/* =========================================================================
   Baby Colic — 18 Everyday Situations · Small Hours Press
   Protótipo v2 · direção "Small Hours" (fundo escuro + cores do guia)
   Tokens de cor com origem amostrada em Colica Bebe/renders-3d/page-01/08.
   ========================================================================= */

:root{
  /* bases escuras — derivadas do verde do guia (#315A52) escurecido */
  --ink:        #060D0B;
  --ink-2:      #0A1410;
  --panel:      #0E1C17;
  --panel-2:    #14261F;
  --offer-bg:   #17110D;

  /* cores do produto (amostradas) */
  --forest:     #315A52;   /* título "Baby Colic" na capa */
  --forest-2:   #395141;   /* camisa verde da ilustração da capa */
  --sage:       #9FC4B4;   /* clareado do forest p/ texto sobre escuro */
  --sage-line:  #4A8C77;
  --terra:      #C95D37;   /* camisa terracota, p.08 */
  --terra-lit:  #E8825A;
  --cta-a:      #B85026;
  --cta-b:      #A8431F;

  /* texto */
  --cream:      #F6F1E8;   /* papel do guia #FCF9F4, levemente rebaixado */
  --cream-dim:  #CFC8B8;
  --mute:       #A8A296;
  --on-cta:     #FFF6EF;

  --r-lg: 22px;
  --r-md: 16px;
  --r-sm: 11px;

  --pad: clamp(18px, 4vw, 34px);
  --gutter: clamp(18px, 5vw, 48px);
  --maxw: 1160px;

  --ff-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --ff-body: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--ink);
  color:var(--cream);
  font-family:var(--ff-body);
  font-size:17px;
  line-height:1.62;
  font-weight:380;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

/* luz de fundo da página inteira: madrugada verde com brasa terracota */
body::before{
  content:"";
  position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(70% 45% at 78% -6%,  rgba(201,93,55,.30), transparent 62%),
    radial-gradient(60% 40% at 6% 12%,   rgba(49,90,82,.36),  transparent 66%),
    radial-gradient(90% 60% at 50% 108%, rgba(49,90,82,.24),  transparent 70%),
    var(--ink);
}
/* grão fino, tira o aspecto de gradiente chapado */
body::after{
  content:"";
  position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }

/* ---------- tipografia ---------- */
h1,h2,h3,.display{
  font-family:var(--ff-display);
  font-weight:600;
  font-variation-settings:"SOFT" 0,"WONK" 0;
  letter-spacing:-.018em;
  line-height:1.08;
  margin:0;
  text-wrap:balance;
}
h1{ font-size:clamp(1.72rem, 1.12rem + 1.75vw, 2.6rem); }
h2{ font-size:clamp(1.62rem, 1.05rem + 2.1vw, 2.75rem); }
h3{ font-size:clamp(1.12rem, .98rem + .5vw, 1.4rem); line-height:1.2; }
p{ margin:0 0 1.05em; }
p:last-child{ margin-bottom:0; }
strong,b{ font-weight:650; color:var(--cream); }

.lede{ font-size:clamp(1.04rem,.98rem + .35vw,1.22rem); color:var(--cream-dim); }
.muted{ color:var(--cream-dim); }
.measure{ max-width:66ch; }

/* ---------- estrutura ---------- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
section{ position:relative; overflow:clip; }
.band{ padding-block:clamp(56px, 8vw, 104px); }
.band--alt{ background:linear-gradient(180deg, rgba(12,25,20,0) 0%, rgba(12,25,20,.94) 9%, rgba(12,25,20,.94) 91%, rgba(12,25,20,0) 100%); }
.band--rule::before{
  content:""; position:absolute; top:0; left:50%; translate:-50% 0;
  width:min(620px,84vw); height:1px;
  background:linear-gradient(90deg,transparent,rgba(232,130,90,.55),transparent);
}
.band--rule{ border-top:1px solid rgba(159,196,180,.11); }

/* ornamento de seção: filete + losango sálvia */
.orn{ display:flex; align-items:center; gap:14px; justify-content:center; margin-bottom:clamp(26px,4vw,44px); }
.orn::before,.orn::after{ content:""; height:1px; width:min(120px,18vw); background:linear-gradient(90deg,transparent,rgba(159,196,180,.42)); }
.orn::after{ background:linear-gradient(270deg,transparent,rgba(159,196,180,.42)); }
.orn span{ width:7px; height:7px; rotate:45deg; background:var(--sage); opacity:.75; }

