/* =========================================================================
   DUO SKINCARE — Design System
   Base: "Atlas Card" style reference (DESIGN.md) — dark, cinematográfico,
   restrição extrema, tipografia geométrica + mono para anotações.
   Paleta: substituída pela paleta anexada pelo cliente (azul acinzentado
   sobre near-black) no lugar do Sapphire Volt original.
   ========================================================================= */

:root{
  /* ---- Cores (paleta do cliente) ---- */
  --void:        #0D0C11;   /* canvas absoluto */
  --obsidian:    #16151D;   /* superfície 1 */
  --graphite:    #1F1E28;   /* superfície 2 / hover */
  --line:        #292834;   /* divisores */
  --ash:         #6D87AA;   /* texto secundário / azul profundo */
  --frost:       #B0C1D9;   /* texto terciário / estados claros */
  --paper:       #D7D7D9;   /* texto primário */
  --pure-white:  #FFFFFF;
  --accent:      #A0BAD9;   /* único acento — CTA e marca */
  --accent-deep: #6D87AA;

  --muted:       rgba(215,215,217,.56);
  --muted-soft:  rgba(215,215,217,.34);

  /* ---- Tipografia ---- */
  --font-display: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-ui:      'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  /* Jost = substituto da geométrica leve impressa no frasco. Display e logo. */
  --font-brand:   'Jost', 'Futura', 'Century Gothic', ui-sans-serif, system-ui, sans-serif;

  --text-caption: 10px;   --leading-caption: 1.5;
  --text-body:    15px;   --leading-body: 1.67;
  --text-body-lg: 17px;   --leading-body-lg: 1.24;
  --text-sub:     23px;   --leading-sub: 1.3;
  --text-heading: 28px;   --leading-heading: 1.4;
  /* extensões do sistema para escala de landing page */
  --text-display: clamp(30px, 4.6vw, 54px);
  --text-title:   clamp(25px, 3.4vw, 38px);

  /* ---- Espaçamento (base 8) ---- */
  --s-8:8px; --s-16:16px; --s-24:24px; --s-32:32px; --s-48:48px;
  --s-64:64px; --s-88:88px; --s-104:104px; --s-128:128px; --s-144:144px; --s-176:176px;

  /* ---- Layout ---- */
  --wrap: 1180px;
  --narrow: 640px;
  --section-gap: clamp(72px, 10vw, 144px);
  --gutter: clamp(20px, 5vw, 48px);

  /* ---- Raios ---- */
  --r-tag: 4px; --r-card: 12px; --r-input: 8px; --r-pill: 128px;
}

/* ---------------- Reset ---------------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--void); color:var(--paper);
  font-family:var(--font-display); font-size:var(--text-body-lg);
  line-height:1.6; font-weight:400;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img,svg,video{ display:block; max-width:100%; }
h1,h2,h3,h4,p,figure,blockquote{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
a{ color:inherit; text-decoration:none; }
button,input{ font:inherit; color:inherit; }
button{ background:none; border:0; cursor:pointer; }
::selection{ background:var(--accent); color:var(--void); }

.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.skip-link{ position:absolute; left:-9999px; top:0; z-index:200; background:var(--accent);
  color:var(--void); padding:12px 20px; border-radius:0 0 var(--r-input) 0; }
.skip-link:focus{ left:0; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:2px; }

/* ---------------- Tipografia utilitária ---------------- */
.eyebrow{
  font-family:var(--font-mono); font-size:11px; line-height:var(--leading-caption);
  letter-spacing:.18em; text-transform:uppercase; color:var(--ash); margin-bottom:var(--s-24);
}
.annotation{
  font-family:var(--font-mono); font-size:12px; line-height:1.6;
  letter-spacing:.02em; color:var(--muted); text-align:center;
}
.annotation--left{ text-align:left; }
em{ font-style:normal; color:var(--accent); }

/* ---------------- Layout ---------------- */
.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gutter); }
.wrap--narrow{ max-width:calc(var(--narrow) + var(--gutter) * 2); }
.section{ padding-block:var(--section-gap); }
.section--tight{ padding-block:clamp(48px,6vw,88px); }
.section--alt{ background:var(--obsidian); border-block:1px solid var(--line); }
.section--narrative{ padding-block:clamp(88px,12vw,176px); }

