/* NovaVitis · estilo do site
   Paleta da logomarca e da filmagem: berinjela da uva, oliva da folha, creme da luz da manhã. */

:root{
  --canvas:#22111D;
  --deep:#1A0C16;
  --panel:#2E1828;
  --accent:#B9AE74;
  --accent-hover:#CFC48A;
  --accent-muted:rgba(185,174,116,.28);
  --sand:#E3D5B4;
  --sand-hover:#EEE3C9;
  --olive-line:#8F8752;
  --olive-ink:#5F5A2E;
  --text-primary:#F2EADC;
  --text-secondary:#CDBFC3;
  --linen:#EEE7DA;
  --linen-2:#E5DCCB;
  --ink:#2B1526;
  --ink-2:#5B4553;
  --field-line:#7E6A76;

  --f-display:"Gilda Display","Bodoni 72",Didot,Georgia,serif;
  --f-text:"Jost","Futura","Century Gothic",system-ui,sans-serif;
  --f-mono:"DM Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;

  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-io:cubic-bezier(.65,0,.35,1);

  --tshadow:0 1px 2px rgba(14,6,12,.95),0 3px 12px rgba(14,6,12,.78),0 10px 44px rgba(14,6,12,.8);
  --tshadow-light:0 1px 1px rgba(255,249,238,.6),0 0 18px rgba(255,247,234,.62),0 0 46px rgba(255,245,230,.5);

  --gx:clamp(16px,6vw,96px);
  --gutter:clamp(16px,5vw,64px);
  --wrap:min(1200px,calc(100% - 2 * var(--gutter)));
}

*,*::before,*::after{box-sizing:border-box}
html{overflow-x:hidden;overflow-x:clip;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;overflow-x:hidden;overflow-x:clip;background:var(--canvas);color:var(--text-primary);font:400 1.0625rem/1.65 var(--f-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
img,svg,video{display:block;max-width:100%}
p,h1,h2,h3,ol,ul,figure{margin:0}
a{color:inherit}
button,input,textarea{font:inherit;color:inherit}
::selection{background:rgba(185,174,116,.38);color:var(--text-primary)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.linen :focus-visible{outline-color:var(--olive-ink)}
p{text-wrap:pretty}
.ln{display:block;text-wrap:balance}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
section[id],#main{scroll-margin-top:88px}
#main:focus{outline:none}

.skip{position:fixed;left:12px;top:-64px;z-index:100;background:var(--accent);color:var(--canvas);padding:.75em 1.1em;border-radius:10px;text-decoration:none;font-weight:500;transition:top .35s var(--ease-out)}
.skip:focus{top:12px}

/* ---------- ambiente fixo ao fundo ---------- */
.ambient{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:var(--canvas)}
.ambient .glow{position:absolute;width:80vmax;height:80vmax;border-radius:50%}
.ambient .g1{left:-26vmax;top:-22vmax;background:radial-gradient(circle,rgba(96,40,80,.5),rgba(96,40,80,0) 62%)}
.ambient .g2{right:-30vmax;bottom:-30vmax;background:radial-gradient(circle,rgba(124,116,62,.2),rgba(124,116,62,0) 60%)}
.ambient .grain{position:absolute;inset:0;opacity:.035;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* ---------- navegação ---------- */
.nav{position:fixed;top:14px;left:50%;z-index:50;transform:translateX(-50%);width:min(1200px,calc(100% - 24px));display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:9px 9px 9px 18px;border-radius:999px;background:rgba(34,17,29,.76);border:1px solid rgba(242,234,220,.1);-webkit-backdrop-filter:blur(16px) saturate(1.15);backdrop-filter:blur(16px) saturate(1.15);transition:background .5s var(--ease-out),box-shadow .5s var(--ease-out)}
.nav.solid{background:rgba(34,17,29,.86);box-shadow:0 18px 40px -24px rgba(0,0,0,.6)}
.brand{display:flex;align-items:center;gap:.65rem;text-decoration:none;flex:none;padding:2px 0}
.brand-sym{height:34px;width:auto}
.brand-name{height:17px;width:auto}
.nav-links{display:flex;align-items:center;gap:clamp(1rem,2.4vw,2.2rem)}
.nav-links a{font:500 .93rem/1 var(--f-text);color:rgba(242,234,220,.86);text-decoration:none;position:relative;padding:.6rem 0}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:.25rem;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease-out)}
.nav-links a:hover{color:var(--text-primary)}
.nav-links a:hover::after{transform:scaleX(1)}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;padding:1em 1.65em;border-radius:999px;background:var(--sand);color:var(--canvas);border:1px solid var(--sand);font:500 1rem/1.1 var(--f-text);letter-spacing:.01em;text-decoration:none;text-align:center;cursor:pointer;box-shadow:0 12px 30px -14px rgba(227,213,180,.55);transition:background-color .45s var(--ease-out),border-color .45s var(--ease-out),transform .45s var(--ease-out),box-shadow .45s var(--ease-out)}
.btn:hover{background:var(--sand-hover);border-color:var(--sand-hover);transform:translateY(-1px);box-shadow:0 16px 34px -14px rgba(238,227,201,.6)}
.btn .wa-ic{width:1.18em;height:1.18em;flex:none;margin-left:-.2em;fill:currentColor}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.btn.ghost{background:rgba(20,9,17,.28);color:var(--text-primary);border-color:rgba(242,234,220,.5);box-shadow:none}
.btn.ghost:hover{background:rgba(242,234,220,.12);border-color:var(--text-primary)}
.btn-sm{padding:.78em 1.25em;font-size:.92rem}
.btn-wide{width:100%}
@media (pointer:coarse){.btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}}