.eyebrow{
  font-family:var(--ff-body); font-size:.86rem; font-weight:600;
  color:var(--sage); letter-spacing:.01em; margin:0 0 12px;
}

/* ---------- flutuantes (aquarelas de fundo) ---------- */
.floaters{ position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0; }
.floaters img{
  position:absolute; width:var(--w,190px); opacity:var(--o,.5);
  filter:saturate(.85) brightness(.95) drop-shadow(0 18px 34px rgba(0,0,0,.55));
  animation:drift var(--t,9s) ease-in-out infinite alternate;
  animation-delay:var(--d,0s);
  will-change:transform;
}
@keyframes drift{
  from{ transform:translate3d(0,0,0) rotate(var(--rot,0deg)); }
  to  { transform:translate3d(var(--dx,6px),var(--dy,-22px),0) rotate(calc(var(--rot,0deg) + var(--drot,3deg))); }
}
section > .wrap{ position:relative; z-index:1; }

/* ---------- cabeçalho ---------- */
.site{
  position:sticky; top:0; z-index:60;
  backdrop-filter:blur(14px);
  background:linear-gradient(180deg, rgba(6,13,11,.92), rgba(6,13,11,.62));
  border-bottom:1px solid rgba(159,196,180,.12);
}
.site .wrap{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding-block:13px; }
.brand{ display:flex; align-items:center; gap:11px; text-decoration:none; }
.brand svg{ width:32px; height:32px; flex:none; }
.brand b{ font-family:var(--ff-display); font-weight:600; font-size:1.02rem; letter-spacing:-.01em; white-space:nowrap; }
.brand i{ display:block; font-style:normal; font-size:.72rem; color:var(--sage); letter-spacing:.06em; line-height:1.1; }
.site .cta{ padding:10px 20px; font-size:.92rem; }
@media (max-width:719px){ .site .cta{ display:none; } }

/* ---------- botão ---------- */
.cta{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:19px 34px; border:0; border-radius:999px; cursor:pointer;
  font-family:var(--ff-body); font-size:1.06rem; font-weight:700; letter-spacing:.005em;
  color:var(--on-cta); text-decoration:none;
  background:linear-gradient(180deg,var(--cta-a),var(--cta-b));
  box-shadow:
    inset 0 1px 0 rgba(255,246,239,.34),
    0 10px 26px -10px rgba(232,130,90,.85),
    0 0 58px -16px rgba(232,130,90,.75);
  transition:transform .18s ease, box-shadow .22s ease, filter .22s ease;
}
.cta:hover{ transform:translateY(-2px); filter:brightness(1.07);
  box-shadow:inset 0 1px 0 rgba(255,246,239,.4), 0 16px 34px -12px rgba(232,130,90,.95), 0 0 84px -14px rgba(232,130,90,.9); }
.cta:active{ transform:translateY(0); }
.cta--wide{ width:100%; max-width:460px; }
.cta svg{ width:19px; height:19px; flex:none; }
:focus-visible{ outline:3px solid var(--sage); outline-offset:3px; border-radius:6px; }

/* selos factuais sob o CTA */
.trust{ list-style:none; display:flex; flex-wrap:wrap; gap:9px 20px; padding:0; margin:20px 0 0; }
.trust li{ display:flex; align-items:center; gap:8px; font-size:.86rem; color:var(--cream-dim); }
.trust svg{ width:16px; height:16px; color:var(--sage); flex:none; }

/* ---------- cartões ---------- */
.card{
  position:relative;
  background:linear-gradient(168deg, var(--panel-2) 0%, var(--panel) 46%, #091310 100%);
  border:1px solid rgba(159,196,180,.16);
  border-radius:var(--r-lg);
  padding:var(--pad);
  box-shadow:inset 0 1px 0 rgba(246,241,232,.055), 0 30px 70px -40px #000;
}
.card--accent{
  border-color:rgba(201,93,55,.48);
  box-shadow:inset 0 1px 0 rgba(255,214,196,.14), 0 0 72px -26px rgba(232,130,90,.55), 0 34px 80px -46px #000;
}

/* =========================================================================
   S01 · HERO
   ========================================================================= */
.hero{ padding-top:clamp(18px,3vw,40px); padding-bottom:clamp(36px,5vw,72px); }
.hero-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(20px,2.4vw,34px); align-items:end; }
.hero-card{ padding:clamp(24px,2.6vw,36px); }
.hero-card h1{ margin-bottom:.46em; }
.hero-card .sub{ color:var(--cream-dim); font-size:clamp(1rem,.94rem + .3vw,1.12rem); max-width:52ch; }

