
/*
  SANA — site v2

  Para usar a família Novecento Sans Wide enviada:
  coloque os três arquivos .otf numa pasta "fonts" ao lado deste CSS,
  mantendo os nomes abaixo. Os arquivos de fonte NÃO estão incluídos no ZIP.
*/
@font-face {
  font-family: "Novecento";
  src: url("fonts/Novecentosanswide-Light.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Novecento";
  src: url("fonts/Novecentosanswide-Normal.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Novecento";
  src: url("fonts/Novecentosanswide-DemiBold.otf") format("opentype");
  font-weight: 600;
  font-style: normal;
}

:root{
  --areia:#E6E0D5;
  --mata:#0B291E;
  --terra:#62472F;
  --pulso:#D17693;
  --agua:#16535A;
  --serra:#849B72;
  --ink:#10241D;
  --white:#F3EEE4;
  --line:rgba(243,238,228,.28);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--areia);
  color:var(--ink);
  font-family:"Novecento","Arial Narrow",Arial,sans-serif;
  font-weight:300;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img,video{display:block;width:100%}

.grain{
  position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.055;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}
.topbar{
  position:fixed;z-index:40;left:0;right:0;top:0;
  display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;
  padding:20px 28px;color:var(--white);
  mix-blend-mode:difference;
  font-size:10px;text-transform:uppercase;letter-spacing:.14em;
}
.wordmark{font-size:22px;font-weight:600;letter-spacing:.2em}
.topbar-center{text-align:center;opacity:.7}
nav{display:flex;justify-content:flex-end;gap:22px}
nav a{opacity:.78}
nav a:hover{opacity:1}

.hero{
  position:relative;height:100svh;min-height:720px;
  overflow:hidden;color:var(--white);
}
.hero-video{
  position:absolute;inset:0;height:100%;object-fit:cover;
  transform:scale(1.025);
}
.hero-tint{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(4,25,27,.22),rgba(4,25,27,.48));
}
.hero-copy{
  position:absolute;left:4.5vw;right:4.5vw;top:17vh;
}
.kicker,.eyebrow,.index,.work-note,.credit{
  text-transform:uppercase;letter-spacing:.16em;font-size:10px;
}
.hero h1{
  margin:11vh 0 0;font-weight:300;
  font-size:clamp(64px,10.5vw,178px);line-height:.79;letter-spacing:-.06em;
}
.hero h1 span{display:block;margin-left:14vw;font-weight:600}
.hero-note{
  position:absolute;left:4.5vw;right:4.5vw;bottom:40px;
  display:flex;align-items:center;gap:15px;
  font-size:10px;text-transform:uppercase;letter-spacing:.14em;
}
.hero-note i{height:1px;background:rgba(255,255,255,.55);flex:1}
.scroll{
  position:absolute;right:4.5vw;bottom:40px;
  transform:translateY(-28px);font-size:10px;text-transform:uppercase;letter-spacing:.14em;
}

.translation{
  padding:150px 5vw 170px;
  display:grid;grid-template-columns:1fr 3fr;gap:5vw;
  background:var(--areia);
}
.translation-side{display:flex;gap:28px}
.translation-main{max-width:1120px}
.lead{
  font-size:clamp(40px,5.4vw,88px);line-height:.98;
  letter-spacing:-.04em;margin:0 0 16px;font-weight:300;
}
.lead.ghost{color:var(--agua);margin-left:7vw}
.translation-flow{
  display:flex;align-items:center;margin-top:110px;
  font-size:11px;text-transform:uppercase;letter-spacing:.18em;
}
.translation-flow svg{width:120px;height:45px;margin:0 10px;overflow:visible}
.translation-flow path{
  fill:none;stroke:var(--terra);stroke-width:1.2;
  vector-effect:non-scaling-stroke;
}

.principle{
  min-height:100svh;position:relative;overflow:hidden;
  padding:72px 5vw;background:var(--mata);color:var(--white);
}
.principle-top{display:flex;gap:28px;font-size:10px;text-transform:uppercase;letter-spacing:.16em}
.principle h2{
  position:relative;z-index:2;margin:13vh 0 0;
  font-size:clamp(58px,8.7vw,150px);line-height:.84;
  font-weight:300;letter-spacing:-.055em;
}
.principle h2 span{color:var(--serra);margin-left:10vw}
.principle h2.second{text-align:right;margin-top:9vh}
.principle h2.second span{color:var(--pulso);margin-left:0;margin-right:7vw}
.contour{
  position:absolute;border:1px solid rgba(230,224,213,.27);
  border-radius:48% 52% 43% 57% / 61% 40% 60% 39%;
  transform:rotate(-14deg);
}
.contour-a{width:48vw;height:28vw;left:-8vw;bottom:-8vw}
.contour-b{width:40vw;height:22vw;left:-3vw;bottom:-3vw}
.contour-c{width:32vw;height:17vw;left:2vw;bottom:2vw}

.territory{
  display:grid;grid-template-columns:1.16fr .84fr;
  min-height:100svh;background:var(--agua);color:var(--white);
}
.territory-image{position:relative;overflow:hidden;min-height:100vh}
.territory-image img{height:100%;object-fit:cover}
.material-label{
  position:absolute;left:28px;bottom:24px;
  font-size:11px;text-transform:uppercase;letter-spacing:.18em;
}
.territory-copy{
  padding:90px 5vw 70px;display:flex;flex-direction:column;justify-content:center;
}
.territory-copy blockquote{
  margin:12vh 0 18px;
  font-size:clamp(38px,4.6vw,72px);line-height:.98;
  letter-spacing:-.035em;font-weight:300;
}
.credit{opacity:.58;margin-bottom:9vh}
.bodycopy{max-width:500px;font-size:15px;line-height:1.8;opacity:.82}

.materials{
  padding:24px;background:var(--areia);
  display:grid;grid-template-columns:1.18fr .82fr .82fr;gap:12px;
}
.material-card{
  min-height:72vh;position:relative;overflow:hidden;
}
.material-card img{
  position:absolute;inset:0;height:100%;object-fit:cover;
  transition:transform 1.4s cubic-bezier(.2,.7,.2,1);
}
.material-card:hover img{transform:scale(1.045)}
.material-overlay{
  position:absolute;inset:auto 0 0;padding:28px;color:var(--white);
  background:linear-gradient(transparent,rgba(0,0,0,.52));
}
.material-overlay span{font-size:10px;letter-spacing:.15em}
.material-overlay h3{
  margin:10px 0 7px;font-size:38px;font-weight:300;letter-spacing:-.03em;
}
.material-overlay p{margin:0;font-size:11px;text-transform:uppercase;letter-spacing:.11em}
.material-card.abstract{background:var(--serra)}
.topography{position:absolute;inset:0;overflow:hidden}
.ring{
  position:absolute;border:1px solid rgba(243,238,228,.55);
  border-radius:52% 48% 60% 40% / 42% 56% 44% 58%;
  transform:rotate(16deg);
}
.r1{width:86%;height:54%;left:-14%;top:9%}
.r2{width:70%;height:44%;left:-5%;top:15%}
.r3{width:55%;height:34%;left:5%;top:21%}
.r4{width:41%;height:25%;left:13%;top:27%}
.r5{width:25%;height:16%;left:21%;top:32%}
.material-overlay.dark{background:linear-gradient(transparent,rgba(11,41,30,.72))}

.work{padding:150px 5vw;background:var(--areia)}
.work-head{
  display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:38px;
}
.work-head>div{display:flex;gap:28px}
.work-note{opacity:.55}
.project{display:block;margin-bottom:65px}
.project-image{overflow:hidden}
.project-one .project-image{
  height:76vh;
  background:
    linear-gradient(125deg,rgba(11,41,30,.18),rgba(11,41,30,.04)),
    url("assets/agua.png") center/cover;
}
.project-two .project-image{
  height:60vh;background:url("assets/mata.png") center/cover;
}
.project-three .project-image{
  height:60vh;background:url("assets/areia.png") center/cover;
}
.project-meta{
  display:grid;grid-template-columns:60px 1fr auto;
  align-items:end;border-top:1px solid rgba(16,36,29,.3);
  margin-top:12px;padding-top:13px;
}
.project-meta span,.project-meta p{font-size:10px;text-transform:uppercase;letter-spacing:.14em}
.project-meta h3{font-size:24px;font-weight:300;margin:0}
.project-meta p{margin:0;opacity:.55}
.project-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}

.studio{
  padding:150px 5vw;background:var(--terra);color:var(--white);
  display:grid;grid-template-columns:1fr 2.6fr;gap:5vw;
}
.studio-label{display:flex;gap:28px}
.studio-copy h2{
  font-size:clamp(62px,8.2vw,136px);font-weight:300;
  line-height:.84;letter-spacing:-.055em;margin:0 0 65px;
}
.studio-copy p{
  max-width:760px;margin-left:9vw;
  font-size:18px;line-height:1.75;
}

.services{background:var(--terra);color:var(--white);padding:0 5vw 130px}
.service{
  display:grid;grid-template-columns:70px 1fr 1.2fr;gap:30px;
  padding:27px 0;border-top:1px solid rgba(243,238,228,.25);
}
.service span{font-size:10px;opacity:.6}
.service h3{font-size:26px;font-weight:300;margin:0}
.service p{margin:0;opacity:.72;font-size:13px;line-height:1.5}

.contact{
  min-height:96svh;position:relative;overflow:hidden;
  background:var(--pulso);color:var(--white);
  padding:90px 5vw 38px;
  display:flex;flex-direction:column;justify-content:space-between;
}
.contact-water{
  position:absolute;width:52vw;height:52vw;right:-10vw;top:-20vw;
  border:1px solid rgba(255,255,255,.34);
  border-radius:53% 47% 61% 39% / 42% 58% 42% 58%;
}
.contact-water:before,.contact-water:after{
  content:"";position:absolute;inset:8%;border:1px solid rgba(255,255,255,.25);
  border-radius:inherit;
}
.contact-water:after{inset:16%}
.contact h2{
  position:relative;z-index:1;
  font-size:clamp(72px,11vw,180px);line-height:.78;
  font-weight:300;letter-spacing:-.06em;margin:8vh 0;
}
.contact h2 span{display:inline-block;color:var(--mata);font-weight:600}
.mail{
  position:relative;z-index:1;display:flex;justify-content:space-between;
  padding:18px 0;border-bottom:1px solid rgba(255,255,255,.5);
  font-size:clamp(20px,2.6vw,42px);
}
.mail b{font-weight:300}
.contact-foot{display:flex;justify-content:space-between;font-size:10px;text-transform:uppercase;letter-spacing:.15em}
footer{
  background:var(--mata);color:var(--white);padding:22px 5vw;
  display:flex;justify-content:space-between;font-size:9px;
  text-transform:uppercase;letter-spacing:.16em;
}

.reveal{
  opacity:0;transform:translateY(28px);
  transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1);
}
.reveal.visible{opacity:1;transform:none}

@media (max-width:900px){
  .topbar{grid-template-columns:1fr auto;padding:18px 20px}
  .topbar-center{display:none}
  nav{gap:13px}
  nav a:nth-child(2){display:none}
  .hero-copy{left:20px;right:20px}
  .hero h1{font-size:17vw}
  .hero h1 span{margin-left:0}
  .hero-note{left:20px;right:20px}
  .hero-note i{display:none}
  .hero-note span{margin-right:12px}
  .scroll{right:20px}
  .translation{grid-template-columns:1fr;padding:95px 20px 110px}
  .translation-main{margin-top:30px}
  .lead.ghost{margin-left:0}
  .translation-flow{overflow:hidden;margin-top:70px}
  .translation-flow svg{min-width:54px}
  .principle{padding:70px 20px}
  .principle h2{font-size:16vw}
  .territory{grid-template-columns:1fr}
  .territory-image{min-height:65vh}
  .territory-copy{padding:80px 20px}
  .materials{grid-template-columns:1fr;padding:10px}
  .material-card{min-height:72vh}
  .work{padding:100px 20px}
  .work-head{display:block}
  .work-note{margin-top:14px}
  .project-pair{grid-template-columns:1fr}
  .project-one .project-image,.project-two .project-image,.project-three .project-image{height:62vh}
  .project-meta{grid-template-columns:40px 1fr}
  .project-meta p{grid-column:2;margin-top:8px}
  .studio{grid-template-columns:1fr;padding:100px 20px}
  .studio-copy p{margin-left:0}
  .services{padding:0 20px 90px}
  .service{grid-template-columns:36px 1fr}
  .service p{grid-column:2}
  .contact{padding:80px 20px 30px}
  .contact h2{font-size:18vw}
  .mail{font-size:17px}
  footer{padding:20px}
}


/* ---------- SANA logo / scroll morph ---------- */
.svg-wordmark{
  width:74px;height:25px;display:block;
}
.svg-wordmark svg{width:100%;height:100%;overflow:visible}
.svg-wordmark path{fill:currentColor}

