/* =========================================================
   WGLA INCORPORADORA — Landing (design system Casa Assinada)
   Linguagem editorial (papel/tinta, Didone, fio de LED) +
   acento latão e voz técnica mono.
   Fontes: Playfair Display (display) · Hanken Grotesk (texto) · Fragment Mono (dados)
   ========================================================= */

/* ---------- 1. TOKENS ---------- */
:root{
  /* superfícies */
  --paper:#F3EFE8;      /* fundo claro principal (off-white quente) */
  --paper-2:#E8E2D7;    /* fundo claro secundário / placeholder de imagem */
  --ink:#161412;        /* fundo escuro / texto principal */
  --ink-2:#221F1B;      /* escuro secundário (gradientes) */
  /* texto secundário */
  --stone:#6E6860;      /* texto secundário sobre claro */
  --stone-2:#A39C91;    /* texto secundário sobre escuro */
  /* acentos */
  --brass:#16688A;      /* azul-mar profundo — <em> em fundo claro, botão sólido */
  --led:#6FC6DE;        /* azul-água — <em>, linhas brilhantes em fundo escuro */
    /* tipografia */
  --serif:"Hanken Grotesk", system-ui, -apple-system, sans-serif;   /* fonte única */
  --sans:"Hanken Grotesk", system-ui, -apple-system, sans-serif;
  --mono:"Hanken Grotesk", system-ui, -apple-system, sans-serif;
  /* layout */
  --gut:clamp(16px, 4vw, 64px);
  --radius:8px;                          /* raio de todas as imagens */          /* gutter lateral fluido */
  /* movimento */
  --ease:cubic-bezier(.2,.7,.1,1);       /* ease-out suave usado em TODAS as transições CSS */
}

/* ---------- 2. RESET / BASE ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
html.lock{overflow:hidden}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--led);color:var(--ink)}
:focus-visible{outline:1px solid var(--brass);outline-offset:4px}
.skip{position:absolute;left:-9999px;top:8px;background:var(--ink);color:var(--paper);padding:8px 14px;z-index:999}
.skip:focus{left:8px}

/* ---------- 3. UTILITÁRIOS ---------- */
.eyebrow{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.32em;text-transform:uppercase}
.serif{font-family:var(--serif)}
em{font-style:italic}
/* máscara de revelação de linha: <span class="mask"><span>Texto</span></span> */
.mask{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.mask > span{display:block;will-change:transform}
.note{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--stone-2)}
.dark{background:var(--ink);color:var(--paper)}
.frame{position:relative;overflow:hidden;background:var(--paper-2);border-radius:var(--radius)}
.frame img{width:100%;height:100%;object-fit:cover}

/* ---------- 4. INTRO (preloader) ---------- */
.intro{position:fixed;inset:0;z-index:200;background:var(--ink);display:grid;place-items:center;color:var(--paper)}
.intro__mark{width:84px;height:auto}
.intro__mark rect{fill:var(--paper);transform-box:fill-box}
.intro__word{margin-top:28px;font-size:13px;font-weight:500;letter-spacing:.8em;text-align:center;padding-left:.8em;overflow:hidden}
.intro__sub{margin-top:10px;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--stone-2);overflow:hidden}
.intro__sub span{display:inline-block}
.intro__word span{display:inline-block}
.intro__inner{display:flex;flex-direction:column;align-items:center}

/* ---------- 5. HEADER ---------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:18px var(--gut);transition:background .5s var(--ease),color .5s var(--ease),padding .5s var(--ease)}
.hdr.scrolled{background:rgba(243,239,232,.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding-top:12px;padding-bottom:12px}
.hdr.dark{color:var(--paper)}
.hdr.dark.scrolled{background:rgba(22,20,18,.8)}
.brand{display:flex;align-items:center;gap:14px}
.brand svg{width:30px;height:auto;fill:currentColor}
.brand__txt{display:flex;flex-direction:column;line-height:1.1}
.brand__txt b{font-weight:500;font-size:14px;letter-spacing:.42em}
.brand__txt small{font-size:8px;letter-spacing:.36em;opacity:.7;margin-top:3px}
.nav{display:flex;gap:34px;align-items:center}
.nav a{font-size:12px;letter-spacing:.2em;text-transform:uppercase;position:relative;padding:4px 0}
/* hover: sublinhado que entra pela esquerda e sai pela direita */
.nav a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.nav a:hover::after{transform:scaleX(1);transform-origin:left}

