/* Brava Smart Store — camada de interação e experiência (compartilhada por todas as páginas) */

html{scroll-padding-top:84px;}
@media(max-width:860px){html{scroll-padding-top:72px;}}
img{height:auto;}
body{overflow-x:hidden;}

/* ---------- barra de progresso de leitura ---------- */
.ux-progress{position:fixed; top:0; left:0; height:3px; width:0; z-index:80; background:linear-gradient(90deg,#4f8cff,#34e0d8); box-shadow:0 0 12px rgba(79,140,255,.8); pointer-events:none; transition:width .08s linear;}

/* ---------- cabeçalho: encolhe ao rolar ---------- */
header .nav{transition:padding .25s ease;}
header.is-scrolled .nav{padding-top:10px; padding-bottom:10px;}
header.is-scrolled{background:rgba(7,11,19,.94);}
header .btn{white-space:nowrap;}

/* ---------- menu do celular ---------- */
.ux-burger{display:none; width:44px; height:44px; border:1px solid var(--line-strong); background:transparent; border-radius:var(--radius); color:var(--ink); cursor:pointer; align-items:center; justify-content:center; flex:none;}
.ux-burger span,.ux-burger span::before,.ux-burger span::after{display:block; width:20px; height:2px; background:currentColor; border-radius:2px; transition:transform .25s ease, background .2s ease; content:"";}
.ux-burger span{position:relative;}
.ux-burger span::before{position:absolute; top:-6px;}
.ux-burger span::after{position:absolute; top:6px;}
.ux-burger[aria-expanded="true"] span{background:transparent;}
.ux-burger[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg);}
.ux-burger[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg);}
.ux-menu{display:none;}
@media(max-width:1200px){
  .navlinks{display:none !important;}
  .ux-burger{display:inline-flex;}
  .nav{gap:10px;}
  .nav-cta{margin-left:auto;}
  .nav-cta .btn-sm{padding:9px 12px;}
  .ux-menu{display:block; position:fixed; left:0; right:0; top:var(--ux-header-h,64px); background:rgba(7,11,19,.98); backdrop-filter:blur(14px); border-bottom:1px solid var(--line-strong); padding:10px 20px 22px; z-index:49; max-height:calc(100vh - var(--ux-header-h,64px)); overflow-y:auto; transform:translateY(-12px); opacity:0; visibility:hidden; transition:opacity .22s ease, transform .22s ease, visibility .22s;}
  .ux-menu.open{transform:none; opacity:1; visibility:visible;}
  .ux-menu a{display:flex; align-items:center; justify-content:space-between; padding:15px 4px; border-bottom:1px solid var(--line); text-decoration:none; color:var(--ink); font-family:var(--serif-hdg); font-weight:500; font-size:1.05rem;}
  .ux-menu a::after{content:"›"; color:var(--trace-bright); font-size:1.3rem;}
  .ux-menu a[aria-current="page"]{color:var(--trace-bright);}
  .ux-menu .ux-menu-cta{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:18px;}
  .ux-menu .ux-menu-cta a{justify-content:center; border:1px solid var(--line-strong); border-radius:var(--radius); padding:13px 10px; font-size:.92rem;}
  .ux-menu .ux-menu-cta a::after{content:none;}
  .ux-menu .ux-menu-cta a.primary{background:linear-gradient(135deg,#2f6fe6,#5b8cff); border-color:transparent;}
}

/* ---------- abas ---------- */
.ux-tabs{margin-top:6px;}
.ux-tabs-nav{display:flex; gap:8px; overflow-x:auto; scroll-snap-type:x proximity; padding:4px 2px 14px; margin:0 -2px; -webkit-overflow-scrolling:touch; scrollbar-width:none;}
.ux-tabs-nav::-webkit-scrollbar{display:none;}
.ux-tab{flex:none; scroll-snap-align:start; display:inline-flex; align-items:center; gap:9px; padding:12px 18px; border:1px solid var(--line-strong); background:var(--bg-raised); color:var(--ink-dim); border-radius:999px; font-family:var(--sans-body); font-weight:600; font-size:.9rem; cursor:pointer; transition:color .18s, border-color .18s, background .18s, box-shadow .25s, transform .12s; white-space:nowrap;}
.ux-tab svg{width:18px; height:18px; flex:none;}
.ux-tab:hover{color:var(--ink); border-color:rgba(79,140,255,.5);}
.ux-tab:active{transform:scale(.97);}
.ux-tab[aria-selected="true"]{color:#fff; border-color:transparent; background:linear-gradient(135deg,#2f6fe6,#5b8cff); box-shadow:0 8px 26px -8px rgba(47,111,230,.85);}
.ux-tab:focus-visible,.ux-burger:focus-visible,.ux-top:focus-visible,.ux-bar a:focus-visible{outline:2px solid #34e0d8; outline-offset:3px;}
.ux-panel{animation:uxPanel .4s ease both;}
.ux-panel[hidden]{display:none;}
@keyframes uxPanel{from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:none;}}
.ux-tabs .ux-panel > section,.ux-tabs .ux-panel > .wrap{padding:0;}
.ux-panel .section-head{margin-bottom:28px;}
@media(max-width:560px){.ux-tab{padding:11px 15px; font-size:.86rem;}}

/* ---------- filtros da loja ---------- */
.ux-filter{display:flex; gap:8px; flex-wrap:wrap; margin:0 0 26px;}
@media(max-width:700px){.ux-filter{flex-wrap:nowrap; overflow-x:auto; margin-right:-20px; padding-right:20px; scrollbar-width:none;} .ux-filter::-webkit-scrollbar{display:none;}}
.ux-chip{flex:none; display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border:1px solid var(--line-strong); background:var(--bg-raised); color:var(--ink-dim); border-radius:999px; font-family:var(--sans-body); font-weight:600; font-size:.88rem; cursor:pointer; transition:all .18s;}
.ux-chip small{font-size:.74rem; opacity:.7; font-weight:500;}
.ux-chip:hover{color:var(--ink); border-color:rgba(79,140,255,.5);}
.ux-chip[aria-pressed="true"]{color:#fff; border-color:transparent; background:linear-gradient(135deg,#2f6fe6,#5b8cff); box-shadow:0 8px 24px -8px rgba(47,111,230,.85);}

/* ---------- passos em carrossel no celular ---------- */
@media(max-width:700px){
  .steps.ux-swipe{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:12px; border:none; border-radius:0; padding:2px 20px 14px; margin:0 -20px; scrollbar-width:none;}
  .steps.ux-swipe::-webkit-scrollbar{display:none;}
  .steps.ux-swipe .step{flex:0 0 78%; scroll-snap-align:center; border:1px solid var(--line-strong) !important; border-radius:var(--radius); background:var(--bg-raised);}
}
.ux-hint{display:none; text-align:center; color:var(--ink-dim); font-size:.78rem; margin-top:4px;}
@media(max-width:700px){.ux-hint{display:block;}}

/* ---------- entrada suave ao rolar ---------- */
.ux-rv{opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); transition-delay:var(--ux-d,0ms);}
.ux-rv.in{opacity:1; transform:none;}

/* ---------- efeitos de toque / passagem ---------- */
.svc-card,.compare-card,.step,.prod-card,.local-chip,.factor-chip,.symptom-list span,.brand-cell{transition:transform .25s ease, border-color .25s ease, box-shadow .3s ease, background .25s ease;}
@media(hover:hover){
  .svc-card:hover,.compare-card:hover,.prod-card:hover{transform:translateY(-4px); box-shadow:0 18px 40px -22px rgba(47,111,230,.7); border-color:rgba(79,140,255,.4);}
  .svc-card:hover svg{filter:drop-shadow(0 0 8px rgba(79,140,255,.7));}
}
.btn-copper{position:relative; overflow:hidden;}
.btn-copper::after{content:""; position:absolute; top:0; left:-60%; width:40%; height:100%; background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent); transform:skewX(-20deg); transition:left .6s ease;}
.btn-copper:hover::after{left:130%;}
details{transition:border-color .2s, background .2s;}
details[open] > :not(summary){animation:uxPanel .35s ease both;}

/* ---------- voltar ao topo ---------- */
.ux-top{position:fixed; right:22px; bottom:90px; z-index:59; width:46px; height:46px; border-radius:50%; border:1px solid var(--line-strong); background:rgba(12,18,30,.92); color:var(--ink); display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:0; transform:translateY(12px); pointer-events:none; transition:opacity .25s, transform .25s, border-color .2s; backdrop-filter:blur(8px);}
.ux-top.show{opacity:1; transform:none; pointer-events:auto;}
.ux-top:hover{border-color:var(--trace-bright); color:var(--trace-bright);}
.ux-top svg{width:20px; height:20px;}

/* ---------- barra de ação fixa no celular ---------- */
.ux-bar{display:none;}
@media(max-width:700px){
  .wa-float{bottom:calc(78px + env(safe-area-inset-bottom)); right:14px; width:54px; height:54px;}
  .ux-bar{display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; position:fixed; left:0; right:0; bottom:0; z-index:70; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:rgba(7,11,19,.96); backdrop-filter:blur(12px); border-top:1px solid var(--line-strong); transform:translateY(0); transition:transform .3s ease;}
  .ux-bar.hide{transform:translateY(110%);}
  .ux-bar a{display:flex; align-items:center; justify-content:center; gap:8px; padding:12px 6px; border:1px solid var(--line-strong); border-radius:var(--radius); text-decoration:none; color:var(--ink); font-weight:600; font-size:.86rem; background:var(--bg-raised);}
  .ux-bar a svg{width:18px; height:18px; flex:none;}
  .ux-bar a.primary{background:linear-gradient(135deg,#2f6fe6,#5b8cff); border-color:transparent; color:#fff;}
  body{padding-bottom:76px;}
  .ux-top{bottom:calc(144px + env(safe-area-inset-bottom)); right:18px; width:42px; height:42px;}
}

/* ---------- ajustes de tela pequena (sem rolagem lateral) ---------- */
@media(max-width:700px){
  section{padding-top:46px; padding-bottom:46px;}
  .section-head{margin-bottom:26px; gap:14px;}
  .btn{white-space:normal; text-align:center; justify-content:center;}
  .hero-actions{display:grid; grid-template-columns:1fr; gap:10px;}
  .hero-actions .btn{width:100%;}
  .hero-meta{display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px;}
  .hero-meta div{font-size:.72rem; line-height:1.35;}
  .hero-meta strong{font-size:.98rem;}
  .footer-grid{grid-template-columns:1fr 1fr; gap:26px 18px;}
  .footer-grid > div:first-child,.footer-grid > div:last-child{grid-column:1 / -1;}
  .footer-bottom{flex-direction:column; gap:10px;}
}
@media(max-width:380px){.nav-cta .btn-sm{font-size:.76rem; padding:9px 10px;} .logo{font-size:1rem;}}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .ux-rv{opacity:1; transform:none; transition:none;}
  .ux-panel,details[open] > :not(summary){animation:none;}
  .btn-copper::after{display:none;}
}

/* grades de serviço: uma coluna no celular (cartões "span 2" criavam colunas extras) */
@media(max-width:600px){
  .svc-grid{grid-template-columns:1fr !important;}
}
@media(max-width:860px){
  .svc-grid > .svc-card{grid-column:auto !important;}
}

/* cabeçalho enxuto no celular: logo + menu (WhatsApp/ligar ficam na barra fixa) */
@media(max-width:700px){
  .nav-cta{display:none;}
  .nav{justify-content:space-between;}
  .logo{white-space:nowrap;}
}

/* ---------- loja: barra de categorias fixa + painéis ---------- */
.ux-off{display:none !important;}
.ux-shopbar{position:sticky; top:var(--ux-header-h,72px); z-index:40; background:rgba(9,14,24,.95); backdrop-filter:blur(12px); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:12px 0 0;}
.ux-shopbar .ux-tabs-nav{padding-bottom:12px;}
.ux-tab small{font-weight:500; opacity:.7; font-size:.76rem;}
[role="tabpanel"].ux-shop-panel{animation:uxPanel .4s ease both;}
@media(max-width:700px){
  .prod-grid{grid-template-columns:repeat(2,1fr) !important; gap:12px !important;}
  .prod-card .prod-body{padding:12px !important;}
  .prod-card h3,.prod-card h4{font-size:.95rem;}
  .ux-shopbar .wrap{padding:0 0 0 20px;}
}
.ux-shopbar .ux-tabs-nav{margin:0;}

/* ---------- documentos legais em acordeão ---------- */
.policy-tools{display:flex; gap:8px; flex-wrap:wrap; margin:6px 0 18px;}
.policy-acc{border:1px solid var(--line-strong); border-radius:var(--radius); background:var(--bg-raised); margin:0 0 10px; overflow:hidden;}
.policy-acc[open]{border-color:rgba(79,140,255,.4);}
.policy-acc > summary{list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 18px; position:relative;}
.policy-acc > summary::-webkit-details-marker{display:none;}
.policy-acc > summary h2{margin:0; font-size:1.02rem; font-weight:600; letter-spacing:0; max-width:none; line-height:1.3;}
.policy-acc > summary .plus{position:relative; flex:none; width:14px; height:14px; display:block;}
.policy-acc > summary .plus::before,.policy-acc > summary .plus::after{content:""; position:absolute; background:var(--trace-bright); transition:transform .25s;}
.policy-acc > summary .plus::before{width:100%; height:2px; top:6px; left:0;}
.policy-acc > summary .plus::after{height:100%; width:2px; left:6px; top:0;}
.policy-acc[open] > summary .plus::after{transform:scaleY(0);}
.policy-acc .policy-body{padding:2px 18px 18px;}
.policy-acc .policy-body > :first-child{margin-top:0;}

/* compactação no celular */
@media(max-width:600px){
  .svc-card{padding:20px 18px !important;}
  .svc-card ul{gap:4px;}
  .svc-card h4{margin-bottom:8px;}
  .diff-left{padding:26px 22px !important;}
  .diff-right{padding:22px !important;}
  .diff-list{gap:10px;}
  .diff-list li{padding-bottom:10px;}
  .board-section{gap:26px;}
  .unlock-band{padding:26px 22px !important;}
  .final-cta{padding:46px 0;}
  footer{padding:44px 0 26px;}
}

/* ---------- botão flutuante do WhatsApp: destaque suave ---------- */
.wa-float{display:flex !important; animation:uxPulse 2.8s ease-out infinite;}
.wa-float:hover{transform:scale(1.07);}
@keyframes uxPulse{0%{box-shadow:0 6px 26px -4px rgba(79,140,255,.65),0 0 0 0 rgba(79,140,255,.45);}70%{box-shadow:0 6px 26px -4px rgba(79,140,255,.65),0 0 0 16px rgba(79,140,255,0);}100%{box-shadow:0 6px 26px -4px rgba(79,140,255,.65),0 0 0 0 rgba(79,140,255,0);}}
@media (prefers-reduced-motion:reduce){.wa-float{animation:none;}}

/* ---------- seletor de idioma ---------- */
.ux-lang{display:inline-flex; align-items:center; gap:2px; padding:3px; border:1px solid var(--line-strong); border-radius:999px; background:rgba(255,255,255,.03); margin-left:auto; margin-right:14px; flex:none;}
.ux-lang a{display:inline-flex; align-items:center; justify-content:center; min-width:34px; height:30px; padding:0 9px; border-radius:999px; font-size:.76rem; font-weight:700; letter-spacing:.04em; color:var(--ink-dim); text-decoration:none; transition:background .2s, color .2s;}
.ux-lang a:hover{color:var(--ink);}
.ux-lang a[aria-current="true"]{background:linear-gradient(135deg,#2f6fe6,#5b8cff); color:#fff;}
.ux-lang a:focus-visible{outline:2px solid #34e0d8; outline-offset:2px;}
@media(max-width:1200px){.ux-lang{margin-right:0;}}
@media(max-width:420px){.ux-lang a{min-width:28px; height:28px; padding:0 6px; font-size:.7rem;} .logo{font-size:1rem !important; gap:8px !important;} .nav{gap:8px !important;}}
@media(min-width:1041px){.ux-lang{margin-left:18px;}}

/* ---------- como chegar: Maps e Waze ---------- */
.ux-route{display:flex; flex-wrap:wrap; gap:8px;}
.ux-route a{display:inline-flex; align-items:center; gap:7px; padding:8px 12px; border:1px solid var(--line-strong); border-radius:var(--radius); font-size:.82rem; font-weight:600; color:var(--ink); text-decoration:none; background:var(--bg-raised); transition:border-color .2s, transform .2s;}
.ux-route a svg{width:16px; height:16px; flex:none;}
.ux-route a:hover{border-color:var(--trace-bright); transform:translateY(-1px);}
.ux-route a.r-waze svg{color:#33ccff;} .ux-route a.r-maps svg{color:#ff6b5e;}
.ux-route.big{margin-top:16px;} .ux-route.big a{padding:12px 16px; font-size:.92rem;}
.ux-route-li{list-style:none; margin-top:6px;}
.ux-menu .ux-menu-route{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:10px;}
.ux-menu .ux-menu-route a{justify-content:center; border:1px solid var(--line-strong); border-radius:var(--radius); padding:13px 10px; font-size:.92rem;}
.ux-menu .ux-menu-route a::after{content:none;}

/* ---------- cabeçalho único em todas as páginas ---------- */
header .nav{gap:20px; flex-wrap:nowrap;}
header .logo{white-space:nowrap; flex:none;}
header .navlinks{gap:clamp(14px,1.8vw,28px); white-space:nowrap; margin-inline:auto;}
header .navlinks a{white-space:nowrap; padding:6px 0; position:relative;}
header .navlinks a.current{color:var(--trace-bright);}
header .navlinks a.current::after{content:""; position:absolute; left:0; right:0; bottom:-4px; height:2px; border-radius:2px; background:var(--trace-bright);}
header .nav-cta .btn{white-space:nowrap;}

/* ---------- rodapé moderno: ícones, redes sociais e como chegar ---------- */
footer .footer-grid{grid-template-columns:1.2fr 1fr 1fr 1fr 1.4fr; gap:36px 40px;}
@media(max-width:1000px){footer .footer-grid{grid-template-columns:1fr 1fr 1fr;}}
@media(max-width:800px){footer .footer-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){footer .footer-grid{grid-template-columns:1fr 1fr;} footer .footer-grid > div:first-child,footer .footer-grid > div:last-child{grid-column:1 / -1;}}
footer .f-tag{color:var(--ink-dim); font-size:.9rem; max-width:30ch; margin:0 0 18px;}
footer .f-social{display:grid; gap:10px; max-width:240px;}
footer .f-social a{display:flex; align-items:center; gap:12px; padding:10px 14px; border:1px solid var(--line-strong); border-radius:var(--radius); color:var(--ink) !important; font-size:.88rem; font-weight:600; background:var(--bg-raised); transition:transform .2s, border-color .2s;}
footer .f-social a:hover{transform:translateY(-2px); border-color:var(--trace-bright);}
footer .f-social svg{width:22px; height:22px; flex:none;}
footer .f-social a.ig svg{color:#fff; background:radial-gradient(circle at 30% 107%,#fdf497 0,#fd5949 45%,#d6249f 60%,#285aeb 90%); border-radius:7px; padding:3px; width:26px; height:26px;}
footer .f-social a.tt svg{color:#fff; background:#000; border-radius:7px; padding:4px; width:26px; height:26px; filter:drop-shadow(1.4px 1.4px 0 #fe2c55) drop-shadow(-1.4px -1.4px 0 #25f4ee);}
footer .f-list{gap:12px !important;}
footer .f-row{display:flex; align-items:flex-start; gap:12px; color:var(--ink-dim); font-size:.88rem; line-height:1.45; text-decoration:none;}
footer a.f-row:hover{color:var(--trace-bright);}
footer .f-ic{display:inline-flex; align-items:center; justify-content:center; flex:none; width:34px; height:34px; border-radius:10px; background:rgba(79,140,255,.12); border:1px solid rgba(79,140,255,.28); color:var(--trace-bright);}
footer .f-ic svg{width:18px; height:18px;}
footer .f-ic.wa{background:rgba(37,211,102,.14); border-color:rgba(37,211,102,.35); color:#25d366;}
footer .f-tx{display:block; padding-top:7px; min-width:0; overflow-wrap:anywhere;}
footer .f-tx b{display:block; color:var(--ink); font-weight:600; font-size:.82rem; margin-bottom:1px;}
footer .f-route{display:flex; flex-wrap:wrap; gap:8px; margin-top:16px;}
footer .f-route a{display:inline-flex; align-items:center; gap:8px; padding:8px 12px 8px 9px; border:1px solid var(--line-strong); border-radius:999px; background:var(--bg-raised); color:var(--ink) !important; font-size:.84rem; font-weight:600; transition:transform .2s, border-color .2s;}
footer .f-route a:hover{transform:translateY(-2px); border-color:var(--trace-bright);}
footer .f-route svg{width:22px; height:22px; flex:none;}

/* ===== lista de produtos: galeria, promoção, pagamento, zoom ===== */
.aparelhos-anchor{scroll-margin-top:90px;height:0}
.prod-thumb{position:relative}
.pz-open{all:unset;position:absolute;inset:0;cursor:zoom-in;display:block}
.pz-open:focus-visible{outline:3px solid var(--trace-bright,#4f8cff);outline-offset:-3px}
.prod-thumb.has-img .pz-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .25s ease,transform .35s ease}
.prod-thumb.has-img .pz-img.show{opacity:1}
.pz-ico{position:absolute;right:10px;bottom:10px;width:34px;height:34px;border-radius:50%;background:rgba(10,14,22,.72);color:#fff;display:grid;place-items:center;pointer-events:none}
.pz-ico svg{width:18px;height:18px}
.pz-dots{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:8px;z-index:2;pointer-events:none}
.pz-dot{pointer-events:auto;width:12px;height:12px;border-radius:50%;border:2px solid #fff;background:rgba(10,14,22,.45);padding:0;cursor:pointer;box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.pz-dot.on{background:#fff}
.pz-dot::after{content:"";position:absolute;inset:-8px}
.pz-dot{position:relative}
.prod-badge{position:absolute;left:10px;top:10px;z-index:3;background:#e5341d;color:#fff;font-weight:800;font-size:.72rem;letter-spacing:.06em;padding:5px 10px;border-radius:999px;box-shadow:0 6px 14px -6px rgba(229,52,29,.8)}
.prod-card.is-promo{border-color:rgba(229,52,29,.55)}
.prod-long{margin:-4px 0 12px}
.prod-long-tx{font-size:.82rem;color:var(--ink-dim);white-space:pre-line;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.prod-long-tx.open{display:block;-webkit-line-clamp:unset;overflow:visible}
.prod-more{all:unset;cursor:pointer;color:var(--trace-bright,#4f8cff);font-size:.8rem;font-weight:600;margin-top:4px;padding:6px 0;display:inline-block}
.prod-more:hover{text-decoration:underline}.prod-more:focus-visible{outline:2px solid var(--trace-bright,#4f8cff);outline-offset:2px}
.prod-old{display:block;font-family:var(--sans-body);font-size:.78rem;color:var(--ink-dim);font-weight:400}
.prod-inst{margin-top:10px;font-size:.8rem;color:var(--ink)}
.prod-boleto{margin-top:6px;display:flex;align-items:center;gap:6px;font-size:.76rem;color:var(--ink-dim)}
.prod-boleto svg{width:15px;height:15px;flex:none}
.prod-empty{margin-top:34px;border:1px dashed var(--line-strong);border-radius:var(--radius);padding:28px;text-align:center}
.prod-empty p{color:var(--ink-dim);margin:0 auto 16px;max-width:52ch}
.pz-lb{position:fixed;inset:0;z-index:10000;background:rgba(5,8,14,.94);display:flex;align-items:center;justify-content:center}
.pz-lb[hidden]{display:none}
.pz-stage{position:absolute;inset:56px 0 64px;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none;cursor:zoom-in}
.pz-stage.zoomed{cursor:grab}
.pz-stage img{max-width:100%;max-height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;transition:transform .12s ease-out;will-change:transform;background:#fff;border-radius:4px}
.pz-x,.pz-nav,.pz-tools button{all:unset;cursor:pointer;color:#fff;background:rgba(255,255,255,.14);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:28px;line-height:1;text-align:center}
.pz-x:hover,.pz-nav:hover,.pz-tools button:hover{background:rgba(255,255,255,.28)}
.pz-x:focus-visible,.pz-nav:focus-visible,.pz-tools button:focus-visible{outline:3px solid #fff}
.pz-x{position:absolute;top:8px;right:10px;z-index:3}
.pz-nav{position:absolute;top:50%;margin-top:-22px;z-index:3}.pz-prev{left:8px}.pz-next{right:8px}.pz-nav[hidden]{display:none}
.pz-tools{position:absolute;left:0;right:0;bottom:10px;display:flex;align-items:center;justify-content:center;gap:12px;z-index:3;padding:0 12px}
.pz-hint{color:#c9d2e3;font-size:.74rem;text-align:center;max-width:40ch}
html.pz-lock{overflow:hidden}
@media(max-width:480px){.pz-hint{font-size:.68rem}}
.aparelhos-anchor{scroll-margin-top:160px}
.prod-foot{flex-wrap:wrap}.prod-price{white-space:nowrap}

.coleta-strip{padding:28px 0 0}
.coleta-box{display:flex;align-items:center;gap:18px;padding:18px 22px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03)}
.coleta-ico{width:34px;height:34px;flex:none;color:var(--copper,#c9824a)}
.coleta-txt{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}
.coleta-txt strong{font-size:1.05rem}
.coleta-txt span{color:var(--ink-dim,#aaa);font-size:.95rem;line-height:1.45}
.coleta-box .btn{flex:none;white-space:nowrap}
@media(max-width:700px){.coleta-box{flex-direction:column;align-items:flex-start}.coleta-box .btn{width:100%;text-align:center}}

/* foto de topo (Quem somos, Dúvidas, Central) */
.hero .hero-photo{position:absolute; right:0; bottom:0; width:100%; height:auto; aspect-ratio:3/1; object-fit:cover; object-position:right center; z-index:0; pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 42%),linear-gradient(180deg,transparent 0,#000 28%); -webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent 0,#000 42%),linear-gradient(180deg,transparent 0,#000 28%); mask-composite:intersect;}
.hero.has-photo h1{max-width:18ch;}
.hero.has-photo .lede{max-width:40ch;}
@media(max-width:900px){
  .hero.has-photo{padding-bottom:0; display:flex; flex-direction:column;}
  .hero.has-photo h1,.hero.has-photo .lede{max-width:none;}
  .hero.has-photo .hero-photo{position:relative; order:2; aspect-ratio:3/1.6; margin-top:34px; object-position:75% center;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 30%); mask-image:linear-gradient(180deg,transparent 0,#000 30%); -webkit-mask-composite:source-over; mask-composite:add;}
}
