/* Navbar mobile — Modernista (fase 2). Escopo .pf-mnav-root.
   Drawer (menu) à esquerda + sheet (carrinho) de baixo. Botões vêm de pf-buttons.css. */

.pf-mnav-root{position:relative;overflow:hidden;font-family:var(--font-sans,'Prompt',sans-serif);color:#003352;background:#f5f8fb}
.pf-mnav-root *,.pf-mnav-root *::before,.pf-mnav-root *::after{box-sizing:border-box}
.pf-mnav-root .pf-mtop{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:32px;padding:0 16px;background:#003352;color:#b8c9d8;font-size:12px}
.pf-mnav-root .pf-mbar{display:flex;align-items:center;gap:4px;min-height:60px;padding:0 8px;background:#0057a6;color:#ffffff}
.pf-mnav-root .pf-mlogo{flex:1;color:#ffffff;text-decoration:none;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:24px;letter-spacing:.04em;text-transform:uppercase}
.pf-mnav-root .pf-msearch{display:flex;height:44px;margin:0;padding:0 12px 12px;background:#0057a6}
.pf-mnav-root .pf-msearch input{flex:1;min-width:0;border:0;border-radius:4px 0 0 4px;padding:0 14px;font:400 15px/22px 'Prompt',sans-serif;color:#003352;outline:none}
.pf-mnav-root .pf-msearch button{width:48px;border:0;border-radius:0 4px 4px 0;background:#00a3e0;color:#003352;cursor:pointer}
.pf-mnav-root .pf-pills{display:flex;gap:8px;overflow-x:auto;padding:12px}

.pf-mnav-root .pf-ibtn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:8px;background:transparent;color:#ffffff;cursor:pointer;transition:background 160ms}
.pf-mnav-root .pf-ibtn:hover{background:#00477f}
.pf-mnav-root .pf-ibtn.is-open{background:#003352}
.pf-mnav-root .pf-ibtn:focus-visible{outline:2px solid #ffffff;outline-offset:2px}
.pf-mnav-root .pf-badge{position:absolute;top:2px;right:0;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:#00a3e0;color:#003352;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px #0057a6}
@keyframes pfMPop{0%{transform:scale(.6)}60%{transform:scale(1.2)}100%{transform:scale(1)}}
.pf-mnav-root .pf-badge.is-bump{animation:pfMPop 360ms cubic-bezier(.2,.7,.2,1)}
.pf-mnav-root .pf-chipcar{display:inline-flex;align-items:center;min-height:24px;padding:0 12px;color:#003352;background:#00a3e0;text-decoration:none;clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%);font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:14px;letter-spacing:.04em}
.pf-mnav-root .pf-chipcar:hover{color:#003352;background:#ffffff}
.pf-mnav-root .pf-chipcar:focus-visible{outline:2px solid #00a3e0;outline-offset:2px}

/* Backdrop / drawer / sheet (absolute: confinados ao .pf-mnav-root) */
.pf-mnav-root .pf-back{position:absolute;inset:0;z-index:40;border:0;padding:0;margin:0;background:rgba(0,51,82,.45);opacity:0;visibility:hidden;cursor:default;transition:opacity 260ms,visibility 0s linear 260ms}
.pf-mnav-root .pf-back.is-on{opacity:1;visibility:visible;transition-delay:0s}
.pf-mnav-root .pf-drawer{position:absolute;top:0;bottom:0;left:0;width:min(320px,88%);z-index:50;background:#ffffff;display:flex;flex-direction:column;overflow-y:auto;transform:translateX(-102%);visibility:hidden;transition:transform 340ms cubic-bezier(.2,.7,.2,1),visibility 0s linear 340ms;box-shadow:8px 0 32px rgba(0,51,82,.25)}
.pf-mnav-root .pf-drawer.is-open{transform:none;visibility:visible;transition-delay:0s}
.pf-mnav-root .pf-dhead{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 16px 16px 20px;background:#003352;color:#ffffff}
.pf-mnav-root .pf-dsec{padding:12px 20px 4px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#56657a}
.pf-mnav-root .pf-sheet{position:absolute;left:0;right:0;bottom:0;z-index:50;max-height:88%;background:#ffffff;border-radius:16px 16px 0 0;display:flex;flex-direction:column;transform:translateY(102%);visibility:hidden;transition:transform 380ms cubic-bezier(.2,.7,.2,1),visibility 0s linear 380ms;box-shadow:0 -8px 32px rgba(0,51,82,.25)}
.pf-mnav-root .pf-sheet.is-open{transform:none;visibility:visible;transition-delay:0s}
.pf-mnav-root .pf-sheet::before{content:'';position:absolute;top:0;left:24px;width:88px;height:4px;background:#00a3e0;clip-path:polygon(4px 0,100% 0,calc(100% - 4px) 100%,0 100%)}
.pf-mnav-root .pf-shead{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 8px 20px}
.pf-mnav-root .pf-sfoot{display:flex;flex-direction:column;gap:12px;padding:16px 20px 20px;border-top:1px solid #d7e1ea}
.pf-mnav-root .pf-st{opacity:0;transform:translateY(8px);transition:opacity 220ms,transform 280ms cubic-bezier(.2,.7,.2,1)}
.pf-mnav-root .is-open .pf-st{opacity:1;transform:none}
.pf-mnav-root .pf-drawer .pf-st{transform:translateX(-12px)}
.pf-mnav-root .pf-drawer.is-open .pf-st{transform:none}

.pf-mnav-root .pf-mnav{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:52px;padding:0 20px;color:#003352;text-decoration:none;font-size:18px;font-weight:500;isolation:isolate}
.pf-mnav-root .pf-mnav::before{content:'';position:absolute;top:6px;bottom:6px;left:-12px;right:40%;background:#0057a6;clip-path:polygon(0 0,100% 0,calc(100% - 12px) 100%,0 100%);transform:scaleX(0);transform-origin:left;transition:transform 260ms cubic-bezier(.7,0,.2,1);z-index:-1}
.pf-mnav-root .pf-mnav:hover::before{transform:scaleX(.08)}
.pf-mnav-root .pf-mnav.is-active{color:#ffffff}
.pf-mnav-root .pf-mnav.is-active::before{transform:scaleX(1)}
.pf-mnav-root .pf-mnav:focus-visible{outline:2px solid #0057a6;outline-offset:-2px}
.pf-mnav-root .pf-mnav.is-offer{color:#c2410c}
.pf-mnav-root .pf-row{position:relative;display:flex;align-items:center;gap:14px;min-height:52px;padding:0 20px;color:#003352;text-decoration:none;font-size:16px;transition:background 120ms}
.pf-mnav-root .pf-row:hover{background:#eef5fb}
.pf-mnav-root .pf-row::before{content:'';position:absolute;left:0;top:10px;bottom:10px;width:4px;background:#0057a6;transform:scaleY(0);transition:transform 200ms}
.pf-mnav-root .pf-row:hover::before{transform:scaleY(1)}
.pf-mnav-root .pf-row:focus-visible{outline:2px solid #0057a6;outline-offset:-2px}
.pf-mnav-root .pf-row.is-danger{color:#b42318}
.pf-mnav-root .pf-row.is-danger:hover{background:#fdecea}
.pf-mnav-root .pf-row.is-danger::before{background:#b42318}
.pf-mnav-root .pf-close{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:22px;background:#eef5fb;color:#003352;cursor:pointer}
.pf-mnav-root .pf-close:hover{background:#d7e1ea}
.pf-mnav-root .pf-close:focus-visible{outline:2px solid #0057a6;outline-offset:2px}
.pf-mnav-root .pf-close.on-deep{background:#0b3c59;color:#ffffff}
.pf-mnav-root .pf-close.on-deep:focus-visible{outline-color:#00a3e0}
.pf-mnav-root .pf-cartrow{display:flex;align-items:center;gap:12px;padding:12px 20px;border-bottom:1px solid #d7e1ea;font-size:14px}
.pf-mnav-root .pf-cartrow .pf-thumb{width:56px;height:56px;border-radius:4px;background:#eef5fb;flex:none}
.pf-mnav-root .pf-cartrow b{display:block;color:#0057a6}
.pf-mnav-root .pf-qty{display:inline-flex;border:1px solid #d7e1ea;border-radius:2px;overflow:hidden}
.pf-mnav-root .pf-qty span{min-width:32px;display:flex;align-items:center;justify-content:center}
.pf-mnav-root .pf-qs{width:44px;height:44px;border:0;background:#ffffff;color:#003352;font-size:18px;cursor:pointer}
.pf-mnav-root .pf-qs:hover{background:#eef5fb}
.pf-mnav-root .pf-qs:focus-visible{outline:2px solid #0057a6;outline-offset:-2px}
.pf-mnav-root .pf-ib{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:2px;background:transparent;color:#56657a;cursor:pointer}
.pf-mnav-root .pf-ib:hover{background:#fdecea;color:#b42318}
.pf-mnav-root .pf-ib:focus-visible{outline:2px solid #0057a6;outline-offset:2px}
.pf-mnav-root .pf-pill{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid #6f849b;border-radius:2px;background:#ffffff;color:#003352;text-decoration:none;font-size:14px;white-space:nowrap}
.pf-mnav-root .pf-pill:hover{border-color:#0057a6;background:#eef5fb}
.pf-mnav-root .pf-pill:focus-visible{outline:2px solid #0057a6;outline-offset:2px}

@media (prefers-reduced-motion: reduce){
  .pf-mnav-root .pf-drawer,.pf-mnav-root .pf-sheet,.pf-mnav-root .pf-st,.pf-mnav-root .pf-back,.pf-mnav-root .pf-mnav::before{transition:none!important}
  .pf-mnav-root .pf-badge{animation:none!important}
}