/* Tentação · site institucional
   Conceito: editorial de perfumaria. Faixas bordô (desejo) e creme (cuidado) alternadas,
   uma só família serifada (Caladea, a equivalente livre da Cambria do manual) e um detalhe
   próprio da marca: as fotos de destaque levam uma "mordida" no canto, como a maçã do símbolo.
   Mobile-first; acima de 900px as seções abrem em duas colunas. */
:root{
  --bordo:#3A0A12;        /* Bordô Pecado */
  --bordo-escuro:#2A070D; /* rodapé e faixas profundas */
  --bordo-card:#45101A;   /* cartões sobre bordô */
  --vinho:#6E1423;        /* fios sobre bordô */
  --vermelho:#8E1626;     /* Vermelho Maçã: botões de compra */
  --vermelho-hover:#A51B2E;
  --rose:#E3B8A8;         /* Rosé Pele: eyebrows, ícones */
  --nude:#E8CFC4;         /* Nude: títulos sobre bordô */
  --creme:#F4E9E1;        /* Creme: fundo claro */
  --creme-2:#EADBD1;      /* cartões sobre creme */
  --rose-apagado:#C9A89F; /* texto secundário sobre bordô */
  --tinta:#2A070D;        /* texto sobre creme */
  --tinta-2:#5E3A3E;      /* texto secundário sobre creme */
  --linha-escura:rgba(227,184,168,.26);
  --linha-clara:rgba(58,10,18,.16);
  --grad-rose:linear-gradient(135deg,#EEC6A9 0%,#C98A6B 28%,#F0C9AC 50%,#CF9474 74%,#E9BC9E 100%);

  --serif:"Caladea","Cambria",Georgia,"Times New Roman",serif;
  --t-xs:.72rem; --t-s:.9rem; --t-m:1.05rem; --t-l:1.3rem; --t-xl:clamp(1.7rem,5.4vw,2.6rem); --t-xxl:clamp(2.2rem,8vw,4.1rem);
  --gl:max(20px, env(safe-area-inset-left, 0px));
  --gr:max(20px, env(safe-area-inset-right, 0px));
  --topo:64px;
  --mordida:2.6rem;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--topo) + 12px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bordo);color:var(--nude);font-family:var(--serif);font-size:var(--t-m);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--bordo-escuro)}
