:root{
  --bg:#0d0c0a; --fg:#efe7da; --ouro:#cfa66a; --ipe:#9b7cc0;
  --fg2:color-mix(in srgb,var(--fg) 72%,transparent);
  --fg3:color-mix(in srgb,var(--fg) 46%,transparent);
  --linha:color-mix(in srgb,var(--fg) 16%,transparent);
  --serif:"Bodoni Moda","Didot","Times New Roman",serif;
  --sans:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gx:max(20px,env(safe-area-inset-left,0px));
  color-scheme:dark;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);font-weight:400;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
::selection{background:var(--ouro);color:var(--bg)}

/* ---------- abertura (carregando) ---------- */
.abertura{position:fixed;inset:0;z-index:50;background:var(--bg);display:grid;place-items:center;transition:opacity 1.1s ease .2s,visibility 0s linear 1.4s}
.abertura.fora{opacity:0;visibility:hidden}
.abertura .marca{font-family:var(--serif);font-size:clamp(44px,9vw,92px);letter-spacing:.32em;padding-left:.32em;font-weight:400}
.abertura .barra{width:140px;height:1px;background:var(--linha);margin:22px auto 0;overflow:hidden}
.abertura .barra i{display:block;height:100%;width:0;background:var(--ouro);transition:width .3s ease}
.abertura small{display:block;text-align:center;margin-top:14px;font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--fg3)}

/* ---------- topo ---------- */
.topo{position:fixed;inset:0 0 auto;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:calc(18px + env(safe-area-inset-top,0px)) max(22px,env(safe-area-inset-right,0px)) 18px var(--gx);
  transition:background .5s,backdrop-filter .5s}
.topo.solido{background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.logo{font-family:var(--serif);font-size:22px;letter-spacing:.3em;text-decoration:none;line-height:1}
.logo small{display:block;font-family:var(--sans);font-size:9px;letter-spacing:.42em;color:var(--fg3);margin-top:6px;text-transform:uppercase}
.topo nav{display:flex;gap:28px;font-size:12px;letter-spacing:.18em;text-transform:uppercase}
.topo nav a{text-decoration:none;color:var(--fg2);transition:color .3s}
.topo nav a:hover{color:var(--fg)}
.botao{display:inline-flex;align-items:center;gap:10px;border:1px solid color-mix(in srgb,var(--ouro) 70%,transparent);color:var(--fg);
  padding:12px 20px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;background:transparent;cursor:pointer;font-family:var(--sans);
  transition:background .35s,color .35s,border-color .35s}
.botao:hover{background:var(--ouro);color:var(--bg);border-color:var(--ouro)}
.botao.cheio{background:var(--ouro);color:var(--bg);border-color:var(--ouro)}
.botao.cheio:hover{background:var(--fg);border-color:var(--fg)}
.botao svg{width:16px;height:16px}
@media (max-width:860px){.topo nav{display:none}.topo .botao{padding:10px 14px;font-size:11px}}

/* ---------- o filme ---------- */
.filme{position:relative}
.palco{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#000}
.palco canvas{position:absolute;inset:0;width:100%;height:100%}
.vinheta{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 45%,transparent 45%,rgba(0,0,0,.55) 100%),
             linear-gradient(to bottom,rgba(0,0,0,.45),transparent 22%,transparent 62%,rgba(0,0,0,.7))}
.grao{position:absolute;inset:-50%;pointer-events:none;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grao .9s steps(4) infinite}
@keyframes grao{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}100%{transform:translate(1%,3%)}}
.faixa{position:absolute;left:0;right:0;height:11vh;background:#000;z-index:3;transition:transform 1.6s cubic-bezier(.7,0,.2,1)}
.faixa.cima{top:0}.faixa.baixo{bottom:0}
.palco.aberto .faixa.cima{transform:translateY(-100%)}
.palco.aberto .faixa.baixo{transform:translateY(100%)}

/* textos que entram e saem com a rolagem */
.cena{position:absolute;z-index:4;opacity:0;pointer-events:none;
  --t:0;transform:translate3d(0,calc((1 - var(--e,0)) * 26px),0);filter:blur(calc((1 - var(--e,0)) * 8px));will-change:opacity,transform,filter}
.cena.ativa{pointer-events:auto}
.cena::before{content:"";position:absolute;inset:-30% -25%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(8,6,4,.5),rgba(8,6,4,.22) 60%,transparent)}
.andar::before{display:none}
.rotulo{font-size:11px;letter-spacing:.38em;text-transform:uppercase;color:var(--ouro);display:flex;align-items:center;gap:14px}
.rotulo::before{content:"";width:34px;height:1px;background:currentColor}
.titulo{font-family:var(--serif);font-weight:400;line-height:1.02;letter-spacing:-.01em;margin:.35em 0 0;text-wrap:balance;text-shadow:0 2px 30px rgba(0,0,0,.45)}
.titulo em{font-style:italic;color:var(--ouro)}
.t-xl{font-size:clamp(42px,8.4vw,128px)}
.t-marca{font-size:clamp(46px,6.6vw,104px)}
.t-l{font-size:clamp(32px,5.6vw,84px)}
.apoio{max-width:30em;color:var(--fg2);font-size:clamp(15px,1.25vw,18px);margin:18px 0 0;text-shadow:0 1px 18px rgba(0,0,0,.6)}
.esq{left:var(--gx);bottom:16vh;max-width:min(760px,calc(100% - 2*var(--gx)))}
.dir{right:max(22px,env(safe-area-inset-right,0px));bottom:16vh;max-width:min(760px,calc(100% - 2*var(--gx)));text-align:right}
.dir .rotulo{justify-content:flex-end}.dir .apoio{margin-left:auto}
.centro{left:50%;top:50%;transform:translate3d(-50%,calc(-50% + (1 - var(--e,0)) * 26px),0);text-align:center;width:min(980px,calc(100% - 2*var(--gx)))}
.centro .rotulo{justify-content:center}.centro .rotulo::after{content:"";width:34px;height:1px;background:currentColor}
.centro .apoio{margin-inline:auto}
.letras span span{display:inline-block;opacity:calc(var(--e,0) * 1.6 - var(--i) * .06);transform:translateY(calc((1 - min(1, var(--e,0) * 1.4)) * .35em))}