.logo-morph-section{
  position:relative;
  height:260vh;
  background:var(--agua);
  color:var(--white);
}
.morph-sticky{
  position:sticky;
  top:0;
  height:100svh;
  min-height:680px;
  overflow:hidden;
  display:grid;
  place-items:center;
}
.morph-sticky:before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.2;
  background:
    radial-gradient(circle at 18% 75%, rgba(230,224,213,.23), transparent 28%),
    radial-gradient(circle at 78% 20%, rgba(132,155,114,.22), transparent 24%);
}
.morph-stage{
  position:relative;
  z-index:2;
  width:min(82vw,1100px);
}
.morph-logo{
  width:100%;
  display:block;
  overflow:visible;
}
.morph-path{
  fill:var(--areia);
  vector-effect:non-scaling-stroke;
}
.morph-caption{
  margin:24px auto 0;
  width:min(440px,70%);
  display:flex;
  align-items:center;
  gap:18px;
  text-transform:uppercase;
  letter-spacing:.17em;
  font-size:9px;
}
.morph-caption i{
  height:1px;
  flex:1;
  background:rgba(243,238,228,.45);
  position:relative;
  overflow:hidden;
}
.morph-caption i:after{
  content:"";
  position:absolute;
  inset:0;
  background:var(--pulso);
  transform:scaleX(var(--morph-progress,0));
  transform-origin:left;
}
.morph-ui{
  position:absolute;
  z-index:4;
  top:84px;
  display:flex;
  gap:20px;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.17em;
}
.morph-ui-left{left:5vw}
.morph-ui-right{right:5vw}
.morph-ui-right #morph-percent{
  min-width:26px;
  color:var(--pulso);
}
.logo-morph-section:after{
  content:"";
  position:absolute;
  width:48vw;height:20vw;
  left:-9vw;bottom:10vh;
  border:1px solid rgba(243,238,228,.18);
  border-radius:58% 42% 53% 47% / 45% 61% 39% 55%;
  transform:rotate(-8deg);
}

/* ---------- water-like cursor ---------- */
#water-cursor{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  z-index:45;
  pointer-events:none;
}
.water-lens{
  position:fixed;
  left:0;top:0;
  width:96px;height:96px;
  border-radius:50%;
  z-index:44;
  pointer-events:none;
  transform:translate(-50%,-50%);
  border:1px solid rgba(230,224,213,.34);
  background:
    radial-gradient(circle at 40% 35%, rgba(255,255,255,.08), transparent 34%),
    radial-gradient(circle, transparent 47%, rgba(255,255,255,.08) 50%, transparent 55%);
  box-shadow:
    inset 0 0 28px rgba(255,255,255,.035),
    0 0 34px rgba(22,83,90,.08);
  opacity:0;
  transition:opacity .25s ease;
  mix-blend-mode:difference;
}
body.cursor-active .water-lens{opacity:1}

@media (pointer:coarse){
  #water-cursor,.water-lens{display:none}
}
@media (max-width:900px){
  .logo-morph-section{height:220vh}
  .morph-stage{width:92vw}
  .morph-ui{top:72px}
  .morph-ui-left{left:20px}
  .morph-ui-right{right:20px}
  .morph-caption{width:76%}
}


/* ---------- v4: refined opening ---------- */
.topbar{color:var(--areia)}
.svg-wordmark{width:88px;height:28px}
.svg-wordmark img{width:100%;height:100%;object-fit:contain;object-position:left center}
.hero{color:var(--areia)}
.hero-copy{top:18vh}
.hero h1{color:var(--areia);margin-top:11vh}
.hero-answer{
  position:absolute;z-index:3;left:4.5vw;right:4.5vw;bottom:38px;
  display:grid;grid-template-columns:1.45fr 1fr;gap:7vw;align-items:end;
  color:var(--areia);border-top:1px solid rgba(230,224,213,.42);padding-top:18px;
}
.answer-words{display:flex;gap:20px;flex-wrap:wrap;font-size:10px;text-transform:uppercase;letter-spacing:.14em}
.answer-words span{opacity:.78}
.hero-answer p{margin:0;font-size:15px;line-height:1.5;text-align:right;letter-spacing:.01em}
@media(max-width:900px){
 .svg-wordmark{width:76px;height:24px}
 .hero-answer{left:20px;right:20px;grid-template-columns:1fr;gap:14px}
 .answer-words{gap:10px 16px}
 .hero-answer p{text-align:left;font-size:13px}
}


/* ---------- v5: interactive answer after the home ---------- */
.answer-experience{
  position:relative;
  height:220vh;
  background:var(--areia);
  color:var(--mata);
}
.answer-sticky{
  position:sticky;
  top:0;
  height:100svh;
  min-height:680px;
  overflow:hidden;
  isolation:isolate;
}
.answer-sticky:before,
.answer-sticky:after{
  content:"";
  position:absolute;
  border:1px solid rgba(22,83,90,.14);
  border-radius:54% 46% 61% 39% / 41% 60% 40% 59%;
  pointer-events:none;
}
.answer-sticky:before{
  width:52vw;height:30vw;left:-17vw;bottom:-8vw;transform:rotate(-12deg);
}
.answer-sticky:after{
  width:35vw;height:20vw;right:-12vw;top:-5vw;transform:rotate(19deg);
}
.answer-meta{
  position:absolute;
  z-index:6;
  left:4.5vw;right:4.5vw;top:84px;
  display:flex;justify-content:space-between;
  font-size:9px;text-transform:uppercase;letter-spacing:.17em;
  color:rgba(11,41,30,.58);
}
.answer-lines{
  position:absolute;inset:0;width:100%;height:100%;
  overflow:visible;pointer-events:none;z-index:2;
}
.answer-line{
  fill:none;
  stroke:rgba(22,83,90,.35);
  stroke-width:1;
  vector-effect:non-scaling-stroke;
}
.thought{
  --mx:0px;
  --my:0px;
  --scroll-x:0px;
  --scroll-y:0px;
  position:absolute;
  z-index:5;
  border:0;
  padding:0;
  color:var(--mata);
  background:transparent;
  font:inherit;
  cursor:pointer;
  text-align:left;
  transform:
    translate(var(--scroll-x),var(--scroll-y))
    translate(var(--mx),var(--my));
  transition:color .25s ease;
}
.thought:before{
  content:"";
  position:absolute;
  width:9px;height:9px;border-radius:50%;
  background:var(--pulso);
  left:-19px;top:50%;transform:translateY(-50%) scale(.65);
  transition:transform .3s ease, background .3s ease;
}
.thought:hover:before,
.thought.is-active:before{
  transform:translateY(-50%) scale(1.55);
  background:var(--agua);
}
.thought-index{
  display:block;
  margin-bottom:8px;
  font-size:8px;letter-spacing:.16em;
  color:rgba(11,41,30,.42);
}
.thought-label{
  display:block;
  font-size:clamp(22px,2.4vw,40px);
  font-weight:300;letter-spacing:-.035em;
  white-space:nowrap;
}
.thought-intencao{left:11vw;top:27vh}
.thought-historia{right:11vw;top:24vh}
.thought-memoria{left:14vw;bottom:22vh}
.thought-sentimento{right:10vw;bottom:25vh}

.translation-core{
  --core-scale:.86;
  --core-opacity:.28;
  position:absolute;
  z-index:4;
  left:50%;top:50%;
  width:min(41vw,620px);
  aspect-ratio:1.42;
  transform:translate(-50%,-50%) scale(var(--core-scale));
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;
  opacity:var(--core-opacity);
  transition:opacity .15s linear;
}
.translation-core:before{
  content:"";
  position:absolute;
  inset:8%;
  border:1px solid rgba(22,83,90,.22);
  border-radius:52% 48% 44% 56% / 58% 43% 57% 42%;
  transform:rotate(-6deg);
}
.core-rings{position:absolute;inset:0;pointer-events:none}
.core-rings i{
  position:absolute;inset:6%;
  border:1px solid rgba(132,155,114,.34);
  border-radius:58% 42% 54% 46% / 43% 59% 41% 57%;
}
.core-rings i:nth-child(2){inset:14%;transform:rotate(9deg)}
.core-rings i:nth-child(3){inset:23%;transform:rotate(-8deg)}
.core-small{
  position:relative;z-index:2;
  margin:0 0 16px;
  font-size:9px;text-transform:uppercase;letter-spacing:.18em;
}
.translation-core h2{
  position:relative;z-index:2;
  margin:0;
  font-size:clamp(45px,6vw,94px);
  line-height:.82;
  font-weight:300;
  letter-spacing:-.055em;
}
.translation-core h2 strong{
  color:var(--agua);
  font-weight:600;
}
.answer-instruction{
  position:absolute;z-index:5;
  left:4.5vw;bottom:34px;
  margin:0;font-size:10px;line-height:1.55;
  text-transform:uppercase;letter-spacing:.13em;
  color:rgba(11,41,30,.48);
}
.answer-experience.is-resolved .thought{
  color:rgba(11,41,30,.42);
}
.answer-experience.is-resolved .translation-core{
  --core-opacity:1;
}
.answer-experience.is-resolved .core-rings i{
  animation:answerPulse 3.8s ease-in-out infinite alternate;
}
@keyframes answerPulse{
  from{transform:scale(.98) rotate(-3deg)}
  to{transform:scale(1.03) rotate(4deg)}
}

@media(max-width:900px){
  .answer-experience{height:190vh}
  .answer-meta{left:20px;right:20px;top:72px}
  .answer-meta span:last-child{display:none}
  .thought-label{font-size:22px}
  .thought-intencao{left:9vw;top:23vh}
  .thought-historia{right:8vw;top:31vh}
  .thought-memoria{left:10vw;bottom:29vh}
  .thought-sentimento{right:8vw;bottom:19vh}
  .translation-core{width:82vw}
  .translation-core h2{font-size:14vw}
  .answer-instruction{left:20px;bottom:24px}
}


/* ---------- v6: home text white ---------- */
.hero,
.hero .hero-copy,
.hero .hero-note,
.hero .topbar,
.hero h1,
.hero .kicker,
.hero .scroll{
  color:#fff !important;
}

/* ---------- v6: scroll journey ---------- */
.journey{
  position:relative;
  height:320vh;
  background:var(--mata);
  color:#fff;
}
.journey-sticky{
  position:sticky;
  top:0;
  height:100svh;
  min-height:700px;
  overflow:hidden;
  background:
    radial-gradient(circle at 20% 16%, rgba(132,155,114,.09), transparent 27%),
    radial-gradient(circle at 78% 74%, rgba(22,83,90,.12), transparent 30%),
    var(--mata);
}
.journey-meta{
  position:absolute;
  z-index:8;
  top:78px;
  left:4.5vw;
  right:4.5vw;
  display:flex;
  justify-content:space-between;
  color:rgba(255,255,255,.62);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.18em;
}
.journey-path{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:1;
  overflow:visible;
}
.journey-path-base,
.journey-path-progress{
  fill:none;
  vector-effect:non-scaling-stroke;
}
.journey-path-base{
  stroke:rgba(255,255,255,.15);
  stroke-width:2;
  stroke-dasharray:4 10;
}
.journey-path-progress{
  stroke:var(--areia);
  stroke-width:2;
  stroke-linecap:round;
  stroke-dasharray:1;
  stroke-dashoffset:1;
  pathLength:1;
}
.journey-marker{
  position:absolute;
  z-index:5;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 0 9px rgba(255,255,255,.08);
  left:90px;
  top:820px;
  transform:translate(-50%,-50%);
}
.journey-dot{
  position:absolute;
  z-index:4;
  width:18px;
  height:18px;
  border-radius:50%;
  background:rgba(255,255,255,.22);
  border:1px solid rgba(255,255,255,.65);
  transform:translate(-50%,-50%);
  transition:background .25s ease, transform .25s ease;
}
.journey-dot.active{
  background:#fff;
  transform:translate(-50%,-50%) scale(1.12);
}
.dot-1{left:6%;top:86%}
.dot-2{left:27%;top:73%}
.dot-3{left:55%;top:35%}
.dot-4{left:75%;top:21%}
.dot-5{left:93%;top:45%}
.journey-step{
  position:absolute;
  z-index:6;
  width:min(360px,28vw);
  opacity:.18;
  transform:translateY(18px);
  transition:opacity .35s ease, transform .35s ease;
}
.journey-step.active{
  opacity:1;
  transform:none;
}
.journey-step .step-index{
  display:block;
  margin-bottom:10px;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.17em;
  color:rgba(255,255,255,.45);
}
.journey-step h2{
  margin:0 0 10px;
  font-size:clamp(30px,3.4vw,54px);
  line-height:.95;
  font-weight:300;
  letter-spacing:-.035em;
}
.journey-step p{
  margin:0;
  max-width:320px;
  color:rgba(255,255,255,.7);
  font-size:12px;
  line-height:1.65;
}
.step-1{left:9%;bottom:7%}
.step-2{left:30%;bottom:24%}
.step-3{left:57%;top:21%}
.step-4{left:74%;top:8%}
.step-5{
  right:4.5%;
  top:48%;
  width:min(460px,32vw);
}
.final-step h2{
  color:var(--areia);
  font-weight:600;
}
.final-step p{
  color:rgba(255,255,255,.74);
}
.journey:before,
.journey:after{
  content:"";
  position:absolute;
  border:1px solid rgba(255,255,255,.08);
  border-radius:55% 45% 62% 38% / 41% 59% 43% 57%;
  pointer-events:none;
}
.journey:before{
  width:36vw;height:22vw;
  left:-9vw;bottom:4vh;
  transform:rotate(-11deg);
}
.journey:after{
  width:28vw;height:16vw;
  right:-7vw;top:8vh;
  transform:rotate(15deg);
}