img{max-width:100%;display:block;height:auto}
[hidden]{display:none!important}
a{color:inherit}
h1,h2,h3{font-weight:400;line-height:1.12;margin:0;text-wrap:balance;letter-spacing:.005em}
p{margin:0}
:focus-visible{outline:2px solid var(--rose);outline-offset:3px}
.claro :focus-visible{outline-color:var(--vermelho)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pular{position:absolute;left:var(--gl);top:-60px;z-index:80;background:var(--creme);color:var(--tinta);padding:.6rem 1rem}
.pular:focus{top:calc(env(safe-area-inset-top,0px) + 8px)}

/* faixas */
.faixa{padding-left:var(--gl);padding-right:var(--gr)}
.faixa > .wrap{max-width:1140px;margin:0 auto;padding-block:clamp(3.2rem,9vw,6rem)}
.claro{background:var(--creme);color:var(--tinta)}
.profundo{background:var(--bordo-escuro)}
.estreito{max-width:720px!important}

.eyebrow{font-size:var(--t-xs);letter-spacing:.42em;text-transform:uppercase;color:var(--rose)}
.claro .eyebrow{color:var(--vermelho)}
.titulo{font-size:var(--t-xl)}
.titulo em,.hero h1 em{font-style:italic;color:var(--rose)}
.claro .titulo em{color:var(--vermelho)}
.lead{font-size:var(--t-l);line-height:1.5;color:var(--rose-apagado);max-width:36em}
.claro .lead{color:var(--tinta-2)}
.texto{display:flex;flex-direction:column;gap:1.1rem;min-width:0}
.texto p{max-width:38em}
.secundario{color:var(--rose-apagado)}
.claro .secundario{color:var(--tinta-2)}
.fio{height:1px;background:var(--linha-escura);border:0;margin:0}
.claro .fio{background:var(--linha-clara)}

/* botões: alvo de 52px para o polegar */
.botoes{display:flex;flex-wrap:wrap;gap:.7rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:52px;padding:.7rem 1.6rem;border:1px solid transparent;font:inherit;font-size:.82rem;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.btn-compra{background:var(--vermelho);color:var(--creme)}
.btn-compra:hover{background:var(--vermelho-hover)}
.btn-linha{border-color:var(--linha-escura);color:var(--nude);background:transparent}
.btn-linha:hover{border-color:var(--rose);color:var(--creme)}
.claro .btn-linha{border-color:var(--linha-clara);color:var(--tinta)}
.claro .btn-linha:hover{border-color:var(--vermelho);color:var(--vermelho)}
.link{color:var(--rose);text-decoration:underline;text-underline-offset:.25em;text-decoration-thickness:1px}
.claro .link{color:var(--vermelho)}

/* faixa de aviso */
.aviso{background:var(--bordo-escuro);color:var(--rose);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;text-align:center;padding:.55rem var(--gr) .55rem var(--gl)}

/* topo */
.topo{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(58,10,18,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--linha-escura);padding-left:var(--gl);padding-right:var(--gr)}
.topo .wrap{max-width:1140px;margin:0 auto;height:var(--topo);display:flex;align-items:center;gap:1rem}
.marca{display:block;flex:none}
.marca img{height:44px;width:auto}
.menu{margin-left:auto;display:flex;align-items:center;gap:.4rem}
.nav{display:none}
.nav a{text-decoration:none;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--nude);padding:.6rem .7rem}
.nav a:hover,.nav a[aria-current="page"]{color:var(--rose)}
.nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:.5em;text-decoration-thickness:1px}
.btn-menu{width:48px;height:48px;display:grid;place-items:center;background:none;border:0;color:var(--nude);cursor:pointer}
.btn-menu span{display:block;width:22px;height:1px;background:currentColor;box-shadow:0 -7px 0 currentColor,0 7px 0 currentColor}
.topo .btn-compra{min-height:42px;padding:.5rem 1rem;font-size:.7rem}
.gaveta{position:fixed;inset:0;z-index:70;background:var(--bordo-escuro);padding:calc(env(safe-area-inset-top,0px) + 1rem) var(--gr) 2rem var(--gl);display:flex;flex-direction:column;gap:2rem;overflow-y:auto}
.gaveta-topo{display:flex;align-items:center;justify-content:space-between}
.gaveta-topo img{height:36px;width:auto}
.fechar{width:48px;height:48px;background:none;border:1px solid var(--linha-escura);color:var(--nude);font:inherit;font-size:1.4rem;cursor:pointer}
.gaveta nav{display:flex;flex-direction:column}
.gaveta nav a{font-size:1.7rem;text-decoration:none;padding:.7rem 0;border-bottom:1px solid var(--linha-escura)}
.gaveta nav a[aria-current="page"]{color:var(--rose);font-style:italic}
.gaveta .contatos{display:flex;flex-direction:column;gap:.4rem;color:var(--rose-apagado);font-size:.95rem}