.section__head{ max-width:var(--narrow); margin:0 auto clamp(48px,6vw,var(--s-88)); text-align:center; }
.section__title{
  font-family:var(--font-brand); font-weight:400;
  font-size:var(--text-title); line-height:1.14; letter-spacing:-.004em; color:var(--paper);
}
.section__sub{
  margin-top:var(--s-24); font-size:var(--text-sub); line-height:var(--leading-sub);
  color:var(--muted); font-weight:400;
}

/* Bloco narrativo — coluna centrada de 640px (padrão editorial do sistema) */
.narrative{ max-width:var(--narrow); margin-inline:auto; text-align:center; }
.narrative__lead{
  font-family:var(--font-brand); font-weight:400;
  font-size:var(--text-title); line-height:1.18; letter-spacing:-.004em;
  color:var(--paper); margin-bottom:var(--s-32);
}
.narrative p:not(.narrative__lead):not(.annotation):not(.eyebrow){
  font-size:var(--text-sub); line-height:var(--leading-sub); color:var(--muted);
}
.narrative p + p{ margin-top:var(--s-32); }

/* ---------------- Botões ---------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--font-ui); font-size:var(--text-body-lg); line-height:var(--leading-body-lg);
  font-weight:500; letter-spacing:-.004em;
  padding:17px 34px; border-radius:var(--r-pill); border:1px solid transparent;
  transition:background-color .28s ease, color .28s ease, border-color .28s ease, transform .28s ease;
  white-space:nowrap;
}
.btn--primary{ background:var(--accent); color:var(--void); }
.btn--primary:hover{ background:var(--frost); }
.btn--primary:active{ transform:translateY(1px); }
.btn--ghost{ background:transparent; color:var(--paper); border-color:rgba(215,215,217,.28); }
.btn--ghost:hover{ border-color:var(--accent); color:var(--accent); }
.btn--sm{ padding:13px 24px; font-size:var(--text-body); }
.btn--block{ width:100%; }
.btn[disabled]{ opacity:.45; pointer-events:none; }

/* ---------------- Header ---------------- */
.header{
  position:fixed; inset:0 0 auto 0; z-index:80;
  transition:background-color .35s ease, border-color .35s ease, backdrop-filter .35s ease;
  border-bottom:1px solid transparent;
}
.header.is-stuck{
  background:rgba(13,12,17,.82); backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%); border-bottom-color:var(--line);
}
.header__inner{
  max-width:var(--wrap); margin-inline:auto; padding:18px var(--gutter);
  display:flex; align-items:center; justify-content:space-between; gap:var(--s-24);
}
.logo{
  display:inline-flex; flex-direction:column; align-items:center;
  font-family:var(--font-brand); font-weight:300; line-height:1; color:var(--paper);
}
.logo__duo{ font-size:23px; letter-spacing:.15em; text-indent:.15em; }
.logo__sub{ margin-top:5px; font-size:7.5px; letter-spacing:.44em; text-indent:.44em; opacity:.72; }
.logo--lg .logo__duo{ font-size:30px; }
.logo--lg .logo__sub{ font-size:9px; margin-top:6px; }

.nav{ display:flex; gap:var(--s-32); }
.nav a{
  font-family:var(--font-ui); font-size:var(--text-body); color:var(--muted);
  letter-spacing:.01em; transition:color .25s ease; position:relative;
}
.nav a:hover{ color:var(--paper); }

.header__actions{ display:flex; align-items:center; gap:var(--s-8); }
.cart-btn{
  position:relative; width:42px; height:42px; border-radius:var(--r-pill);
  display:grid; place-items:center; color:var(--paper);
  border:1px solid rgba(215,215,217,.18); transition:border-color .25s ease, color .25s ease;
}
.cart-btn:hover{ border-color:var(--accent); color:var(--accent); }
.cart-btn__count{
  position:absolute; top:-4px; right:-4px; min-width:19px; height:19px; padding:0 5px;
  border-radius:var(--r-pill); background:var(--accent); color:var(--void);
  font-family:var(--font-mono); font-size:10px; font-weight:500;
  display:grid; place-items:center; transition:transform .25s ease;
}
.cart-btn__count[data-empty="true"]{ transform:scale(0); }