/* faixa de especificação (microcopy de confiança da copy) */
.spec{
  display:inline-block; margin:2px 0 20px; padding:9px 16px;
  border:1px solid rgba(159,196,180,.26); border-radius:999px;
  background:rgba(159,196,180,.06);
  font-size:.88rem; color:var(--sage); font-weight:600;
}

/* foto-herói com halo e sombra projetada */
.hero-fig{ position:relative; margin:0; display:flex; justify-content:center; align-items:flex-end; }
.hero-fig::before{ /* halo volumétrico */
  content:""; position:absolute; z-index:0;
  width:112%; aspect-ratio:1/1; left:-6%; top:-8%;
  background:radial-gradient(circle at 52% 42%,
      rgba(255,192,148,.55) 0%, rgba(214,98,56,.38) 24%,
      rgba(201,93,55,.20) 42%, rgba(49,90,82,.18) 56%, transparent 70%);
  filter:blur(16px);
}
.hero-fig::after{ /* sombra projetada no chão */
  content:""; position:absolute; bottom:6px; left:16%; width:68%; height:46px; z-index:0;
  background:radial-gradient(ellipse at center, rgba(0,0,0,.72), transparent 72%);
  filter:blur(9px);
}
.hero-fig img{
  position:relative; z-index:1; width:min(100%,560px);
  transform:perspective(1100px) rotateY(-6deg) rotateX(1.4deg) translateZ(0);
  filter:drop-shadow(0 32px 46px rgba(0,0,0,.78)) drop-shadow(0 0 40px rgba(232,130,90,.18)) contrast(1.05) saturate(1.02);
  -webkit-mask-image:linear-gradient(180deg,#000 74%,rgba(0,0,0,.34) 92%,transparent 100%),
                     linear-gradient(90deg,transparent 0%,#000 9%,#000 91%,transparent 100%);
          mask-image:linear-gradient(180deg,#000 74%,rgba(0,0,0,.34) 92%,transparent 100%),
                     linear-gradient(90deg,transparent 0%,#000 9%,#000 91%,transparent 100%);
  -webkit-mask-composite:source-in; mask-composite:intersect;
}

/* =========================================================================
   Faixa de números reais
   ========================================================================= */
.figures{ border-block:1px solid rgba(159,196,180,.13); background:rgba(10,20,16,.7); }
.figures ul{ list-style:none; margin:0; padding:clamp(22px,3vw,34px) 0; display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.figures li{ text-align:center; position:relative; }
.figures li + li::before{ content:""; position:absolute; left:0; top:12%; height:76%; width:1px; background:rgba(159,196,180,.16); }
.figures .n{ display:block; font-family:var(--ff-display); font-weight:600; font-size:clamp(2rem,1.1rem + 3vw,3.3rem); line-height:1; color:var(--terra-lit); }
.figures .l{ display:block; font-size:.8rem; color:var(--cream-dim); margin-top:7px; line-height:1.3; }

/* =========================================================================
   S02 · listas em cartão escuro (ritmo da referência)
   ========================================================================= */
.scenes{ list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.scenes li{ display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:start; padding:17px 4px; }
.scenes li + li{ border-top:1px solid rgba(159,196,180,.11); }
.scenes .ic{
  width:44px; height:44px; border-radius:13px; display:grid; place-items:center; flex:none;
  background:rgba(201,93,55,.18); border:1px solid rgba(201,93,55,.5); color:var(--terra-lit);
  box-shadow:0 0 22px -8px rgba(232,130,90,.65);
}
.scenes .ic svg{ width:23px; height:23px; }
.scenes p{ margin:0; color:var(--cream-dim); }

.verdict{ text-align:center; margin-bottom:0 !important; font-family:var(--ff-display); font-size:clamp(1.18rem,1rem + .8vw,1.65rem); color:var(--cream); margin:clamp(26px,4vw,40px) auto; max-width:30ch; line-height:1.28; }

.notfor{ margin-top:clamp(20px,3vw,30px); align-self:start; }
.notfor ul li:last-child{ padding-bottom:4px; }
.notfor h3{ margin-bottom:14px; }
.notfor ul{ list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.notfor li{ display:grid; grid-template-columns:auto 1fr; gap:14px; padding:14px 2px; color:var(--cream-dim); }
.notfor li + li{ border-top:1px solid rgba(159,196,180,.1); }
.notfor svg{ width:19px; height:19px; color:var(--sage); margin-top:4px; flex:none; }

.two-col{ display:grid; grid-template-columns:1fr; gap:clamp(16px,2.4vw,26px); }
@media (min-width:900px){ .two-col{ grid-template-columns:1.25fr .95fr; align-items:start; } }

/* =========================================================================
   S03 · prova
   ========================================================================= */
.claim{ text-align:center; font-family:var(--ff-display); font-size:clamp(1.5rem,1rem + 2vw,2.5rem); line-height:1.16; max-width:22ch; margin:0 auto clamp(20px,3vw,30px); }
.claim em{ font-style:normal; color:var(--terra-lit); }
.sources-note{ max-width:74ch; margin-inline:auto; text-align:center; color:var(--cream-dim); }
.after-list{ margin-top:22px; color:var(--cream-dim); }

.pages{ list-style:none; margin:clamp(30px,4vw,48px) 0 0; padding:0; display:grid; gap:clamp(16px,2.2vw,24px); }
.pages + *{ margin-top:0; }
@media (min-width:760px){ .pages{ grid-template-columns:1fr 1fr; } }
.pages li{
  display:grid; grid-template-columns:172px 1fr; gap:22px; align-items:start;
  padding:22px; border-radius:var(--r-md);
  background:linear-gradient(168deg, var(--panel-2), var(--panel) 60%, #091310);
  border:1px solid rgba(159,196,180,.15);
  box-shadow:inset 0 1px 0 rgba(246,241,232,.05), 0 26px 60px -40px #000;
}
.pages figure{ margin:0; position:relative; }
.pages figure::before{ content:""; position:absolute; inset:-16% -14%; background:radial-gradient(circle at 50% 46%, rgba(159,196,180,.24), transparent 66%); filter:blur(8px); }
.pages figure::after{ content:""; position:absolute; left:8%; right:8%; bottom:-8px; height:24px; background:radial-gradient(ellipse at center, rgba(0,0,0,.75), transparent 70%); filter:blur(7px); }
.pages img{ position:relative; width:100%; border-radius:4px; filter:drop-shadow(0 20px 30px rgba(0,0,0,.72)) brightness(1.06) contrast(1.04) saturate(1.04); }
.pages p{ margin:0; color:var(--cream-dim); font-size:.97rem; }
.pages strong{ display:block; margin-bottom:6px; font-family:var(--ff-display); font-weight:600; font-size:1.06rem; color:var(--cream); line-height:1.25; }
@media (max-width:519px){ .pages li{ grid-template-columns:1fr; gap:18px; padding:18px; justify-items:center; text-align:center; }
  .pages figure{ width:64%; } }

/* =========================================================================
   S04 · história
   ========================================================================= */
#story::before{
  content:""; position:absolute; z-index:0; pointer-events:none;
  left:50%; top:48%; translate:-50% -50%;
  width:min(820px,96%); height:min(640px,80vw);
  background:radial-gradient(ellipse at center, rgba(49,90,82,.30), rgba(49,90,82,.10) 46%, transparent 70%);
  filter:blur(18px);
}
.story{ max-width:60ch; margin-inline:auto; }
.story .open{ font-family:var(--ff-display); font-size:clamp(1.55rem,1.05rem + 2.1vw,2.6rem); line-height:1.14; color:var(--cream); margin-bottom:.7em; }
.story p{ color:var(--cream-dim); }
.story .turn{ font-family:var(--ff-display); font-size:clamp(1.15rem,1rem + .7vw,1.45rem); color:var(--sage); line-height:1.3; margin-block:1.4em .9em; }
.story .pin{ border-left:2px solid rgba(201,93,55,.6); padding-left:22px; color:var(--cream); }

/* =========================================================================
   S05 · conteúdo
   ========================================================================= */
.stack{ display:grid; gap:clamp(18px,2.6vw,28px); }
.swap{ list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.swap li{ padding:18px 2px; display:grid; grid-template-columns:auto 1fr; gap:16px; }
.swap li + li{ border-top:1px solid rgba(159,196,180,.11); }
.swap .mv{ width:30px; height:30px; border-radius:50%; display:grid; place-items:center; flex:none; background:rgba(159,196,180,.1); border:1px solid rgba(159,196,180,.3); color:var(--sage); }
.swap .mv svg{ width:16px; height:16px; }
.swap p{ margin:0; max-width:80ch; color:var(--cream-dim); }
.swap .usual{ color:var(--cream); font-weight:650; }
.swap .ask{ color:var(--terra-lit); font-weight:650; }

.studies{ list-style:none; margin:0; padding:0; display:grid; gap:0; }
.studies li{ padding:14px 0; color:var(--cream-dim); font-size:.97rem; border-top:1px solid rgba(159,196,180,.1); }
.studies li:first-child{ border-top:0; }
.studies li::before{ content:""; }
.argument{ margin-top:clamp(20px,3vw,32px); margin-bottom:clamp(4px,1vw,10px); max-width:72ch; margin-inline:auto; text-align:center; font-size:clamp(1.02rem,.96rem + .35vw,1.16rem); color:var(--cream); }

/* brasa por tras da caixa de oferta */
#offer::before{
  content:""; position:absolute; z-index:0; pointer-events:none;
  left:50%; top:46%; translate:-50% -50%;
  width:min(1100px,102%); height:min(760px,86vw);
  background:radial-gradient(ellipse at center, rgba(201,93,55,.24), rgba(201,93,55,.09) 42%, transparent 68%);
  filter:blur(22px);
}

/* =========================================================================
   S06 · oferta
   ========================================================================= */
.offer-wrap{ display:grid; gap:clamp(22px,3vw,40px); align-items:center; }
@media (min-width:920px){ .offer-wrap{ grid-template-columns:1.35fr .65fr; } }
.offer{
  background:linear-gradient(165deg,#1E1610 0%, var(--offer-bg) 52%, #0B0906 100%);
  border:1px solid rgba(201,93,55,.55);
  border-radius:var(--r-lg);
  padding:clamp(24px,3.2vw,44px);
  box-shadow:inset 0 1px 0 rgba(255,214,196,.16), 0 0 90px -28px rgba(232,130,90,.62), 0 40px 90px -50px #000;
}
.offer h3{ margin-bottom:18px; }
.includes{ list-style:none; margin:0 0 24px; padding:0; display:grid; gap:11px; }
.includes li{ display:grid; grid-template-columns:auto 1fr; gap:13px; color:var(--cream-dim); }
.includes svg{ width:20px; height:20px; color:var(--terra-lit); margin-top:3px; flex:none; }
.price{ padding:20px 0 22px; border-top:1px solid rgba(201,93,55,.32); border-bottom:1px solid rgba(201,93,55,.32); margin-bottom:22px; color:var(--cream-dim); line-height:1.5; }
.price .pre{ display:block; font-size:.95rem; color:var(--sage); margin-bottom:1px; }
.price .big{ font-family:var(--ff-display); font-weight:700; font-size:clamp(2.4rem,1.5rem + 3vw,3.6rem); color:var(--cream); line-height:1.02; letter-spacing:-.02em; display:block; margin-bottom:7px; }
.price .after{ display:block; font-size:.98rem; }
.worth{ color:var(--cream-dim); }
.caveat{ color:var(--mute); font-size:.94rem; font-style:italic; margin-bottom:20px; }
.refund{ margin:0 0 24px; padding:16px 18px; border-radius:var(--r-md); background:rgba(159,196,180,.07); border:1px solid rgba(159,196,180,.2); color:var(--cream-dim); font-size:.97rem; }

/* selo circular de garantia */
.seal{ display:grid; justify-items:center; gap:14px; text-align:center; }
.seal svg{ width:clamp(178px,23vw,252px); height:auto; filter:drop-shadow(0 18px 34px rgba(0,0,0,.6)) drop-shadow(0 0 34px rgba(232,130,90,.3)); }
.seal p{ margin:0; color:var(--cream-dim); font-size:.92rem; max-width:26ch; }

/* =========================================================================
   S07 · fechamento
   ========================================================================= */
.close-grid{ display:grid; gap:clamp(22px,3vw,44px); align-items:center; }
@media (min-width:860px){ .close-grid{ grid-template-columns:.42fr .58fr; } }
.close-fig{ position:relative; justify-self:center; }
.close-fig::before{ content:""; position:absolute; inset:-14% -10% -6%; background:radial-gradient(circle at 50% 46%, rgba(159,196,180,.28), transparent 66%); filter:blur(10px); }
.close-fig img{ position:relative; width:min(100%,300px); filter:drop-shadow(0 30px 44px rgba(0,0,0,.75)); }
.close-copy .open{ font-family:var(--ff-display); font-size:clamp(1.45rem,1.05rem + 1.8vw,2.35rem); line-height:1.15; margin-bottom:.6em; }
.close-copy p{ color:var(--cream-dim); }
.close-copy .beat{ color:var(--cream); }
.close-copy p:last-child{ margin-bottom:0; }

/* =========================================================================
   S08 · FAQ
   ========================================================================= */
.faq{ max-width:840px; margin-inline:auto; display:grid; gap:11px; }
.faq details{
  background:linear-gradient(168deg,var(--panel-2),var(--panel));
  border:1px solid rgba(159,196,180,.16); border-radius:var(--r-md); overflow:hidden;
}
.faq details[open]{ border-color:rgba(201,93,55,.42); }
.faq summary{
  cursor:pointer; list-style:none; padding:19px 22px; display:flex; gap:16px; align-items:center;
  font-family:var(--ff-display); font-weight:600; font-size:1.06rem; color:var(--cream);
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:""; margin-left:auto; flex:none; width:13px; height:13px;
  border-right:2px solid var(--sage); border-bottom:2px solid var(--sage);
  rotate:45deg; translate:0 -3px; transition:rotate .22s ease;
}
.faq details[open] summary::after{ rotate:225deg; translate:0 3px; }
.faq .a{ padding:0 22px 21px; color:var(--cream-dim); }
.faq .a p{ margin:0; }

/* =========================================================================
   rodapé
   ========================================================================= */
.site-foot{ border-top:1px solid rgba(159,196,180,.13); background:rgba(6,13,11,.9); padding-block:36px 40px; }
.foot-in{ display:grid; gap:14px; justify-items:center; text-align:center; }
.foot-in .mark{ font-family:var(--ff-display); font-weight:600; font-size:1.18rem; }
.foot-links{ color:var(--cream-dim); font-size:.95rem; }
.foot-links a{ text-decoration:none; border-bottom:1px solid rgba(159,196,180,.35); padding-bottom:1px; }
.foot-links a:hover{ color:var(--sage); }
.foot-note{ color:var(--mute); font-size:.9rem; max-width:52ch; }
[data-pending]{ border-bottom-style:dashed; }

/* ---------- responsivo ---------- */
@media (max-width:899px){
  .hero-grid{ grid-template-columns:1fr; gap:0; }
  .hero-fig{ min-height:0; order:-1; margin-bottom:-26px; }
  .hero-fig img{
    width:min(78%,330px); transform:none;
    -webkit-mask-image:linear-gradient(180deg,#000 58%,rgba(0,0,0,.28) 86%,transparent 100%);
            mask-image:linear-gradient(180deg,#000 58%,rgba(0,0,0,.28) 86%,transparent 100%);
  }
  .hero-fig::after{ display:none; }
}
@media (max-width:719px){
  body{ font-size:16.5px; }
  .site .wrap{ padding-block:11px; }
  .brand svg{ width:26px; height:26px; }
  .brand b{ font-size:.92rem; }
  .site .cta{ display:inline-flex; width:auto; padding:9px 15px; font-size:.82rem; }
  .hero{ padding-top:6px; padding-bottom:30px; }
  .hero-fig{ margin-bottom:-34px; }
  .hero-fig img{ width:min(56%,196px); }
  .hero-card{ padding:20px 18px 24px; }
  .hero-card h1{ margin-bottom:.4em; }
  .hero-card .sub{ font-size:.97rem; line-height:1.55; }
  .spec{ margin:0 0 15px; font-size:.79rem; padding:7px 12px; }
  .cta{ width:100%; padding:17px 22px; font-size:1rem; }
  .figures ul{ grid-template-columns:1fr 1fr; gap:22px 10px; }
  .figures li:nth-child(3)::before{ display:none; }
  .trust{ gap:7px 16px; }
  .trust li{ font-size:.8rem; }
}
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto; }
}
