/* Conta do cliente + bloco de novidades (mesma identidade da loja) */
:root { --tungstenio:#0A0D0F; --abismo:#06080A; --painel:#0E1317; --vidro:#E6ECEA; --aco:#8F9DA0; --brasa:#D9482B; --ouro:#f1d58f; --linha:rgba(230,236,234,.16);
  --f-display:"Instrument Serif","Iowan Old Style",Georgia,serif; --f-texto:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
body.conta { margin:0; background:var(--abismo); color:var(--vidro); font:16px/1.55 var(--f-texto); -webkit-font-smoothing:antialiased; min-height:100vh; padding-bottom:env(safe-area-inset-bottom); }
[hidden] { display:none !important; }
a { color:inherit; }
.ct-topo { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px max(20px,env(safe-area-inset-left)) 18px; border-bottom:1px solid var(--linha); }
.ct-logo { display:flex; align-items:center; gap:12px; text-decoration:none; }
.ct-logo span { display:grid; line-height:1.1; } .ct-logo b { letter-spacing:.14em; font-size:14px; } .ct-logo i { font-style:normal; font-size:12px; color:var(--aco); letter-spacing:.2em; text-transform:uppercase; }
.ct-voltar { font-size:14px; color:var(--aco); text-underline-offset:5px; min-height:44px; display:inline-flex; align-items:center; }
.ct-main { width:min(720px,100%); margin:0 auto; padding:clamp(24px,5vw,56px) 20px 80px; }
h1, h2 { font-family:var(--f-display); font-weight:400; line-height:1; margin:0; }
h1 { font-size:clamp(40px,8vw,64px); margin-bottom:12px; } h2 { font-size:30px; margin-bottom:10px; }
.ct-nota { color:rgba(230,236,234,.72); margin:0 0 18px; max-width:62ch; }
.ct-card { background:var(--painel); border:1px solid var(--linha); border-radius:22px; padding:clamp(18px,4vw,28px); margin-bottom:16px; }
.ct-abas { display:flex; gap:8px; margin-bottom:18px; }
.ct-aba { flex:1; font:inherit; font-weight:600; color:var(--vidro); background:transparent; border:1px solid var(--linha); border-radius:999px; padding:12px; min-height:48px; cursor:pointer; }
.ct-aba[aria-selected=true] { background:var(--ouro); color:#14110a; border-color:var(--ouro); }
.ct-campo { display:grid; gap:7px; margin-bottom:14px; }
.ct-campo label, .ct-rotulo { font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--aco); }
.ct-campo input, .ct-campo select { width:100%; font:inherit; font-size:16px; color:var(--vidro); background:var(--tungstenio); border:1px solid rgba(230,236,234,.26); border-radius:14px; padding:13px 15px; min-height:48px; }
.ct-campo input:focus, .ct-campo select:focus { outline:none; border-color:var(--ouro); box-shadow:0 0 0 3px rgba(241,213,143,.18); }
.ct-campo.erro input { border-color:var(--brasa); }
.ct-dica { font-size:13px; color:var(--aco); margin:0; }
.ct-erro { color:#ff8a6e; font-size:14px; font-weight:600; margin:8px 0; min-height:1.2em; }
.ct-ok { color:var(--ouro); font-size:14px; font-weight:600; margin:8px 0; }
.ct-grade { display:grid; grid-template-columns:1fr 1fr; gap:0 14px; } .ct-grade .larga { grid-column:1 / -1; }
.ct-check { display:flex; gap:12px; align-items:flex-start; font-size:15px; margin:10px 0; min-height:44px; cursor:pointer; }
.ct-check input { width:22px; height:22px; accent-color:var(--brasa); flex:none; margin-top:2px; }
.ct-btn { font:inherit; font-weight:600; font-size:15px; color:#fff; background:var(--brasa); border:1px solid transparent; border-radius:999px; padding:12px 26px; min-height:48px; cursor:pointer; }
.ct-btn:disabled { opacity:.5; cursor:not-allowed; }
.ct-btn.sec { background:transparent; border-color:rgba(230,236,234,.4); color:var(--vidro); }
.ct-btn.perigo { background:#b8321a; }
.ct-link { font:inherit; font-size:14px; color:var(--aco); background:none; border:0; padding:0; text-decoration:underline; text-underline-offset:5px; cursor:pointer; min-height:44px; display:inline-flex; align-items:center; }
.ct-link:hover { color:var(--vidro); }
.ct-linha { display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; }
.ct-ped { display:grid; gap:6px; width:100%; text-align:left; font:inherit; color:inherit; background:var(--tungstenio); border:1px solid var(--linha); border-radius:16px; padding:14px 18px; margin-bottom:10px; cursor:pointer; min-height:72px; }
.ct-ped:hover { border-color:rgba(241,213,143,.6); }
.ct-ped b { font-size:15px; } .ct-ped small { color:var(--aco); font-size:13px; overflow-wrap:anywhere; }
.ct-selos { display:flex; gap:8px; flex-wrap:wrap; }
.ct-selo { font-size:12px; font-weight:700; border:1px solid var(--linha); border-radius:999px; padding:4px 11px; white-space:nowrap; }
.ct-tab { width:100%; border-collapse:collapse; font-size:14px; margin:10px 0; } .ct-tab td { padding:7px 0; border-bottom:1px solid rgba(230,236,234,.08); } .ct-tab td:last-child { text-align:right; white-space:nowrap; }
details.ct-det summary { cursor:pointer; min-height:44px; display:flex; align-items:center; font-weight:600; }
.ct-idiomas { display:flex; gap:6px; flex-wrap:wrap; } .ct-idiomas a { font-size:13px; color:var(--aco); text-decoration:none; padding:6px 10px; border:1px solid var(--linha); border-radius:999px; }
.ct-idiomas a[aria-current=true] { color:var(--vidro); border-color:var(--ouro); }
@media (max-width:560px) { .ct-grade { grid-template-columns:1fr; } .ct-topo { flex-wrap:wrap; } }

/* bloco de novidades no rodapé da loja e ícone da conta no menu */
.nl { max-width:560px; margin:0 auto 28px; padding:0 20px; text-align:left; }
.nl h3 { font-family:var(--f-display); font-weight:400; font-size:32px; margin:0 0 6px; }
.nl p { color:rgba(230,236,234,.72); margin:0 0 12px; font-size:15px; }
.nl-linha { display:flex; gap:10px; flex-wrap:wrap; }
.nl input[type=email] { flex:1 1 220px; font:inherit; font-size:16px; color:var(--vidro); background:var(--tungstenio); border:1px solid rgba(230,236,234,.3); border-radius:999px; padding:12px 18px; min-height:48px; }
.nl input[type=email]:focus { outline:none; border-color:var(--ouro); }
.nl .nl-check { display:flex; gap:12px; align-items:flex-start; font-size:14px; margin:12px 0; min-height:44px; cursor:pointer; color:var(--vidro); }
.nl .nl-check input { width:22px; height:22px; accent-color:var(--brasa); flex:none; }
.nl button { font:inherit; font-weight:600; color:#fff; background:var(--brasa); border:0; border-radius:999px; padding:12px 24px; min-height:48px; cursor:pointer; }
.nl .nl-msg { font-size:14px; font-weight:600; margin:10px 0 0; min-height:1.2em; } .nl .nl-msg.erro { color:#ff8a6e; } .nl .nl-msg.ok { color:var(--ouro); }
.ap-conta-link { display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:0 10px; color:inherit; text-decoration:none; font-size:14px; }
.ck-conta { border:1px solid var(--linha); border-radius:14px; padding:12px 16px; margin:0 0 14px; font-size:14px; color:rgba(230,236,234,.85); }
.ck-conta a { color:var(--ouro); }
.ck-nl { grid-column:1 / -1; display:flex; gap:12px; align-items:flex-start; font-size:14px; color:var(--vidro); min-height:44px; cursor:pointer; }
.ck-nl input { width:22px; height:22px; accent-color:var(--brasa); flex:none; }

.rodape > .nl { grid-column: 1 / -1; width: 100%; max-width: 560px; margin: 0 0 32px; padding: 0; }

/* senha: ver/ocultar + medidor */
.senha-wrap { position:relative; display:block; }
.senha-wrap input { padding-right:54px !important; }
.senha-olho { position:absolute; right:6px; top:50%; transform:translateY(-50%); width:44px; height:44px; display:grid; place-items:center; background:none; border:0; border-radius:12px; color:var(--aco); cursor:pointer; font-size:18px; }
.senha-olho:hover, .senha-olho[aria-pressed=true] { color:var(--ouro); }
.senha-forca { display:flex; gap:5px; margin:8px 0 2px; }
.senha-forca i { flex:1; height:5px; border-radius:99px; background:rgba(230,236,234,.14); }
.senha-forca i.on.n1 { background:#d9482b; } .senha-forca i.on.n2 { background:#e0a33a; } .senha-forca i.on.n3 { background:#c9d86b; } .senha-forca i.on.n4 { background:#6fcf97; }

/* páginas legais e 404 */
.legal-texto { width:min(760px,100%); }
.legal-texto h1 { font-size:clamp(38px,7vw,56px); margin-bottom:6px; }
.legal-texto h2 { font-family:var(--f-texto); font-size:19px; font-weight:600; margin:30px 0 8px; letter-spacing:0; }
.legal-texto p, .legal-texto li { color:rgba(230,236,234,.82); }
.legal-texto ul { padding-left:22px; display:grid; gap:8px; }
.legal-texto a { color:var(--ouro); }
.legal-texto .atualizado { color:var(--aco); font-size:14px; margin:0 0 22px; }
.legal-rodape { display:flex; flex-wrap:wrap; gap:8px 22px; justify-content:center; padding:26px 20px 70px; border-top:1px solid var(--linha); color:var(--aco); font-size:14px; }
.legal-rodape a { color:inherit; min-height:44px; display:inline-flex; align-items:center; }
.legal-rodape p { flex-basis:100%; text-align:center; margin:4px 0 0; }
.nf { text-align:center; display:grid; justify-items:center; gap:6px; padding-top:12vh; }
.nf-cod { font:400 clamp(70px,16vw,130px)/1 var(--f-display); margin:10px 0 0; color:var(--ouro); }
.ck-leg { display:flex; flex-wrap:wrap; gap:6px 18px; justify-content:center; margin:10px 0; font-size:13px; }
.ck-leg a { color:var(--aco); min-height:44px; display:inline-flex; align-items:center; }

@media (pointer: coarse) {
  .ct-idiomas a { min-height: 44px; display: inline-flex; align-items: center; padding: 6px 14px; }
  .ct-logo { min-height: 44px; }
  body.conta { min-height: 100svh; }
}

/* celular: a página só rola para cima e para baixo (nunca para os lados). A fileira da coleção continua deslizando de lado
   porque ela mesma é uma área de rolagem com touch-action próprio. */
@media (max-width: 860px), (pointer: coarse) {
  html { overflow-x: hidden; max-width: 100%; overscroll-behavior-x: none; touch-action: pan-y pinch-zoom; } /* só no html: no body 'hidden' quebraria as cenas presas (sticky) */
  body { overflow-x: clip; max-width: 100%; overscroll-behavior-x: none; touch-action: pan-y pinch-zoom; }
  body { position: relative; }
  img, video, canvas { max-width: 100%; }
}