.menu-btn{
  display:none; width:42px; height:42px; border-radius:var(--r-pill);
  border:1px solid rgba(215,215,217,.18);
  flex-direction:column; align-items:center; justify-content:center; gap:5px;
}
.menu-btn span{ display:block; width:16px; height:1.5px; background:var(--paper); transition:transform .3s ease; }
.menu-btn[aria-expanded="true"] span:first-child{ transform:translateY(3.25px) rotate(45deg); }
.menu-btn[aria-expanded="true"] span:last-child{ transform:translateY(-3.25px) rotate(-45deg); }

/* ---------------- Hero ---------------- */
.hero{
  position:relative; min-height:100vh; min-height:100svh;
  display:grid; align-items:end; justify-items:start; text-align:left;
  padding:calc(var(--s-128) + 20px) var(--gutter) clamp(72px,10vh,var(--s-104));
  overflow:hidden; isolation:isolate;
}
.hero > .hero__content{ width:100%; max-width:var(--wrap); margin-inline:auto; }
.hero__media{ position:absolute; inset:0; z-index:-1; background:var(--void); }
.hero__media video{
  width:100%; height:100%; object-fit:cover; object-position:center 38%;
  transform:scale(1.04) translateY(-4%);
}
/* Escurece o vídeo para o texto respirar, mantendo a atmosfera fria da paleta */
.hero__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(13,12,17,.62) 0%, rgba(13,12,17,.28) 32%, rgba(13,12,17,0) 58%),
    linear-gradient(180deg, rgba(13,12,17,.52) 0%, rgba(13,12,17,0) 22%, rgba(13,12,17,.06) 48%, rgba(13,12,17,.58) 74%, rgba(13,12,17,.95) 92%);
}
/* Transição gradiente da imagem para o void — nunca corte seco (regra do sistema) */
.hero__fade{
  position:absolute; inset:auto 0 -1px 0; height:26%;
  background:linear-gradient(180deg, rgba(20,19,26,0) 0%, var(--void) 88%);
}
.hero__content{ position:relative; }
.hero .eyebrow{ color:var(--frost); }
.hero__content > *{ max-width:600px; }
.hero__title{ max-width:820px; }
.hero__title{
  font-family:var(--font-brand); font-weight:300;
  font-size:var(--text-display); line-height:1.06; letter-spacing:-.006em;
  color:var(--paper); text-wrap:balance;
}
.hero__lead{
  margin-top:var(--s-32); font-size:var(--text-sub); line-height:var(--leading-sub);
  color:rgba(215,215,217,.78); max-width:520px;
}
.hero__cta{
  margin-top:var(--s-48); display:flex; gap:var(--s-16);
  justify-content:flex-start; flex-wrap:wrap;
}
.closing .hero__cta{ justify-content:center; }
.hero__cta + .annotation{ margin-top:var(--s-24); }
.hero .eyebrow{ margin-bottom:var(--s-16); }
.hero__title + .hero__cta{ margin-top:var(--s-32); }
.hero__mute{
  position:absolute; right:var(--gutter); bottom:var(--s-48); z-index:3;
  width:40px; height:40px; border-radius:var(--r-pill); display:grid; place-items:center;
  color:var(--frost); border:1px solid rgba(215,215,217,.2);
  transition:color .25s ease, border-color .25s ease;
}
.hero__mute:hover{ color:var(--accent); border-color:var(--accent); }
.hero__mute.is-on .mute-x{ display:none; }
/* Indicador de scroll — linha fina, sem rótulo */
.hero__scroll{
  position:absolute; left:58%; bottom:var(--s-32); width:52px; height:1px;
  background:linear-gradient(90deg, transparent, var(--frost), transparent);
  transform:translateX(-50%); opacity:.7; animation:breathe 3.4s ease-in-out infinite;
}
@keyframes breathe{ 0%,100%{ opacity:.28; width:38px; } 50%{ opacity:.85; width:64px; } }