/* ---------- tipografia comum ---------- */
.kicker{display:inline-flex;align-items:center;gap:.7rem;font:400 .76rem/1.2 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.linen .kicker{color:var(--olive-ink)}
.chip{padding:.62em .95em .56em;border-radius:999px;background:rgba(20,9,17,.5);border:1px solid rgba(242,234,220,.16);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-shadow:0 1px 3px rgba(14,6,12,.85);color:var(--text-primary)}
.h2{font:400 clamp(1.95rem,1.1rem + 3vw,3.9rem)/1.06 var(--f-display);letter-spacing:-.005em;margin-top:1.1rem;text-wrap:balance}
.lede{font:300 clamp(1.12rem,.95rem + .45vw,1.38rem)/1.55 var(--f-text);color:var(--text-secondary);margin-top:1.2rem}
.linen{background:var(--linen);color:var(--ink)}
.linen .lede{color:var(--ink-2)}
.junto{display:inline-block}
.tendril{width:44px;height:18px;flex:none;overflow:visible}
.tendril path{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s var(--ease-out) .25s}
.rv.in .tendril path{stroke-dashoffset:0}
html:not(.js) .tendril path{stroke-dashoffset:0}

/* ---------- entradas ---------- */
.js .rv{opacity:0;transform:translateY(18px)}
.js .rv.in{opacity:1;transform:none;transition:opacity 1s var(--ease-out),transform 1s var(--ease-out);transition-delay:calc(var(--i,0) * 90ms)}
.js .rv.in.settled{transition-delay:0s}

/* ---------- HERO ---------- */
.hero{position:relative;height:520vh;background:var(--deep)}
.stage{position:sticky;top:0;height:100vh;overflow:hidden;isolation:isolate;--g:.18}
.poster,.poster-end{position:absolute;inset:0;background:var(--deep) 50% 70%/cover no-repeat}
.poster-end{opacity:0}
#hero{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 70%;opacity:0;transition:opacity .9s var(--ease-out);transform:translateZ(0);will-change:transform}
.stage.video-ready #hero{opacity:1}
.stage.video-failed #hero{display:none}
.scrim{position:absolute;inset:0;pointer-events:none;opacity:var(--g);background:radial-gradient(ellipse 120% 90% at 50% 45%,rgba(14,6,12,0) 35%,rgba(14,6,12,.66) 100%)}
.stage::after{content:"";position:absolute;left:0;right:0;bottom:0;height:16vh;pointer-events:none;background:linear-gradient(to bottom,rgba(26,12,22,0),rgba(26,12,22,.5))}

.band{position:absolute;left:var(--gx);right:var(--gx);opacity:0;pointer-events:none;isolation:isolate;will-change:opacity}
.band.off{visibility:hidden}
.band::before{content:"";position:absolute;z-index:-1;pointer-events:none;opacity:calc(.25 + .75 * var(--k,1))}
.b-title{font:400 clamp(2.3rem,1rem + 3.3vw,4.5rem)/1.04 var(--f-display);letter-spacing:-.005em;margin-top:.55em;text-wrap:balance}

.b1{top:clamp(6.4rem,13.5vh,9.2rem)}
.b1::before{inset:-48% -34% -62% -20%;background:radial-gradient(ellipse 58% 60% at 30% 46%,rgba(251,246,236,.62) 0%,rgba(251,246,236,.4) 46%,rgba(251,246,236,0) 76%)}
.b1 .chip{background:rgba(255,251,243,.56);border-color:rgba(43,21,38,.16);color:var(--ink);text-shadow:none}
.b1 .b-title{color:var(--ink);text-shadow:var(--tshadow-light);font-size:clamp(2.2rem,.8rem + 3vw,3.95rem)}
.blurswap{display:grid}
.blurswap>span{grid-area:1/1}
.blurswap .soft{filter:blur(10px);opacity:calc(.9 * (1 - var(--k,1)))}
.blurswap .sharp{opacity:var(--k,1);transform:translateY(calc((1 - var(--k,1)) * 6px))}

.b2{top:61%;transform:translateY(-50%)}
.b2::before{inset:-56% -14% -56% -26%;background:radial-gradient(ellipse 60% 80% at 26% 50%,rgba(14,6,12,.8) 0%,rgba(14,6,12,.64) 50%,rgba(14,6,12,0) 80%)}
.b2 .b-title{color:var(--text-primary);text-shadow:var(--tshadow);font-size:clamp(2.7rem,1rem + 4.4vw,5.6rem);width:fit-content;margin-top:0}
.b2 .w{display:inline-block;--kc:clamp(0,(var(--k,0) - var(--th,0)) * 2.8,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc)) * -24px))}
.b2 .b-line{margin-top:1rem;font:400 clamp(1.1rem,.9rem + .5vw,1.42rem)/1.5 var(--f-text);width:fit-content;color:var(--text-primary);text-shadow:var(--tshadow);--kl:clamp(0,(var(--k,0) - .55) * 3,1);opacity:var(--kl);transform:translateY(calc((1 - var(--kl)) * -12px))}