/* ---------- 6. BOTÕES ---------- */
/* hover: preenchimento sobe de baixo (::before translateY 101% → 0) + seta desliza 4px */
.btn{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;padding:15px 24px;border:1px solid currentColor;position:relative;overflow:hidden;isolation:isolate;transition:color .5s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;background:var(--ink);transform:translateY(101%);transition:transform .55s var(--ease);z-index:-1}
.btn:hover{color:var(--paper)}
.btn:hover::before{transform:translateY(0)}
.btn--solid{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn--solid::before{background:var(--brass)}
.btn--led{border-color:var(--led);color:var(--led)}
.btn--led::before{background:var(--led)}
.btn--led:hover{color:var(--ink)}
.btn .arr{display:inline-block;transition:transform .5s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}
.hdr .btn{padding:11px 18px}

/* ---------- 7. BURGER + MENU MOBILE ---------- */
.burger{display:none;width:44px;height:44px;position:relative}
.burger i{position:absolute;left:10px;right:10px;height:1px;background:currentColor;transition:transform .5s var(--ease)}
.burger i:nth-child(1){top:18px}.burger i:nth-child(2){top:26px}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(4px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){transform:translateY(-4px) rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:90;background:var(--ink);color:var(--paper);padding:110px var(--gut) 36px;display:flex;flex-direction:column;justify-content:space-between;clip-path:inset(0 0 100% 0);visibility:hidden}
.menu ol{list-style:none}
.menu li{overflow:hidden;border-bottom:1px solid rgba(243,239,232,.14)}
.menu li a{display:flex;align-items:baseline;justify-content:space-between;font-family:var(--serif);font-size:clamp(2.1rem,9vw,3.4rem);line-height:1.25;padding:10px 0}
.menu li a small{font-family:var(--sans);font-size:11px;letter-spacing:.3em;opacity:.5}
.menu__foot{display:flex;flex-direction:column;gap:14px;font-size:13px;letter-spacing:.08em}
.menu__foot a{color:var(--led)}

/* ---------- 8. HERO ---------- */
.hero{position:relative;min-height:100svh;padding:clamp(110px,14vh,150px) var(--gut) clamp(60px,10vh,110px);display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:-1;overflow:hidden;background:var(--ink)}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:50% 60%}
/* overlay: escurece a base e a esquerda, onde vivem o texto e o botão */
.hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(22,20,18,.86) 0%,rgba(22,20,18,.6) 45%,rgba(22,20,18,.2) 100%),linear-gradient(0deg,rgba(22,20,18,.85) 0%,rgba(22,20,18,0) 55%),linear-gradient(180deg,rgba(22,20,18,.55) 0%,rgba(22,20,18,0) 22%)}
/* linha de LED com glow que se estende na entrada */
.hero__txt{padding-bottom:clamp(8px,3vh,40px);position:relative;z-index:2}
.hero__kicker{display:flex;gap:18px;align-items:center;margin-bottom:clamp(22px,4vh,44px);color:var(--stone-2)}
.hero__kicker::before{content:"";width:42px;height:1px;background:currentColor}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(3rem,6.1vw,7.6rem);line-height:.96;letter-spacing:-.025em}
.hero h1 em{color:var(--led)}
.hero__row{display:flex;gap:clamp(20px,3vw,48px);align-items:flex-end;margin-top:clamp(28px,5vh,56px);flex-wrap:wrap}
.hero__lead{max-width:40ch;color:rgba(243,239,232,.78);font-size:clamp(15px,1.1vw,17px)}
.hero__ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero__scroll{position:absolute;right:var(--gut);bottom:26px;display:flex;align-items:center;gap:12px;color:var(--stone-2);font-size:10px}
/* indicador "Role": linha que escorre (CSS keyframes) */
.hero__scroll i{display:block;width:1px;height:36px;background:var(--stone-2);transform-origin:top;animation:drip 2.4s var(--ease) infinite}
@keyframes drip{0%{transform:scaleY(0)}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ---------- 9. MANIFESTO (texto que acende palavra a palavra) ---------- */
.manifesto{padding:clamp(100px,18vh,200px) var(--gut) clamp(90px,14vh,160px);position:relative;overflow:hidden}
.manifesto__label{color:var(--led);margin-bottom:clamp(30px,5vh,60px);display:flex;align-items:center;gap:16px}
.manifesto__label::before{content:"";width:42px;height:2px;background:var(--led);box-shadow:0 0 12px var(--led)}
.manifesto__txt{font-family:var(--serif);font-size:clamp(1.9rem,4.3vw,4.6rem);line-height:1.14;letter-spacing:-.015em;max-width:19ch}
.manifesto__txt .w{opacity:.14;display:inline-block}
.manifesto__txt em{color:var(--led)}
.sig{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,48px);margin-top:clamp(70px,12vh,140px);border-top:1px solid rgba(243,239,232,.14);padding-top:34px}
.sig__item{position:relative}
.sig__n{font-family:var(--serif);font-style:italic;color:var(--led);font-size:15px}
.sig__item h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.3rem,1.8vw,1.75rem);line-height:1.15;margin:12px 0 10px}
.sig__item p{color:var(--stone-2);font-size:14px;max-width:30ch}