/* ---------------- Faixa de selos ---------------- */
.strip{
  background:var(--obsidian); border-block:1px solid var(--line);
  overflow:hidden; padding-block:16px;
}
.strip__track{
  display:flex; align-items:center; gap:var(--s-24); width:max-content;
  animation:slide 46s linear infinite;
  font-family:var(--font-mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--ash);
}
.strip__track i{ color:var(--muted-soft); font-style:normal; }
@keyframes slide{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ---------------- Ritual ---------------- */
.ritual{ display:grid; grid-template-columns:1fr 1px 1fr; gap:clamp(32px,5vw,var(--s-88)); align-items:start; }
.ritual__divider{ align-self:stretch; display:grid; place-items:center; }
.ritual__divider span{
  display:block; width:1px; height:100%;
  background:linear-gradient(180deg, transparent, var(--line) 18%, var(--line) 82%, transparent);
}
.ritual__card{ --tone:var(--frost); }
.ritual__card[data-phase="noite"]{ --tone:var(--ash); }
.ritual__time{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.22em; color:var(--tone);
  margin-bottom:var(--s-24);
}
.ritual__art{ color:var(--tone); margin-bottom:var(--s-32); opacity:.9; }
.ritual__name{ font-family:var(--font-brand); font-size:var(--text-heading); font-weight:400; letter-spacing:0; line-height:1.15; }
.ritual__role{ margin-top:10px; font-size:var(--text-body); color:var(--tone); font-family:var(--font-mono); letter-spacing:.02em; }
.ritual__desc{ margin-top:var(--s-24); font-size:var(--text-body-lg); line-height:1.6; color:var(--muted); }
.ritual__list{ margin-top:var(--s-24); display:grid; gap:10px; }
.ritual__list li{
  font-size:var(--text-body); color:var(--paper); padding-left:22px; position:relative;
}
.ritual__list li::before{
  content:""; position:absolute; left:0; top:.72em; width:10px; height:1px; background:var(--tone);
}
.ritual__card .annotation{ margin-top:var(--s-32); }
.ritual__cta{ margin-top:clamp(48px,6vw,var(--s-88)); text-align:center; display:grid; gap:var(--s-16); justify-items:center; }

/* ---------------- Grids ---------------- */
.grid{ display:grid; gap:var(--s-24); }
.grid--3{ grid-template-columns:repeat(3,1fr); }
.grid--offers{ grid-template-columns:repeat(2,1fr); gap:var(--s-24); max-width:860px; margin-inline:auto; }

/* ---------------- Pilares (o ativo) ---------------- */
.pillar{
  background:var(--void); border:1px solid var(--line); border-radius:var(--r-card);
  padding:clamp(24px,3vw,var(--s-32));
  transition:border-color .3s ease, transform .3s ease;
}
.pillar:hover{ border-color:rgba(160,186,217,.3); transform:translateY(-3px); }
.pillar__num{
  font-family:var(--font-mono); font-size:11px; letter-spacing:.22em;
  color:var(--accent-deep); margin-bottom:var(--s-24);
}
.pillar h3{ font-family:var(--font-brand); font-size:var(--text-sub); font-weight:400; letter-spacing:0; line-height:1.25; }
.pillar p{ margin-top:var(--s-16); font-size:var(--text-body); line-height:1.68; color:var(--muted); }

/* ---------------- Destaque do cobre ---------------- */
.callout{
  margin-top:var(--s-32); display:flex; gap:clamp(20px,3vw,var(--s-32)); align-items:center;
  padding:clamp(24px,3vw,var(--s-32)); border-radius:var(--r-card);
  border:1px solid rgba(160,186,217,.3);
  background:linear-gradient(115deg, rgba(160,186,217,.10), transparent 58%);
}
.callout__mark{
  flex:none; width:84px; height:84px; display:grid; place-items:center;
  border:1px solid rgba(160,186,217,.34); border-radius:var(--r-card);
  font-size:34px; font-weight:700; letter-spacing:-.03em; color:var(--accent);
}
.callout h3{ font-size:var(--text-body-lg); font-weight:700; letter-spacing:-.01em; }
.callout p{ margin-top:10px; font-size:var(--text-body); line-height:1.68; color:var(--muted); max-width:66ch; }

/* ---------------- Como usar ---------------- */
.howto{
  margin-top:clamp(48px,6vw,var(--s-88)); padding-top:var(--s-48);
  border-top:1px solid var(--line);
  display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s-32);
}
.howto__step{ display:flex; gap:var(--s-16); align-items:baseline; }
.howto__step span{
  font-family:var(--font-mono); font-size:11px; letter-spacing:.2em; color:var(--accent); flex:none;
}
.howto__step p{ font-size:var(--text-body); line-height:1.62; color:var(--muted); }