@media(max-width:900px){
  .journey{height:280vh}
  .journey-meta{left:20px;right:20px;top:70px}
  .journey-meta span:last-child{display:none}
  .journey-step{
    width:min(260px,68vw);
  }
  .step-1{left:8%;bottom:8%}
  .step-2{left:22%;bottom:28%}
  .step-3{left:50%;top:29%}
  .step-4{left:58%;top:10%}
  .step-5{
    right:6%;
    top:51%;
    width:min(300px,72vw);
  }
  .journey-step h2{font-size:30px}
  .journey-step p{font-size:11px}
  .dot-1{left:7%;top:85%}
  .dot-2{left:28%;top:72%}
  .dot-3{left:56%;top:36%}
  .dot-4{left:76%;top:22%}
  .dot-5{left:92%;top:45%}
}


/* ---------- v7: percurso refinado ---------- */

/* Linha visualmente atrás dos textos e com mais respiro */
.journey-path{
  z-index:1;
}
.journey-step{
  z-index:7;
  padding:14px 18px;
  border-radius:18px;
  background:rgba(11,41,30,.88);
  box-shadow:0 10px 30px rgba(0,0,0,.10);
  backdrop-filter:blur(2px);
}

/* Todos os blocos passam a usar a mesma largura e ritmo */
.journey-step{
  width:320px;
}
.journey-step h2{
  font-size:38px;
  line-height:1;
  margin-bottom:12px;
}
.journey-step p{
  max-width:280px;
  font-size:12px;
  line-height:1.6;
}

/* Reposicionamento para a linha não atravessar os textos */
.step-1{left:8%;bottom:7%}
.step-2{left:27%;bottom:22%}
.step-3{left:55%;top:27%}
.step-4{left:72%;top:7%}

/* Último estágio maior e com mais destaque */
.step-5{
  right:4.5%;
  top:50%;
  width:min(560px,36vw);
  padding:22px 24px 24px;
  background:rgba(11,41,30,.94);
  border:1px solid rgba(230,224,213,.15);
}
.final-step h2{
  font-size:clamp(48px,5.2vw,84px);
  line-height:.9;
  color:var(--areia);
  font-weight:600;
  letter-spacing:-.045em;
}
.final-step p{
  max-width:500px;
  font-size:13px;
  line-height:1.65;
  color:rgba(255,255,255,.82);
}
.final-dot{
  width:24px;
  height:24px;
}
.final-dot.active{
  box-shadow:
    0 0 0 10px rgba(255,255,255,.08),
    0 0 0 22px rgba(209,118,147,.07);
}

/* Estados de entrada mais claros */
.journey-step{
  opacity:0;
  visibility:hidden;
  transform:translateY(26px);
  transition:
    opacity .45s ease,
    transform .45s cubic-bezier(.2,.7,.2,1),
    visibility .45s;
}
.journey-step.is-revealed{
  opacity:.38;
  visibility:visible;
  transform:none;
}
.journey-step.active{
  opacity:1;
  visibility:visible;
  transform:none;
}
.journey-step.is-complete{
  opacity:.55;
  visibility:visible;
  transform:none;
}

/* Próximo ponto também não aparece antes da hora */
.journey-dot{
  opacity:0;
  visibility:hidden;
  transition:
    opacity .3s ease,
    visibility .3s,
    background .25s ease,
    transform .25s ease;
}
.journey-dot.is-revealed{
  opacity:.5;
  visibility:visible;
}
.journey-dot.active{
  opacity:1;
  visibility:visible;
}

/* Marcador fica acima da linha, mas abaixo dos textos */
.journey-marker{z-index:5}

/* Mobile */
@media(max-width:900px){
  .journey-step{
    width:min(280px,76vw);
    padding:12px 14px;
  }
  .journey-step h2{font-size:30px}
  .journey-step p{font-size:11px}
  .step-1{left:7%;bottom:8%}
  .step-2{left:20%;bottom:27%}
  .step-3{left:43%;top:31%}
  .step-4{left:52%;top:10%}
  .step-5{
    right:5%;
    top:52%;
    width:min(330px,82vw);
    padding:18px;
  }
  .final-step h2{font-size:42px}
}


/* ==========================================================
   v8 — percurso refinado com vídeo ao fundo
   ========================================================== */

.journey-v8{
  position:relative;
  height:340vh;
  background:var(--mata);
  color:var(--areia);
}

.journey-v8 .journey-sticky{
  position:sticky;
  top:0;
  height:100svh;
  min-height:720px;
  overflow:hidden;
  isolation:isolate;
  background:var(--mata);
}

.journey-bg-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
  filter:saturate(.78) contrast(.98) brightness(.72);
  transform:scale(1.03);
}

.journey-video-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(180deg, rgba(7,31,23,.76), rgba(7,31,23,.82)),
    radial-gradient(circle at 50% 52%, rgba(11,41,30,.30), rgba(11,41,30,.76) 74%);
  pointer-events:none;
}

.journey-v8 .journey-meta{
  position:absolute;
  top:78px;
  left:4.5vw;
  right:4.5vw;
  z-index:10;
  display:flex;
  justify-content:space-between;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:rgba(243,238,228,.62);
}

/* The path owns the middle lane. Text never enters this lane. */
.journey-v8 .journey-path{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:3;
  pointer-events:none;
}

.journey-v8 .journey-path-base,
.journey-v8 .journey-path-progress{
  fill:none;
  vector-effect:non-scaling-stroke;
}

.journey-v8 .journey-path-base{
  stroke:rgba(243,238,228,.16);
  stroke-width:1.25;
  stroke-dasharray:3 10;
}

.journey-v8 .journey-path-progress{
  stroke:var(--areia);
  stroke-width:1.7;
  stroke-linecap:round;
  pathLength:1;
  stroke-dasharray:1;
  stroke-dashoffset:1;
}

.journey-v8 .journey-marker{
  position:absolute;
  z-index:6;
  width:14px;
  height:14px;
  border-radius:50%;
  background:#fff;
  box-shadow:
    0 0 0 7px rgba(255,255,255,.07),
    0 0 26px rgba(255,255,255,.14);
  transform:translate(-50%,-50%);
}

/* Nodes sit on the path. */
.journey-node{
  position:absolute;
  z-index:5;
  width:14px;
  height:14px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  border:1px solid rgba(243,238,228,.62);
  background:rgba(243,238,228,.08);
  opacity:0;
  visibility:hidden;
  transition:
    opacity .35s ease,
    visibility .35s,
    transform .35s ease,
    background .35s ease;
}

.journey-node.is-revealed{
  opacity:.55;
  visibility:visible;
}

.journey-node.active{
  opacity:1;
  visibility:visible;
  background:#fff;
  transform:translate(-50%,-50%) scale(1.15);
}

.final-node.active{
  box-shadow:
    0 0 0 10px rgba(255,255,255,.06),
    0 0 0 24px rgba(209,118,147,.055);
}

/* Approximate points along the central path */
.node-1{left:50%;top:91%}
.node-2{left:47.5%;top:69%}
.node-3{left:53.1%;top:49.5%}
.node-4{left:47.2%;top:28%}
.node-5{left:55.3%;top:8.5%}

/* Text is deliberately kept in two columns outside the path lane. */
.journey-v8 .journey-step{
  position:absolute;
  z-index:8;
  width:min(410px,30vw);
  padding:0;
  margin:0;
  background:none;
  box-shadow:none;
  backdrop-filter:none;
  border-radius:0;

  opacity:0;
  visibility:hidden;
  transform:translateY(24px);
  transition:
    opacity .5s ease,
    transform .5s cubic-bezier(.2,.7,.2,1),
    visibility .5s;
}

.journey-v8 .journey-step.is-revealed{
  opacity:.34;
  visibility:visible;
  transform:none;
}

.journey-v8 .journey-step.active{
  opacity:1;
  visibility:visible;
  transform:none;
}

.journey-v8 .journey-step.is-complete{
  opacity:.50;
  visibility:visible;
  transform:none;
}

.journey-v8 .journey-step .step-index{
  display:block;
  margin-bottom:10px;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.17em;
  color:rgba(243,238,228,.46);
}

.journey-v8 .journey-step h2{
  margin:0 0 11px;
  font-size:clamp(31px,3.1vw,50px);
  line-height:.98;
  font-weight:300;
  letter-spacing:-.035em;
  color:var(--areia);
}

.journey-v8 .journey-step p{
  margin:0;
  max-width:320px;
  font-size:12px;
  line-height:1.65;
  color:rgba(243,238,228,.70);
}

/* Alternating editorial rhythm, keeping a large empty corridor in the middle. */
.journey-v8 .step-1{
  left:8vw;
  bottom:8vh;
}

.journey-v8 .step-2{
  right:7vw;
  bottom:28vh;
}

.journey-v8 .step-3{
  left:8vw;
  top:42vh;
}

.journey-v8 .step-4{
  right:7vw;
  top:20vh;
}

/* Final statement is the destination and gets the strongest hierarchy. */
.journey-v8 .step-5{
  left:7vw;
  top:10vh;
  width:min(620px,38vw);
}

.journey-v8 .final-step h2{
  font-size:clamp(52px,5.8vw,94px);
  line-height:.86;
  font-weight:600;
  letter-spacing:-.05em;
  color:#fff;
}

.journey-v8 .final-step p{
  max-width:500px;
  font-size:13px;
  line-height:1.7;
  color:rgba(243,238,228,.78);
}

/* Small rule visually connects text to the route without crossing the copy. */
.journey-v8 .journey-step:after{
  content:"";
  position:absolute;
  top:34px;
  width:52px;
  height:1px;
  background:rgba(243,238,228,.28);
}

.journey-v8 .side-left:after{
  left:calc(100% + 24px);
}

.journey-v8 .side-right:after{
  right:calc(100% + 24px);
}

.journey-v8 .final-step:after{
  width:76px;
  background:rgba(243,238,228,.42);
}

/* Mobile becomes a cleaner vertical journey. */
@media(max-width:900px){
  .journey-v8{height:300vh}

  .journey-v8 .journey-meta{
    left:20px;
    right:20px;
    top:70px;
  }

  .journey-v8 .journey-meta span:last-child{display:none}

  .journey-v8 .journey-path{
    left:-29%;
    width:158%;
  }

  .journey-v8 .journey-step{
    width:min(290px,72vw);
  }

  .journey-v8 .step-1{
    left:7vw;
    bottom:8vh;
  }

  .journey-v8 .step-2{
    right:6vw;
    bottom:29vh;
  }

  .journey-v8 .step-3{
    left:7vw;
    top:43vh;
  }

  .journey-v8 .step-4{
    right:6vw;
    top:21vh;
  }

  .journey-v8 .step-5{
    left:7vw;
    top:9vh;
    width:min(330px,82vw);
  }

  .journey-v8 .journey-step h2{font-size:30px}
  .journey-v8 .final-step h2{font-size:44px}
  .journey-v8 .journey-step p{font-size:11px}

  .journey-v8 .journey-step:after{display:none}
}


/* ==========================================================
   v9 — percurso vertical, fundo #0f271d e composição refinada
   ========================================================== */

.journey-v9{
  position:relative;
  height:370vh;
  background:#0f271d;
  color:var(--areia);
}

.journey-v9 .journey-sticky{
  position:sticky;
  top:0;
  height:100svh;
  min-height:720px;
  overflow:hidden;
  isolation:isolate;
  background:#0f271d;
}

/* O vídeo permanece, mas sem textura artificial, apenas com cor sólida sobre ele */
.journey-v9 .journey-bg-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
  filter:none;
  opacity:.32;
  transform:scale(1.02);
}

.journey-v9 .journey-video-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(15,39,29,.76);
  pointer-events:none;
}