/* ---------- 10. PROJETO EM DESTAQUE (imagem central que cresce até sangrar) ---------- */
.show{position:relative;height:100svh;overflow:hidden;display:grid;place-items:center}
.show__top{position:absolute;top:clamp(84px,11vh,110px);left:var(--gut);right:var(--gut);display:flex;justify-content:space-between;color:var(--stone);z-index:3}
.show__count{font-family:var(--mono);letter-spacing:.12em}
.show__media{border-radius:var(--radius);position:absolute;left:50%;top:50%;width:min(34vw,440px);height:min(56svh,560px);transform:translate(-50%,-50%);overflow:hidden;background:var(--paper-2);will-change:width,height}
.show__media img{width:100%;height:100%;object-fit:cover;transform:scale(1.25);transform-origin:center}
.show__shade{position:absolute;inset:0;opacity:0;background:linear-gradient(0deg,rgba(22,20,18,.94) 0%,rgba(22,20,18,.78) 32%,rgba(22,20,18,.3) 65%,rgba(22,20,18,.15) 100%)}
.show__txt{position:absolute;left:var(--gut);right:var(--gut);bottom:clamp(40px,9vh,90px);z-index:2;color:var(--paper);display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(24px,5vw,80px);align-items:end;opacity:0}
.show__title{grid-row:span 2;font-family:var(--serif);font-weight:400;font-size:clamp(3rem,8vw,9rem);line-height:.92;letter-spacing:-.03em}
.show__title em{color:var(--led)}
.show__lead{color:rgba(243,239,232,.8);max-width:42ch}
.show__meta{display:flex;gap:clamp(20px,3vw,44px);border-top:1px solid rgba(243,239,232,.2);padding-top:18px}
.show__meta dt{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone-2)}
.show__meta dd{font-family:var(--serif);font-size:clamp(1.2rem,1.6vw,1.6rem);margin-top:4px}

/* ---------- 11. PORTFÓLIO HORIZONTAL ---------- */
.port{position:relative;height:100svh;overflow:hidden;background:var(--paper-2)}
/* texto fantasma gigante em outline, com parallax mais lento que o trilho */
.port__ghost{position:absolute;left:0;top:50%;transform:translateY(-50%);font-family:var(--serif);font-style:italic;font-size:clamp(10rem,30vw,34rem);line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(22,20,18,.12);white-space:nowrap;pointer-events:none;will-change:transform}
.port__head{position:absolute;top:clamp(90px,13vh,120px);left:var(--gut);right:var(--gut);display:flex;justify-content:space-between;align-items:flex-end;z-index:3}
.port__head h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,3.6vw,3.6rem);line-height:1;letter-spacing:-.02em}
.port__head p{color:var(--stone);font-size:14px;max-width:30ch;text-align:right}
.port__track{position:absolute;left:0;top:0;bottom:0;display:flex;align-items:center;gap:clamp(40px,6vw,110px);padding:0 var(--gut);padding-left:max(var(--gut),38vw);padding-top:clamp(120px,14vh,150px);will-change:transform}
.pi{flex:none;position:relative}
.pi .frame{height:var(--h)}
.pi .frame img{height:100%;width:auto;max-width:none}
.pi figcaption{display:flex;gap:14px;align-items:baseline;margin-top:14px;font-size:13px;color:var(--stone);max-width:300px}
.pi figcaption b{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--ink);font-size:15px}
/* tamanhos e deslocamentos que criam o ritmo irregular */
.pi--t{--h:min(62svh,580px)}
.pi--m{--h:min(48svh,500px)}
.pi--s{--h:min(38svh,400px)}
.pi--up{transform:translateY(-6svh)}
.pi--down{align-self:flex-end;margin-bottom:clamp(40px,6vh,80px)}
.port__end{flex:none;width:min(360px,70vw);display:flex;flex-direction:column;gap:22px}
.port__end p{font-family:var(--serif);font-size:clamp(1.6rem,2.4vw,2.4rem);line-height:1.1}
.port__prog{position:absolute;left:var(--gut);right:var(--gut);bottom:28px;height:1px;background:rgba(22,20,18,.12);z-index:3}
.port__prog i{position:absolute;inset:0;background:var(--ink);transform-origin:left;transform:scaleX(0)}