/* contador de andares */
.andar{right:max(22px,env(safe-area-inset-right,0px));top:24vh;text-align:right}
.andar b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(70px,11vw,170px);line-height:.9;font-variant-numeric:tabular-nums;color:var(--fg)}
.andar span{font-size:11px;letter-spacing:.38em;text-transform:uppercase;color:var(--fg2)}

/* números da chegada */
.numeros{display:flex;gap:clamp(18px,3.4vw,56px);margin-top:28px;flex-wrap:wrap}
.numeros div{border-top:1px solid var(--linha);padding-top:12px;min-width:92px}
.numeros b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,44px);line-height:1}
.numeros span{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--fg3)}
.dir .numeros{justify-content:flex-end}

/* trilho de capítulos */
.trilho{position:absolute;z-index:5;left:var(--gx);bottom:calc(22px + env(safe-area-inset-bottom,0px));display:flex;gap:18px;transition:opacity .6s}
.trilho a{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--fg3);transition:color .4s}
.trilho a i{width:18px;height:1px;background:currentColor;transition:width .5s}
.trilho a span{opacity:0;transform:translateX(-6px);transition:.5s}
.trilho a.agora{color:var(--fg)}.trilho a.agora i{width:42px;background:var(--ouro)}
.trilho a span{display:none}.trilho a.agora span{display:inline;opacity:1;transform:none}
@media (max-width:860px){.trilho{display:none}}
.tempo{position:absolute;z-index:5;right:max(22px,env(safe-area-inset-right,0px));bottom:calc(22px + env(safe-area-inset-bottom,0px));font-size:10.5px;letter-spacing:.3em;color:var(--fg3);font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:12px}
.tempo i{width:90px;height:1px;background:var(--linha);position:relative;overflow:hidden}
.tempo i::after{content:"";position:absolute;inset:0;background:var(--ouro);transform-origin:left;transform:scaleX(var(--p,0))}
.rolar{position:absolute;z-index:5;left:50%;bottom:calc(26px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);font-size:10px;letter-spacing:.38em;text-transform:uppercase;color:var(--fg2);display:grid;justify-items:center;gap:12px;transition:opacity .6s}
.rolar i{width:1px;height:46px;background:linear-gradient(var(--fg),transparent);animation:desce 2.2s ease-in-out infinite;transform-origin:top}
@keyframes desce{0%{transform:scaleY(0)}45%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}

/* final do filme */
.convite{left:var(--gx);bottom:14vh;max-width:min(700px,calc(100% - 2*var(--gx)))}
.convite .titulo{font-size:clamp(32px,4.4vw,64px)}
.convite .acoes{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}

/* ---------- seções depois do filme ---------- */
.secao{padding:clamp(80px,12vw,160px) var(--gx);padding-right:max(20px,env(safe-area-inset-right,0px))}
.dentro{max-width:1180px;margin:0 auto}
.cab{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:56px}
.cab .titulo{margin:0}
.cab p{color:var(--fg2);max-width:34em;margin:0}
@media (max-width:860px){.cab{grid-template-columns:1fr;gap:20px}}
.aparece{opacity:0;transform:translateY(30px);transition:opacity 1.1s ease,transform 1.1s cubic-bezier(.2,.7,.2,1)}
.aparece.ok{opacity:1;transform:none}