/* mordida: o canto superior direito "mordido", como o símbolo */
.mordida{-webkit-mask:radial-gradient(circle at 100% 0,transparent var(--mordida),#000 calc(var(--mordida) + 1px));mask:radial-gradient(circle at 100% 0,transparent var(--mordida),#000 calc(var(--mordida) + 1px))}
.foto{position:relative;margin:0;min-width:0}
.foto img{width:100%;aspect-ratio:4/5;object-fit:cover}
.foto figcaption{font-size:var(--t-xs);letter-spacing:.3em;text-transform:uppercase;color:var(--rose-apagado);margin-top:.7rem}
.claro .foto figcaption{color:var(--tinta-2)}

/* topo da home: no celular a foto ocupa a largura toda e o texto entra sobre o degradê (mesmo enquadramento da landing);
   no computador, foto à esquerda na altura da tela e texto à direita */
.cena{background:var(--bordo-escuro);position:relative;overflow:hidden}
.cena-foto{margin:0;position:relative}
.cena-foto img{width:100%;aspect-ratio:4/5;max-height:88vh;object-fit:cover}
.cena-foto::after{content:"";position:absolute;inset:auto 0 0;height:40%;background:linear-gradient(rgba(42,7,13,0),var(--bordo-escuro))}
.cena-txt{position:relative;z-index:1;margin-top:-5.2rem;padding:0 var(--gr) 3.2rem var(--gl);display:flex;flex-direction:column;align-items:center;text-align:center;gap:1rem}
.cena h1{font-size:var(--t-xxl);color:var(--nude);max-width:12em}
.cena h1 em{font-style:italic;color:var(--rose)}
.cena .lead{font-size:clamp(1.05rem,3.6vw,1.25rem);max-width:26em}
.cena .botoes{flex-direction:column;width:100%;max-width:360px;margin-top:.4rem}
.cena .botoes .btn{width:100%}
.hero-sub{font-size:.85rem;color:var(--rose-apagado);letter-spacing:.04em}

/* faixa de confiança */
.confianca{background:var(--creme);color:var(--tinta);padding-left:var(--gl);padding-right:var(--gr);border-bottom:1px solid var(--linha-clara)}
.confianca ul{max-width:1140px;margin:0 auto;list-style:none;padding:1.4rem 0;display:grid;grid-template-columns:1fr 1fr;gap:1.1rem 1.4rem}
.confianca li{display:flex;gap:.7rem;align-items:flex-start;font-size:.88rem;line-height:1.35;min-width:0}
.confianca li strong{display:block;font-weight:700;font-size:.92rem}
.confianca li span{color:var(--tinta-2)}
.ico{flex:none;width:28px;height:28px;color:var(--vermelho)}
.ico svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}

/* manifesto */
.manifesto{text-align:center}
.manifesto .wrap{display:flex;flex-direction:column;align-items:center;gap:1.6rem}
.manifesto .simbolo{width:64px}
.manifesto blockquote{margin:0;font-size:clamp(1.9rem,6.6vw,3.4rem);line-height:1.12;color:var(--nude);max-width:16em;text-wrap:balance}
.manifesto blockquote em{color:var(--rose)}
.manifesto p{max-width:34em;color:var(--rose-apagado)}

/* duas colunas */
.duas{display:grid;gap:2.4rem;align-items:center}

/* notas olfativas */
.notas{list-style:none;padding:0;margin:0;display:grid;gap:0;border-top:1px solid var(--linha-clara)}
.notas li{display:grid;grid-template-columns:7.5rem 1fr;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--linha-clara);min-width:0}
.notas b{font-weight:400;font-size:var(--t-xs);letter-spacing:.3em;text-transform:uppercase;color:var(--vermelho);padding-top:.25rem}
.faixa:not(.claro) .notas{border-color:var(--linha-escura)}
.faixa:not(.claro) .notas li{border-color:var(--linha-escura)}
.faixa:not(.claro) .notas b{color:var(--rose)}
.preco-linha{display:flex;flex-wrap:wrap;align-items:baseline;gap:.3rem 1rem}
.preco{font-size:2.1rem;line-height:1}
.preco-obs{font-size:.88rem;color:var(--tinta-2)}
.faixa:not(.claro) .preco-obs{color:var(--rose-apagado)}

/* momentos: carrossel de deslizar no celular, três colunas a partir de 640px */
.momentos{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:1rem;margin:2.2rem calc(-1 * var(--gr)) 0 calc(-1 * var(--gl));padding:0 var(--gr) .3rem var(--gl);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gl);scrollbar-width:none;overscroll-behavior-x:contain}
.momentos::-webkit-scrollbar{display:none}
.momento{display:flex;flex-direction:column;gap:.8rem;min-width:0;scroll-snap-align:start}
.momento img{width:100%;aspect-ratio:4/5;object-fit:cover}
.momento h3{font-size:1.45rem;color:var(--nude)}
.momento p{color:var(--rose-apagado);font-size:.98rem}
.claro .momento h3{color:var(--tinta)}
.claro .momento p{color:var(--tinta-2)}