.journey-v9 .journey-meta{
  position:absolute;
  top:78px;
  left:4.5vw;
  right:4.5vw;
  z-index:10;
  display:flex;
  justify-content:space-between;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:rgba(243,238,228,.64);
}

/* Percurso claramente de cima para baixo */
.journey-v9 .journey-path{
  position:absolute;
  top:9vh;
  left:50%;
  width:min(44vw,720px);
  height:82vh;
  transform:translateX(-50%);
  z-index:3;
  pointer-events:none;
  overflow:visible;
}

.journey-v9 .journey-path-base,
.journey-v9 .journey-path-progress{
  fill:none;
  vector-effect:non-scaling-stroke;
}

.journey-v9 .journey-path-base{
  stroke:rgba(243,238,228,.17);
  stroke-width:1.4;
  stroke-dasharray:3 11;
}

.journey-v9 .journey-path-progress{
  stroke:var(--areia);
  stroke-width:1.8;
  stroke-linecap:round;
  pathLength:1;
  stroke-dasharray:1;
  stroke-dashoffset:1;
}

.journey-v9 .journey-marker{
  position:absolute;
  z-index:6;
  width:14px;
  height:14px;
  border-radius:50%;
  background:#fff;
  box-shadow:
    0 0 0 7px rgba(255,255,255,.06),
    0 0 24px rgba(255,255,255,.12);
  transform:translate(-50%,-50%);
}

.journey-v9 .journey-node{
  position:absolute;
  z-index:5;
  width:13px;
  height:13px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  border:1px solid rgba(243,238,228,.66);
  background:rgba(243,238,228,.08);
  opacity:0;
  visibility:hidden;
  transition:
    opacity .35s ease,
    visibility .35s,
    transform .35s ease,
    background .35s ease;
}

.journey-v9 .journey-node.is-revealed{
  opacity:.55;
  visibility:visible;
}

.journey-v9 .journey-node.active{
  opacity:1;
  visibility:visible;
  background:#fff;
  transform:translate(-50%,-50%) scale(1.15);
}

.journey-v9 .final-node.active{
  box-shadow:
    0 0 0 10px rgba(255,255,255,.06),
    0 0 0 22px rgba(209,118,147,.055);
}

/* Nodes alinhados verticalmente ao percurso */
.journey-v9 .node-1{left:50%;top:16%}
.journey-v9 .node-2{left:50%;top:33%}
.journey-v9 .node-3{left:50%;top:50%}
.journey-v9 .node-4{left:50%;top:67%}
.journey-v9 .node-5{left:50%;top:84%}

/* Dois de um lado e dois do outro, com ritmo simétrico */
.journey-v9 .journey-step{
  position:absolute;
  z-index:8;
  width:min(360px,28vw);
  padding:0;
  margin:0;
  background:none;
  box-shadow:none;
  backdrop-filter:none;
  border-radius:0;

  opacity:0;
  visibility:hidden;
  transform:translateY(18px);
  transition:
    opacity .5s ease,
    transform .5s cubic-bezier(.2,.7,.2,1),
    visibility .5s;
}

.journey-v9 .journey-step.is-revealed{
  opacity:.34;
  visibility:visible;
  transform:none;
}

.journey-v9 .journey-step.active{
  opacity:1;
  visibility:visible;
  transform:none;
}

.journey-v9 .journey-step.is-complete{
  opacity:.48;
  visibility:visible;
  transform:none;
}

.journey-v9 .journey-step .step-index{
  display:block;
  margin-bottom:9px;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.17em;
  color:rgba(243,238,228,.46);
}

.journey-v9 .journey-step h2{
  margin:0 0 10px;
  font-size:clamp(32px,3vw,48px);
  line-height:.98;
  font-weight:300;
  letter-spacing:-.035em;
  color:var(--areia);
}

.journey-v9 .journey-step p{
  margin:0;
  max-width:310px;
  font-size:12px;
  line-height:1.65;
  color:rgba(243,238,228,.72);
}

/* Posicionamento vertical refinado */
.journey-v9 .step-1{
  left:8vw;
  top:17vh;
}

.journey-v9 .step-2{
  right:8vw;
  top:34vh;
}

.journey-v9 .step-3{
  left:8vw;
  top:51vh;
}

.journey-v9 .step-4{
  right:8vw;
  top:68vh;
}

/* Frase final centralizada embaixo de tudo */
.journey-v9 .step-5{
  left:50%;
  top:auto;
  bottom:4.5vh;
  transform:translate(-50%,18px);
  width:min(900px,72vw);
  text-align:center;
}

.journey-v9 .step-5.is-revealed,
.journey-v9 .step-5.active,
.journey-v9 .step-5.is-complete{
  transform:translate(-50%,0);
}

.journey-v9 .final-step h2{
  margin:0 auto 14px;
  max-width:900px;
  font-size:clamp(54px,6vw,96px);
  line-height:.88;
  font-weight:600;
  letter-spacing:-.05em;
  color:#fff;
}

.journey-v9 .final-step p{
  margin:0 auto;
  max-width:620px;
  font-size:13px;
  line-height:1.7;
  color:rgba(243,238,228,.80);
}

/* Pequenos conectores laterais sem atravessar o texto */
.journey-v9 .journey-step:not(.final-step):after{
  content:"";
  position:absolute;
  top:34px;
  width:56px;
  height:1px;
  background:rgba(243,238,228,.24);
}

.journey-v9 .side-left:after{
  left:calc(100% + 22px);
}

.journey-v9 .side-right:after{
  right:calc(100% + 22px);
}

/* Mobile: caminho central e textos alternados sem colisão */
@media(max-width:900px){
  .journey-v9{height:320vh}

  .journey-v9 .journey-meta{
    left:20px;
    right:20px;
    top:70px;
  }

  .journey-v9 .journey-meta span:last-child{display:none}

  .journey-v9 .journey-path{
    width:72vw;
    height:80vh;
    top:10vh;
  }

  .journey-v9 .journey-step{
    width:min(280px,68vw);
  }

  .journey-v9 .step-1{left:6vw;top:18vh}
  .journey-v9 .step-2{right:6vw;top:35vh}
  .journey-v9 .step-3{left:6vw;top:52vh}
  .journey-v9 .step-4{right:6vw;top:69vh}

  .journey-v9 .step-5{
    width:min(360px,86vw);
    bottom:4vh;
  }

  .journey-v9 .journey-step h2{font-size:29px}
  .journey-v9 .final-step h2{font-size:43px}
  .journey-v9 .journey-step p{font-size:11px}

  .journey-v9 .journey-step:not(.final-step):after{display:none}
}