/* ---------- 13. MATERIAIS ---------- */
.mat{padding:clamp(100px,16vh,180px) var(--gut) clamp(90px,14vh,160px);overflow:hidden}
.mat__grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(30px,6vw,110px)}
.mat__head h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,5vw,5.6rem);line-height:.98;letter-spacing:-.025em}
.mat__head h2 em{color:var(--led)}
.mat__head > p{color:var(--stone-2);max-width:36ch;margin-top:26px}
.mlist{list-style:none;margin-top:clamp(36px,6vh,64px);border-top:1px solid rgba(243,239,232,.14)}
.mlist li{display:flex;justify-content:space-between;gap:20px;padding:15px 0;border-bottom:1px solid rgba(243,239,232,.14);font-size:15px}
.mlist li span:last-child{color:var(--stone-2);font-size:13px;text-align:right}
.mlist li b{font-family:var(--serif);font-weight:400;font-size:19px}
/* galeria: trilho com scroll-snap (swipe nativo) + setas */
.gal{min-width:0;align-self:start}
.gal__track{display:flex;gap:clamp(12px,1.6vw,24px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-x:contain;outline:none}
.gal__track::-webkit-scrollbar{display:none}
.gal__track:focus-visible{outline:1px solid var(--led);outline-offset:6px}
.sw{flex:0 0 64%;scroll-snap-align:start;margin:0}
.sw .frame{aspect-ratio:4/5}
.sw .frame img{transition:transform 1.2s var(--ease)}
.sw:hover .frame img{transform:scale(1.04)}
.sw figcaption{display:grid;grid-template-columns:auto 1fr;column-gap:14px;margin-top:16px;font-size:13px;color:var(--stone-2);line-height:1.4}
.sw figcaption .mono{grid-row:span 2;font-size:11px;color:var(--led);padding-top:.45em}
.sw figcaption b{font-family:var(--serif);font-weight:400;font-size:20px;color:var(--paper)}
.gal__ctrl{display:flex;align-items:center;gap:18px;margin-top:clamp(24px,4vh,40px)}
.gal__count{font-size:12px;color:var(--stone-2);letter-spacing:.1em}
.gal__count b{font-weight:400;color:var(--paper)}
.gal__bar{flex:1;height:1px;background:rgba(243,239,232,.16);position:relative}
.gal__bar i{position:absolute;inset:0;background:var(--led);box-shadow:0 0 10px var(--led);transform-origin:left;transform:scaleX(calc(1 / 6));transition:transform .6s var(--ease)}
.gal__btn{width:52px;height:52px;border-radius:50%;border:1px solid rgba(243,239,232,.24);display:grid;place-items:center;transition:background .4s var(--ease),border-color .4s,color .4s,opacity .3s}
.gal__btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.3;transition:transform .4s var(--ease)}
.gal__btn:hover:not(:disabled){background:var(--led);border-color:var(--led);color:var(--ink)}
#galNext:hover:not(:disabled) svg{transform:translateX(3px)}
#galPrev:hover:not(:disabled) svg{transform:translateX(-3px)}
.gal__btn:disabled{opacity:.3;cursor:default}

.nums{padding:clamp(50px,9vh,90px) var(--gut) clamp(60px,10vh,100px);border-top:1px solid rgba(243,239,232,.08)}
.nums .stats{margin-top:0;border-top:0}
.nums .stats > div{padding-top:0}

/* ---------- 14. Dados, grão, marquee, números ---------- */
.mono{font-family:var(--mono);font-weight:400;letter-spacing:.04em}
.eyebrow--led{color:var(--led);margin-bottom:26px;display:flex;align-items:center;gap:16px}
.eyebrow--led::before{content:"";width:42px;height:2px;background:var(--led);box-shadow:0 0 12px var(--led)}
/* grão analógico sobre as seções escuras (herdado da v1) */
.grain{position:relative;isolation:isolate}
.grain::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;opacity:.07;mix-blend-mode:screen;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}


.sig{grid-template-columns:repeat(3,1fr)}
.sig__n{font-size:17px}
.sig__item p{max-width:36ch}
.stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(70px,12vh,130px);border-top:1px solid rgba(243,239,232,.14)}
.stats > div{padding:28px 0 0;position:relative}
.stats > div + div{padding-left:clamp(16px,2.4vw,40px);border-left:1px solid rgba(243,239,232,.1)}
.stats dt{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone-2)}
.stats dd{font-family:var(--serif);font-size:clamp(3.2rem,7vw,7.4rem);line-height:1;letter-spacing:-.03em;margin-top:18px;font-variant-numeric:lining-nums tabular-nums}
.stats dd small{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--led);margin-left:10px;vertical-align:.35em}