/* passos (sequência real de uso) */
.passos{list-style:none;padding:0;margin:2rem 0 0;display:grid;gap:1.4rem;counter-reset:p}
.passos li{counter-increment:p;display:grid;grid-template-columns:3rem 1fr;gap:1rem;align-items:start;min-width:0}
.passos li::before{content:counter(p);width:3rem;height:3rem;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font-size:1.25rem;color:var(--vermelho)}
.faixa:not(.claro) .passos li::before{color:var(--rose)}
.passos h3{font-size:1.2rem;margin-bottom:.25rem}
.passos p{color:var(--tinta-2)}
.faixa:not(.claro) .passos p{color:var(--rose-apagado)}
.atencao{margin-top:2rem;padding:1.1rem 1.2rem;border:1px solid var(--linha-clara);background:var(--creme-2);font-size:.92rem;color:var(--tinta-2)}
.atencao strong{color:var(--tinta);letter-spacing:.18em;text-transform:uppercase;font-size:.72rem;display:block;margin-bottom:.3rem}
.faixa:not(.claro) .atencao{background:var(--bordo-card);border-color:var(--linha-escura);color:var(--rose-apagado)}
.faixa:not(.claro) .atencao strong{color:var(--nude)}

/* compromissos */
.compromissos{display:grid;gap:0;margin-top:2.4rem;border-top:1px solid var(--linha-escura)}
.compromisso{display:grid;grid-template-columns:32px 1fr;gap:1rem;padding:1.4rem 0;border-bottom:1px solid var(--linha-escura);min-width:0}
.compromisso .ico{color:var(--rose);width:32px;height:32px}
.compromisso h3{font-size:1.25rem;margin-bottom:.3rem;color:var(--nude)}
.compromisso p{color:var(--rose-apagado);font-size:.97rem}
.claro .compromissos,.claro .compromisso{border-color:var(--linha-clara)}
.claro .compromisso .ico{color:var(--vermelho)}
.claro .compromisso h3{color:var(--tinta)}
.claro .compromisso p{color:var(--tinta-2)}
.registro{margin-top:2rem;display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;font-size:.82rem;letter-spacing:.06em;color:var(--rose-apagado)}
.registro b{color:var(--nude);font-weight:400}