/* v10 — percurso alinhado */
.journey-v10{position:relative;height:430vh;background:#0f271d;color:var(--areia)}
.journey-v10 .journey-sticky{position:sticky;top:0;height:100svh;min-height:740px;overflow:hidden;isolation:isolate;background:#0f271d}
.journey-v10 .journey-bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:.30;filter:none;transform:scale(1.015)}
.journey-v10 .journey-video-overlay{position:absolute;inset:0;z-index:1;background:rgba(15,39,29,.77);pointer-events:none}
.journey-v10 .journey-meta{position:absolute;top:78px;left:4.5vw;right:4.5vw;z-index:10;display:flex;justify-content:space-between;font-size:9px;text-transform:uppercase;letter-spacing:.18em;color:rgba(243,238,228,.62)}
.journey-v10 .journey-path{position:absolute;top:7vh;left:50%;width:min(40vw,650px);height:78vh;transform:translateX(-50%);z-index:3;pointer-events:none;overflow:visible}
.journey-v10 .journey-path-base,.journey-v10 .journey-path-progress{fill:none;vector-effect:non-scaling-stroke}
.journey-v10 .journey-path-base{stroke:rgba(243,238,228,.16);stroke-width:1.35;stroke-dasharray:3 11}
.journey-v10 .journey-path-progress{stroke:var(--areia);stroke-width:1.8;stroke-linecap:round;pathLength:1;stroke-dasharray:1;stroke-dashoffset:1}
.journey-v10 .journey-marker{position:absolute;z-index:6;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 0 0 7px rgba(255,255,255,.06),0 0 24px rgba(255,255,255,.12);transform:translate(-50%,-50%)}
.journey-v10 .journey-node{position:absolute;z-index:5;width:13px;height:13px;border-radius:50%;transform:translate(-50%,-50%);border:1px solid rgba(243,238,228,.66);background:rgba(243,238,228,.08);opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s,transform .35s ease,background .35s ease}
.journey-v10 .journey-node.is-revealed{opacity:.55;visibility:visible}
.journey-v10 .journey-node.active{opacity:1;visibility:visible;background:#fff;transform:translate(-50%,-50%) scale(1.15)}
.journey-v10 .final-node.active{box-shadow:0 0 0 10px rgba(255,255,255,.06),0 0 0 22px rgba(209,118,147,.055)}
.journey-v10 .journey-step{position:absolute;z-index:8;width:min(360px,28vw);padding:0;margin:0;background:none;box-shadow:none;backdrop-filter:none;border-radius:0;opacity:0;visibility:hidden;transform:translateY(18px);transition:opacity .5s ease,transform .5s cubic-bezier(.2,.7,.2,1),visibility .5s}
.journey-v10 .journey-step.is-revealed{opacity:.34;visibility:visible;transform:none}
.journey-v10 .journey-step.active{opacity:1;visibility:visible;transform:none}
.journey-v10 .journey-step.is-complete{opacity:.48;visibility:visible;transform:none}
.journey-v10 .journey-step .step-index{display:block;margin-bottom:9px;font-size:8px;text-transform:uppercase;letter-spacing:.17em;color:rgba(243,238,228,.46)}
.journey-v10 .journey-step h2{margin:0 0 10px;font-size:clamp(32px,3vw,48px);line-height:.98;font-weight:300;letter-spacing:-.035em;color:var(--areia)}
.journey-v10 .journey-step p{margin:0;max-width:310px;font-size:12px;line-height:1.65;color:rgba(243,238,228,.72)}
.journey-v10 .step-1{left:8vw;top:14vh}
.journey-v10 .step-2{right:8vw;top:29vh}
.journey-v10 .step-3{left:8vw;top:44vh}
.journey-v10 .step-4{right:8vw;top:59vh}
.journey-v10 .step-5{left:50%;bottom:2.5vh;width:min(980px,76vw);text-align:center;transform:translate(-50%,18px)}
.journey-v10 .step-5.is-revealed,.journey-v10 .step-5.active,.journey-v10 .step-5.is-complete{transform:translate(-50%,0)}
.journey-v10 .final-step h2{margin:0 auto 16px;max-width:980px;font-size:clamp(60px,6.6vw,108px);line-height:.86;font-weight:600;letter-spacing:-.052em;color:#fff}
.journey-v10 .final-step p{margin:0 auto;max-width:650px;font-size:13px;line-height:1.7;color:rgba(243,238,228,.80)}
.journey-v10 .journey-step:not(.final-step):after{content:"";position:absolute;top:34px;width:48px;height:1px;background:rgba(243,238,228,.22)}
.journey-v10 .side-left:after{left:calc(100% + 20px)}
.journey-v10 .side-right:after{right:calc(100% + 20px)}
@media(max-width:900px){
  .journey-v10{height:360vh}
  .journey-v10 .journey-meta{left:20px;right:20px;top:70px}
  .journey-v10 .journey-meta span:last-child{display:none}
  .journey-v10 .journey-path{width:70vw;height:76vh;top:8vh}
  .journey-v10 .journey-step{width:min(280px,68vw)}
  .journey-v10 .step-1{left:6vw;top:15vh}
  .journey-v10 .step-2{right:6vw;top:30vh}
  .journey-v10 .step-3{left:6vw;top:45vh}
  .journey-v10 .step-4{right:6vw;top:60vh}
  .journey-v10 .step-5{width:min(390px,88vw);bottom:2vh}
  .journey-v10 .journey-step h2{font-size:29px}
  .journey-v10 .final-step h2{font-size:46px}
  .journey-v10 .journey-step p{font-size:11px}
  .journey-v10 .journey-step:not(.final-step):after{display:none}
}


/* ==========================================================
   v11 — CORREÇÃO DE COMPOSIÇÃO DO TEXTO
   Mantém linha e bolinhas da v10; corrige apenas os blocos.
   ========================================================== */

.journey-v10 .journey-step{
  width:clamp(260px,24vw,390px) !important;
}

/* Quatro conceitos: duas colunas fixas, afastadas da linha */
.journey-v10 .step-1{
  left:7vw !important;
  right:auto !important;
  top:17vh !important;
  bottom:auto !important;
  text-align:left !important;
}
.journey-v10 .step-2{
  right:7vw !important;
  left:auto !important;
  top:31vh !important;
  bottom:auto !important;
  text-align:left !important;
}
.journey-v10 .step-3{
  left:7vw !important;
  right:auto !important;
  top:46vh !important;
  bottom:auto !important;
  text-align:left !important;
}
.journey-v10 .step-4{
  right:7vw !important;
  left:auto !important;
  top:60vh !important;
  bottom:auto !important;
  text-align:left !important;
}

/* Tipografia mais editorial e uniforme */
.journey-v10 .journey-step:not(.final-step) h2{
  font-size:clamp(30px,2.65vw,46px) !important;
  line-height:.98 !important;
  margin:0 0 10px !important;
}
.journey-v10 .journey-step:not(.final-step) p{
  max-width:300px !important;
  font-size:11px !important;
  line-height:1.55 !important;
}

/* Removemos os risquinhos laterais: estavam criando ruído visual */
.journey-v10 .journey-step:not(.final-step):after{
  display:none !important;
}

/* A resposta final fica realmente DEPOIS do percurso, no rodapé visual */
.journey-v10 .step-5{
  left:50% !important;
  right:auto !important;
  top:76vh !important;
  bottom:auto !important;
  width:min(900px,74vw) !important;
  text-align:center !important;
  transform:translate(-50%,24px) !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}

.journey-v10 .step-5.is-revealed,
.journey-v10 .step-5.active,
.journey-v10 .step-5.is-complete{
  transform:translate(-50%,0) !important;
}

.journey-v10 .final-step h2{
  max-width:900px !important;
  margin:0 auto 15px !important;
  font-size:clamp(48px,5vw,82px) !important;
  line-height:.9 !important;
  letter-spacing:-.045em !important;
  font-weight:500 !important;
}

.journey-v10 .final-step p{
  max-width:620px !important;
  margin:0 auto !important;
  font-size:12px !important;
  line-height:1.6 !important;
}

/* Garante que a linha termine antes da frase final */
.journey-v10 .journey-path{
  top:8vh !important;
  height:66vh !important;
}

/* O último nó fica no fim da linha, acima da frase, não no meio dela. */
.journey-v10 .final-node{
  z-index:7 !important;
}

@media(max-width:900px){
  .journey-v10 .step-1{left:5vw !important;top:16vh !important}
  .journey-v10 .step-2{right:5vw !important;top:31vh !important}
  .journey-v10 .step-3{left:5vw !important;top:46vh !important}
  .journey-v10 .step-4{right:5vw !important;top:61vh !important}
  .journey-v10 .step-5{
    top:78vh !important;
    width:88vw !important;
  }
  .journey-v10 .final-step h2{
    font-size:clamp(38px,10vw,52px) !important;
  }
}


/* ==========================================================
   v12 — acabamento do percurso
   ========================================================== */

/* Depois que um conceito foi percorrido, ele permanece vivo.
   Ao voltar o scroll, a lógica de revelação original continua funcionando. */
.journey-v10 .journey-step.is-complete{
  opacity:1 !important;
  visibility:visible !important;
}

.journey-v10 .journey-step.is-complete .step-index,
.journey-v10 .journey-step.active .step-index{
  color:rgba(243,238,228,.78) !important;
}

.journey-v10 .journey-step.is-complete h2,
.journey-v10 .journey-step.active h2{
  color:var(--areia) !important;
}

.journey-v10 .journey-step.is-complete p,
.journey-v10 .journey-step.active p{
  color:rgba(243,238,228,.86) !important;
}

/* Resposta final sem índice e sem subtítulo. */
.journey-v10 .final-step{
  width:min(980px,80vw) !important;
}

.journey-v10 .final-step h2{
  max-width:980px !important;
  margin:0 auto !important;
  font-size:clamp(52px,5.5vw,90px) !important;
  line-height:.92 !important;
  text-align:center !important;
  white-space:normal !important;
}

/* Quando todo o percurso chega ao final, os quatro conceitos ficam
   simultaneamente em intensidade máxima. */
.journey-v10.journey-finished .journey-step:not(.final-step){
  opacity:1 !important;
  visibility:visible !important;
}
.journey-v10.journey-finished .journey-step:not(.final-step) .step-index{
  color:rgba(243,238,228,.78) !important;
}
.journey-v10.journey-finished .journey-step:not(.final-step) h2{
  color:var(--areia) !important;
}
.journey-v10.journey-finished .journey-step:not(.final-step) p{
  color:rgba(243,238,228,.86) !important;
}

@media(max-width:900px){
  .journey-v10 .final-step{
    width:90vw !important;
  }
  .journey-v10 .final-step h2{
    font-size:clamp(40px,10.5vw,54px) !important;
  }
}


/* ==========================================================
   v13 — teste: vídeo puro no fundo do percurso
   ========================================================== */

.journey-v10 .journey-sticky{
  background:#000 !important;
}

.journey-v10 .journey-bg-video{
  opacity:1 !important;
  filter:none !important;
  transform:scale(1.015) !important;
}

.journey-v10 .journey-video-overlay{
  background:transparent !important;
  opacity:0 !important;
}


/* ==========================================================
   v14 — vídeo fantasma com máscara verde sutil
   ========================================================== */

.journey-v10 .journey-sticky{
  background:#0f271d !important;
}

.journey-v10 .journey-bg-video{
  opacity:.22 !important;
  filter:saturate(.72) contrast(.96) brightness(.86) !important;
  transform:scale(1.02) !important;
}

.journey-v10 .journey-video-overlay{
  opacity:1 !important;
  background:
    linear-gradient(
      180deg,
      rgba(15,39,29,.72) 0%,
      rgba(15,39,29,.76) 48%,
      rgba(15,39,29,.80) 100%
    ) !important;
}

/* suaviza ainda mais as áreas claras do vídeo */
.journey-v10 .journey-sticky:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 45%, rgba(15,39,29,.02), rgba(15,39,29,.12) 68%, rgba(15,39,29,.20) 100%);
}


/* ==========================================================
   v15 — máscara verde 70% / vídeo mais aparente
   ========================================================== */

.journey-v10 .journey-sticky{
  background:#0f271d !important;
}

.journey-v10 .journey-bg-video{
  opacity:1 !important;
  filter:none !important;
  transform:scale(1.015) !important;
}

.journey-v10 .journey-video-overlay{
  opacity:1 !important;
  background:rgba(15,39,29,.70) !important;
}

/* Remove a camada extra de escurecimento da v14 */
.journey-v10 .journey-sticky:after{
  display:none !important;
}


/* ==========================================================
   v16 — página estática de respiro / Hino de Macaé
   ========================================================== */

.poetic-pause{
  position:relative;
  min-height:100svh;
  background:var(--areia);
  color:#0f271d;
  display:flex;
  align-items:stretch;
  overflow:hidden;
}

.poetic-pause-frame{
  position:relative;
  width:100%;
  min-height:100svh;
  padding:76px 4.5vw 58px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

/* detalhe quase topográfico, mas extremamente discreto */
.poetic-pause-frame:before{
  content:"";
  position:absolute;
  width:min(58vw,850px);
  aspect-ratio:1.65;
  right:-16vw;
  bottom:-15vw;
  border:1px solid rgba(15,39,29,.10);
  border-radius:58% 42% 64% 36% / 46% 58% 42% 54%;
  transform:rotate(-9deg);
  pointer-events:none;
}

.poetic-pause-frame:after{
  content:"";
  position:absolute;
  width:min(43vw,650px);
  aspect-ratio:1.6;
  right:-7vw;
  bottom:-10vw;
  border:1px solid rgba(15,39,29,.07);
  border-radius:47% 53% 38% 62% / 61% 42% 58% 39%;
  transform:rotate(7deg);
  pointer-events:none;
}

.poetic-pause-meta{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  font-size:9px;
  line-height:1.4;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:rgba(15,39,29,.52);
}

.poetic-pause-quote{
  position:relative;
  z-index:2;
  width:min(1120px,88vw);
  margin:auto 0;
  padding:11vh 0 8vh;
  border:0;
}

.poetic-pause-quote p{
  margin:0;
  max-width:1100px;
  font-size:clamp(48px,6.8vw,112px);
  line-height:.91;
  letter-spacing:-.052em;
  font-weight:300;
  color:#0f271d;
}

.poetic-pause-quote footer{
  margin-top:32px;
  font-size:10px;
  line-height:1.4;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(15,39,29,.56);
}

.poetic-pause-line{
  position:relative;
  z-index:2;
  width:100%;
  height:1px;
  background:rgba(15,39,29,.17);
}

@media(max-width:900px){
  .poetic-pause-frame{
    padding:70px 20px 34px;
  }

  .poetic-pause-meta{
    gap:20px;
  }

  .poetic-pause-meta span:last-child{
    text-align:right;
  }

  .poetic-pause-quote{
    width:100%;
    padding:10vh 0;
  }

  .poetic-pause-quote p{
    font-size:clamp(42px,12vw,68px);
    line-height:.94;
  }

  .poetic-pause-quote footer{
    margin-top:24px;
  }
}


/* ==========================================================
   v17 — A SANA nasce do encontro
   ========================================================== */
.encounter-page{
  position:relative;
  min-height:100svh;
  background:#0f271d;
  color:#f3eee4;
  overflow:hidden;
  display:block;
}
.encounter-image{
  position:absolute;
  inset:0;
  z-index:0;
}
.encounter-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 52%;
  display:block;
}
.encounter-shade{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(90deg, rgba(15,39,29,.74) 0%, rgba(15,39,29,.42) 38%, rgba(15,39,29,.08) 67%, rgba(15,39,29,.18) 100%),
    linear-gradient(180deg, rgba(15,39,29,.22) 0%, rgba(15,39,29,.02) 45%, rgba(15,39,29,.42) 100%);
}
.encounter-content{
  position:relative;
  z-index:2;
  min-height:100svh;
  padding:76px 4.5vw 58px;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(270px,32vw);
  grid-template-rows:auto 1fr auto;
  column-gap:7vw;
}
.encounter-meta{
  grid-column:1/-1;
  display:flex;
  justify-content:space-between;
  font-size:9px;
  line-height:1.4;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:rgba(243,238,228,.72);
}
.encounter-title{
  grid-column:1;
  grid-row:2;
  align-self:center;
  margin:0;
  max-width:950px;
  font-size:clamp(72px,8.6vw,150px);
  line-height:.82;
  letter-spacing:-.06em;
  font-weight:500;
  color:#f3eee4;
}
.encounter-quote{
  grid-column:2;
  grid-row:3;
  align-self:end;
  justify-self:end;
  width:min(390px,100%);
  margin:0 0 1vh;
  padding:22px 0 0;
  border:0;
  border-top:1px solid rgba(243,238,228,.48);
}
.encounter-quote p{
  margin:0;
  font-size:clamp(16px,1.35vw,22px);
  line-height:1.28;
  letter-spacing:-.015em;
  font-weight:300;
  color:#f3eee4;
}
.encounter-quote footer{
  margin-top:17px;
  font-size:9px;
  line-height:1.4;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(243,238,228,.72);
}
@media(max-width:900px){
  .encounter-content{
    padding:70px 20px 34px;
    display:flex;
    flex-direction:column;
  }
  .encounter-meta{gap:18px}
  .encounter-meta span:last-child{text-align:right}
  .encounter-title{
    margin:auto 0;
    font-size:clamp(62px,17vw,100px);
  }
  .encounter-quote{
    width:min(330px,84vw);
    margin-left:auto;
  }
  .encounter-shade{
    background:
      linear-gradient(180deg,rgba(15,39,29,.28),rgba(15,39,29,.16) 45%,rgba(15,39,29,.60)),
      linear-gradient(90deg,rgba(15,39,29,.55),rgba(15,39,29,.06));
  }
}


/* ==========================================================
   v22 — réplica da referência enviada
   ========================================================== */

html body .encounter-page-v22{
  position:relative !important;
  min-height:100svh !important;
  height:100svh !important;
  overflow:hidden !important;
  background:#0f271d !important;
  color:#f3eee4 !important;
}

html body .encounter-page-v22 .encounter-image{
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
}

html body .encounter-page-v22 .encounter-image img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  transform:none !important;
  filter:none !important;
  display:block !important;
}

html body .encounter-page-v22 .encounter-shade{
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  background:
    linear-gradient(90deg,
      rgba(10,19,14,.34) 0%,
      rgba(10,19,14,.20) 31%,
      rgba(10,19,14,.06) 60%,
      rgba(10,19,14,.02) 100%
    ) !important;
}

html body .encounter-page-v22 .encounter-content{
  position:relative !important;
  z-index:2 !important;
  width:100% !important;
  height:100% !important;
  min-height:100svh !important;
  padding:0 !important;
  display:block !important;
}

/* exatamente na posição visual da referência */
html body .encounter-page-v22 .encounter-meta{
  position:absolute !important;
  left:2.8vw !important;
  top:21.5vh !important;
  margin:0 !important;
  font-size:9px !important;
  line-height:1 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
  color:rgba(243,238,228,.90) !important;
}