/* ---------- 16. MATERIAIS: amostras em gradiente + link LED ---------- */
.link-led{display:inline-flex;gap:12px;align-items:center;margin-top:34px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--led);padding-bottom:6px;border-bottom:1px solid rgba(111,198,222,.4);transition:border-color .5s var(--ease)}
.link-led:hover{border-color:var(--led)}
.link-led .arr{transition:transform .5s var(--ease)}
.link-led:hover .arr{transform:translateX(4px)}

/* ---------- 17. DEPOIMENTO ---------- */
.quote{position:relative;overflow:hidden;background:var(--paper-2);padding:clamp(110px,18vh,200px) var(--gut)}
.quote__mark{position:absolute;left:var(--gut);top:clamp(10px,4vh,50px);font-family:var(--serif);font-style:italic;font-size:clamp(14rem,30vw,30rem);line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(22,20,18,.14);pointer-events:none}
.quote blockquote{position:relative;max-width:1100px;margin-left:auto}
.quote p{font-family:var(--serif);font-size:clamp(1.8rem,3.8vw,4rem);line-height:1.14;letter-spacing:-.015em}
.quote p .w{opacity:.16;display:inline-block}
.quote p em{color:var(--brass)}
.quote footer{margin-top:clamp(30px,5vh,50px);color:var(--stone);font-size:14px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.quote footer::before{content:"";width:42px;height:1px;background:currentColor}
.quote footer .mono{color:var(--ink);text-transform:uppercase;font-size:12px;letter-spacing:.14em}

/* ---------- 15. WGLA: marca tipográfica ---------- */
.brand__txt b{font-family:var(--serif);font-weight:500;font-size:22px;letter-spacing:.18em;line-height:1}
.brand__txt small{font-size:8px;letter-spacing:.52em;margin-top:5px}
.intro__logo{display:flex;gap:.18em;font-family:var(--serif);font-size:clamp(3.4rem,8vw,6rem);line-height:1;overflow:hidden;padding-bottom:.06em}
.intro__logo span{display:inline-block}
.intro__horizon{width:min(320px,70vw);height:2px;margin-top:22px;background:var(--led);box-shadow:0 0 18px 2px rgba(111,198,222,.55);transform-origin:center}
.intro__word{margin-top:20px;letter-spacing:.62em;padding-left:.62em}

/* empreendimentos: legenda com nome e local */
.pi figcaption span{display:flex;flex-direction:column;font-family:var(--serif);font-size:clamp(1.2rem,1.6vw,1.6rem);color:var(--ink);line-height:1.15}
.pi figcaption small{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--stone);margin-top:6px}
.pi figcaption{max-width:340px}

.mat__ctas{display:flex;flex-wrap:wrap;align-items:center;gap:26px;margin-top:40px}
.mat__ctas .link-led{margin-top:0}

/* ---------- 16. PARCEIROS ---------- */
.partners{padding:clamp(100px,16vh,180px) var(--gut);display:grid;grid-template-columns:5fr 7fr;gap:clamp(30px,6vw,110px);align-items:start}
.partners__head,.contact__head{position:sticky;top:clamp(100px,16vh,140px)}
.partners__eyebrow{color:var(--stone);display:flex;align-items:center;gap:16px;margin-bottom:26px}
.partners__eyebrow::before{content:"";width:42px;height:1px;background:currentColor}
.partners h2,.contact h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,5vw,5.6rem);line-height:.98;letter-spacing:-.025em}
.partners h2 em,.contact h2 em{color:var(--brass)}
.partners__head > p:last-child,.contact__head > p{color:var(--stone);max-width:38ch;margin-top:26px}
.plist{list-style:none;border-top:1px solid rgba(22,20,18,.16)}
.plist li{display:grid;grid-template-columns:56px 1fr auto;align-items:baseline;gap:16px;padding:clamp(18px,2.8vh,28px) 0;border-bottom:1px solid rgba(22,20,18,.16);position:relative}
.plist li::before{content:"";position:absolute;left:0;top:-1px;height:2px;width:100%;background:var(--led);box-shadow:0 0 12px var(--led);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease)}
.plist li:hover::before{transform:scaleX(1)}
.plist .mono{font-size:12px;color:var(--stone)}
.plist b{font-family:var(--serif);font-weight:400;font-size:clamp(1.8rem,3.6vw,3.6rem);line-height:1;letter-spacing:-.02em;transition:transform .7s var(--ease),color .5s}
.plist i{font-style:normal;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--stone)}
.plist:hover b{color:rgba(22,20,18,.3)}
.plist li:hover b{color:var(--ink);transform:translateX(clamp(8px,1.6vw,26px))}