/* dúvidas */
.faq{margin-top:2rem;border-top:1px solid var(--linha-clara)}
.faq details{border-bottom:1px solid var(--linha-clara)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.1rem 0;font-size:1.12rem;min-height:52px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font-size:1.5rem;line-height:1;color:var(--vermelho);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details > div{padding:0 0 1.2rem;color:var(--tinta-2);display:flex;flex-direction:column;gap:.7rem;max-width:44em}
.faq-grupo{margin-top:3rem}
.faq-grupo:first-of-type{margin-top:1rem}
.faq-grupo h2{font-size:1.5rem}
.faixa:not(.claro) .faq,.faixa:not(.claro) .faq details{border-color:var(--linha-escura)}
.faixa:not(.claro) .faq summary{color:var(--nude)}
.faixa:not(.claro) .faq summary::after{color:var(--rose)}
.faixa:not(.claro) .faq details > div{color:var(--rose-apagado)}
.indice{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.6rem}
.indice a{font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;border:1px solid var(--linha-clara);padding:.6rem .9rem}
.indice a:hover{border-color:var(--vermelho);color:var(--vermelho)}

/* cabeçalho de página interna */
.cab{background:radial-gradient(100% 120% at 90% 0,#561220 0%,var(--bordo) 60%)}
.cab .wrap{padding-block:clamp(2.6rem,8vw,4.6rem) clamp(2.2rem,6vw,3.4rem);display:flex;flex-direction:column;gap:1rem}
.cab h1{font-size:var(--t-xxl)}
.migalhas{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rose-apagado)}
.migalhas a{text-decoration:none}
.migalhas a:hover{color:var(--rose)}
.migalhas span{margin:0 .5rem;opacity:.6}

/* texto longo (políticas) */
.doc{max-width:720px}
.doc h2{font-size:1.55rem;margin:2.6rem 0 .8rem}
.doc h3{font-size:1.18rem;margin:1.6rem 0 .5rem}
.doc p,.doc li{color:var(--tinta-2);max-width:40em}
.doc p + p{margin-top:.9rem}
.doc ul,.doc ol{padding-left:1.2rem;display:flex;flex-direction:column;gap:.45rem;margin:.8rem 0}
.doc strong{color:var(--tinta)}
.doc .atualizado{font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-2)}
.doc .caixa{border:1px solid var(--linha-clara);background:var(--creme-2);padding:1.1rem 1.2rem;margin:1.4rem 0}
.tabela{overflow-x:auto;margin:1rem 0}
.tabela table{border-collapse:collapse;width:100%;min-width:520px;font-size:.92rem}
.tabela th,.tabela td{text-align:left;padding:.7rem .6rem;border-bottom:1px solid var(--linha-clara);vertical-align:top;color:var(--tinta-2)}
.tabela th{color:var(--tinta);font-weight:700}
.ph{background:rgba(142,22,38,.1);color:var(--vermelho);padding:0 .25em;border-radius:2px;white-space:nowrap}
.faixa:not(.claro) .ph,.rodape .ph{background:rgba(227,184,168,.14);color:var(--rose)}

/* produto */
.produto > .wrap{display:grid;gap:2.2rem;padding-block:1.6rem 3.6rem}
.galeria{min-width:0}
.galeria-trilho{display:flex;gap:.6rem;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(-1 * var(--gr)) 0 calc(-1 * var(--gl));padding:0 var(--gr) 0 var(--gl);scrollbar-width:none}
.galeria-trilho::-webkit-scrollbar{display:none}
.galeria-trilho img{flex:0 0 86%;scroll-snap-align:center;aspect-ratio:4/5;object-fit:cover;width:86%}
.galeria-pontos{display:flex;justify-content:center;gap:.5rem;margin-top:.9rem}
.galeria-pontos button{width:28px;height:28px;padding:0;background:none;border:0;cursor:pointer;display:grid;place-items:center}
.galeria-pontos button::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--linha-escura)}
.galeria-pontos button[aria-current="true"]::before{background:var(--rose)}
.compra{display:flex;flex-direction:column;gap:1.2rem;min-width:0}
.compra h1{font-size:clamp(2.1rem,7vw,3.2rem)}
.compra .resumo{color:var(--rose-apagado)}
.kits{border:0;margin:0;padding:0;display:grid;gap:.6rem}
.kits legend{font-size:var(--t-xs);letter-spacing:.3em;text-transform:uppercase;color:var(--rose);margin-bottom:.6rem}
.kit{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.9rem;padding:1rem 1.1rem;border:1px solid var(--linha-escura);background:var(--bordo-card);cursor:pointer;min-height:64px}
.kit input{appearance:none;-webkit-appearance:none;width:20px;height:20px;border:1px solid var(--rose);border-radius:50%;margin:0;display:grid;place-items:center;cursor:pointer}
.kit input::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--rose);transform:scale(0);transition:transform .15s}
.kit input:checked::before{transform:scale(1)}
.kit:has(input:checked){border-color:var(--rose);background:#4f1320}
.kit-nome{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.kit-nome small{color:var(--rose-apagado);font-size:.8rem}
.kit-preco{text-align:right;display:flex;flex-direction:column;line-height:1.2}
.kit-preco s{font-size:.78rem;color:var(--rose-apagado)}
.kit-preco b{font-weight:400;font-size:1.2rem}
.selo-kit{position:absolute;top:-.65rem;right:1rem;background:var(--grad-rose);color:var(--bordo-escuro);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;padding:.2rem .55rem}
.pagamentos{display:flex;flex-wrap:wrap;gap:.3rem .6rem;font-size:.82rem;color:var(--rose-apagado)}
.pagamentos span::before{content:"·";margin-right:.6rem;color:var(--rose)}
.pagamentos span:first-child::before{content:none}

.form{display:grid;gap:.9rem}
.form .linha{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.form .linha.cep{grid-template-columns:1.4fr 1fr}
.campo{display:flex;flex-direction:column;gap:.35rem;min-width:0}
.campo label{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--rose)}
.campo input,.campo select,.campo textarea{font:inherit;font-size:1rem;color:var(--creme);background:var(--bordo-escuro);border:1px solid var(--linha-escura);padding:.8rem .9rem;min-height:50px;width:100%;border-radius:0}
.campo textarea{min-height:130px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--rose)}
.campo [aria-invalid="true"]{border-color:#E06A78}
.claro .campo label{color:var(--vermelho)}
.claro .campo input,.claro .campo select,.claro .campo textarea{color:var(--tinta);background:#fff;border-color:var(--linha-clara)}
.claro .campo input:focus,.claro .campo select:focus,.claro .campo textarea:focus{border-color:var(--vermelho)}
.dica{font-size:.8rem;color:var(--rose-apagado)}
.aceite{display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:start;font-size:.85rem;color:var(--rose-apagado);cursor:pointer}
.aceite input{width:20px;height:20px;margin:.15rem 0 0;accent-color:var(--rose)}
.claro .dica{color:var(--tinta-2)}
.erro{color:#F2A0A9;font-size:.9rem;min-height:1.2em}
.claro .erro{color:var(--vermelho)}
.total{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--linha-escura);padding-top:1rem;font-size:1.05rem}
.total b{font-weight:400;font-size:1.6rem}
.confirmacao{border:1px solid var(--rose);padding:1.1rem;background:var(--bordo-card);display:flex;flex-direction:column;gap:.6rem}
.claro .confirmacao{background:#fff;border-color:var(--vermelho)}
.ficha{display:grid;gap:0;margin:0;border-top:1px solid var(--linha-clara)}
.ficha div{display:grid;grid-template-columns:8.5rem 1fr;gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--linha-clara);min-width:0}
.ficha dt{font-size:var(--t-xs);letter-spacing:.24em;text-transform:uppercase;color:var(--vermelho);padding-top:.2rem}
.ficha dd{margin:0;color:var(--tinta-2)}

.compra-home .compra{gap:1.1rem}
.so-desktop{display:none}

/* barra fixa de compra (produto, celular) */
.barra{position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(42,7,13,.97);border-top:1px solid var(--linha-escura);padding:.6rem var(--gr) calc(.6rem + env(safe-area-inset-bottom,0px)) var(--gl);display:flex;align-items:center;gap:1rem;transform:translateY(0);transition:transform .25s}
.barra.oculta{transform:translateY(110%)}
.barra div{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.barra small{font-size:.72rem;color:var(--rose-apagado);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.barra b{font-weight:400;font-size:1.2rem}
.barra .btn{margin-left:auto;min-height:48px;padding:.5rem 1.3rem}
.com-barra{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}

/* contato */
.canais{display:grid;gap:1rem;margin-top:2rem}
.canal{border:1px solid var(--linha-clara);padding:1.3rem;display:flex;flex-direction:column;gap:.4rem;background:var(--creme-2);min-width:0}
.canal h2{font-size:1.25rem}
.canal p{color:var(--tinta-2);overflow-wrap:anywhere}
.canal .valor{font-size:1.2rem;color:var(--tinta);user-select:all}
.empresa{margin-top:2.4rem;font-size:.92rem;color:var(--tinta-2);display:grid;gap:.3rem}

/* rodapé */
.rodape{background:var(--bordo-escuro);color:var(--rose-apagado);padding-left:var(--gl);padding-right:var(--gr)}
.rodape > .wrap{max-width:1140px;margin:0 auto;padding-block:3.4rem 2rem;display:grid;gap:2.4rem}
.rodape-marca{display:flex;flex-direction:column;gap:1rem;align-items:flex-start}
.rodape-marca img{width:150px}
.rodape-marca p{font-style:italic;color:var(--nude)}
.colunas{display:grid;grid-template-columns:1fr 1fr;gap:2rem 1.4rem}
.colunas h2{font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--rose);margin-bottom:.8rem}
.colunas ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.15rem}
.colunas a{text-decoration:none;display:inline-block;padding:.3rem 0;font-size:.95rem}
.colunas a:hover{color:var(--nude)}
.colunas li{font-size:.92rem;overflow-wrap:anywhere}
.legal{border-top:1px solid var(--linha-escura);padding-top:1.4rem;font-size:.78rem;line-height:1.6;display:flex;flex-direction:column;gap:.5rem}
.legal p{max-width:70em}

/* consentimento de cookies (LGPD) */
.cookies{position:fixed;z-index:65;left:max(12px,env(safe-area-inset-left,0px));right:max(12px,env(safe-area-inset-right,0px));bottom:calc(12px + env(safe-area-inset-bottom,0px));max-width:560px;margin:0 auto;background:var(--creme);color:var(--tinta);padding:1.1rem 1.2rem;box-shadow:0 18px 50px rgba(0,0,0,.45);display:flex;flex-direction:column;gap:.8rem;font-size:.9rem}
.cookies p{color:var(--tinta-2)}
.cookies .botoes{gap:.5rem}
.cookies .btn{min-height:46px;padding:.5rem 1.1rem;font-size:.72rem;flex:1 1 auto}
.cookies .btn-linha{border-color:var(--linha-clara);color:var(--tinta)}

/* entrada suave, a partir de um estado visível */
@media (prefers-reduced-motion:no-preference){
  .cena-txt > *{animation:sobe .8s cubic-bezier(.2,.7,.2,1) both}
  .cena-txt > *:nth-child(2){animation-delay:.07s}
  .cena-txt > *:nth-child(3){animation-delay:.14s}
  .cena-txt > *:nth-child(4){animation-delay:.21s}
  @keyframes sobe{from{transform:translateY(10px)}to{transform:none}}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* telas médias */
@media (min-width:640px){
  .confianca ul{grid-template-columns:repeat(4,1fr)}
  .momentos{grid-auto-flow:row;grid-template-columns:repeat(3,1fr);gap:1.6rem;overflow:visible;margin-inline:0;padding:0}
  .canais{grid-template-columns:repeat(3,1fr)}
  .colunas{grid-template-columns:repeat(4,1fr)}
}
/* tablets em pé: a foto do topo não ocupa a tela inteira e as fotos das seções não ficam gigantes */
@media (min-width:600px) and (max-width:899px){
  .cena-foto img{max-height:66vh}
  .duas > .foto{width:100%;max-width:480px;justify-self:center}
}
/* telas grandes */
@media (min-width:900px){
  :root{--topo:76px;--mordida:3.4rem}
  .marca img{height:56px}
  .nav{display:flex}
  .btn-menu{display:none}
  .cena{display:grid;grid-template-columns:1.15fr 1fr;min-height:min(84vh,760px);background:radial-gradient(120% 90% at 85% 25%,#4d101c 0%,var(--bordo-escuro) 65%)}
  .cena-foto img{height:100%;max-height:none;aspect-ratio:auto;object-position:50% 45%}
  .cena-foto::after{display:none}
  .cena-txt{margin-top:0;align-self:center;padding:4rem max(var(--gr),clamp(2rem,6vw,6rem)) 4rem clamp(2rem,5vw,5rem);text-align:left;align-items:flex-start}
  .cena .botoes{flex-direction:row;max-width:none}
  .cena .botoes .btn{width:auto}
  .so-desktop{display:block}
  .compra-home{align-items:center}
  .duas{grid-template-columns:1fr 1fr;gap:5rem}
  .duas.inverte > :first-child{order:2}
  .compromissos{grid-template-columns:1fr 1fr;column-gap:3rem}
  .produto > .wrap{grid-template-columns:1.1fr 1fr;gap:4rem;align-items:start;padding-block:3rem 5rem}
  .galeria{position:sticky;top:calc(var(--topo) + 1.5rem)}
  .galeria-trilho{margin:0;padding:0}
  .galeria-trilho img{flex-basis:100%;width:100%}
  .barra{display:none}
  .com-barra{padding-bottom:0}
  .rodape > .wrap{grid-template-columns:1fr 3fr;gap:4rem}
  .legal{grid-column:1 / -1}
  .passos{grid-template-columns:repeat(3,1fr);gap:2rem}
  .passos li{grid-template-columns:1fr;gap:1rem}
}

/* Botão de compra ocupado e página de pedido confirmado (volta do checkout) */
.btn[disabled]{opacity:.65;cursor:progress}
.confirmado .wrap{display:flex;flex-direction:column;gap:1.1rem;padding-top:1rem;padding-bottom:1rem}
.selo-ok{width:64px;height:64px;border:1.5px solid var(--rose);border-radius:50%;display:grid;place-items:center}
.selo-ok svg{width:28px;height:28px;fill:none;stroke:var(--rose);stroke-width:1.6}
.resumo-pedido{margin:.4rem 0;border:1px solid var(--linha-escura);background:var(--bordo-card);padding:.6rem 1.1rem}
.resumo-pedido div{display:flex;justify-content:space-between;gap:1rem;padding:.45rem 0}
.resumo-pedido div+div{border-top:1px solid var(--linha-escura)}
.resumo-pedido dt{color:var(--rose-apagado)}
.resumo-pedido dd{margin:0;text-align:right}