html body .encounter-page-v22 .encounter-title{
  position:absolute !important;
  left:3.1vw !important;
  top:41.2vh !important;
  width:53vw !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  display:block !important;
  font-size:clamp(72px,7.75vw,128px) !important;
  line-height:.80 !important;
  letter-spacing:-.062em !important;
  color:#f3eee4 !important;
  text-align:left !important;
}

html body .encounter-page-v22 .encounter-title .line-one,
html body .encounter-page-v22 .encounter-title .line-two{
  display:block !important;
  white-space:nowrap !important;
}

html body .encounter-page-v22 .encounter-title .word-a,
html body .encounter-page-v22 .encounter-title .word-nasce,
html body .encounter-page-v22 .encounter-title .line-two{
  font-weight:400 !important;
}

html body .encounter-page-v22 .encounter-title .word-sana{
  font-weight:300 !important;
  letter-spacing:-.045em !important;
  margin:0 .12em 0 .02em !important;
}

/* citação no mesmo lugar da referência, sem Macaé/RJ no topo */
html body .encounter-page-v22 .encounter-quote-wrap{
  position:absolute !important;
  left:62.3vw !important;
  top:51.3vh !important;
  width:31vw !important;
  max-width:500px !important;
  margin:0 !important;
}

html body .encounter-page-v22 .encounter-quote{
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  width:100% !important;
}

html body .encounter-page-v22 .encounter-quote p{
  margin:0 !important;
  font-size:clamp(16px,1.35vw,22px) !important;
  line-height:1.32 !important;
  letter-spacing:-.015em !important;
  font-weight:300 !important;
  font-style:italic !important;
  color:#f3eee4 !important;
}

html body .encounter-page-v22 .encounter-quote footer{
  margin-top:17px !important;
  font-size:9px !important;
  line-height:1 !important;
  letter-spacing:.17em !important;
  text-transform:none !important;
  color:rgba(243,238,228,.84) !important;
}

/* linha fina apontando para o encontro das águas */
html body .encounter-page-v22 .quote-pointer{
  position:absolute !important;
  right:calc(100% + 14px) !important;
  top:14px !important;
  width:92px !important;
  height:1px !important;
  background:rgba(243,238,228,.46) !important;
  transform:rotate(-42deg) !important;
  transform-origin:right center !important;
}

html body .encounter-page-v22 .quote-pointer:after{
  content:"" !important;
  position:absolute !important;
  left:-1px !important;
  top:-2px !important;
  width:5px !important;
  height:5px !important;
  border-radius:50% !important;
  border:1px solid rgba(243,238,228,.56) !important;
  background:transparent !important;
}

@media(max-width:900px){
  html body .encounter-page-v22 .encounter-meta{
    left:20px !important;
    top:17vh !important;
  }
  html body .encounter-page-v22 .encounter-title{
    left:20px !important;
    top:39vh !important;
    width:88vw !important;
    font-size:clamp(54px,15vw,86px) !important;
  }
  html body .encounter-page-v22 .encounter-title .line-one,
  html body .encounter-page-v22 .encounter-title .line-two{
    white-space:normal !important;
  }
  html body .encounter-page-v22 .encounter-quote-wrap{
    left:auto !important;
    right:20px !important;
    top:auto !important;
    bottom:6vh !important;
    width:74vw !important;
  }
  html body .encounter-page-v22 .quote-pointer{
    width:60px !important;
  }
}


/* ==========================================================
   v23 — réplica do mockup aprovado
   ========================================================== */

html body .encounter-page-v23{
  position:relative !important;
  height:100svh !important;
  min-height:760px !important;
  overflow:hidden !important;
  background:#0f271d !important;
  color:#f4f0e8 !important;
}

html body .encounter-page-v23 .encounter-image{
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
}

html body .encounter-page-v23 .encounter-image img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center 46% !important;
  transform:scale(1.01) !important;
  display:block !important;
  filter:saturate(1.16) contrast(1.08) brightness(.92) !important;
}

html body .encounter-page-v23 .encounter-shade{
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  background:
    linear-gradient(
      90deg,
      rgba(7,18,13,.34) 0%,
      rgba(7,18,13,.18) 28%,
      rgba(7,18,13,.04) 58%,
      rgba(7,18,13,.01) 100%
    ),
    linear-gradient(
      180deg,
      rgba(7,18,13,.08) 0%,
      rgba(7,18,13,0) 48%,
      rgba(7,18,13,.08) 100%
    ) !important;
}

html body .encounter-page-v23 .encounter-content{
  position:relative !important;
  z-index:2 !important;
  width:100% !important;
  height:100% !important;
  min-height:100svh !important;
  padding:0 !important;
  display:block !important;
}

html body .encounter-page-v23 .encounter-meta{
  position:absolute !important;
  left:3.05vw !important;
  top:29.3vh !important;
  margin:0 !important;
  font-size:9px !important;
  line-height:1 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
  color:rgba(244,240,232,.94) !important;
}

/* Headline placement and proportions from the approved mockup */
html body .encounter-page-v23 .encounter-title{
  position:absolute !important;
  left:3.0vw !important;
  top:39.4vh !important;
  width:53vw !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  color:#f4f0e8 !important;
  font-size:clamp(70px,7.75vw,126px) !important;
  line-height:.79 !important;
  letter-spacing:-.063em !important;
  text-align:left !important;
}

html body .encounter-page-v23 .title-line{
  display:block !important;
  white-space:nowrap !important;
}

html body .encounter-page-v23 .word-a,
html body .encounter-page-v23 .word-nasce,
html body .encounter-page-v23 .title-line-2{
  font-weight:400 !important;
}

html body .encounter-page-v23 .word-sana{
  font-weight:300 !important;
  letter-spacing:-.04em !important;
  margin:0 .10em 0 .015em !important;
}

/* Quote placement at the actual meeting point */
html body .encounter-page-v23 .encounter-quote-wrap{
  position:absolute !important;
  left:61.5vw !important;
  top:48.8vh !important;
  width:min(31vw,470px) !important;
  margin:0 !important;
}

html body .encounter-page-v23 .encounter-quote{
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}

html body .encounter-page-v23 .encounter-quote p{
  margin:0 !important;
  font-size:clamp(16px,1.32vw,21px) !important;
  line-height:1.30 !important;
  letter-spacing:-.012em !important;
  font-weight:300 !important;
  font-style:italic !important;
  color:#f4f0e8 !important;
}

html body .encounter-page-v23 .encounter-quote footer{
  margin-top:17px !important;
  font-size:9px !important;
  line-height:1 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
  color:rgba(244,240,232,.88) !important;
}

html body .encounter-page-v23 .quote-pointer{
  position:absolute !important;
  right:calc(100% + 18px) !important;
  top:20px !important;
  width:92px !important;
  height:1px !important;
  background:rgba(244,240,232,.56) !important;
  transform:rotate(-40deg) !important;
  transform-origin:right center !important;
}

html body .encounter-page-v23 .quote-pointer:after{
  content:"" !important;
  position:absolute !important;
  left:-1px !important;
  top:-2px !important;
  width:5px !important;
  height:5px !important;
  border-radius:50% !important;
  border:1px solid rgba(244,240,232,.62) !important;
  background:transparent !important;
}

@media(max-width:900px){
  html body .encounter-page-v23{
    min-height:680px !important;
  }

  html body .encounter-page-v23 .encounter-meta{
    left:20px !important;
    top:22vh !important;
  }

  html body .encounter-page-v23 .encounter-title{
    left:20px !important;
    top:40vh !important;
    width:88vw !important;
    font-size:clamp(56px,14.8vw,86px) !important;
  }

  html body .encounter-page-v23 .title-line{
    white-space:normal !important;
  }

  html body .encounter-page-v23 .encounter-quote-wrap{
    left:auto !important;
    right:20px !important;
    top:auto !important;
    bottom:7vh !important;
    width:min(330px,78vw) !important;
  }

  html body .encounter-page-v23 .quote-pointer{
    width:60px !important;
  }
}


/* v24 — SOMENTE ajuste da frase principal */
html body .encounter-page-v23 .encounter-title{
  font-size:clamp(64px,7.05vw,116px) !important;
  letter-spacing:-.025em !important;
}

html body .encounter-page-v23 .word-sana{
  font-weight:300 !important;
  letter-spacing:.015em !important;
}

/* mantém o restante da frase com o mesmo peso */
html body .encounter-page-v23 .word-a,
html body .encounter-page-v23 .word-nasce,
html body .encounter-page-v23 .title-line-2{
  font-weight:400 !important;
}


/* v26 — nova página após a segunda seção: somente imagem */
.image-page-v26{
  position:relative;
  width:100%;
  height:100svh;
  min-height:100vh;
  margin:0;
  padding:0;
  overflow:hidden;
  background:#0f271d;
}
.image-page-v26 > img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  margin:0;
  padding:0;
  filter:none;
  transform:none;
}


/* v27 — título sobre a imagem, conforme referência */
.image-page-v26 .encontro-title-v27{
  position:absolute;
  z-index:2;
  left:2.7vw;
  top:5.2vh;
  margin:0;
  padding:0;
  color:#f4f0e8;
  font-size:clamp(58px,5.4vw,94px);
  line-height:.91;
  letter-spacing:-.045em;
  text-align:left;
  font-weight:400;
}

.image-page-v26 .encontro-line-v27{
  display:block;
  white-space:nowrap;
}

.image-page-v26 .encontro-a-v27,
.image-page-v26 .encontro-regular-v27{
  font-weight:400;
}

.image-page-v26 .encontro-sana-v27{
  font-weight:300;
  letter-spacing:.015em;
}

@media(max-width:900px){
  .image-page-v26 .encontro-title-v27{
    left:20px;
    top:6vh;
    font-size:clamp(48px,12vw,74px);
  }
}


/* v28 — SOMENTE título: maior, centralizado e SANA substituído pela logo */
.image-page-v26 .encontro-title-v27{
  display:none !important;
}

.image-page-v26 .encontro-title-v28{
  position:absolute;
  z-index:2;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:max-content;
  max-width:92vw;
  margin:0;
  padding:0;
  color:#f4f0e8;
  font-size:clamp(76px,7.2vw,128px);
  line-height:.90;
  letter-spacing:-.045em;
  text-align:left;
  font-weight:400;
}

.image-page-v26 .encontro-line-v28{
  display:flex;
  align-items:baseline;
  gap:.13em;
  white-space:nowrap;
}

.image-page-v26 .encontro-line2-v28{
  display:block;
}

.image-page-v26 .encontro-logo-v28{
  width:2.55em;
  height:auto;
  max-height:.76em;
  object-fit:contain;
  object-position:center;
  display:inline-block;
  vertical-align:baseline;
  transform:translateY(.03em);
}

@media(max-width:900px){
  .image-page-v26 .encontro-title-v28{
    font-size:clamp(52px,12.5vw,82px);
    max-width:90vw;
  }
  .image-page-v26 .encontro-line-v28{
    gap:.10em;
  }
}


/* v29 — bloco centralizado na página, conteúdo alinhado à esquerda,
   usando EXATAMENTE a logo enviada pela usuária */
.image-page-v26 .encontro-title-v28{display:none !important;}

.image-page-v26 .encontro-title-v29{
  position:absolute !important;
  z-index:5 !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%,-50%) !important;
  width:max-content !important;
  max-width:92vw !important;
  margin:0 !important;
  padding:0 !important;
  color:#f4f0e8 !important;
  font-size:clamp(76px,7.4vw,132px) !important;
  line-height:.90 !important;
  letter-spacing:-.045em !important;
  font-weight:400 !important;
  text-align:left !important;
}

.image-page-v26 .encontro-line-v29{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:.13em !important;
  white-space:nowrap !important;
}

.image-page-v26 .encontro-line2-v29{
  display:block !important;
  text-align:left !important;
}

.image-page-v26 .encontro-logo-v29{
  display:block !important;
  width:2.62em !important;
  height:.72em !important;
  object-fit:contain !important;
  object-position:center !important;
  margin:0 !important;
  padding:0 !important;
  flex:none !important;
}

@media(max-width:900px){
  .image-page-v26 .encontro-title-v29{
    font-size:clamp(50px,12.5vw,80px) !important;
    max-width:90vw !important;
  }
}


/* v30 — SOMENTE mover o bloco para o canto esquerdo da página */
.image-page-v26 .encontro-title-v29{
  left:3vw !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  text-align:left !important;
}

@media(max-width:900px){
  .image-page-v26 .encontro-title-v29{
    left:20px !important;
  }
}


/* v31 — [2] ORIGEM + chamada do Hino no encontro das águas */
.image-page-v31{
  position:relative;
}

/* Mesmo espírito da numeração/título da página anterior */
.image-page-v31 .origem-label-v31{
  position:absolute;
  z-index:6;
  left:3vw;
  top:7.5vh;
  color:#f4f0e8;
  font-size:9px;
  line-height:1;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:400;
}