.b3{bottom:clamp(2.4rem,8vh,5.4rem)}
.b3::before{inset:-58% -18% -42% -30%;background:radial-gradient(ellipse 58% 64% at 26% 60%,rgba(14,6,12,.74) 0%,rgba(14,6,12,.5) 46%,rgba(14,6,12,0) 76%)}
.b3 .b-title{color:var(--text-primary);text-shadow:var(--tshadow)}
.b3 .b-title .w{display:inline-block;--kc:clamp(0,(var(--k,0) - var(--th,0)) * 3,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc)) * .5em))}
.b3 .kicker{opacity:clamp(0,var(--k,0) * 4,1)}
.b3 .b-sub{margin-top:1rem;font:400 clamp(1.05rem,.9rem + .4vw,1.32rem)/1.55 var(--f-text);width:fit-content;color:var(--text-primary);text-shadow:var(--tshadow);--ks:clamp(0,(var(--k,0) - .62) * 4,1);opacity:var(--ks);transform:translateY(calc((1 - var(--ks)) * 14px))}
.b-ctas{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.7rem;pointer-events:auto;--kb:clamp(0,(var(--k,0) - .78) * 5,1);opacity:var(--kb);transform:translateY(calc((1 - var(--kb)) * 14px))}
.band .btn{text-shadow:none}

.rail{position:absolute;right:clamp(14px,2.2vw,36px);top:33vh;height:34vh;width:1px;background:rgba(242,234,220,.24)}
.rail i{position:absolute;inset:0;background:var(--accent);transform-origin:top;transform:scaleY(var(--p,0))}
.rail b{position:absolute;left:-3px;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;background:rgba(242,234,220,.55);transition:background-color .5s var(--ease-out),transform .5s var(--ease-out)}
.rail b.on{background:var(--accent);transform:scale(1.25)}

.cue{position:absolute;left:50%;bottom:clamp(16px,4vh,40px);transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.8rem;font:400 .72rem/1 var(--f-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--text-primary);text-shadow:var(--tshadow);opacity:var(--cue,1);pointer-events:none}
.cue::after{content:"";width:1px;height:40px;background:linear-gradient(var(--text-primary),rgba(242,234,220,0));animation:cueLine 2.6s var(--ease-io) -1.3s infinite}
@keyframes cueLine{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

.ring{position:absolute;right:clamp(14px,2.2vw,36px);bottom:clamp(16px,3.5vh,36px);width:34px;height:34px;color:var(--text-primary);transform:rotate(-90deg);opacity:.85;transition:opacity .7s var(--ease-out)}
.ring .track{opacity:.22}
.stage.video-ready .ring{opacity:0}
.chev{position:absolute;right:clamp(14px,2.2vw,36px);bottom:clamp(16px,3.5vh,36px);width:30px;height:30px;color:var(--text-primary);opacity:.8}
.chev svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

.pollen{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity 1.4s var(--ease-out)}
.stage.pollen-on>.pollen{opacity:1}
.pollen span{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);border-radius:50%;background:rgba(255,244,214,.9);box-shadow:0 0 8px rgba(255,236,190,.75);opacity:0;animation:pol var(--d) linear var(--dl) infinite}
.stage:not(.pollen-on) .pollen span{animation-play-state:paused}
@keyframes pol{0%{transform:translate3d(0,0,0);opacity:0}15%{opacity:.62}80%{opacity:.5}100%{transform:translate3d(var(--dx),-16vh,0);opacity:0}}

