/* =====================================================================
   Yazodara Ferasçoli — bio · revisão 2
   Cores herdadas do index.bio-backup.html (mesmos nomes de tokens).
   Grid de 12 colunas, eixo central, espaçamento em múltiplos de 8px.
   ===================================================================== */

:root{
  /* cor — tema escuro (revisão 5): preto profundo + off-white + vinho como único acento */
  --bg:#0D0A0B;
  --surface:#161012;          /* preto levemente mais claro (cards, campos, círculos) */
  --paper:#FDFBF7;            /* moldura das polaroids e papel */
  --paper-ink:#211714;        /* texto sobre papel claro */
  --wine:#850342;
  --wine-deep:#5A012C;
  --wine-dark:#6E0236;
  --wine-soft:rgba(133,3,66,0.18);
  --wine-line:rgba(133,3,66,0.6);
  --ink:#F7F3EE;              /* texto principal (off-white) */
  --ink-soft:#9A8F89;         /* texto secundário (cinza quente) */
  --on-wine:#F7F3EE;
  --on-wine-soft:rgba(247,243,238,0.74);
  --on-wine-line:rgba(247,243,238,0.2);
  --line:rgba(247,243,238,0.10);
  --line-strong:rgba(247,243,238,0.18);
  --error:#E0605F;
  --tt-cyan:#25F4EE;   /* TikTok — só detalhe */
  --tt-red:#FE2C55;    /* TikTok — só detalhe */

  --ease:cubic-bezier(0.16, 1, 0.3, 1);
  --spring:cubic-bezier(0.34, 1.32, 0.5, 1);

  /* tipografia */
  --font-display:'Instrument Serif', Georgia, 'Times New Roman', serif;
  --font-body:'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:'Geist Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
  --font-pen:'Caveat', 'Bradley Hand', cursive;      /* manuscrito legível (aviso, legendas, verso) */

  /* escala de espaçamento — 8px */
  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:40px; --s6:48px; --s7:56px;
  --s8:64px; --s9:72px; --s10:80px; --s12:96px;

  /* grid */
  --cols:12;
  --margin:16px;
  --gutter:16px;
  --maxw:1200px;

  /* respiro vertical das seções (no máx. 56px celular / 96px desktop) */
  --sec-y:var(--s6);

  --nav-h:64px;
  --radius:16px;
}
@media (min-width:768px){
  :root{ --margin:32px; --gutter:24px; --sec-y:var(--s8); }
}
@media (min-width:1280px){
  :root{ --margin:48px; --sec-y:var(--s9); }
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
/* overflow-x no html (vai para a viewport) e clip no body: 'hidden' no body cria um contêiner de
   rolagem que não rola e quebra o position:sticky da seção de informações */
html{ overflow-x:hidden; -webkit-text-size-adjust:100%; }
body{
  background:var(--ink);
  color:var(--ink);
  font-family:var(--font-body);
  font-weight:400;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; cursor:pointer; border:none; background:none; text-align:inherit; }
ul,ol{ list-style:none; }
svg{ display:block; }
i, em{ font-style:italic; }
:focus-visible{ outline:2px solid var(--on-wine); outline-offset:3px; border-radius:4px; }
.varal-sec :focus-visible, .sheet :focus-visible, .aplicar-sec :focus-visible{ outline-color:var(--wine); }

.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; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

.skip-link{
  position:fixed; top:var(--s1); left:50%; z-index:3000;
  transform:translate(-50%, -200%);
  background:var(--on-wine); color:var(--wine);
  padding:var(--s1) var(--s2); border-radius:999px; font-weight:600; font-size:14px;
}
.skip-link:focus{ transform:translate(-50%, 0); }

#app{ background:var(--bg); transform-origin:50% 0; transition:transform 600ms var(--ease), border-radius 600ms var(--ease); }
.is-sheet-open #app{ transform:scale(0.96); border-radius:var(--radius); overflow:hidden; }

/* ============ GRID ============ */
.container{
  width:100%;
  max-width:calc(var(--maxw) + var(--margin) * 2);
  margin:0 auto;
  padding:0 var(--margin);
}
.grid12{
  display:grid;
  grid-template-columns:repeat(var(--cols), minmax(0, 1fr));
  column-gap:var(--gutter);
}
.grid-debug{
  position:fixed; inset:0; z-index:5000; pointer-events:none;
  background-image:repeating-linear-gradient(to bottom, rgba(37,244,238,0.10) 0 1px, transparent 1px 8px);
}
.grid-debug .container, .grid-debug .grid12{ height:100%; }
.grid-debug .grid12 span{
  background:rgba(254,44,85,0.10);
  box-shadow:inset 1px 0 0 rgba(254,44,85,0.45), inset -1px 0 0 rgba(254,44,85,0.45);
}
.grid-debug-axis{ position:absolute; top:0; bottom:0; left:50%; width:1px; margin-left:-0.5px; background:var(--tt-cyan); }

/* ============ NAVEGAÇÃO — 4 ABAS ============ */
.tabs{
  position:fixed; z-index:1000;
  left:0; right:0; bottom:0;
  padding:var(--s1) var(--s2) calc(var(--s1) + env(safe-area-inset-bottom));
  background:rgba(13,10,11,0.94);
  border-top:1px solid var(--line);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
}
.tabs-inner{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  max-width:480px;
  margin:0 auto;
}
.tab{
  position:relative; z-index:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:4px;
  min-height:48px;
  padding:4px 2px;
  font-family:var(--font-body);
  font-weight:500;
  font-size:10.5px;
  white-space:nowrap;
  text-align:center;
  color:rgba(247,243,238,0.58);
  transition:color 300ms var(--ease);
}
.tab.is-active{ color:var(--on-wine); }
.tab-icon{
  width:22px; height:22px;
  fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
}
.tab.is-active .tab-icon{ animation:tab-pop 520ms var(--spring); }
@keyframes tab-pop{ 0%{ transform:scale(1); } 40%{ transform:scale(1.22) translateY(-2px); } 100%{ transform:scale(1); } }
.tabs-indicator{
  position:absolute; z-index:0; top:0; bottom:0; left:0;
  width:33.33%;
  border-radius:12px;
  background:rgba(247,243,238,0.08);
  box-shadow:inset 0 -2px 0 var(--on-wine);
  transition:transform 480ms var(--ease), width 480ms var(--ease);
}
.tabs-cta{ display:none; }
/* celular: botão flutuante na base (acima das abas); some quando o formulário aparece */
.apply-float{
  position:fixed; z-index:990; left:50%; bottom:calc(var(--nav-h) + var(--s2) + env(safe-area-inset-bottom));
  transform:translateX(-50%);
  display:inline-flex; align-items:center; justify-content:center;
  min-height:48px; padding:0 var(--s4);
  border-radius:999px;
  background:var(--wine); color:var(--ink);
  font-weight:600; font-size:15px; white-space:nowrap;
  box-shadow:0 14px 30px -12px rgba(133,3,66,0.75), 0 0 0 1px rgba(247,243,238,0.08);
  transition:transform 450ms var(--ease), opacity 300ms var(--ease);
}
.apply-float.is-hidden{ transform:translate(-50%, 140%); opacity:0; pointer-events:none; }
@media (min-width:768px){
  .apply-float{ display:none; }
  .tabs{
    top:var(--s2); bottom:auto; left:50%; right:auto;
    transform:translateX(-50%);
    display:flex; align-items:center; gap:6px;
    width:min(760px, calc(100% - var(--margin) * 2));
    padding:6px;
    border:1px solid rgba(247,243,238,0.10);
    border-radius:999px;
  }
  .tabs-inner{ flex:1; max-width:none; }
  .tabs-cta{ display:inline-flex; align-items:center; flex:0 0 auto; min-height:40px; padding:0 var(--s3); border-radius:999px; background:var(--wine); color:var(--ink); font-weight:600; font-size:13px; white-space:nowrap; transition:transform 300ms var(--spring), box-shadow 300ms var(--ease); }
  .tabs-cta:hover{ transform:scale(1.04); box-shadow:0 8px 22px -8px rgba(133,3,66,0.8); }
  .tab{ flex-direction:row; gap:var(--s1); font-size:13px; min-height:40px; }
  .tab-icon{ width:16px; height:16px; }
  .tabs-indicator{ border-radius:999px; background:rgba(247,243,238,0.1); box-shadow:none; }
}

/* ============ BOTÕES ============ */
.btn{
  position:relative;
  display:flex;
  width:100%;
  align-items:center; justify-content:center;
  gap:10px;
  font-family:var(--font-body);
  font-weight:600;
  font-size:15px;
  letter-spacing:0.01em;
  padding:var(--s2) var(--s3);
  min-height:56px;
  border-radius:999px;
  text-align:center;
  line-height:1.3;
  transition:transform 220ms var(--ease), box-shadow 220ms var(--ease);
}
.btn:active{ transform:scale(0.97); }
@media (hover:hover){ .btn:hover{ transform:scale(1.015); } }
.btn:disabled{ opacity:0.6; cursor:not-allowed; pointer-events:none; }
.btn-wine{ background:var(--wine); color:var(--on-wine); box-shadow:0 10px 26px -10px rgba(133,3,66,0.4); }
.btn-light{ background:var(--on-wine); color:var(--wine); box-shadow:0 16px 32px -16px rgba(0,0,0,0.5); }

.icon-btn{
  width:40px; height:40px;
  display:flex; align-items:center; justify-content:center;
  border-radius:999px;
  color:var(--ink);
  transition:background-color 200ms var(--ease), transform 300ms var(--spring);
}
.icon-btn svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.icon-btn:hover{ background:var(--line); }
.icon-btn:active{ transform:scale(0.9); }

/* ============ ABA 1 — INÍCIO (HERO) ============ */
.hero{
  position:relative;
  height:100svh;
  min-height:560px;
  overflow:hidden;
  background:#1E1E1E;
  color:var(--on-wine);
  touch-action:pan-y;
  isolation:isolate;
}
.hero-stage{ position:absolute; z-index:0; inset:0; }
.hero-img{ width:100%; height:100%; object-fit:cover; object-position:52% 0; }
.js .hero-stage.is-placed .hero-img{ object-fit:fill; }
.hero-layer{ position:absolute; inset:0; display:block; }
.hero-layer img{ width:100%; height:100%; }
.hero-layer--pb{ will-change:mask-image; }
@media (prefers-reduced-motion: reduce){ .hero-layer--pb{ display:none; } }

.hero-name{ position:absolute; z-index:2; inset:0; pointer-events:none; }
/* a cabeça redesenhada por cima do nome (canvas; só a faixa do nome) */
.hero-front{ position:absolute; z-index:2; left:0; top:0; width:100%; pointer-events:none; }
.hero-front-layer{ position:absolute; left:0; top:0; display:block; width:100%; }
@media (prefers-reduced-motion: reduce){ #heroFrontPb{ display:none; } }
.hero-name-big{
  position:absolute; left:50%; top:var(--name-top, 3svh);
  transform:translateX(-50%);
  font-family:var(--font-display);
  font-weight:400;
  font-size:var(--name-size, min(24vw, 21svh));
  line-height:0.8;
  letter-spacing:-0.025em;
  white-space:nowrap;
  color:var(--on-wine);
  text-shadow:0 2px 40px rgba(0,0,0,0.25);
}
.hero-name-big .ch{ display:inline-block; }
.hero-surname{
  position:absolute; z-index:3; left:0; right:0; top:var(--sur-top, calc(3svh + min(24vw, 21svh) * 0.86));
  text-align:center;
  font-family:var(--font-mono);
  font-weight:500;
  font-size:12px;
  letter-spacing:0.62em;
  padding-left:0.62em;
  text-transform:uppercase;
  color:var(--on-wine);
  text-shadow:0 1px 12px rgba(0,0,0,0.55);
  pointer-events:none;
}
@media (min-width:768px){
  .hero-surname{ font-size:14px; letter-spacing:0.8em; padding-left:0.8em; }
  /* sem JS: o nome começa abaixo do menu do topo */
  .hero-name-big{ top:var(--name-top, 80px); }
  .hero-surname{ top:var(--sur-top, calc(80px + min(24vw, 21svh) * 0.86)); }
}

/* dissolve longo (~40%) até o vinho da seção seguinte, sem linha de corte */
.hero-fade{
  position:absolute; z-index:3; left:0; right:0; bottom:-1px;
  height:40%;
  pointer-events:none;
  background:linear-gradient(to bottom,
    rgba(13,10,11,0) 0%,
    rgba(13,10,11,0.06) 12%,
    rgba(13,10,11,0.18) 24%,
    rgba(13,10,11,0.36) 38%,
    rgba(13,10,11,0.58) 54%,
    rgba(13,10,11,0.80) 70%,
    rgba(13,10,11,0.94) 84%,
    #0D0A0B 100%);
}

.hero-bottom{
  position:absolute; z-index:4; left:0; right:0; bottom:0;
  display:flex; flex-direction:column; align-items:center;
  text-align:center;
  /* celular: espaço para as abas + o botão flutuante "Aplicar para vaga" */
  padding-bottom:calc(var(--nav-h) + 88px + env(safe-area-inset-bottom));
  pointer-events:none;
}
.hero-bottom > *{ pointer-events:auto; }
@media (min-width:768px){ .hero-bottom{ padding-bottom:var(--s5); } }

.hero-head{
  max-width:18ch;
  font-family:var(--font-display);
  font-weight:400;
  font-size:clamp(26px, 6.6vw, 40px);
  line-height:1.02;
  letter-spacing:-0.01em;
  text-wrap:balance;
  margin-bottom:var(--s1);
}
.hero-head em{ font-style:italic; }
/* ============ ABA 2 — FUNIL DE DOUTRINAÇÃO ============ */
.funil-sec{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:var(--bg);
  color:var(--ink);
  padding:var(--s8) 0 var(--sec-y);
}
.funil-inner{ display:flex; flex-direction:column; align-items:center; text-align:center; }
.funil-kicker{
  margin-bottom:var(--s3);
  font-family:var(--font-mono); font-weight:500; font-size:11px;
  letter-spacing:0.26em; padding-left:0.26em; text-transform:uppercase;
  color:var(--ink-soft);
}
.funil-sec .ment-row{ width:100%; }
.funil-line{ margin-top:var(--s4); font-family:var(--font-display); font-size:clamp(26px, 6.4vw, 40px); line-height:1.08; text-wrap:balance; }
.funil-badge{
  margin-top:var(--s2);
  padding:6px 14px; border-radius:999px;
  border:1px solid var(--wine-line);
  background:var(--wine-soft);
  font-family:var(--font-mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--ink);
}
.funil-wrap{ position:relative; z-index:0; }
/* fotos nas bordas (só desktop): dissolvem no preto para o centro e no topo/base */
.funil-side{ display:none; }
@media (min-width:1024px){
  .funil-sec .funil-inner{ position:relative; z-index:1; }
  .funil-side{
    display:block;
    position:absolute; z-index:0; top:-6%; height:112%;
    width:25vw;
    pointer-events:none;
    opacity:0;
    transition:opacity 1400ms var(--ease), transform 1400ms var(--ease);
  }
  .funil-side picture, .funil-side img{ display:block; width:100%; height:100%; object-fit:cover; }
  .funil-side--esq{
    left:0; transform:translateX(-20px);
    -webkit-mask-image:linear-gradient(to right, #000 40%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 20%, #000 72%, transparent 100%);
    -webkit-mask-composite:source-in;
            mask-image:linear-gradient(to right, #000 40%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 20%, #000 72%, transparent 100%);
            mask-composite:intersect;
  }
  .funil-side--dir{
    right:0; transform:translateX(20px);
    -webkit-mask-image:linear-gradient(to left, #000 40%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 20%, #000 72%, transparent 100%);
    -webkit-mask-composite:source-in;
            mask-image:linear-gradient(to left, #000 40%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 20%, #000 72%, transparent 100%);
            mask-composite:intersect;
  }
  .funil-side--esq img{ object-position:78% 22%; }
  .funil-side--dir img{ object-position:4% 22%; }
  .funil-side.is-in{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion: reduce){ .funil-side{ opacity:1; transform:none; } }
/* vídeo da /dm/, compacto e sóbrio */
.funil-video{ width:100%; max-width:720px; margin-top:var(--s5); }
.funil-video-btn{
  position:relative; width:100%; aspect-ratio:16 / 9;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--radius);
  border:1px solid var(--line);
  background:radial-gradient(circle at 50% 45%, #241519 0%, #120D0F 70%);
  transition:border-color 300ms var(--ease);
}
.funil-video-btn:hover{ border-color:var(--wine-line); }
.funil-video-play{ width:64px; height:64px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--wine); color:var(--ink); transition:transform 300ms var(--spring); }
.funil-video-btn:hover .funil-video-play{ transform:scale(1.08); }
.funil-video-play svg{ width:24px; height:24px; fill:currentColor; margin-left:3px; }
.funil-video-frame{ display:block; width:100%; aspect-ratio:16 / 9; border:0; border-radius:var(--radius); background:#000; }
.ment-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-areas:"funil funil" "chat heart";
  row-gap:var(--s1);
  align-items:start;
}
.ment-row .funil-wrap{ grid-area:funil; width:100%; }
.ment-icon--chat{ grid-area:chat; justify-self:end; margin-right:var(--s4); }
.ment-icon--heart{ grid-area:heart; justify-self:start; margin-left:var(--s4); }
@media (min-width:1024px){
  .ment-row{
    grid-template-columns:1fr minmax(0, 640px) 1fr;
    grid-template-areas:"chat funil heart";
    column-gap:var(--s3);
  }
  .ment-icon--chat, .ment-icon--heart{ margin:0; margin-top:43px; }
  .ment-icon--chat{ justify-self:end; }
  .ment-icon--heart{ justify-self:start; }
}
.ment-icon{
  display:flex; flex-direction:column; align-items:center;
  gap:10px;
  -webkit-tap-highlight-color:transparent;
}
.ment-circle{
  width:72px; height:72px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  border:1px solid var(--on-wine-line);
  transition:border-color 300ms var(--ease), background-color 300ms var(--ease), transform 400ms var(--spring);
}
.ment-circle svg{ width:28px; height:28px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; overflow:visible; }
.ment-circle .dot{ fill:currentColor; stroke:none; }
.ment-icon:active .ment-circle{ transform:scale(0.94); }
.ment-icon:hover .ment-circle, .ment-icon:focus-visible .ment-circle{ border-color:var(--on-wine); background:rgba(247,243,238,0.07); }
.ment-icon--chat:hover .dot, .ment-icon--chat:focus-visible .dot, .ment-icon--chat.is-active .dot{ animation:typing 1s ease-in-out infinite; }
.ment-icon--chat .d2{ animation-delay:0.15s !important; }
.ment-icon--chat .d3{ animation-delay:0.3s !important; }
@keyframes typing{ 0%,60%,100%{ transform:translateY(0); opacity:0.45; } 30%{ transform:translateY(-2.5px); opacity:1; } }
.ment-icon--heart svg{ transform-origin:50% 55%; }
.ment-icon--heart:hover svg, .ment-icon--heart:focus-visible svg, .ment-icon--heart.is-active svg{ animation:beat 1.1s ease-in-out infinite; }
@keyframes beat{ 0%,100%{ transform:scale(1); } 14%{ transform:scale(1.2); } 28%{ transform:scale(0.96); } 42%{ transform:scale(1.12); } 70%{ transform:scale(1); } }

/* ----- botão 3D do Funil (inalterado desde a revisão 1) ----- */
.funil-wrap{
  display:flex; flex-direction:column; align-items:center;
  gap:var(--s3);
  margin-bottom:var(--s3);
}
.funil-btn{
  --rx:0deg; --ry:0deg; --lift:0px; --mx:50%; --my:50%;
  display:block;
  width:100%;
  max-width:640px;
  border-radius:var(--radius);
  -webkit-tap-highlight-color:transparent;
}
.funil-stage{ display:block; perspective:900px; }
.funil-plate{
  position:relative;
  display:block;
  transform-style:preserve-3d;
  transform:rotateX(var(--rx)) rotateY(var(--ry));
  transition:transform 600ms var(--ease);
}
.funil-btn.is-tracking .funil-plate{ transition:transform 120ms linear; }
.funil-depth{
  position:absolute; inset:0;
  border-radius:var(--radius);
  background:#2B0015;
  transform:translateZ(-1px);
  transition:box-shadow 400ms var(--ease);
}
.funil-face{
  position:relative;
  display:block;
  padding:var(--s4) var(--s4);
  border-radius:var(--radius);
  background:linear-gradient(160deg, #6A0234 0%, var(--wine-deep) 100%);
  border:1px solid rgba(247,243,238,0.16);
  overflow:hidden;
  transform:translateZ(var(--lift));
  transition:transform 500ms var(--ease);
}
.funil-face img{ position:relative; z-index:1; width:100%; height:auto; aspect-ratio:1776 / 264; }
.funil-shine{
  position:absolute; inset:0; z-index:2;
  pointer-events:none;
  background:radial-gradient(240px circle at var(--mx) var(--my), rgba(255,255,255,0.18), transparent 60%);
  opacity:0;
  transition:opacity 400ms var(--ease);
}
.funil-shine::before{
  content:"";
  position:absolute; top:-20%; bottom:-20%; left:0;
  width:40%;
  background:linear-gradient(100deg, transparent 0%, rgba(255,255,255,0.32) 50%, transparent 100%);
  transform:translateX(-160%) skewX(-18deg);
}
.funil-btn.is-hover .funil-shine{ opacity:1; }
.funil-btn.is-hover .funil-shine::before{ animation:funil-sweep 1100ms var(--ease) forwards; }
@keyframes funil-sweep{ to{ transform:translateX(360%) skewX(-18deg); } }
@media (hover:none){
  .funil-plate{ animation:funil-float 4.2s ease-in-out infinite; }
  .funil-btn.is-pressed .funil-face{ transform:translateZ(-8px) scale(0.975); transition-duration:120ms; }
  .funil-shine::before{ animation:funil-sweep 2600ms var(--ease) 1.2s infinite; }
}
@keyframes funil-float{
  0%,100%{ transform:translateY(0) rotateX(4deg); }
  50%{ transform:translateY(-6px) rotateX(-3deg); }
}

/* ============ INFORMAÇÕES — uma por vez, em tela cheia ============
   Container alto + palco sticky. Sem pin/scrub: o scroll é 100% nativo.
   Sem JS (sem a classe .js) os 5 blocos aparecem em lista, um embaixo do outro. */
.info{ position:relative; background:var(--bg); color:var(--ink); }
.info-seg{ display:none; }
.info-stage{ display:flex; flex-direction:column; align-items:center; padding:var(--s8) 0; }
.info-blocks{ display:flex; flex-direction:column; align-items:center; gap:var(--s5); }
.info-block{
  max-width:14em;
  font-family:var(--font-display);
  font-weight:400;
  font-size:clamp(40px, 10.5vw, 92px);
  line-height:1.06;
  letter-spacing:-0.01em;
  text-align:center;
  text-wrap:balance;
}
.info-block i{ font-style:italic; }
.info-block .num{
  position:relative; display:inline-block;
  font-style:italic; font-size:1.2em; line-height:1;
  color:var(--wine);
  white-space:nowrap;
}
.info-block .num b{ font-weight:400; font-variant-numeric:tabular-nums; }
.info-block .num::after{
  content:""; position:absolute; left:3%; right:3%; bottom:-0.05em;
  height:max(2px, 0.03em); border-radius:1px;
  background:currentColor;
}
.info-steps{ display:none; }
.js .info-track{ position:relative; height:calc(5 * 55svh); }
@media (min-width:768px){ .js .info-track{ height:calc(5 * 70svh); } }
.js .info-seg{ display:block; position:absolute; left:0; right:0; height:20%; pointer-events:none; }
.js .info-seg[data-i="0"]{ top:0; }
.js .info-seg[data-i="1"]{ top:20%; }
.js .info-seg[data-i="2"]{ top:40%; }
.js .info-seg[data-i="3"]{ top:60%; }
.js .info-seg[data-i="4"]{ top:80%; }
.js .info-stage{
  position:sticky; top:0;
  height:100svh;
  justify-content:center;
  padding:0;
  overflow:hidden;
}
.js .info-blocks{ display:grid; place-items:center; width:100%; gap:0; }
.js .info-block{
  grid-area:1 / 1;
  opacity:0;
  transform:translateY(24px);
  transition:opacity 500ms var(--ease), transform 500ms var(--ease);
}
.js .info-block.is-before{ transform:translateY(-24px); }
.js .info-block.is-active{ opacity:1; transform:none; will-change:opacity, transform; }
.js .info-block .num::after{ transform:scaleX(0); transform-origin:0 50%; transition:transform 600ms var(--ease) 250ms; }
.js .info-block.is-active .num::after{ transform:scaleX(1); }
.js .info-steps{
  display:flex;
  position:absolute; left:50%; bottom:calc(var(--nav-h) + 88px + env(safe-area-inset-bottom));
  transform:translateX(-50%);
  flex-direction:column; align-items:center; gap:var(--s1);
  font-family:var(--font-mono);
}
@media (min-width:768px){ .js .info-steps{ bottom:var(--s5); } }
.info-count{ font-size:12px; letter-spacing:0.2em; color:var(--ink-soft); }
.info-count b{ font-weight:500; color:var(--wine); }
.info-nums{ display:flex; gap:4px; }
.info-nums button{
  min-width:36px; min-height:32px; padding:4px 6px;
  border-radius:6px;
  font-family:var(--font-mono); font-size:11px; letter-spacing:0.12em;
  color:var(--ink-soft);
  transition:color 200ms var(--ease), background-color 200ms var(--ease);
}
.info-nums button:hover{ color:var(--ink); background:var(--line); }
.info-nums button.is-active{ color:var(--wine); }
.info-bar{ position:relative; width:200px; height:2px; border-radius:1px; background:var(--line-strong); overflow:hidden; }
.info-bar-fill{ position:absolute; inset:0; background:var(--wine); transform:scaleX(0.2); transform-origin:0 50%; transition:transform 500ms var(--ease); }
@media (prefers-reduced-motion: reduce){ .js .info-block, .info-bar-fill{ transition:none; } }

/* ============ VARAL DE POLAROIDS ============ */
.varal-sec{ position:relative; background:var(--bg); color:var(--ink); padding:var(--s6) 0 var(--s5); }
.varal-hint{
  position:relative;
  display:flex; justify-content:center; align-items:flex-start; gap:6px;
  padding:0 var(--margin);
  font-family:var(--font-pen); font-weight:500; font-size:clamp(24px, 6vw, 30px); line-height:1.1;
  text-align:center;
  color:var(--ink);
}
.varal-hint-arrow{ flex:0 0 auto; width:42px; height:32px; margin-top:12px; overflow:visible; }
.varal-hint-arrow path{ fill:none; stroke:var(--ink); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.varal{
  --pw:196px;
  --pgap:18px;
  position:relative;
  height:440px;
  overflow:hidden;
  touch-action:pan-y;
  cursor:grab;
  user-select:none; -webkit-user-select:none;
}
.varal.is-dragging{ cursor:grabbing; }
@media (min-width:768px){ .varal{ --pw:228px; --pgap:24px; height:500px; } }
.varal-track{
  position:absolute; top:0; left:0; height:100%;
  display:flex; align-items:flex-start;
  gap:var(--pgap);
  padding:0 var(--margin);
  will-change:transform;
}
.varal-rope{ position:absolute; z-index:1; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.varal-hook{ position:absolute; z-index:2; top:var(--hook-y, 40px); width:18px; height:30px; color:var(--ink); pointer-events:none; }
.varal-hook svg{ width:100%; height:100%; overflow:visible; }
.varal-hook circle{ fill:currentColor; }
.varal-hook path{ fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; }
.varal-hook--l{ left:9px; }
.varal-hook--r{ right:9px; transform:scaleX(-1); }
.varal-track{ z-index:2; }
.varal-rope path{ fill:none; stroke:var(--ink); stroke-width:1.6; stroke-linecap:round; opacity:0.75; }
.pol{ position:relative; flex:0 0 var(--pw); margin-top:132px; }
.pol-peg{
  position:absolute; z-index:3; top:-30px; left:50%;
  width:14px; height:44px; margin-left:-7px;
  border-radius:3px 3px 4px 4px;
  background:linear-gradient(90deg, #A97B4E 0%, #D8B289 42%, #C59A6B 58%, #9C6F45 100%);
  box-shadow:0 3px 6px rgba(33,23,20,0.25);
  transform:rotate(calc(var(--rot) * 0.5 + var(--swing, 0deg) * 0.6));
}
.pol-peg::before{ content:""; position:absolute; left:-2px; right:-2px; top:15px; height:5px; border-radius:2px; background:linear-gradient(#b9b4ae, #7f7a74); }
.pol-peg::after{ content:""; position:absolute; left:50%; top:0; bottom:0; width:1px; margin-left:-0.5px; background:rgba(60,35,15,0.45); }
.pol-swing{ transform-origin:50% -16px; transform:rotate(calc(var(--rot) + var(--swing, 0deg))); }
.pol-card{
  --tilt:0deg;
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:216 / 268;
  perspective:1100px;
  -webkit-tap-highlight-color:transparent;
}
@media (hover:hover){ .pol-card:hover{ --tilt:15deg; } }
.pol-face{
  position:absolute; inset:0;
  display:flex; flex-direction:column;
  background:var(--paper);
  box-shadow:0 14px 26px -12px rgba(33,23,20,0.38), 0 2px 4px rgba(33,23,20,0.06);
  backface-visibility:hidden; -webkit-backface-visibility:hidden;
  transition:transform 800ms var(--ease);
}
.pol-front{ padding:12px 12px 0; transform:rotateY(var(--tilt)); }
.pol-back{ transform:rotateY(calc(180deg + var(--tilt))); padding:var(--s2) var(--s2); justify-content:center; text-align:left; overflow:hidden; background:var(--paper); }
.pol.is-flipped .pol-front{ transform:rotateY(calc(-180deg + var(--tilt))); }
.pol.is-flipped .pol-back{ transform:rotateY(var(--tilt)); }
.pol-photo{ position:relative; display:block; width:100%; aspect-ratio:1; overflow:hidden; background:#E9E3DC; }
.pol-photo picture, .pol-photo img{ width:100%; height:100%; object-fit:cover; pointer-events:none; }
.pol-caption{
  flex:1;
  display:flex; align-items:center; justify-content:center;
  padding:0 26px 0 6px;
  font-family:var(--font-pen);
  font-size:23px; line-height:1;
  text-align:center;
  color:var(--paper-ink);
}
@media (min-width:768px){ .pol-caption{ font-size:25px; } }
/* ponta inferior direita levemente dobrada + ícone de girar */
.pol-front::before{
  content:""; position:absolute; right:0; bottom:0;
  width:26px; height:26px;
  background:var(--bg);
  clip-path:polygon(100% 0, 100% 100%, 0 100%);
}
.pol-front::after{
  content:""; position:absolute; right:0; bottom:0;
  width:26px; height:26px;
  background:linear-gradient(135deg, #F3EEE6 0%, #E3DACD 48%, #CFC4B4 50%, transparent 51%);
  clip-path:polygon(0 0, 100% 0, 0 100%);
  filter:drop-shadow(-1px -1px 1px rgba(33,23,20,0.12));
}
.pol-turn{
  position:absolute; right:30px; bottom:10px;
  width:16px; height:16px;
  color:var(--ink-soft); opacity:0.75;
}
.pol-turn svg{ width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
/* verso: Caveat 500, legível, cara de escrito à mão; o JS reduz 21→19 (ou 19→17) se não couber */
.pol-back-text{
  display:block;
  font-family:'Caveat', 'Bradley Hand', cursive;
  font-weight:500;
  font-size:19px; line-height:1.4;
  color:#2A2522;
  transform:rotate(-1deg);
}
@media (min-width:768px){ .pol-back-text{ font-size:21px; } }

/* passarinho (decoração) */
.bird{
  position:absolute; z-index:6; left:0; top:0;
  width:56px; height:56px;
  padding:0;
  transform-origin:50% 62%;
  pointer-events:none;
  will-change:transform;
}
@media (max-width:767px){ .bird{ width:46px; height:46px; } }
.bird-svg{ display:block; width:100%; height:100%; overflow:visible; }
.bird .pb-asa{ transform:rotate(-10deg); transition:transform 380ms var(--ease); }
.bird.is-flapping .pb-asa{ animation:wing-flap 0.24s ease-in-out infinite alternate; }
@keyframes wing-flap{ from{ transform:rotate(-24deg); } to{ transform:rotate(6deg); } }
/* setas do varal (alternativa ao arraste/trackpad) */
.varal-nav{ display:flex; align-items:center; justify-content:center; gap:var(--s2); margin-top:var(--s1); }
.varal-arrow{ border:1px solid var(--line-strong); color:var(--ink); }
.varal-arrow:disabled{ opacity:0.3; cursor:default; }

/* ============ RODAPÉ ============ */
.footer{
  border-top:1px solid var(--line);
  background:var(--bg);
  color:var(--on-wine);
  padding:var(--s5) 0 calc(var(--nav-h) + var(--s3) + env(safe-area-inset-bottom));
  text-align:center;
}
@media (min-width:768px){ .footer{ padding-bottom:var(--s5); } }
.footer-inner{ display:flex; flex-direction:column; align-items:center; gap:var(--s3); }
.footer-lockup{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:var(--s3);
  width:100%; max-width:640px;
}
.footer-lockup-rule{ width:1px; height:64px; background:rgba(247,243,238,0.22); }
.footer-logo{ justify-self:start; }
.footer-logo img{ width:min(220px, 36vw); height:auto; }
.eagle{ position:relative; justify-self:end; width:min(150px, 26vw); }
.eagle-fly{ position:relative; display:block; transform-origin:50% 60%; }
.eagle-img{ display:block; width:100%; height:auto; transition:transform 500ms var(--spring), filter 500ms var(--ease); }
.footer-lockup .eagle, .footer-lockup .footer-logo{ transition:opacity 900ms var(--ease), transform 900ms var(--ease); }
.footer-lockup.is-waiting .eagle, .footer-lockup.is-waiting .footer-logo{ opacity:0; transform:translateY(16px); }
.footer-logo{ position:relative; }
.footer-logo picture{ display:block; }
.footer-caret{
  position:absolute; top:50%; left:0;
  width:3px; height:58%;
  margin-left:3px;
  background:var(--wine);
  transform:translateY(-40%);
  opacity:0;
}
.footer-logo.is-typing .footer-caret{ opacity:1; }
.footer-logo.is-typed .footer-caret{ animation:caret-blink 0.5s steps(1) 3 forwards; }
@keyframes caret-blink{ 0%{ opacity:1; } 50%,100%{ opacity:0; } }
.eagle.is-alive .eagle-fly{ animation:eagle-float 4.8s ease-in-out infinite; }
@keyframes eagle-float{
  0%,100%{ transform:translateY(0) rotate(-1.2deg); }
  50%{ transform:translateY(-3px) rotate(1.4deg); }
}
/* brilho que percorre as garras metálicas de tempos em tempos */
.eagle-shine{
  position:absolute; inset:0;
  pointer-events:none;
  background:linear-gradient(105deg, transparent 42%, rgba(255,255,255,0.9) 50%, transparent 58%) no-repeat;
  background-size:300% 100%;
  background-position:160% 0;
  -webkit-mask:url("../img/rodape/aguia.webp") center / 100% 100% no-repeat, radial-gradient(ellipse 26% 20% at 86% 90%, #000 55%, transparent 100%);
  -webkit-mask-composite:source-in;
          mask:url("../img/rodape/aguia.webp") center / 100% 100% no-repeat, radial-gradient(ellipse 26% 20% at 86% 90%, #000 55%, transparent 100%);
          mask-composite:intersect;
  mix-blend-mode:screen;
  opacity:0;
}
.eagle.is-alive .eagle-shine{ opacity:1; animation:claw-shine 6.5s ease-in-out 1.2s infinite; }
@keyframes claw-shine{ 0%,70%{ background-position:160% 0; } 88%,100%{ background-position:-60% 0; } }
@media (hover:hover){
  .eagle:hover .eagle-img{ transform:scaleX(1.04); filter:saturate(1.2) brightness(1.06) drop-shadow(0 0 10px rgba(40,255,70,0.35)); }
}
.footer-social{ display:flex; justify-content:center; gap:var(--s2); }
.social{
  width:48px; height:48px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  border:1px solid rgba(247,243,238,0.2);
  transition:border-color 300ms var(--ease), transform 400ms var(--spring);
}
.social-icon{ width:20px; height:20px; fill:currentColor; }
.social-icon rect, .social-icon circle{ fill:none; stroke:currentColor; stroke-width:1.9; }
.social-icon .ig-dot{ fill:currentColor; stroke:none; transform-origin:17.3px 6.7px; }
.social-icon .ig-lens{ transform-origin:12px 12px; }
.social-icon-tiktok{ width:17px; height:20px; }
@media (hover:hover){
  .social:hover{ border-color:var(--on-wine); transform:translateY(-3px); }
  .social[data-social="tiktok"]:hover .social-icon{
    animation:tt-jiggle 600ms var(--ease);
    filter:drop-shadow(-1.5px -1px 0 var(--tt-cyan)) drop-shadow(1.5px 1px 0 var(--tt-red));
  }
  .social[data-social="instagram"]:hover .ig-lens{ animation:ig-lens 600ms var(--spring); }
  .social[data-social="instagram"]:hover .ig-dot{ animation:ig-dot 600ms var(--spring); }
}
@keyframes tt-jiggle{ 0%,100%{ transform:rotate(0); } 25%{ transform:rotate(-10deg); } 60%{ transform:rotate(8deg); } }
@keyframes ig-lens{ 0%{ transform:scale(1); } 40%{ transform:scale(0.7); } 100%{ transform:scale(1); } }
@keyframes ig-dot{ 0%{ transform:scale(1); } 50%{ transform:scale(1.8); } 100%{ transform:scale(1); } }
.footer-bottom{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.06em; line-height:1.7; color:rgba(247,243,238,0.55); }

/* ============ OVERLAY — MURAL DO SUCESSO ============ */
.sheet-scrim{
  position:fixed; inset:0; z-index:1090;
  background:rgba(33,23,20,0.55);
  opacity:0;
  transition:opacity 500ms var(--ease);
}
.sheet-scrim.is-visible{ opacity:1; }
.sheet{
  position:fixed; z-index:1100;
  left:0; right:0; bottom:0;
  height:92svh;
  display:flex; flex-direction:column;
  background:var(--bg);
  color:var(--ink);
  border-radius:20px 20px 0 0;
  box-shadow:0 -20px 60px -20px rgba(0,0,0,0.5);
  transform:translateY(100%);
  transition:transform 640ms var(--spring);
  will-change:transform;
}
.sheet.is-open{ transform:translateY(0); }
.sheet.is-dragging{ transition:none; }
@media (min-width:1024px){
  .sheet{ left:50%; right:auto; width:min(1200px, calc(100% - 96px)); margin-left:calc(min(1200px, calc(100% - 96px)) / -2); }
}
.sheet-head{
  position:relative;
  flex:0 0 auto;
  display:flex; flex-direction:column; align-items:center;
  padding:var(--s1) var(--s6) var(--s2);
  border-bottom:1px solid var(--line);
  touch-action:none;
  cursor:grab;
}
.sheet-grabber{ width:40px; height:4px; border-radius:2px; background:var(--line-strong); margin-bottom:var(--s1); }
.sheet-title{ font-family:var(--font-display); font-weight:400; font-size:26px; line-height:1.1; }
.sheet-close{ position:absolute; top:var(--s2); right:var(--s1); }
.sheet-body{
  position:relative;
  flex:1 1 auto;
  overflow:hidden;
  padding:var(--s2) 0 0;
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 6%, #000 90%, transparent 100%);
          mask-image:linear-gradient(to bottom, transparent 0, #000 6%, #000 90%, transparent 100%);
}
.sheet-body .container{ height:100%; }
.mural-grid{
  touch-action:none;
  --rh:330px;
  --rgap:var(--s2);
  height:100%;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  column-gap:var(--gutter);
}
@media (min-width:768px){ .mural-grid{ --rh:290px; --rgap:var(--s3); } }
@media (min-width:1024px){ .mural-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); --rh:270px; } }
.mural-col{ position:relative; height:100%; overflow:hidden; }
.mural-track{ display:flex; flex-direction:column; gap:var(--rgap); will-change:transform; }
.review{
  flex:0 0 var(--rh);
  height:var(--rh);
  display:flex; flex-direction:column;
  padding:var(--s2);
  border-radius:12px;
  background:var(--surface);
  border:1px solid var(--line);
  text-align:left;
}
@media (min-width:768px){ .review{ padding:var(--s3); } }
.review-head{ display:flex; align-items:center; gap:var(--s1); margin-bottom:var(--s2); }
.review-initial{
  flex:0 0 32px; height:32px;
  display:flex; align-items:center; justify-content:center;
  border-radius:8px;
  background:var(--wine); color:var(--on-wine);
  font-family:var(--font-display); font-style:italic; font-size:20px;
}
.review-who{ display:flex; flex-direction:column; min-width:0; font-weight:600; font-size:13px; line-height:1.25; }
.review-who small{ font-weight:400; font-size:11.5px; color:var(--ink-soft); }
.review-text{ flex:1 1 auto; font-size:13px; line-height:1.55; color:var(--ink); }
@media (min-width:768px){ .review-text{ font-size:14px; } }
.review-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:var(--s2); }
.review-pin{ font-family:var(--font-mono); font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:var(--wine); }
.review-heart{ width:32px; height:32px; display:flex; align-items:center; justify-content:center; border-radius:50%; color:var(--ink-soft); }
.review-heart svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linejoin:round; transition:transform 400ms var(--spring); }
.review-heart[aria-pressed="true"]{ color:var(--tt-red); }
.review-heart[aria-pressed="true"] svg{ fill:currentColor; transform:scale(1.15); }
.review-ph{ border:1px dashed var(--wine-line); background:repeating-linear-gradient(45deg, rgba(133,3,66,0.04) 0 8px, transparent 8px 16px), var(--surface); }
.review-ph .review-text{ display:flex; align-items:center; justify-content:center; text-align:center; font-family:var(--font-mono); font-size:11px; letter-spacing:0.12em; color:var(--ink-soft); }
.heart-burst{
  position:fixed; z-index:1200; width:72px; height:72px; margin:-36px 0 0 -36px;
  pointer-events:none; color:var(--tt-red);
  animation:heart-burst 800ms var(--ease) forwards;
}
.heart-burst svg{ width:100%; height:100%; fill:currentColor; }
@keyframes heart-burst{ 0%{ transform:scale(0.2) rotate(-12deg); opacity:0; } 25%{ transform:scale(1.1) rotate(4deg); opacity:1; } 100%{ transform:scale(1) translateY(-40px); opacity:0; } }

/* ============ FORMULÁRIO DE APLICAÇÃO ============ */
.aplicar-sec{ position:relative; background:var(--bg); color:var(--ink); padding:var(--s8) 0 var(--sec-y); border-top:1px solid var(--line); }
.aplicar-inner{ display:flex; flex-direction:column; align-items:center; text-align:center; }
.aplicar-title{ font-family:var(--font-display); font-weight:400; font-size:clamp(34px, 8vw, 56px); line-height:1.02; }
.aplicar-sub{ margin-top:var(--s1); font-family:var(--font-mono); font-size:11px; letter-spacing:0.2em; text-transform:uppercase; color:var(--ink-soft); }
.aplicar-box{ width:100%; max-width:520px; margin-top:var(--s4); text-align:left; }
.aplicar-box .btn{ margin-top:var(--s1); }
/* campos */
.lead-field{ margin-bottom:var(--s2); }
.lead-field label, .lead-label{ display:block; margin-bottom:8px; font-family:var(--font-mono); font-size:11px; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; color:var(--wine); }
.lead-field input[type="text"], .phone-group{
  width:100%;
  border:1.5px solid var(--line-strong);
  border-radius:10px;
  background:var(--surface);
  transition:border-color 200ms var(--ease), box-shadow 200ms var(--ease);
}
.lead-field input[type="text"], .phone-group input{ padding:14px 16px; font-family:var(--font-body); font-size:16px; color:var(--ink); }
.lead-field input[type="text"]:focus, .phone-group:focus-within{ outline:none; border-color:var(--wine); box-shadow:0 0 0 3px var(--wine-soft); }
.phone-group{ display:flex; align-items:center; }
.phone-prefix{ padding:0 10px 0 14px; border-right:1px solid var(--line); font-size:15px; color:var(--ink-soft); }
.phone-group input{ flex:1; min-width:0; border:0; background:transparent; }
.phone-group input:focus{ outline:none; }
.qual-pills{ display:flex; flex-wrap:wrap; gap:8px; }
.qual-pill{ padding:10px 16px; border-radius:999px; border:1.5px solid var(--line-strong); background:var(--surface); font-size:14px; color:var(--ink); transition:background-color 200ms var(--ease), border-color 200ms var(--ease), color 200ms var(--ease), transform 300ms var(--spring); }
.qual-pill:active{ transform:scale(0.96); }
.qual-pill.is-selected{ background:var(--wine); border-color:var(--wine); color:var(--on-wine); }
.err-msg{ display:none; margin-top:6px; font-size:12px; color:var(--error); }
.lead-field.has-error .err-msg{ display:block; }
.lead-field.has-error input[type="text"], .lead-field.has-error .phone-group{ border-color:var(--error); }
.lead-field input[type="text"], .phone-group{ background:transparent; border:1px solid var(--line-strong); }
.qual-pill{ background:transparent; }
.ap-success{ display:grid; gap:var(--s2); justify-items:center; padding:var(--s4) var(--s3); border-radius:var(--radius); background:var(--surface); border:1px solid var(--line); text-align:center; }
.ap-success[hidden], #apSignup[hidden]{ display:none; }
.ap-success-title{ font-family:var(--font-display); font-size:clamp(28px, 7vw, 38px); line-height:1.05; }
.ap-success .btn{ max-width:320px; }

/* ============ REVELAÇÕES ============ */
.js .reveal{ opacity:0; transform:translateY(20px); transition:opacity 700ms var(--ease), transform 700ms var(--ease); }
.js .reveal.is-inview{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  .js .reveal, .js .hero *{ opacity:1 !important; transform:none !important; }
}