/* Callout editorial sobre o ponto de encontro das águas */
.image-page-v31 .hino-callout-v31{
  position:absolute;
  z-index:6;
  left:52.5%;
  top:48%;
  width:40%;
  min-width:420px;
  height:170px;
  pointer-events:none;
}

.image-page-v31 .hino-dot-v31{
  position:absolute;
  left:0;
  top:52%;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#f4f0e8;
  transform:translate(-50%,-50%);
  box-shadow:0 0 0 5px rgba(244,240,232,.10);
}

.image-page-v31 .hino-line-v31{
  position:absolute;
  left:8px;
  top:52%;
  width:36%;
  height:1px;
  background:rgba(244,240,232,.72);
  transform-origin:left center;
  transform:rotate(-10deg);
}

.image-page-v31 .hino-text-v31{
  position:absolute;
  left:38%;
  top:18%;
  width:min(420px,58%);
  margin:0;
  padding:0;
  border:0;
  color:#f4f0e8;
}

.image-page-v31 .hino-text-v31 p{
  margin:0;
  font-size:clamp(15px,1.2vw,20px);
  line-height:1.35;
  letter-spacing:-.01em;
  font-weight:300;
}

.image-page-v31 .hino-text-v31 footer{
  margin-top:16px;
  font-size:9px;
  line-height:1;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(244,240,232,.78);
}

@media(max-width:900px){
  .image-page-v31 .origem-label-v31{
    left:20px;
    top:6vh;
  }

  .image-page-v31 .hino-callout-v31{
    left:50%;
    top:54%;
    width:46%;
    min-width:0;
    height:150px;
  }

  .image-page-v31 .hino-line-v31{
    width:24%;
  }

  .image-page-v31 .hino-text-v31{
    left:28%;
    top:20%;
    width:70%;
  }

  .image-page-v31 .hino-text-v31 p{
    font-size:13px;
  }
}


/* v32 — IBM Plex Sans Light para o Hino + linha conectada à bolinha */
@font-face{
  font-family:"IBM Plex Sans Local";
  src:url("assets/fonts/IBMPlexSans-Light.ttf") format("truetype");
  font-style:normal;
  font-weight:300;
  font-display:swap;
}

.image-page-v31 .hino-dot-v31{
  width:10px !important;
  height:10px !important;
  box-shadow:none !important;
}

.image-page-v31 .hino-line-v31{
  left:0 !important; /* linha nasce no centro da bolinha */
  top:52% !important;
  transform-origin:left center !important;
}

.image-page-v31 .hino-text-v31,
.image-page-v31 .hino-text-v31 p,
.image-page-v31 .hino-text-v31 footer{
  font-family:"IBM Plex Sans Local", sans-serif !important;
  font-weight:300 !important;
  background:none !important;
  border:none !important;
  box-shadow:none !important;
}

.image-page-v31 .hino-text-v31 footer{
  padding:0 !important;
}


/* v33 — pesos do Hino */
@font-face{
  font-family:"IBM Plex Sans Local";
  src:url("assets/fonts/IBMPlexSans-Regular.ttf") format("truetype");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}

/* Trecho do hino = Light */
.image-page-v31 .hino-text-v31 p{
  font-family:"IBM Plex Sans Local", sans-serif !important;
  font-weight:300 !important;
}

/* Crédito “Hino de Macaé” = Regular */
.image-page-v31 .hino-text-v31 footer{
  font-family:"IBM Plex Sans Local", sans-serif !important;
  font-weight:400 !important;
}


/* ==========================================================
   v34 — ponte entre “A SANA nasce do encontro” e serviços
   ========================================================== */
.possibility-page-v34{
  position:relative;
  min-height:100svh;
  box-sizing:border-box;
  padding:7vh 3vw 5vh;
  background:#f1ecdf;
  color:#0f271d;
  display:grid;
  grid-template-rows:auto 1fr auto auto;
  overflow:hidden;
}

.possibility-meta-v34{
  font-size:9px;
  line-height:1;
  letter-spacing:.16em;
  text-transform:uppercase;
  opacity:.62;
}

.possibility-intro-v34{
  align-self:center;
  padding-top:2vh;
}

.possibility-kicker-v34{
  margin:0 0 20px;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:12px;
  line-height:1.4;
  font-weight:300;
  letter-spacing:.02em;
  opacity:.68;
}

.possibility-intro-v34 h2{
  margin:0;
  max-width:1000px;
  font-size:clamp(58px,6.5vw,112px);
  line-height:.88;
  letter-spacing:-.055em;
  font-weight:400;
}

.possibility-grid-v34{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  border-top:1px solid rgba(15,39,29,.28);
  border-bottom:1px solid rgba(15,39,29,.28);
}

.possibility-item-v34{
  position:relative;
  min-height:205px;
  padding:24px 30px 25px 0;
}

.possibility-item-v34 + .possibility-item-v34{
  border-left:1px solid rgba(15,39,29,.28);
  padding-left:30px;
}

.possibility-index-v34{
  display:block;
  margin-bottom:36px;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:9px;
  letter-spacing:.14em;
  font-weight:400;
  opacity:.48;
}

.possibility-item-v34 h3{
  margin:0 0 18px;
  font-size:clamp(27px,2.25vw,39px);
  line-height:.98;
  letter-spacing:-.035em;
  font-weight:400;
}

.possibility-item-v34 p{
  margin:0;
  max-width:310px;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:11px;
  line-height:1.55;
  font-weight:300;
  opacity:.68;
}

.possibility-close-v34{
  margin:22px 0 0 auto;
  max-width:470px;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:13px;
  line-height:1.5;
  font-weight:300;
  text-align:right;
}

@media(max-width:900px){
  .possibility-page-v34{
    padding:6vh 20px 5vh;
    min-height:auto;
  }
  .possibility-intro-v34{
    padding:12vh 0 10vh;
  }
  .possibility-intro-v34 h2{
    font-size:clamp(48px,13vw,76px);
  }
  .possibility-grid-v34{
    grid-template-columns:1fr;
  }
  .possibility-item-v34{
    min-height:0;
    padding:28px 0;
  }
  .possibility-item-v34 + .possibility-item-v34{
    border-left:0;
    border-top:1px solid rgba(15,39,29,.28);
    padding-left:0;
  }
  .possibility-index-v34{
    margin-bottom:22px;
  }
  .possibility-close-v34{
    margin-top:28px;
  }
}


/* ==========================================================
   v36 — serviços como continuação narrativa + revelação simples
   ========================================================== */

.possibility-page-v34{
  min-height:135svh;
  grid-template-rows:auto auto 1fr !important;
  padding-bottom:9vh;
}

.possibility-page-v34 .possibility-intro-v34{
  padding:12vh 0 10vh;
}

.service-story-v36{
  width:100%;
  max-width:1180px;
  margin-left:auto;
  display:flex;
  flex-direction:column;
}

.service-line-v36{
  display:grid;
  grid-template-columns:minmax(360px,1fr) minmax(280px,.72fr);
  align-items:end;
  gap:6vw;
  padding:30px 0 28px;
  border-top:1px solid rgba(15,39,29,.25);
}

.service-line-v36:last-child{
  border-bottom:1px solid rgba(15,39,29,.25);
}

.service-line-v36 h3{
  margin:0;
  font-size:clamp(30px,3.15vw,54px);
  line-height:1;
  letter-spacing:-.04em;
  font-weight:400;
  text-transform:none;
}

.service-line-v36 p{
  margin:0 0 3px;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:11px;
  line-height:1.5;
  letter-spacing:.015em;
  font-weight:300;
  text-align:left;
  opacity:.66;
}

/* Revelação discreta: sem efeitos chamativos */
.reveal-v36{
  opacity:0;
  transform:translateY(26px);
  transition:
    opacity .85s cubic-bezier(.22,1,.36,1),
    transform .85s cubic-bezier(.22,1,.36,1);
  will-change:opacity,transform;
}

.reveal-v36.is-visible-v36{
  opacity:1;
  transform:translateY(0);
}

.service-line-v36:nth-child(2){transition-delay:.07s}
.service-line-v36:nth-child(3){transition-delay:.14s}
.service-line-v36:nth-child(4){transition-delay:.21s}

@media(max-width:900px){
  .possibility-page-v34{
    min-height:auto;
  }

  .possibility-page-v34 .possibility-intro-v34{
    padding:11vh 0 9vh;
  }

  .service-story-v36{
    margin-left:0;
  }

  .service-line-v36{
    grid-template-columns:1fr;
    gap:18px;
    padding:27px 0 25px;
  }

  .service-line-v36 h3{
    font-size:clamp(29px,8vw,46px);
  }
}

@media(prefers-reduced-motion:reduce){
  .reveal-v36{
    opacity:1;
    transform:none;
    transition:none;
  }
}


/* ==========================================================
   v37 — composição editorial livre dos serviços
   ========================================================== */

.possibility-page-v34{
  display:block !important;
  min-height:190svh !important;
  padding:7vh 3vw 8vh !important;
}

.possibility-page-v34 .possibility-intro-v34{
  padding:12vh 0 14vh !important;
}

.service-story-v36{display:none !important;}

.service-story-v37{
  position:relative;
  width:100%;
  min-height:105vh;
}

.service-moment-v37{
  position:absolute;
  width:min(510px,38vw);
}

.service-moment-v37 h3{
  margin:0 0 16px;
  font-size:clamp(31px,3.1vw,53px);
  line-height:.98;
  letter-spacing:-.04em;
  font-weight:400;
}

.service-moment-v37 p{
  margin:0;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:11px;
  line-height:1.5;
  letter-spacing:.015em;
  font-weight:300;
  opacity:.62;
}

.service-moment-1-v37{
  left:4vw;
  top:2vh;
}

.service-moment-2-v37{
  right:7vw;
  top:25vh;
}

.service-moment-3-v37{
  left:18vw;
  top:53vh;
}

.service-moment-4-v37{
  right:15vw;
  top:78vh;
}

.service-ending-v37{
  width:max-content;
  max-width:80vw;
  margin:5vh auto 0;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:clamp(14px,1.25vw,19px);
  line-height:1.45;
  letter-spacing:.005em;
  font-weight:300;
  text-align:center;
}

.service-ending-v37 strong{
  font-weight:400;
}

@media(max-width:900px){
  .possibility-page-v34{
    min-height:auto !important;
    padding:6vh 20px 8vh !important;
  }

  .service-story-v37{
    min-height:0;
    display:flex;
    flex-direction:column;
    gap:11vh;
  }

  .service-moment-v37{
    position:relative;
    width:88%;
    inset:auto !important;
  }

  .service-moment-v37:nth-child(even){
    margin-left:auto;
  }

  .service-moment-v37 h3{
    font-size:clamp(30px,8vw,45px);
  }

  .service-ending-v37{
    margin-top:13vh;
    max-width:90%;
  }
}


/* ==========================================================
   v38 — maiúsculas + elementos gráficos sutis
   ========================================================== */

.possibility-page-v34{
  position:relative !important;
  overflow:hidden !important;
}

.possibility-page-v34 > *:not(.service-decor-v38):not(.service-dot-v38){
  position:relative;
  z-index:2;
}

/* Linhas orgânicas/topográficas bem discretas */
.service-decor-v38{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
  pointer-events:none;
}

.service-decor-line-v38{
  fill:none;
  stroke:#0f271d;
  stroke-width:1;
  vector-effect:non-scaling-stroke;
  opacity:.10;
}

.line-b-v38{opacity:.065}
.line-c-v38{opacity:.075}

/* pequenos pontos, quase como marcações de mapa */
.service-dot-v38{
  position:absolute;
  z-index:1;
  width:8px;
  height:8px;
  border-radius:50%;
  border:1px solid rgba(15,39,29,.28);
  background:transparent;
  pointer-events:none;
}

.dot-a-v38{
  left:9vw;
  top:39%;
}

.dot-b-v38{
  right:11vw;
  top:67%;
}

/* Um detalhe de linha curta ao lado do fechamento */
.service-ending-v37{
  position:relative;
}

.service-ending-v37:before{
  content:"";
  position:absolute;
  left:50%;
  top:-28px;
  width:72px;
  height:1px;
  background:rgba(15,39,29,.22);
  transform:translateX(-50%);
}

@media(max-width:900px){
  .service-decor-v38{
    opacity:.65;
  }

  .dot-a-v38{left:7vw;top:37%}
  .dot-b-v38{right:8vw;top:69%}
}


/* ==========================================================
   v39 — restaura e reforça a revelação no scroll
   ========================================================== */

.possibility-page-v34 .reveal-v36{
  opacity:0 !important;
  transform:translateY(34px) !important;
  transition:
    opacity .8s cubic-bezier(.22,1,.36,1),
    transform .8s cubic-bezier(.22,1,.36,1) !important;
  will-change:opacity,transform;
}