/* hero estático: escondido por padrão */
.static-hero{display:none}

/* ---------- 01 perguntas ---------- */
.sec{position:relative;padding:clamp(5.5rem,11vw,9.5rem) 0}
.wrap{width:var(--wrap);margin-inline:auto;position:relative}
.two-col{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.col-head{position:sticky;top:8rem}
.contours{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.95}
.contours path{fill:none;stroke:rgba(185,174,116,.13);stroke-width:1;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.6s var(--ease-out);transition-delay:calc(var(--i,0) * 120ms)}
.sec.in .contours path{stroke-dashoffset:0}
.contours g{animation:contourDrift 46s var(--ease-io) -12s infinite alternate}
.sec:not(.live) .contours g{animation-play-state:paused}
@keyframes contourDrift{to{transform:translate3d(-28px,14px,0)}}

/* ---------- 02 serviços ---------- */
.s-head{text-align:center;display:flex;flex-direction:column;align-items:center}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.2rem,2.4vw,2.2rem);margin-top:clamp(2.8rem,5vw,4.6rem)}
.card{display:flex;flex-direction:column}
.card-img{aspect-ratio:4/5;overflow:hidden;border-radius:6px;background:var(--linen-2);box-shadow:0 24px 50px -32px rgba(43,21,38,.55)}
.breath{display:block;width:100%;height:100%;transform:scale(1);transition:transform 1.3s var(--ease-io)}
.card.playing .breath{transform:scale(1.09);transition:transform 7.2s cubic-bezier(.3,.05,.3,1)}
.card-img img{width:100%;height:100%;object-fit:cover}
.card-label{font:400 .74rem/1.2 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--olive-ink);margin-top:1.5rem}
.card-title{font:400 clamp(1.8rem,1.2rem + 1.2vw,2.4rem)/1.1 var(--f-display);margin-top:.5rem}
.card-text{margin-top:.8rem;color:var(--ink-2)}
.card-list{list-style:none;padding:0;margin-top:1.3rem;border-top:1px solid rgba(43,21,38,.16)}
.card-list li{display:flex;gap:.7rem;align-items:baseline;padding:.66rem 0;border-bottom:1px solid rgba(43,21,38,.1);font-size:.98rem}
.card-list li::before{content:"";flex:none;width:7px;height:7px;border-radius:0 60% 0 60%;background:var(--olive-ink);transform:translateY(-1px) rotate(-8deg)}