/* plantas */
.plantas{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--linha);border:1px solid var(--linha)}
@media (max-width:960px){.plantas{grid-template-columns:1fr}}
.planta{background:var(--bg);padding:34px 30px 30px;display:grid;gap:22px;min-width:0;transition:background .5s}
.planta:hover{background:color-mix(in srgb,var(--fg) 4%,var(--bg))}
.planta header{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.planta h3{font-family:var(--serif);font-weight:400;font-size:30px;margin:0}
.planta header span{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ouro)}
.planta .img{aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden}
.planta .img img{width:100%;height:100%;object-fit:contain}
.planta .img img.foto{object-fit:cover}
.planta ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14px;color:var(--fg2)}
.planta li{display:flex;justify-content:space-between;border-bottom:1px solid var(--linha);padding-bottom:8px}
.planta li b{font-weight:500;color:var(--fg)}

/* diferenciais */
.difs{display:grid;grid-template-columns:repeat(4,1fr);gap:40px 28px;counter-reset:d}
@media (max-width:960px){.difs{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.difs{grid-template-columns:1fr}}
.difs div{border-top:1px solid var(--linha);padding-top:20px;counter-increment:d;min-width:0}
.difs div::before{content:counter(d,decimal-leading-zero);font-size:11px;letter-spacing:.24em;color:var(--ouro)}
.difs h3{font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.15;margin:14px 0 10px}
.difs p{margin:0;color:var(--fg2);font-size:14.5px}

/* localização */
.local{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
@media (max-width:960px){.local{grid-template-columns:1fr}}
.mapa{position:relative;aspect-ratio:1/1;border:1px solid var(--linha);overflow:hidden;background:
  radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--ouro) 10%,transparent),transparent 60%)}
.mapa svg{position:absolute;inset:0;width:100%;height:100%}
.mapa .rua{stroke:var(--linha);stroke-width:1;fill:none}
.mapa .av{stroke:color-mix(in srgb,var(--fg) 30%,transparent);stroke-width:2.2;fill:none}
.mapa .anel{fill:none;stroke:var(--ouro);stroke-width:1;opacity:.6;transform-origin:250px 250px;animation:anel 4s ease-out infinite}
.mapa .anel.b{animation-delay:2s}
@keyframes anel{from{transform:scale(.1);opacity:.8}to{transform:scale(1);opacity:0}}
.mapa .ponto{fill:var(--ouro)}
.mapa text{fill:var(--fg2);font:11px var(--sans);letter-spacing:.12em}
.tempos{list-style:none;margin:0;padding:0}
.tempos li{display:flex;align-items:baseline;gap:18px;border-bottom:1px solid var(--linha);padding:18px 0}
.tempos b{font-family:var(--serif);font-weight:400;font-size:40px;line-height:1;min-width:2.4ch;color:var(--ouro);font-variant-numeric:tabular-nums}
.tempos span{color:var(--fg2)}
.tempos small{margin-left:auto;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--fg3)}

/* ficha e contato */
.ficha{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--linha);border:1px solid var(--linha);margin-bottom:90px}
@media (max-width:760px){.ficha{grid-template-columns:1fr}}
.ficha div{background:var(--bg);padding:22px 24px}
.ficha span{display:block;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--fg3)}
.ficha b{font-weight:500;font-size:16px}
.contato{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
@media (max-width:860px){.contato{grid-template-columns:1fr}}
form{display:grid;gap:18px}
label{display:grid;gap:6px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--fg3)}
input,select{font:16px var(--sans);color:var(--fg);background:transparent;border:0;border-bottom:1px solid var(--linha);padding:10px 0;outline:none;border-radius:0;transition:border-color .3s;width:100%}
select option{background:var(--bg)}
input:focus,select:focus{border-color:var(--ouro)}
.aviso{font-size:12.5px;color:var(--fg3);margin:0}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;z-index:60;background:var(--fg);color:var(--bg);padding:14px 20px;font-size:14px;max-width:calc(100% - 32px);transition:.4s;pointer-events:none}
.toast.on{opacity:1;transform:translate(-50%,0)}

footer{border-top:1px solid var(--linha);padding:40px var(--gx) calc(40px + env(safe-area-inset-bottom,0px));padding-right:max(20px,env(safe-area-inset-right,0px));color:var(--fg3);font-size:12.5px}
footer .dentro{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
footer p{margin:0;max-width:60em}

@media (prefers-reduced-motion:reduce){.grao{animation:none}.rolar i{animation:none}}

.logo img{max-height:42px;width:auto}
.t-m{font-size:clamp(32px,5.6vw,84px)}
.t-g{font-size:clamp(42px,8.4vw,128px)}
.t-p{font-size:clamp(28px,3.6vw,56px)}
.plantas.n1{grid-template-columns:1fr}.plantas.n2{grid-template-columns:1fr 1fr}.plantas.n4{grid-template-columns:repeat(4,1fr)}
@media (max-width:960px){.plantas.n2,.plantas.n4{grid-template-columns:1fr}}
.editor-vazio{display:grid;place-items:center;height:100%;color:var(--fg3);font-size:13px;letter-spacing:.2em;text-transform:uppercase}
.secao:empty{display:none}
.local.sem-mapa{grid-template-columns:1fr}