/* ---------------- Bloco de compra ---------------- */
.buy{ display:grid; gap:clamp(24px,4vw,var(--s-48)); }
.buy__media{
  position:relative; overflow:hidden; border-radius:var(--r-card);
  border:1px solid var(--line); background:var(--void);
}
.buy__media video{ width:100%; aspect-ratio:21/9; object-fit:cover; object-position:center 42%; }
.buy__caption{
  position:absolute; inset:auto 0 0 0; padding:var(--s-24);
  background:linear-gradient(180deg, transparent, rgba(13,12,17,.9));
}

/* ---------------- Cartão de oferta ---------------- */
.offer{
  background:var(--void); border:1px solid var(--line); border-radius:var(--r-card);
  padding:var(--s-24); display:flex; flex-direction:column;
  transition:border-color .3s ease, background-color .3s ease, transform .3s ease;
}
.offer:hover{ border-color:rgba(160,186,217,.42); transform:translateY(-3px); }
.offer--featured{
  border-color:rgba(160,186,217,.48);
  background:linear-gradient(180deg, rgba(160,186,217,.08), transparent 44%), var(--void);
}
.offer__head{
  position:relative; margin-bottom:var(--s-24);
  border-radius:var(--r-input); overflow:hidden; background:var(--obsidian);
}
.offer__foto{ width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; display:block; }
.offer__flag{
  position:absolute; top:0; left:0; z-index:2;
  font-family:var(--font-mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase;
  padding:6px 10px; border-radius:var(--r-tag); background:var(--accent); color:var(--void);
}
.offer__flag--muted{ background:transparent; color:var(--ash); border:1px solid var(--line); }
.offer__name{ font-family:var(--font-brand); font-size:var(--text-heading); font-weight:400; letter-spacing:0; line-height:1.15; }
.offer__desc{ margin-top:12px; font-size:var(--text-body); line-height:1.62; color:var(--muted); }
.offer__bullets{ margin-top:var(--s-24); display:grid; gap:10px; padding-top:var(--s-24); border-top:1px solid var(--line); flex:1; align-content:start; }
.offer__bullets li{ position:relative; padding-left:20px; font-size:var(--text-body); color:var(--paper); line-height:1.5; }
.offer__bullets li::before{ content:""; position:absolute; left:0; top:.62em; width:9px; height:1px; background:var(--accent-deep); }
.offer__price{ margin-top:var(--s-24); display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.offer__price strong{ font-family:var(--font-brand); font-size:30px; font-weight:400; letter-spacing:-.004em; }
.offer__price del{ font-family:var(--font-mono); font-size:13px; color:var(--muted-soft); }
.offer__unit{ margin:8px 0 var(--s-24); font-family:var(--font-mono); font-size:11px; letter-spacing:.02em; color:var(--muted); }

/* ---------------- Tabela de ativos ---------------- */
.table-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-card); background:var(--void); }
.actives{ width:100%; border-collapse:collapse; min-width:620px; }
.actives th{
  text-align:left; font-family:var(--font-mono); font-size:10px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ash); font-weight:400;
  padding:var(--s-24); border-bottom:1px solid var(--line);
}
.actives td{ padding:18px var(--s-24); font-size:var(--text-body); border-bottom:1px solid var(--line); color:var(--paper); }
.actives tr:last-child td{ border-bottom:0; }
.actives td:nth-child(2){ font-family:var(--font-mono); color:var(--accent); white-space:nowrap; }
.actives td:nth-child(3){ color:var(--muted); }
.actives td:nth-child(4){ font-family:var(--font-mono); font-size:12px; color:var(--ash); white-space:nowrap; }
.actives tbody tr{ transition:background-color .2s ease; }
.actives tbody tr:hover{ background:var(--obsidian); }
#ciencia .annotation{ margin-top:var(--s-24); }