/* ---------- 02 no campo (vídeo) ---------- */
.campo{background:radial-gradient(ellipse 60% 70% at 72% 50%,rgba(84,38,72,.5),rgba(26,12,22,0) 70%),var(--deep)}
.campo-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.ficha{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:2rem;margin:2.4rem 0 0;border-top:1px solid rgba(242,234,220,.14)}
.ficha div{padding:1rem 0 1.05rem;border-bottom:1px solid rgba(242,234,220,.14)}
.ficha dt{font:400 .72rem/1.3 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.ficha dd{margin:.4rem 0 0;font:400 1.22rem/1.3 var(--f-display);color:var(--text-primary)}
.player{margin:0;justify-self:center;width:min(100%,23rem)}
.player-frame{position:relative;aspect-ratio:9/16;border-radius:20px;overflow:hidden;background:#120810;box-shadow:0 50px 90px -50px rgba(0,0,0,.85),0 0 0 1px rgba(242,234,220,.1)}
.player-capa,.player-frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.player-frame video{background:#120810;z-index:1}
.player-frame::after{content:"";position:absolute;left:0;right:0;bottom:0;height:42%;background:linear-gradient(to bottom,rgba(18,8,16,0),rgba(18,8,16,.72));pointer-events:none;transition:opacity .6s var(--ease-out)}
.play{position:absolute;left:50%;bottom:1.7rem;z-index:2;transform:translateX(-50%);display:inline-flex;align-items:center;gap:.85rem;padding:.5rem 1.35rem .5rem .5rem;border-radius:999px;border:1px solid rgba(242,234,220,.18);background:rgba(20,9,17,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--text-primary);font:500 1rem/1 var(--f-text);cursor:pointer;white-space:nowrap;transition:background-color .45s var(--ease-out),transform .45s var(--ease-out),opacity .45s var(--ease-out)}
.play:hover{background:rgba(20,9,17,.72);transform:translateX(-50%) translateY(-2px)}
.play-ic{position:relative;flex:none;width:3.1rem;height:3.1rem;border-radius:50%;background:var(--sand);color:var(--canvas);display:grid;place-items:center}
.play-ic svg{width:1.15rem;height:1.15rem;fill:currentColor;margin-left:.18rem}
.play-ic::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid rgba(227,213,180,.7);opacity:0;animation:ring 3.6s var(--ease-out) -1.2s infinite}
.sec:not(.live) .play-ic::after{animation-play-state:paused}
@keyframes ring{0%{transform:scale(.92);opacity:.8}70%{transform:scale(1.3);opacity:0}100%{transform:scale(1.3);opacity:0}}
.play-dur{margin-left:.5rem;font:400 .8rem/1 var(--f-mono);letter-spacing:.1em;color:var(--text-secondary)}
.player.tocando .play,.player.tocando .player-frame::after{opacity:0;pointer-events:none}
.player-leg{margin-top:1rem;text-align:center;font:400 .74rem/1.4 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-secondary)}
.player-alt{display:block;margin-top:.6rem;text-align:center;color:var(--accent)}

/* ---------- 04 como começamos ---------- */
.como{background:var(--panel)}
.steps-wrap{position:relative;margin-top:clamp(2.8rem,5vw,4.6rem)}
.steps-line{position:absolute;top:2.1rem;left:2.1rem;right:2.1rem;height:1px;background:linear-gradient(90deg,var(--accent-muted),rgba(185,174,116,.62),var(--accent-muted));transform-origin:left;transform:scaleX(0);transition:transform 1.8s var(--ease-out) .2s;clip-path:inset(-6px 0 -6px 0)}
.sec.in .steps-line{transform:scaleX(1)}
.spark{position:absolute;inset:0;transform:translateX(-100%);animation:travel 9s var(--ease-io) -3s infinite}
.sec:not(.live) .spark{animation-play-state:paused}
.spark::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-radius:50%;background:var(--accent-hover);box-shadow:0 0 12px rgba(207,196,138,.9)}
@keyframes travel{0%{transform:translateX(-100%);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateX(0);opacity:0}}
.steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.5rem,4vw,4rem);position:relative}
.step-n{display:inline-flex;align-items:center;justify-content:center;width:4.2rem;height:4.2rem;border-radius:50%;border:1px solid rgba(185,174,116,.55);background:var(--panel);font:400 1.6rem/1 var(--f-display);color:var(--accent)}
.step-t{font:400 clamp(1.5rem,1.1rem + 1vw,2rem)/1.15 var(--f-display);margin-top:1.4rem}
.step p{color:var(--text-secondary);margin-top:.7rem}
/* as 4 etapas da seção 01 (fundo claro) */
.etapas{margin-top:clamp(2.6rem,4.6vw,4rem)}
.steps-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.5rem,3vw,3rem)}
.steps-4 .step-t{font-size:clamp(1.4rem,.95rem + .85vw,1.85rem)}
.linen .steps-line{background:linear-gradient(90deg,rgba(143,135,82,.3),rgba(143,135,82,.75),rgba(143,135,82,.3))}
.linen .spark::after{background:var(--olive-line);box-shadow:0 0 10px rgba(143,135,82,.7)}
.linen .step-n{background:var(--linen);border-color:rgba(95,90,46,.5);color:var(--olive-ink)}
.linen .step-t{color:var(--ink)}
.linen .step p{color:var(--ink-2)}
.signoff{margin-top:clamp(3.6rem,7vw,6rem);display:flex;justify-content:center;align-items:center;gap:.32em;text-align:center;font:400 clamp(2rem,.9rem + 3.1vw,4rem)/1.08 var(--f-display);letter-spacing:-.005em}
.signoff .sw{white-space:nowrap}
.seta{flex:none;width:1.3em;height:.44em;margin-top:.08em;fill:none;stroke:var(--accent);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;overflow:visible}