/* ---------- 17. CONTATO ---------- */
.contact{padding:clamp(100px,16vh,180px) var(--gut);background:var(--paper-2);display:grid;grid-template-columns:5fr 7fr;gap:clamp(30px,6vw,110px);align-items:start}
.contact__list{list-style:none;margin-top:clamp(30px,5vh,50px);border-top:1px solid rgba(22,20,18,.16)}
.contact__list li{display:grid;grid-template-columns:90px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid rgba(22,20,18,.16);font-size:15px}
.contact__list .mono{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--stone);padding-top:.25em}
.contact__list a{transition:color .3s}
.contact__list a:hover{color:var(--brass)}
.form{display:flex;flex-direction:column;gap:clamp(18px,3vh,28px)}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2vw,30px)}
.field{display:flex;flex-direction:column;gap:8px}
.field > span{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.field input,.field select,.field textarea{font:inherit;font-size:17px;color:var(--ink);background:transparent;border:0;border-bottom:1px solid rgba(22,20,18,.28);border-radius:0;padding:10px 0 12px;outline:none;transition:border-color .4s var(--ease);width:100%}
.field select{appearance:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%236E6860' stroke-width='1.5'/%3E%3C/svg%3E") right center/18px no-repeat;padding-right:28px;cursor:pointer}
.field textarea{resize:vertical;min-height:110px}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brass)}
.field.err input,.field.err textarea{border-color:#B3261E}
.check{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--stone);cursor:pointer}
.check input{margin-top:3px;width:16px;height:16px;accent-color:var(--brass);flex:none}
.check a{text-decoration:underline;text-underline-offset:3px}
.check.err{color:#B3261E}
.form__foot{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:8px}
.form__status{font-size:14px;color:var(--stone);max-width:40ch}
.form__status.ok{color:var(--ink)}

/* CTA: sigla fantasma em contorno */
.cta__ghost{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--serif);font-size:clamp(10rem,34vw,34rem);line-height:.8;letter-spacing:.04em;color:transparent;-webkit-text-stroke:1px rgba(243,239,232,.08);pointer-events:none;white-space:nowrap}
.ftr__legal a:hover{color:var(--led)}

/* botão flutuante de contato */
.fab{position:fixed;right:clamp(16px,2.4vw,32px);bottom:clamp(16px,2.4vw,32px);z-index:80;display:flex;align-items:center;gap:10px;padding:14px 20px 14px 16px;border-radius:999px;background:var(--ink);color:var(--paper);box-shadow:0 10px 30px rgba(22,20,18,.28);font-size:12px;letter-spacing:.16em;text-transform:uppercase;transform:translateY(140%);transition:transform .7s var(--ease),background .4s,color .4s}
.fab.on{transform:none}
.fab svg{width:18px;height:18px;fill:none;stroke:var(--led);stroke-width:1.5;transition:stroke .4s}
.fab:hover{background:var(--led);color:var(--ink)}
.fab:hover svg{stroke:var(--ink)}

/* ---------- 19. CTA ---------- */
.cta{position:relative;overflow:hidden;padding:clamp(120px,20vh,220px) var(--gut) clamp(90px,14vh,150px);text-align:center}
.cta__led{position:absolute;left:0;right:0;top:50%;height:2px;background:var(--led);box-shadow:0 0 22px 3px rgba(111,198,222,.5);transform:scaleX(0);opacity:.85}
.cta__eyebrow{position:relative;white-space:nowrap;justify-content:center;margin-bottom:30px}
.cta h2{position:relative;font-family:var(--serif);font-weight:400;font-size:clamp(3rem,10vw,11rem);line-height:.92;letter-spacing:-.03em}
.cta h2 em{color:var(--led)}
.cta p{position:relative;color:var(--stone-2);max-width:40ch;margin:clamp(26px,5vh,46px) auto 0}
.cta__btns{position:relative;display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:34px}