.possibility-page-v34 .reveal-v36.is-visible-v36{
  opacity:1 !important;
  transform:translateY(0) !important;
}

/* stagger suave */
.possibility-page-v34 .service-moment-1-v37{transition-delay:0s !important}
.possibility-page-v34 .service-moment-2-v37{transition-delay:.08s !important}
.possibility-page-v34 .service-moment-3-v37{transition-delay:.12s !important}
.possibility-page-v34 .service-moment-4-v37{transition-delay:.16s !important}
.possibility-page-v34 .service-ending-v37{transition-delay:.10s !important}

@media(prefers-reduced-motion:reduce){
  .possibility-page-v34 .reveal-v36{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
}


/* ==========================================================
   v46 — convite final
   ========================================================== */
.final-invite-v46{
  min-height:100svh;
  box-sizing:border-box;
  padding:10vh 5vw 9vh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  gap:15vh;
}

.final-invite-copy-v46{
  margin:0;
  max-width:820px;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:clamp(17px,1.45vw,24px);
  line-height:1.45;
  font-weight:300;
  letter-spacing:-.01em;
}

.final-invite-question-v46{
  margin:0;
  max-width:1250px;
  font-size:clamp(62px,7.4vw,128px);
  line-height:.9;
  letter-spacing:-.055em;
  font-weight:400;
}

.reveal-final-v46{
  opacity:0;
  transform:translateY(28px);
  transition:
    opacity .9s cubic-bezier(.22,1,.36,1),
    transform .9s cubic-bezier(.22,1,.36,1);
}

.reveal-final-v46.is-visible-final-v46{
  opacity:1;
  transform:translateY(0);
}

.final-invite-question-v46{
  transition-delay:.12s;
}

@media(max-width:900px){
  .final-invite-v46{
    min-height:100svh;
    padding:9vh 20px 8vh;
    gap:14vh;
  }
  .desktop-break-v46{display:none}
  .final-invite-copy-v46{
    font-size:16px;
    max-width:90%;
  }
  .final-invite-question-v46{
    font-size:clamp(50px,14vw,82px);
  }
}

@media(prefers-reduced-motion:reduce){
  .reveal-final-v46{
    opacity:1;
    transform:none;
    transition:none;
  }
}


/* v47 — mantém o layout original da página territory;
   apenas adapta a nova mensagem e destaca a pergunta */
.territory .invite-copy-v47{
  font-style:normal;
}

.territory .invite-question-v47{
  margin-top:34px;
  max-width:620px;
  font-size:clamp(34px,3.4vw,58px);
  line-height:.96;
  letter-spacing:-.04em;
  font-weight:400;
}


/* ==========================================================
   v48 — convite final refinado
   Texto: IBM Plex Sans Light
   Pergunta: Novecentos
   Imagem mais estreita para ampliar a área textual
   ========================================================== */

/* sobrescreve o grid original apenas nesta página */
.invite-territory-v48{
  grid-template-columns:38% 62% !important;
}

/* a imagem ocupa menos largura horizontal */
.invite-territory-v48 .territory-media{
  width:100% !important;
  max-width:none !important;
}

/* mais respiro para o texto */
.invite-territory-v48 .territory-copy{
  padding-left:clamp(48px,6vw,110px) !important;
  padding-right:5vw !important;
  max-width:none !important;
}

/* corpo pequeno, leve e editorial */
.invite-territory-v48 .invite-copy-v47{
  max-width:600px !important;
  margin:0 !important;
  font-family:"IBM Plex Sans Local",sans-serif !important;
  font-size:clamp(15px,1.15vw,19px) !important;
  line-height:1.52 !important;
  letter-spacing:0 !important;
  font-weight:300 !important;
  font-style:normal !important;
}

/* pergunta grande na Novecentos, como contraste tipográfico */
.invite-territory-v48 .invite-question-v47{
  max-width:760px !important;
  margin:clamp(48px,7vh,90px) 0 0 !important;
  font-family:inherit !important;
  font-size:clamp(54px,5.25vw,92px) !important;
  line-height:.92 !important;
  letter-spacing:-.05em !important;
  font-weight:400 !important;
}

@media(max-width:900px){
  .invite-territory-v48{
    grid-template-columns:1fr !important;
  }

  .invite-territory-v48 .territory-media{
    min-height:38vh !important;
  }

  .invite-territory-v48 .territory-copy{
    padding:8vh 20px 9vh !important;
  }

  .invite-territory-v48 .invite-copy-v47{
    font-size:15px !important;
  }

  .invite-territory-v48 .invite-question-v47{
    font-size:clamp(48px,13vw,76px) !important;
  }
}


/* ==========================================================
   v49 — detalhes editoriais sutis no convite
   ========================================================== */

.invite-territory-v48{
  position:relative !important;
  overflow:hidden !important;
}

.invite-territory-v48 > *:not(.invite-decor-v49){
  position:relative;
  z-index:2;
}

.invite-decor-v49{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  color:currentColor;
}

/* microtexto editorial */
.invite-coordinate-v49{
  position:absolute;
  right:4vw;
  top:7vh;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:8px;
  line-height:1;
  letter-spacing:.16em;
  font-weight:300;
  opacity:.30;
}

/* linha fina horizontal */
.invite-hairline-v49{
  position:absolute;
  right:0;
  top:27%;
  width:13vw;
  height:1px;
  background:currentColor;
  opacity:.15;
}

/* círculo aberto, referência sutil a encontro/ponto */
.invite-circle-v49{
  position:absolute;
  right:7vw;
  bottom:9vh;
  width:88px;
  height:88px;
  border:1px solid currentColor;
  border-radius:50%;
  opacity:.10;
}

/* pequena marca de coordenada */
.invite-cross-v49{
  position:absolute;
  right:calc(7vw + 41px);
  bottom:calc(9vh + 41px);
  width:7px;
  height:7px;
  opacity:.25;
}

.invite-cross-v49:before,
.invite-cross-v49:after{
  content:"";
  position:absolute;
  background:currentColor;
}

.invite-cross-v49:before{
  left:3px;
  top:0;
  width:1px;
  height:7px;
}

.invite-cross-v49:after{
  left:0;
  top:3px;
  width:7px;
  height:1px;
}

/* pequeno traço antes da pergunta */
.invite-territory-v48 .invite-question-v47{
  position:relative;
}

.invite-territory-v48 .invite-question-v47:before{
  content:"";
  display:block;
  width:44px;
  height:1px;
  margin-bottom:22px;
  background:currentColor;
  opacity:.28;
}

@media(max-width:900px){
  .invite-coordinate-v49{
    right:20px;
    top:4vh;
  }

  .invite-hairline-v49{
    display:none;
  }

  .invite-circle-v49{
    right:-30px;
    bottom:5vh;
  }

  .invite-cross-v49{
    right:11px;
    bottom:calc(5vh + 41px);
  }
}


/* v51 — ÚNICA alteração sobre a V49: [06] COMEÇO */
.invite-territory-v48 .invite-meta-v51{
  position:absolute;
  z-index:5;
  left:calc(38% + clamp(48px,6vw,110px));
  top:7vh;
  display:flex;
  align-items:center;
  gap:12px;
  margin:0;
  padding:0;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:9px;
  line-height:1;
  letter-spacing:.16em;
  font-weight:400;
  color:currentColor;
  opacity:.62;
}

@media(max-width:900px){
  .invite-territory-v48 .invite-meta-v51{
    left:20px;
    top:4vh;
  }
}


/* v63 — alinhamento pontual do texto introdutório de [07] */
.studio .studio-copy > p{
  margin-left:0 !important;
  padding-left:0 !important;
  transform:none !important;
  max-width:none !important;
}


/* ==========================================================
   v64 — [08] CONTATO + formulário em modal
   ========================================================== */
.contact-v64{
  position:relative;
}

.contact-main-v64{
  position:relative;
  z-index:2;
}

.contact-actions-v64{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:22px;
  margin-top:42px;
}

.project-button-v64{
  appearance:none;
  border:1px solid rgba(244,240,232,.55);
  background:transparent;
  color:inherit;
  padding:16px 20px;
  font:inherit;
  font-size:11px;
  letter-spacing:.12em;
  cursor:pointer;
  transition:background .25s ease,color .25s ease;
}

.project-button-v64:hover{
  background:#f4f0e8;
  color:#183e33;
}

.project-modal-v64{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  justify-content:flex-end;
  visibility:hidden;
  pointer-events:none;
}

.project-modal-v64.is-open{
  visibility:visible;
  pointer-events:auto;
}

.project-modal-backdrop-v64{
  position:absolute;
  inset:0;
  border:0;
  background:rgba(13,31,26,.66);
  opacity:0;
  cursor:pointer;
  transition:opacity .35s ease;
}

.project-modal-v64.is-open .project-modal-backdrop-v64{
  opacity:1;
}

.project-form-panel-v64{
  position:relative;
  z-index:1;
  width:min(620px,92vw);
  height:100%;
  overflow-y:auto;
  box-sizing:border-box;
  padding:42px clamp(28px,4vw,64px) 36px;
  background:#e8dfce;
  color:#183e33;
  transform:translateX(100%);
  transition:transform .45s cubic-bezier(.22,.8,.24,1);
}

.project-modal-v64.is-open .project-form-panel-v64{
  transform:translateX(0);
}

.project-form-top-v64{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:10vh;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:9px;
  letter-spacing:.14em;
}

.project-form-top-v64 button{
  border:0;
  background:none;
  color:inherit;
  font:inherit;
  letter-spacing:inherit;
  cursor:pointer;
}

.project-form-panel-v64 h2{
  margin:0 0 7vh;
  font-size:clamp(54px,5.6vw,88px);
  line-height:.88;
  letter-spacing:-.055em;
  font-weight:400;
}

.project-form-v64{
  display:flex;
  flex-direction:column;
}

.project-form-v64 label{
  display:block;
  padding:18px 0 14px;
  border-top:1px solid rgba(24,62,51,.34);
}

.project-form-v64 label > span{
  display:block;
  margin-bottom:10px;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:9px;
  line-height:1;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.project-form-v64 em{
  font-style:normal;
  opacity:.48;
}

.project-form-v64 input,
.project-form-v64 textarea{
  width:100%;
  box-sizing:border-box;
  border:0;
  outline:0;
  resize:none;
  background:transparent;
  color:#183e33;
  font:inherit;
  font-size:17px;
  line-height:1.45;
}

.project-form-v64 input::placeholder,
.project-form-v64 textarea::placeholder{
  color:rgba(24,62,51,.48);
}

.project-message-v64{
  border-bottom:1px solid rgba(24,62,51,.34);
}

.project-submit-v64{
  align-self:flex-start;
  margin-top:30px;
  padding:15px 0;
  border:0;
  border-bottom:1px solid currentColor;
  background:none;
  color:inherit;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:10px;
  letter-spacing:.12em;
  cursor:pointer;
}

.project-email-v64{
  display:inline-block;
  margin-top:42px;
  color:inherit;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:10px;
  letter-spacing:.06em;
  text-decoration:none;
  opacity:.7;
}

body.project-modal-open-v64{
  overflow:hidden;
}

@media(max-width:700px){
  .project-form-panel-v64{
    width:100%;
  }

  .project-form-top-v64{
    margin-bottom:8vh;
  }

  .contact-actions-v64{
    margin-top:30px;
  }
}


/* v69 — alinhar o título principal da página de contato ao eixo dos demais elementos */
.contact-v64 .contact-main-v64{
  margin-left:0 !important;
  padding-left:0 !important;
  transform:none !important;
}

.contact-v64 .contact-main-v64 h2{
  margin-left:3vw !important;
  padding-left:0 !important;
  max-width:1180px !important;
}

.contact-v64 .contact-actions-v64{
  margin-left:3vw !important;
}

.contact-v64 .mail{
  margin-left:0 !important;
}

.contact-v64 .contact-foot{
  padding-left:3vw !important;
  padding-right:3vw !important;
  box-sizing:border-box !important;
}

@media(max-width:900px){
  .contact-v64 .contact-main-v64 h2,
  .contact-v64 .contact-actions-v64{
    margin-left:20px !important;
  }

  .contact-v64 .contact-foot{
    padding-left:20px !important;
    padding-right:20px !important;
  }
}


/* ==========================================================
   v75 — envio direto do formulário via Netlify Forms
   ========================================================== */
.project-honeypot-v75{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

.project-status-v75{
  min-height:20px;
  margin:18px 0 0;
  font-family:"IBM Plex Sans Local",sans-serif;
  font-size:11px;
  line-height:1.45;
  letter-spacing:.02em;
  color:inherit;
  opacity:.72;
}

.project-status-v75.is-success-v75{
  opacity:1;
}

.project-status-v75.is-error-v75{
  opacity:1;
}