/* ---------------- Estatísticas ---------------- */
.stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s-24); text-align:center; }
.stat{ padding:var(--s-32) var(--s-16); }
.stat__num{ font-family:var(--font-brand); font-size:clamp(48px,7vw,74px); font-weight:300; letter-spacing:-.01em; line-height:1; color:var(--accent); }
.stat__num span{ font-size:.42em; letter-spacing:0; margin-left:2px; }
.stat__label{ margin-top:var(--s-16); font-size:var(--text-body-lg); color:var(--paper); }
.stat .annotation{ margin-top:8px; }
#resultados > .wrap > .annotation{ margin-top:var(--s-32); }

/* ---------------- Depoimentos ---------------- */
.quote{
  background:var(--obsidian); border:1px solid var(--line); border-radius:var(--r-card);
  padding:var(--s-32); display:flex; flex-direction:column; gap:var(--s-16);
}
.quote__stars{ color:var(--accent); font-size:13px; letter-spacing:.32em; }
.quote blockquote{ font-size:var(--text-body-lg); line-height:1.6; color:var(--paper); flex:1; }
.quote figcaption{ font-family:var(--font-mono); font-size:12px; color:var(--paper); letter-spacing:.02em; }
.quote figcaption span{ color:var(--muted); }

/* ---------------- Garantias ---------------- */
.assurances{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s-48);
  padding-block:var(--s-48); border-block:1px solid var(--line); }
.assurance svg{ color:var(--accent); margin-bottom:var(--s-16); }
.assurance h3{ font-size:var(--text-body-lg); font-weight:700; letter-spacing:-.01em; }
.assurance p{ margin-top:10px; font-size:var(--text-body); line-height:1.6; color:var(--muted); }

/* ---------------- FAQ ---------------- */
.faq{ border-top:1px solid var(--line); }
.faq__item{ border-bottom:1px solid var(--line); }
.faq__item summary{
  list-style:none; cursor:pointer; padding:var(--s-24) 44px var(--s-24) 0; position:relative;
  font-size:var(--text-body-lg); font-weight:500; letter-spacing:-.008em; color:var(--paper);
  transition:color .25s ease;
}
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary:hover{ color:var(--accent); }
.faq__item summary::after,
.faq__item summary::before{
  content:""; position:absolute; right:8px; top:50%; background:var(--accent);
  transition:transform .3s ease, opacity .3s ease;
}
.faq__item summary::before{ width:14px; height:1.5px; transform:translateY(-50%); }
.faq__item summary::after{ width:1.5px; height:14px; right:14.25px; transform:translateY(-50%); }
.faq__item[open] summary::after{ transform:translateY(-50%) rotate(90deg); opacity:0; }
.faq__body{ padding:0 var(--s-48) var(--s-32) 0; }
.faq__body p{ font-size:var(--text-body); line-height:1.72; color:var(--muted); }

/* ---------------- Fechamento ---------------- */
.closing{
  padding-block:clamp(88px,12vw,var(--s-176));
  background:linear-gradient(180deg, var(--void) 0%, #14131C 52%, var(--void) 100%);
  border-top:1px solid var(--line);
}
.closing__title{ font-family:var(--font-brand); font-weight:400; font-size:var(--text-title); letter-spacing:-.004em; line-height:1.16; margin-bottom:var(--s-24); }
.closing .hero__cta{ margin-top:var(--s-48); }

/* ---------------- Footer ---------------- */
.footer{ border-top:1px solid var(--line); background:var(--obsidian); padding-block:var(--s-64) var(--s-32); }
.footer__top{ display:flex; justify-content:space-between; gap:var(--s-48); flex-wrap:wrap; padding-bottom:var(--s-48); border-bottom:1px solid var(--line); }
.footer__tagline{ margin-top:var(--s-16); font-size:var(--text-body); color:var(--muted); max-width:320px; }
.newsletter{ max-width:400px; width:100%; }
.newsletter label{ display:block; font-size:var(--text-body); color:var(--paper); margin-bottom:var(--s-16); }
.newsletter__row{ display:flex; gap:8px; }
.newsletter input{
  flex:1; min-width:0; background:var(--void); border:1px solid var(--line); border-radius:var(--r-input);
  padding:14px 16px; font-size:var(--text-body); color:var(--paper); transition:border-color .25s ease;
}
.newsletter input::placeholder{ color:var(--muted-soft); }
.newsletter input:focus{ outline:none; border-color:var(--accent); }
.newsletter .annotation{ text-align:left; margin-top:12px; }
.newsletter .annotation.is-ok{ color:var(--accent); }
.newsletter .annotation.is-error{ color:var(--frost); }

.footer__cols{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s-32); padding-block:var(--s-48); }
.footer__cols h4{
  font-family:var(--font-mono); font-size:10px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--ash); font-weight:400; margin-bottom:var(--s-16);
}
.footer__cols a{ display:block; font-size:var(--text-body); color:var(--muted); padding-block:6px; transition:color .25s ease; }
.footer__cols a:hover{ color:var(--paper); }
.footer__bottom{ display:flex; justify-content:space-between; gap:var(--s-24); flex-wrap:wrap; padding-top:var(--s-32); border-top:1px solid var(--line); }
.footer__bottom .annotation{ text-align:left; }