/* ---------- 05 equipe ---------- */
.people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.2rem,3vw,2.5rem);margin-top:clamp(2.6rem,5vw,4rem)}
.person{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.3rem 1.6rem;align-items:center;padding:clamp(1.6rem,3vw,2.6rem);border-radius:12px;background:#F5EFE4;border:1px solid rgba(43,21,38,.1)}
.badge{position:relative;width:6.2rem;height:6.2rem;border-radius:50%;background:var(--ink);box-shadow:0 0 0 3px #F5EFE4,0 0 0 4px rgba(43,21,38,.18)}
.badge img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
@keyframes sway{from{transform:rotate(-6deg)}to{transform:rotate(5deg)}}
.person-name{font:400 clamp(1.6rem,1.2rem + .9vw,2.1rem)/1.1 var(--f-display)}
.role{font:400 .74rem/1.3 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--olive-ink);margin-top:.55rem}
.bio{grid-column:1/-1;color:var(--ink-2)}
.ig{grid-column:1/-1;justify-self:start;font:400 .9rem/1.3 var(--f-mono);color:var(--ink);text-decoration:none;border-bottom:1px solid rgba(43,21,38,.35);padding-bottom:2px;transition:border-color .4s var(--ease-out)}
.ig:hover{border-color:var(--ink)}

/* ---------- dúvidas ---------- */
.duvidas .two-col{display:block}
.duvidas .col-head{position:static}
.duvidas .col-body{width:min(100%,46rem);margin:clamp(2.2rem,4vw,3.4rem) 0 0 auto}
.faq-item{border-bottom:1px solid rgba(242,234,220,.16)}
.faq-item:first-child{border-top:1px solid rgba(242,234,220,.16)}
.faq-item h3{font-size:inherit;font-weight:400}
.faq-q{text-wrap:balance;width:100%;display:flex;justify-content:space-between;align-items:baseline;gap:1.2rem;padding:1.45rem 0;background:none;border:0;color:var(--text-primary);font:400 clamp(1.2rem,1rem + .6vw,1.55rem)/1.3 var(--f-display);text-align:left;cursor:pointer;transition:color .4s var(--ease-out)}
.faq-q:hover{color:#fff8ea}
.ic{position:relative;flex:none;width:14px;height:14px;transform:translateY(-2px)}
.ic::before,.ic::after{content:"";position:absolute;left:0;top:50%;width:14px;height:1.5px;background:var(--accent);transition:transform .5s var(--ease-out)}
.ic::after{transform:rotate(90deg)}
.faq-q[aria-expanded="true"] .ic::after{transform:rotate(0deg)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--ease-out)}
.faq-a>div{overflow:hidden;visibility:hidden;transition:visibility 0s .55s}
.faq-a.open{grid-template-rows:1fr}
.faq-a.open>div{visibility:visible;transition-delay:0s}
.faq-a p{padding:0 2rem 1.6rem 0;color:var(--text-secondary);max-width:58ch}

/* ---------- 07 contato ---------- */
.contato{padding-top:0;overflow:hidden}
.banner{position:relative;min-height:clamp(24rem,64vh,42rem);display:flex;align-items:flex-end;overflow:hidden}
.banner>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:66% 60%}
.banner::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--canvas) 1%,rgba(34,17,29,.62) 36%,rgba(34,17,29,.12) 72%),linear-gradient(to right,rgba(34,17,29,.82),rgba(34,17,29,.15) 62%)}
.banner-copy{position:relative;z-index:2;width:var(--wrap);margin:0 auto;padding-bottom:clamp(1.5rem,4vw,3rem)}
.banner-copy .h2,.banner-copy .lede{text-shadow:0 2px 18px rgba(14,6,12,.6)}
.banner-copy .lede{color:var(--text-primary)}
.pollen-c{opacity:1;z-index:1}
.sec:not(.live) .pollen-c span{animation-play-state:paused}
.contours-c{top:auto;bottom:0;height:70%;opacity:.7}
.contato-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(2rem,5vw,5rem);margin-top:clamp(1.2rem,3vw,2.4rem);z-index:1}
.form{display:grid;gap:1.25rem;padding:clamp(1.4rem,3vw,2.6rem);border-radius:16px;background:var(--panel);border:1px solid rgba(242,234,220,.1);box-shadow:0 40px 80px -50px rgba(0,0,0,.7)}
.field{display:grid;gap:.6rem;min-width:0}
.field>label,.field legend{font:400 .74rem/1.3 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-secondary)}
.field input,.field textarea{width:100%;background:rgba(20,9,17,.55);border:1px solid var(--field-line);border-radius:10px;padding:.95rem 1rem;color:var(--text-primary);font:400 1rem/1.4 var(--f-text);transition:border-color .35s var(--ease-out),box-shadow .35s var(--ease-out)}
.field textarea{resize:vertical;min-height:6.5rem}
.field input::placeholder,.field textarea::placeholder{color:rgba(205,191,195,.72)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(185,174,116,.28)}
fieldset.field{border:0;padding:0;margin:0}
.field legend{padding:0;margin-bottom:.6rem}
.chip-row{display:flex;flex-wrap:wrap;gap:.6rem}
.chip-opt{position:relative;cursor:pointer}
.chip-opt input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.chip-opt span{display:inline-flex;align-items:center;min-height:44px;padding:.65rem 1.05rem;border:1px solid var(--field-line);border-radius:999px;font-size:.96rem;line-height:1.2;transition:background-color .35s var(--ease-out),border-color .35s var(--ease-out),color .35s var(--ease-out)}
.chip-opt:hover span{border-color:var(--accent)}
.chip-opt input:checked+span{background:var(--accent);border-color:var(--accent);color:var(--canvas)}
.chip-opt input:focus-visible+span{outline:2px solid var(--accent);outline-offset:3px}
.err-msg{display:none;font-size:.88rem;color:#F0B4A8}
.field.err .err-msg{display:block}
.field.err input,.field.err .chip-opt span{border-color:#E39A8F}
.form-ok{display:none;padding:1rem 1.1rem;border-radius:10px;background:rgba(185,174,116,.12);border:1px solid rgba(185,174,116,.45);color:var(--text-primary)}
.form.sent .form-ok{display:block}
.contato-info ul{list-style:none;padding:0;border-top:1px solid rgba(242,234,220,.16)}
.contato-info li{display:grid;gap:.35rem;padding:1.15rem 0;border-bottom:1px solid rgba(242,234,220,.16)}
.ci-l{font:400 .72rem/1.2 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.contato-info a{font:400 1.25rem/1.3 var(--f-display);text-decoration:none;justify-self:start;border-bottom:1px solid transparent;transition:border-color .4s var(--ease-out)}
.contato-info a:hover{border-color:var(--accent)}
.contato-info li>span:last-child:not(.ci-l){font:400 1.25rem/1.3 var(--f-display)}

/* ---------- rodapé ---------- */
.foot{background:var(--deep);padding:clamp(3.5rem,7vw,5.5rem) 0 2rem;border-top:1px solid rgba(242,234,220,.08);position:relative}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:clamp(1.6rem,4vw,3rem);align-items:start}
.foot-brand img{width:min(230px,70%);height:auto}
.foot-brand p{margin-top:1rem;font:400 1.15rem/1.4 var(--f-display);color:var(--text-secondary)}
.foot-h{font:400 .72rem/1.2 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:.9rem}
.foot-col{display:grid;gap:.5rem;justify-items:start}
.foot-col a,.foot-col p{color:var(--text-secondary);text-decoration:none;font-size:.98rem;transition:color .35s var(--ease-out)}
.foot-col a:hover{color:var(--text-primary)}
.foot-bottom a{color:inherit;text-decoration:underline;text-decoration-color:rgba(205,191,195,.35);text-underline-offset:3px;transition:color .35s var(--ease-out)}
.foot-bottom a:hover{color:var(--text-primary)}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem 2rem;margin-top:clamp(2.4rem,5vw,3.6rem);padding-top:1.4rem;border-top:1px solid rgba(242,234,220,.08);font-size:.86rem;color:rgba(205,191,195,.82)}

/* ---------- a gavinha (assinatura) ---------- */
.gavinha{position:absolute;left:0;top:0;width:100%;height:10px;pointer-events:none;z-index:3;overflow:visible;display:none}
.gavinha .g-path{fill:none;stroke:var(--olive-line);stroke-width:1.7;stroke-linecap:round}
.gavinha .g-curl{fill:none;stroke:#A6AC66;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s var(--ease-out) .25s}
.gavinha .g-leaf{transform-box:fill-box;transform-origin:50% 100%;transform:scale(0) rotate(-18deg);opacity:0;transition:transform 1.2s var(--ease-out),opacity .8s var(--ease-out)}
.gavinha .g-node{fill:var(--olive-line);opacity:0;transition:opacity .6s var(--ease-out)}
.gavinha .on .g-curl{stroke-dashoffset:0}
.gavinha .on .g-leaf{transform:scale(1) rotate(0deg);opacity:1}
.gavinha .on .g-node{opacity:1}
.pinned .gavinha .g-curl{stroke-dashoffset:0}
#main{position:relative}

/* ---------- responsivo ---------- */
@media (max-width:1080px){
  .nav-links{gap:1.1rem}
  .nav-links a{font-size:.88rem}
}
@media (max-width:980px){
  .nav-links{display:none}
  .two-col,.campo-grid,.contato-grid{grid-template-columns:minmax(0,1fr)}
  .col-head{position:static}
  .cards{grid-template-columns:minmax(0,1fr);max-width:620px;margin-inline:auto}
  .card-img{aspect-ratio:16/11}
  .people{grid-template-columns:minmax(0,1fr)}
  .steps{grid-template-columns:minmax(0,1fr);gap:2.4rem}
  .steps-line{top:2.1rem;bottom:2.1rem;left:2.1rem;right:auto;width:1px;height:auto;transform:scaleY(0);transform-origin:top;background:linear-gradient(180deg,var(--accent-muted),rgba(185,174,116,.62),var(--accent-muted));clip-path:inset(0 -6px 0 -6px)}
  .sec.in .steps-line{transform:scaleY(1)}
  .spark{display:none}
  .step{display:grid;grid-template-columns:4.2rem minmax(0,1fr);gap:0 1.2rem}
  .step-n{grid-row:span 2}
  .step-t{margin-top:.4rem}
  .player{margin-top:.6rem}
  .foot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .foot-brand{grid-column:1/-1}
}
@media (max-width:860px){
  .signoff{flex-direction:column;gap:.18em}
  .seta{transform:rotate(90deg);margin:.3em 0}
}
@media (max-width:560px){
  .static-copy .kicker{flex-direction:column;align-items:flex-start;gap:.3rem}
  .static-copy .k-sep{display:none}
  .role-sep{display:none}
  .role-inst{display:block;margin-top:.2rem}
  .ficha .wide{grid-column:1/-1}
  .nav{padding:7px 7px 7px 14px}
  .brand-sym{height:30px}
  .brand-name{height:15px}
  .person{grid-template-columns:minmax(0,1fr)}
  .foot-grid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:380px){
  .brand-name{display:none}
}
@media (max-height:560px){
  .rail,.cue{display:none}
}

/* ---------- os cinco portões do hero estático (idênticos ao JS) ---------- */
@media (max-width: 720px), (orientation: portrait) and (max-width: 1024px), (orientation: portrait) and (pointer: coarse), (orientation: landscape) and (pointer: coarse) and (max-height: 560px), (prefers-reduced-motion: reduce){
  .hero{height:auto}
  .stage{position:relative;height:auto;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;background:var(--canvas)}
  .stage>.poster,.stage>.poster-end,#hero,.stage>.scrim,.band,.rail,.cue,.ring,.chev,.stage>.pollen{display:none}
  .stage::after{display:none}
  .static-hero{display:flex;flex-direction:column;flex:1 1 auto;position:relative}
  .static-img{position:relative;flex:1 1 auto;min-height:58vh;min-height:58svh;background:var(--deep) url("hero-estatico.jpg") 50% 38%/cover no-repeat}
  .static-img::after{content:"";position:absolute;left:0;right:0;bottom:0;height:48%;background:linear-gradient(to bottom,rgba(34,17,29,0),var(--canvas) 92%)}
  .static-copy{position:relative;padding:0 var(--gx) clamp(2.4rem,7vh,4rem);margin-top:-12vh}
  .static-copy .kicker{color:var(--accent)}
  .s-title{font:400 clamp(2.3rem,1.2rem + 5vw,3.6rem)/1.05 var(--f-display);margin-top:.9rem;text-wrap:balance}
  .s-sub{margin-top:1rem;font:300 1.08rem/1.6 var(--f-text);color:var(--text-secondary)}
  .static-copy .btn{margin-top:1.6rem}
}
@media (max-width: 720px), (orientation: portrait) and (max-width: 1024px), (orientation: portrait) and (pointer: coarse), (orientation: landscape) and (pointer: coarse) and (max-height: 560px), (prefers-reduced-motion: reduce){
  @media (orientation: landscape) and (min-width: 721px){
    .stage{min-height:100vh;min-height:100svh}
    .static-hero{justify-content:flex-end}
    .static-img{position:absolute;inset:0;min-height:0;background-image:url("hero-final.jpg");background-position:50% 70%}
    .static-img::after{inset:0;height:auto;background:linear-gradient(to right,rgba(26,12,22,.86) 0%,rgba(26,12,22,.55) 42%,rgba(26,12,22,0) 70%),linear-gradient(to top,rgba(26,12,22,.7),rgba(26,12,22,0) 50%)}
    .static-copy{position:relative;margin:0;padding:clamp(5.5rem,16vh,8rem) var(--gx) clamp(2rem,9vh,5rem);max-width:min(46rem,62vw)}
    .s-title{text-shadow:var(--tshadow)}
    .s-sub{color:var(--text-primary);text-shadow:var(--tshadow)}
  }
  @media (orientation: landscape) and (max-height: 500px){
    .s-title{font-size:clamp(1.9rem,1rem + 3.4vw,2.5rem)}
    .s-sub{font-size:1rem;margin-top:.7rem}
    .static-copy .btn{margin-top:1.1rem}
  }
}

/* ---------- movimento reduzido: tudo no estado final ---------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.001ms!important;transition-delay:0s!important}
  .js .rv{opacity:1;transform:none}
  .tendril path,.contours path{stroke-dashoffset:0}
  .steps-line{transform:none}
  .spark,.pollen span,.cue::after{display:none}
  .ambient .glow{animation:none}
  .contours g{animation:none}
  .play-ic::after{animation:none}
  .breath{transition:none}
}

/* pausa geral com a aba escondida */
body.paused *,body.paused *::before,body.paused *::after{animation-play-state:paused!important}