/* ---------- 20. FOOTER ---------- */
.ftr{background:var(--ink);color:var(--paper);padding:0 var(--gut) 30px;border-top:1px solid rgba(243,239,232,.1)}
.ftr__top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;padding:56px 0 46px;font-size:14px;line-height:1.7}
.ftr__top p{color:var(--stone-2)}
.ftr__about{max-width:36ch}
.ftr__about .mono{display:inline-block;margin-top:12px;font-size:11px}
.ftr__top h4{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--stone-2);font-weight:500;margin-bottom:16px}
.ftr__top ul{list-style:none;display:flex;flex-direction:column;gap:8px;font-size:14px}
.ftr__top a:hover{color:var(--led)}
.ftr__word{font-family:var(--serif);font-size:clamp(5rem,26vw,26rem);letter-spacing:.12em;font-weight:300;line-height:1;white-space:nowrap;overflow:hidden;padding:10px 0 26px .12em;border-bottom:1px solid rgba(243,239,232,.1);text-align:center}
.ftr__word span{display:inline-block}
.ftr__legal{display:flex;justify-content:space-between;gap:30px;padding-top:22px;font-size:12px;color:var(--stone-2);line-height:1.55}
.ftr__legal p{max-width:78ch}

/* ---------- 21. RESPONSIVO ---------- */
@media (max-width:1100px){
  .nav{gap:22px}
  .sig{grid-template-columns:repeat(2,1fr);row-gap:40px}
  .ftr__top{grid-template-columns:1fr 1fr}
}
@media (max-width:899px){
  .nav,.hdr .btn{display:none}
  .burger{display:block}
  .hero h1{font-size:clamp(2.7rem,13.4vw,5.6rem)}
  .hero__scroll{display:none}
  .sig{grid-template-columns:1fr;gap:34px}
  .port__head{flex-direction:column;align-items:flex-start;gap:10px;top:84px}
  .port__head p{text-align:left}
  .port__track{padding-left:var(--gut);padding-top:150px;gap:34px}
  .pi--t{--h:min(52svh,560px)}
  .pi--m{--h:min(36svh,380px)}
  .pi--s{--h:min(30svh,320px)}
  .pi--up,.pi--down{align-self:center;margin:0;transform:none}
  .pi .frame{max-width:82vw}
  /* no mobile, a miniatura aparece na linha ativa (substitui o preview flutuante) */
  .sw{flex-basis:86%}
  .gal__btn{width:46px;height:46px}
  .sig,.sig{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .stats > div:nth-child(3){padding-left:0;border-left:0}
  .stats > div:nth-child(n+3){margin-top:28px;border-top:1px solid rgba(243,239,232,.1)}
  .mat__grid,.partners,.contact,.form__row{grid-template-columns:1fr}
  .partners__head,.contact__head{position:static}
  .plist li{grid-template-columns:34px 1fr}
  .plist i{display:none}
  .fab span{display:none}
  .fab{padding:15px}
  .hero{padding-top:104px}
  .hero__bg::after{background:linear-gradient(0deg,rgba(22,20,18,.92) 0%,rgba(22,20,18,.55) 60%,rgba(22,20,18,.4) 100%)}
  .show__top{top:78px}
  .show__media{width:62vw;height:44svh}
  .show__txt{grid-template-columns:1fr;gap:18px}
  .show__title{grid-row:auto;font-size:clamp(2.6rem,12vw,4rem)}
  .show__meta{gap:18px}
  .ftr__top{grid-template-columns:1fr 1fr}
  .ftr__top > div:first-child{grid-column:1/-1}
  .ftr__legal{flex-direction:column;gap:10px}
}
@media (max-width:420px){
  .sig{grid-template-columns:1fr}
  .hero__ctas .btn{padding:14px 18px}
  .hero__kicker::before{display:none}
  .stats dd{font-size:2.8rem}
  .show__meta{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
  .hero__scroll i{animation:none}
}

/* ---------- 22. AJUSTES WGLA ---------- */
.port__track{padding-top:clamp(170px,22vh,220px)}
.pi--t{--h:min(54svh,540px)}
.pi--up{transform:translateY(-3svh)}
.show__shade{background:linear-gradient(0deg,rgba(22,20,18,.95) 0%,rgba(22,20,18,.82) 38%,rgba(22,20,18,.45) 70%,rgba(22,20,18,.25) 100%)}
@media (max-width:899px){.port__track{padding-top:170px}}

/* ---------- 23. REVISÃO: vídeo na hero, menu transparente, fonte única,
   só o Residencial Ibiza no escuro ---------- */
:root{--black:#0D0C0B}
/* menu sempre transparente; só troca a cor do texto conforme o fundo */
.hdr,.hdr.dark,.hdr.scrolled,.hdr.dark.scrolled{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
/* fonte única: títulos em Hanken Grotesk, leves e com tracking fechado */
.hero h1,.manifesto__txt,.show__title,.mat__head h2,.partners h2,.contact h2,.cta h2,.port__head h2,.quote p,.stats dd{font-weight:300;letter-spacing:-.04em}
.sig__item h3,.plist b,.mlist li b,.sw figcaption b,.pi figcaption span,.show__meta dd,.port__end p{font-weight:400;letter-spacing:-.02em}
.brand__txt b{font-weight:600;letter-spacing:.2em}
.intro__logo{font-weight:300;letter-spacing:.06em}
.ftr__word{font-weight:200;letter-spacing:.06em}
.mono{letter-spacing:.08em}
/* vídeo da hero */
.hero__bg video{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
/* intro clara */
.intro{background:var(--paper);color:var(--ink)}
/* números e sobre: claros */
.nums{border-top:0;padding-top:clamp(70px,11vh,110px)}
.stats > div + div{border-left-color:rgba(22,20,18,.12)}
.stats dt{color:var(--stone)}
.stats dd small{color:var(--brass)}
.manifesto__label{color:var(--brass)}
.manifesto__label::before{background:var(--brass);box-shadow:none;height:1px}
.manifesto__txt .w{opacity:.12}
.manifesto__txt em{color:var(--brass)}
.sig{border-top-color:rgba(22,20,18,.14)}
.sig__n{color:var(--brass)}
.sig__item p{color:var(--stone)}
/* Residencial Ibiza: as duas seções em preto */
.show,.mat{background:var(--black)}
.show__top{color:var(--stone-2)}
.show__media{background:#1a1816}
/* CTA e rodapé claros */
.cta{color:var(--ink)}
.cta__ghost{-webkit-text-stroke:1px rgba(22,20,18,.08)}
.cta__eyebrow{color:var(--brass)}
.cta h2 em{color:var(--brass)}
.cta p{color:var(--stone)}
.ftr{background:var(--paper-2);color:var(--ink);border-top:1px solid rgba(22,20,18,.1)}
.ftr__top p,.ftr__top h4,.ftr__legal{color:var(--stone)}
.ftr__top a:hover,.ftr__legal a:hover{color:var(--brass)}
.ftr__word{border-bottom-color:rgba(22,20,18,.12)}
@media (max-width:899px){.stats > div:nth-child(n+3){border-top-color:rgba(22,20,18,.12)}}

/* ---------- 24. REVISÃO 2: menu com desfoque que some ao rolar, azul-mar,
   WhatsApp, logos de parceiros, foto no rodapé ---------- */
.hdr,.hdr.scrolled{background:rgba(243,239,232,.55);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);border-bottom:1px solid rgba(22,20,18,.06);transition:transform .6s var(--ease),background .5s var(--ease),color .5s var(--ease),padding .5s var(--ease)}
.hdr.dark,.hdr.dark.scrolled{background:rgba(13,12,11,.28);border-bottom-color:rgba(243,239,232,.08)}
.hdr.hide{transform:translateY(-101%)}
.btn--solid::before{background:var(--led)}
.btn--solid:hover{color:var(--ink)}

.plogos{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(22,20,18,.14);border-left:1px solid rgba(22,20,18,.14)}
.plogos li{position:relative;display:grid;place-items:center;aspect-ratio:4/3;padding:clamp(20px,3vw,44px);border-right:1px solid rgba(22,20,18,.14);border-bottom:1px solid rgba(22,20,18,.14);background:var(--paper);transition:background .5s var(--ease)}
.plogos li::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease)}
.plogos li:hover{background:#fff}
.plogos li:hover::before{transform:scaleX(1)}
.plogos img{width:auto;max-width:min(78%,200px);max-height:clamp(64px,7vw,104px);object-fit:contain;filter:grayscale(1) contrast(1.05);opacity:.72;transition:filter .5s var(--ease),opacity .5s var(--ease),transform .7s var(--ease)}
.plogos li:hover img{filter:none;opacity:1;transform:scale(1.04)}
@media (hover:none){.plogos img{filter:none;opacity:1}}


.fab{padding:0;width:60px;height:60px;justify-content:center;background:#25D366;color:#fff;box-shadow:0 10px 30px rgba(18,140,126,.35)}
.fab svg{width:30px;height:30px;fill:currentColor;stroke:none}
.fab:hover{background:#1EBE5A;color:#fff}
.fab:hover svg{stroke:none}
@media (max-width:899px){.fab{width:54px;height:54px;padding:0}.plogos{grid-template-columns:repeat(2,1fr)}}