/* ---------------- Sacola ---------------- */
.drawer-scrim{ position:fixed; inset:0; background:rgba(13,12,17,.72); backdrop-filter:blur(3px); z-index:90; opacity:0; transition:opacity .32s ease; }
.drawer-scrim.is-open{ opacity:1; }
.drawer{
  position:fixed; top:0; right:0; bottom:0; width:min(420px,100vw); z-index:95;
  background:var(--obsidian); border-left:1px solid var(--line);
  display:flex; flex-direction:column; transform:translateX(102%);
  transition:transform .38s cubic-bezier(.22,.61,.36,1); visibility:hidden;
}
.drawer.is-open{ transform:translateX(0); visibility:visible; }
.drawer__head{ display:flex; align-items:center; justify-content:space-between; padding:var(--s-24); border-bottom:1px solid var(--line); }
.drawer__head h2{ font-size:var(--text-body-lg); font-weight:700; letter-spacing:.02em; }
.drawer__close{ width:36px; height:36px; border-radius:var(--r-pill); display:grid; place-items:center; color:var(--muted); transition:color .25s ease; }
.drawer__close:hover{ color:var(--paper); }
.drawer__body{ flex:1; overflow-y:auto; padding:var(--s-24); display:grid; gap:var(--s-16); align-content:start; }
.drawer__empty{ text-align:center; color:var(--muted); font-size:var(--text-body); padding-block:var(--s-64); }
.line-item{ display:grid; grid-template-columns:56px 1fr auto; gap:var(--s-16); align-items:center; padding-bottom:var(--s-16); border-bottom:1px solid var(--line); }
.line-item__art{ width:56px; height:64px; border-radius:var(--r-input); background:var(--void); overflow:hidden; }
.line-item__art img{ width:100%; height:100%; object-fit:cover; object-position:34% center; }
.line-item__name{ font-size:var(--text-body); font-weight:500; line-height:1.3; }
.line-item__meta{ margin-top:4px; font-family:var(--font-mono); font-size:11px; color:var(--muted); }
.qty{ display:inline-flex; align-items:center; gap:2px; margin-top:8px; border:1px solid var(--line); border-radius:var(--r-pill); }
.qty button{ width:26px; height:26px; display:grid; place-items:center; color:var(--muted); font-size:14px; line-height:1; transition:color .2s ease; }
.qty button:hover{ color:var(--accent); }
.qty span{ font-family:var(--font-mono); font-size:12px; min-width:18px; text-align:center; }
.line-item__price{ font-size:var(--text-body); font-weight:500; white-space:nowrap; }
.line-item__remove{ display:block; margin-top:6px; font-family:var(--font-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted-soft); transition:color .2s ease; }
.line-item__remove:hover{ color:var(--frost); }
.drawer__foot{ padding:var(--s-24); border-top:1px solid var(--line); display:grid; gap:12px; }
.drawer__row{ display:flex; justify-content:space-between; align-items:baseline; font-size:var(--text-body-lg); }
.drawer__row strong{ font-weight:700; letter-spacing:-.01em; }
.drawer__row--muted{ font-size:var(--text-body); color:var(--muted); }
.drawer__foot .annotation{ text-align:left; }

/* ---------------- Toast ---------------- */
.toast{
  position:fixed; left:50%; bottom:28px; z-index:120; transform:translate(-50%,24px);
  background:var(--accent); color:var(--void); border-radius:var(--r-pill);
  padding:13px 26px; font-size:var(--text-body); font-weight:500;
  opacity:0; pointer-events:none; transition:opacity .3s ease, transform .3s ease;
}
.toast.is-visible{ opacity:1; transform:translate(-50%,0); }

/* ---------------- Reveal ---------------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .8s cubic-bezier(.22,.61,.36,1), transform .8s cubic-bezier(.22,.61,.36,1); }
.reveal.is-visible{ opacity:1; transform:none; }

/* ---------------- Responsivo ---------------- */
@media (max-width:1080px){
  .grid--offers{ grid-template-columns:1fr; max-width:460px; }
  .howto{ grid-template-columns:1fr; gap:var(--s-24); }
}
@media (max-width:900px){
  .nav{
    position:fixed; inset:72px 0 auto 0; flex-direction:column; gap:0;
    background:rgba(13,12,17,.96); backdrop-filter:blur(20px);
    border-bottom:1px solid var(--line); padding:var(--s-16) var(--gutter) var(--s-32);
    transform:translateY(-12px); opacity:0; pointer-events:none; transition:opacity .28s ease, transform .28s ease;
  }
  .nav.is-open{ opacity:1; transform:none; pointer-events:auto; }
  .nav a{ padding-block:16px; font-size:var(--text-body-lg); color:var(--paper); border-bottom:1px solid var(--line); }
  .menu-btn{ display:flex; }
  .ritual{ grid-template-columns:1fr; gap:var(--s-48); }
  .ritual__divider{ height:1px; }
  .ritual__divider span{ width:100%; height:1px; background:linear-gradient(90deg, transparent, var(--line), transparent); }
  .grid--3{ grid-template-columns:1fr; }
  .callout{ flex-direction:column; align-items:flex-start; }
  .buy__media video{ aspect-ratio:16/9; }
  /* Hero no mobile: vídeo em cima, texto embaixo sobre o fundo sólido.
     O vídeo dá zoom no produto e clareia — texto por cima não sobreviveria. */
  .hero{ display:block; min-height:0; padding:0 0 clamp(48px,8vh,var(--s-64)); text-align:center; }
  .hero__media{ position:relative; inset:auto; z-index:0; height:56svh; }
  .hero__media video{ transform:none; object-position:50% 36%; }
  .hero__scrim{
    background:linear-gradient(180deg, rgba(13,12,17,.74) 0%, rgba(13,12,17,.06) 24%, rgba(13,12,17,.08) 58%, rgba(13,12,17,.9) 100%);
  }
  .hero__fade{ height:36%; }
  .hero__content{ padding:var(--s-32) var(--gutter) 0; }
  .hero__content > *,
  .hero__title{ max-width:520px; margin-inline:auto; }
  .hero__cta{ margin-top:var(--s-32); justify-content:center; }
  .hero .annotation--left{ text-align:center; }
  .hero__mute{ top:calc(56svh - 56px); bottom:auto; }
  .hero__scroll{ display:none; }
  .br-desk{ display:none; }
  .assurances{ grid-template-columns:1fr; gap:var(--s-32); }
  .footer__cols{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
  .stats{ grid-template-columns:1fr; gap:var(--s-16); }
  .stat{ padding:var(--s-24) 0; border-bottom:1px solid var(--line); }
  .stats .stat:last-child{ border-bottom:0; }
  .hero__cta .btn{ width:100%; }
  .hero__mute{ bottom:var(--s-64); }
  .footer__top{ flex-direction:column; }
  .offer__price strong{ font-size:27px; }
}
@media (max-width:480px){
  .logo__word-thin{ display:none; }
  .callout__mark{ width:64px; height:64px; font-size:26px; }
}

/* ---------------- Movimento reduzido ---------------- */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .reveal{ opacity:1; transform:none; }
}