/* ============================ TOKENS ============================ */
:root{
  --ink:#0b0a08;
  --bg:#0d0b09;
  --bg-2:#141110;
  --paper:#f3ece1;
  --paper-dim:#cdbfab;
  --sand:#b19a7c;
  --travertine:#c9b492;
  --amber:#e0a25a;
  --amber-deep:#c07f38;
  --line:rgba(243,236,225,.16);
  --line-soft:rgba(243,236,225,.08);
  --ease:cubic-bezier(.7,0,.15,1);
  --ease-soft:cubic-bezier(.22,1,.36,1);
  --s1:4px; --s2:8px; --s3:16px; --s4:24px; --s5:32px; --s6:48px; --s7:64px; --s8:96px;
  --shell:min(1320px,92vw);
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{
  background:var(--bg);color:var(--paper);font-family:var(--sans);
  font-weight:300;line-height:1.6;letter-spacing:.01em;
  overflow-x:hidden;
}
body.lock{overflow:hidden;height:100vh}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
::selection{background:var(--amber);color:var(--ink)}
/* keyboard focus — elegant, on-brand, only for keyboard users */
:focus{outline:none}
:focus-visible{outline:2px solid var(--amber);outline-offset:4px;border-radius:3px}
.btn:focus-visible,.to-talk:focus-visible,.wa:focus-visible,.cta:focus-visible{outline-offset:5px}
.skip-link{position:fixed;top:-60px;left:16px;z-index:1100;background:var(--amber);color:var(--ink);
  padding:12px 18px;border-radius:8px;font-size:13px;letter-spacing:.04em;transition:top .25s ease}
.skip-link:focus{top:16px}

/* PERSISTENT ARCHITECTURAL BACKGROUND (image) — fixed, behind everything */
.backdrop{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:#0a0908}
.backdrop-img{position:absolute;inset:-8%;background:url("https://d8j0ntlcm91z4.cloudfront.net/user_3H5jt47teUIAYyvUzIPvBQGXmMy/hf_20260806_214504_7cabec84-1246-4dee-8097-53fa855f13db_min.webp") center/cover no-repeat;
  filter:brightness(.72) contrast(1.05) saturate(.98);transform:scale(1.06);will-change:transform}
.backdrop::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,7,6,.28),rgba(8,7,6,.4) 50%,rgba(8,7,6,.56))}
/* evolving 3D soul (blueprint -> reality) over the backdrop */
.soul{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;display:block;opacity:0;transition:opacity 1.6s ease}
body.soul-on .soul{opacity:1}
main{position:relative;z-index:10}

/* content sits on frosted glass so the architecture breathes behind every section */
body.bg main > section:not(#hero){background-color:rgba(9,8,7,.3);-webkit-backdrop-filter:blur(6px) saturate(1.06);backdrop-filter:blur(6px) saturate(1.06)}
body.bg #confiar,body.bg #vozes,body.bg #imoveis,body.bg #conversa,body.bg #metodo,body.bg #quem{background:rgba(9,8,7,.3)}
body.bg .marquee{background:rgba(9,8,7,.26);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
body.bg footer{background:rgba(6,5,4,.5)}
/* hero stays fully opaque over the backdrop (its own world) */
body.bg #hero{background:transparent}
@media(max-width:900px){
  /* blur is expensive while scrolling on phones — use opacity instead */
  body.bg main > section:not(#hero),
  body.bg #confiar,body.bg #vozes,body.bg #imoveis,body.bg #conversa,body.bg #metodo,body.bg #quem{background-color:rgba(9,8,7,.34);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
}

/* film grain + vignette overlays (always on) */
.grain{
  position:fixed;inset:-50%;z-index:900;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  animation:grain 6s steps(6) infinite;mix-blend-mode:overlay;
}
@keyframes grain{
  0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-5%)}
  60%{transform:translate(-2%,4%)}80%{transform:translate(5%,2%)}100%{transform:translate(0,0)}
}
.vignette{position:fixed;inset:0;z-index:895;pointer-events:none;
  box-shadow:inset 0 0 200px 40px rgba(0,0,0,.55), inset 0 0 60px 0 rgba(0,0,0,.4);}

/* day -> night colour grade (scroll-driven) */
.grade{position:fixed;inset:0;z-index:893;pointer-events:none;mix-blend-mode:soft-light;will-change:opacity}
.grade.dawn{opacity:.55;background:radial-gradient(120% 80% at 70% 8%,rgba(224,162,90,.55),rgba(224,120,60,.12) 45%,transparent 70%)}
.grade.night{opacity:0;background:linear-gradient(180deg,rgba(30,52,96,.5),rgba(10,16,34,.66))}

/* section dock */
.dock{position:fixed;right:clamp(16px,2.4vw,30px);top:50%;transform:translateY(-50%);z-index:690;
  display:flex;flex-direction:column;gap:16px;align-items:flex-end;opacity:0;transition:opacity .6s}
.dock button{display:flex;align-items:center;gap:10px;background:none;border:none;cursor:pointer;padding:0;color:var(--paper-dim)}
.dock button .d{width:7px;height:7px;border-radius:50%;border:1px solid rgba(243,236,225,.4);transition:.4s var(--ease-soft)}
.dock button .t{font-size:10px;letter-spacing:.16em;text-transform:uppercase;opacity:0;transform:translateX(6px);transition:.4s var(--ease-soft);white-space:nowrap}
.dock button:hover .t{opacity:.8;transform:none}
.dock button.on .d{background:var(--amber);border-color:var(--amber);transform:scale(1.15);box-shadow:0 0 12px 2px rgba(224,162,90,.5)}
.dock button.on .t{opacity:1;transform:none;color:var(--paper)}

/* kinetic marquee connector */
.marquee{position:relative;overflow:hidden;padding:clamp(22px,4.5vh,50px) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.mq-track{display:flex;width:max-content;will-change:transform}
.mq-track .it{font-family:var(--serif);font-weight:300;font-size:clamp(24px,5vw,60px);line-height:1;white-space:nowrap;
  padding-right:.5em;color:transparent;-webkit-text-stroke:1px rgba(243,236,225,.5);text-stroke:1px rgba(243,236,225,.5)}
.mq-track .it .amb{-webkit-text-stroke:1px var(--amber-deep);color:transparent}
.mq-track .it b{font-weight:300;color:var(--paper);-webkit-text-stroke:0}

/* cursor light */
.cursor-light{position:fixed;top:0;left:0;width:380px;height:380px;margin:-190px 0 0 -190px;
  border-radius:50%;pointer-events:none;z-index:880;mix-blend-mode:screen;opacity:0;
  background:radial-gradient(circle,rgba(233,224,208,.08),rgba(233,224,208,.03) 42%,transparent 66%);
  transition:opacity .6s ease;will-change:transform}

/* custom cursor (desktop) */
.cur{position:fixed;top:0;left:0;z-index:885;pointer-events:none;opacity:0;mix-blend-mode:difference;will-change:transform}
.cur .dot{position:absolute;width:6px;height:6px;border-radius:50%;background:#fff;transform:translate(-50%,-50%)}
.cur .ring{position:absolute;width:36px;height:36px;border:1px solid rgba(255,255,255,.7);border-radius:50%;transform:translate(-50%,-50%);
  transition:width .35s var(--ease-soft),height .35s var(--ease-soft),background .35s}
.cur .lbl{position:absolute;transform:translate(-50%,-50%);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:#fff;opacity:0;transition:opacity .3s;white-space:nowrap}
.cur.hot .ring{width:74px;height:74px;background:rgba(255,255,255,.05)}
.cur.hot .lbl{opacity:1}
body.cursor-on,body.cursor-on a,body.cursor-on .home,body.cursor-on .close,body.cursor-on button{cursor:none}

/* hero floating dust */
#hero .dust{position:absolute;inset:0;width:100%;height:100%;z-index:8;pointer-events:none;opacity:.6}

/* menu button */
.chrome-r{display:flex;align-items:center;gap:clamp(14px,2vw,26px)}
.menu-btn{width:44px;height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  background:none;border:none;cursor:pointer;padding:0;color:var(--paper)}
.menu-btn span{display:block;width:26px;height:1.5px;background:currentColor;transition:transform .4s var(--ease),opacity .3s;transform-origin:center}
.menu-btn.open span:nth-child(1){transform:translateY(3.75px) rotate(45deg)}
.menu-btn.open span:nth-child(2){transform:translateY(-3.75px) rotate(-45deg)}

/* fullscreen menu */
.menu{position:fixed;inset:0;z-index:960;visibility:hidden;pointer-events:none}
.menu.on{visibility:visible;pointer-events:auto}
.menu .menu-bg{position:absolute;inset:0;background:#080706;clip-path:inset(0 0 100% 0);will-change:clip-path;transition:clip-path .8s var(--ease)}
.menu.on .menu-bg{clip-path:inset(0 0 0% 0)}
.menu.closing .menu-bg{clip-path:inset(100% 0 0 0)}
.menu .menu-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(90% 70% at 80% 10%,rgba(224,162,90,.14),transparent 60%)}
.menu-inner{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;
  width:var(--shell);margin:0 auto;padding:clamp(90px,14vh,140px) 0 clamp(40px,8vh,80px)}
.menu-list{display:flex;flex-direction:column;gap:clamp(4px,1.2vh,12px)}
.menu-list a{display:flex;align-items:baseline;gap:clamp(16px,3vw,40px);position:relative;width:fit-content;
  font-family:var(--serif);font-weight:300;font-size:clamp(34px,7vw,80px);line-height:1.05;color:var(--paper);
  opacity:0;transform:translateY(34px);
  transition:color .4s,padding-left .5s var(--ease-soft),opacity .6s var(--ease-soft),transform .7s var(--ease-soft)}
.menu.on .menu-list a{opacity:1;transform:none}
.menu.on .menu-list a:nth-child(1){transition-delay:.18s}
.menu.on .menu-list a:nth-child(2){transition-delay:.24s}
.menu.on .menu-list a:nth-child(3){transition-delay:.30s}
.menu.on .menu-list a:nth-child(4){transition-delay:.36s}
.menu.on .menu-list a:nth-child(5){transition-delay:.42s}
.menu.on .menu-list a:nth-child(6){transition-delay:.48s}
.menu.on .menu-list a:nth-child(7){transition-delay:.54s}
.menu .menu-foot{opacity:0;transition:opacity .6s ease .5s}
.menu.on .menu-foot{opacity:1}
.menu-list a i{font-style:normal;font-size:clamp(11px,1.3vw,15px);letter-spacing:.2em;color:var(--amber);font-family:var(--sans);transform:translateY(-.4em)}
.menu-list a span{position:relative;transition:opacity .4s}
.menu-list a::after{content:"";position:absolute;left:0;bottom:.12em;height:1px;width:0;background:var(--amber);transition:width .5s var(--ease-soft)}
.menu-list a:hover{padding-left:14px}
@media(hover:hover){.menu-list a:hover span{opacity:.55}.menu-list a:hover::after{width:100%}}
.menu-list a .ln{overflow:hidden;display:inline-block}
.menu-foot{display:flex;gap:clamp(32px,6vw,90px);margin-top:clamp(40px,7vh,80px);padding-top:var(--s5);border-top:1px solid var(--line);flex-wrap:wrap}
.menu-foot p{color:var(--paper-dim);font-size:14px;margin-top:10px;line-height:1.6}
.menu-foot a:hover{color:var(--paper)}

/* ============================ PRELOADER / UMBRAL ============================ */
.umbral{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;pointer-events:none}
.umbral .panel{position:absolute;top:0;bottom:0;width:50.5%;background:#000;z-index:2;
  will-change:transform}
.umbral .panel.l{left:0;transform:translateX(0)}
.umbral .panel.r{right:0;transform:translateX(0)}
.umbral .panel::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:linear-gradient(to bottom,transparent,rgba(224,162,90,.5),transparent)}
.umbral .panel.l::after{right:0}
.umbral .panel.r::after{left:0}
.umbral .seam{position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;z-index:3;
  background:linear-gradient(to bottom,transparent 0%,rgba(224,162,90,.0) 8%,rgba(255,220,170,.9) 50%,rgba(224,162,90,0) 92%,transparent);
  filter:blur(.4px);transform:scaleY(0);transform-origin:center;box-shadow:0 0 24px 4px rgba(224,162,90,.5)}
.umbral .intro{position:relative;z-index:4;text-align:center;opacity:0}
.umbral .intro .mark{font-family:var(--serif);font-weight:300;letter-spacing:.42em;
  font-size:clamp(22px,5vw,40px);padding-left:.42em;color:var(--paper)}
.umbral .intro .whisper{margin-top:var(--s3);font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--paper-dim)}
.umbral .count{position:absolute;bottom:var(--s6);left:0;right:0;text-align:center;z-index:4;
  font-size:11px;letter-spacing:.3em;color:var(--paper-dim);font-variant-numeric:tabular-nums}

/* ============================ CHROME / NAV ============================ */
.chrome{position:fixed;top:0;left:0;right:0;z-index:980;display:flex;align-items:center;justify-content:space-between;
  padding:var(--s4) clamp(20px,4vw,48px);mix-blend-mode:difference;opacity:0;transition:opacity .4s ease}
body.viewing .chrome{opacity:0!important;pointer-events:none}
.chrome .logo{font-family:var(--serif);letter-spacing:.34em;font-size:15px;padding-left:.34em}
.chrome .to-talk{font-size:11px;letter-spacing:.24em;text-transform:uppercase;border:1px solid rgba(255,255,255,.5);
  padding:10px 18px;border-radius:40px;transition:.4s var(--ease-soft)}
.chrome .to-talk:hover{background:#fff;color:#000}

/* side seam / progress — the door-gap that follows you */
.railseam{position:fixed;left:clamp(18px,4vw,42px);top:0;bottom:0;width:1px;z-index:680;
  background:var(--line-soft);opacity:0}
.railseam .fill{position:absolute;top:0;left:-.5px;width:2px;height:0;
  background:linear-gradient(to bottom,var(--amber),var(--amber-deep));box-shadow:0 0 12px 1px rgba(224,162,90,.5)}
.railseam .cap{position:absolute;left:-3px;width:7px;height:7px;border-radius:50%;background:var(--amber);
  box-shadow:0 0 14px 3px rgba(224,162,90,.6);transform:translateY(-3.5px)}

/* ============================ STRUCTURE ============================ */
main{position:relative;z-index:10}
.chapter{position:relative;width:100%}
.shell{width:var(--shell);margin:0 auto}

/* chapter meta label */
.qmark{display:flex;align-items:baseline;gap:var(--s3);margin-bottom:var(--s5)}
.qmark .idx{font-family:var(--serif);font-size:13px;letter-spacing:.2em;color:var(--amber)}
.qmark .q{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--paper-dim)}
.qmark .rule{flex:1;height:1px;background:var(--line);transform-origin:left;transform:scaleX(0)}

/* the reveal media — DOORS OPEN left↔right (the signature) */
.reveal{position:relative;overflow:hidden;background:var(--bg-2)}
.reveal .media{position:absolute;inset:0;clip-path:inset(0 50% 0 50%);will-change:clip-path}
.reveal .media .img,.reveal .media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;will-change:transform;z-index:1}
.reveal .media .fallback{position:absolute;inset:0;z-index:0;background:
  radial-gradient(120% 90% at 70% 20%,rgba(224,162,90,.28),transparent 55%),
  linear-gradient(160deg,#1c1712,#0b0a08 70%);}
.reveal .media::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;z-index:5;
  background:linear-gradient(to bottom,transparent,rgba(255,220,170,.85),transparent);
  box-shadow:0 0 22px 3px rgba(224,162,90,.5);opacity:1;transition:opacity .5s ease}
.reveal.open .media::before{opacity:0}
.reveal .scrim{position:absolute;inset:0;z-index:6;background:linear-gradient(to top,rgba(8,7,6,.72),transparent 55%)}

/* type */
.eyebrow{font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--amber);font-weight:400}
h1,h2,h3{font-family:var(--serif);font-weight:300;line-height:1.02;letter-spacing:-.015em}
.display{font-size:clamp(46px,11vw,150px)}
.h-xl{font-size:clamp(34px,6.5vw,86px);line-height:1.02}
.h-lg{font-size:clamp(28px,4.6vw,60px)}
.lede{font-size:clamp(17px,2.1vw,23px);line-height:1.5;color:var(--paper);max-width:26ch}
.body{font-size:clamp(15px,1.35vw,18px);color:var(--paper-dim);max-width:52ch}
.body strong{color:var(--paper);font-weight:400}

/* line-reveal wrapper for split text */
.split .line{overflow:hidden}
.rise{opacity:0}

/* ============================ HERO ============================ */
#hero{height:100svh;min-height:620px;position:relative;display:flex;align-items:flex-end}
#hero .reveal{position:absolute;inset:0}
#hero .reveal .media{clip-path:inset(0 50% 0 50%)}
#hero .content{position:relative;z-index:20;width:var(--shell);margin:0 auto;padding-bottom:clamp(40px,9vh,110px)}
#hero .display{margin:var(--s3) 0 var(--s4)}
#hero .kicker{display:flex;gap:var(--s3);align-items:center;flex-wrap:wrap}
#hero .sub{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s5);flex-wrap:wrap;margin-top:var(--s4)}
.scrollcue{display:flex;align-items:center;gap:var(--s3);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--paper-dim)}
.scrollcue .bar{position:relative;width:52px;height:1px;background:var(--line);overflow:hidden}
.scrollcue .bar::after{content:"";position:absolute;inset:0;width:40%;background:var(--amber);animation:slide 2.4s var(--ease-soft) infinite}
@keyframes slide{0%{transform:translateX(-120%)}100%{transform:translateX(320%)}}

/* generic chapter padding */
.pad{padding:clamp(90px,16vh,190px) 0}
.pad-sm{padding:clamp(60px,9vh,110px) 0}

/* ============================ CH II — QUEM SOMOS ============================ */
#quem .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,88px);align-items:center}
#quem .reveal{height:min(74vh,640px);border-radius:2px}
.people{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);margin-top:var(--s6);padding-top:var(--s5);border-top:1px solid var(--line)}
.people .p{min-width:0}
.people .p .nm{font-family:var(--serif);font-size:18px;color:var(--paper)}
.people .p .rl{font-size:12px;letter-spacing:.06em;color:var(--paper-dim)}

/* ============================ CH III — CONFIAR ============================ */
#confiar{background:linear-gradient(180deg,var(--bg),#100d0b)}
#confiar .top{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:end}
.values{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(48px,8vh,96px)}
.values .v{background:var(--bg);padding:clamp(24px,3vw,40px) clamp(20px,2.4vw,32px);min-height:210px;display:flex;flex-direction:column;justify-content:space-between;transition:background .5s var(--ease-soft)}
.values .v:hover{background:var(--bg-2)}
.values .v .n{font-family:var(--serif);font-size:13px;color:var(--amber);letter-spacing:.1em}
.values .v .t{font-family:var(--serif);font-size:clamp(22px,2.4vw,30px);margin-top:auto}
.values .v .d{font-size:13.5px;color:var(--paper-dim);margin-top:var(--s3);line-height:1.5}
.stats{display:flex;flex-wrap:wrap;gap:clamp(28px,5vw,80px);margin-top:clamp(48px,8vh,90px);
  padding-top:var(--s6);border-top:1px solid var(--line)}
.stats .st{flex:1;min-width:180px}
.stats .st .big{font-family:var(--serif);font-size:clamp(40px,5vw,68px);line-height:1;color:var(--paper)}
.stats .st .lab{font-size:13px;color:var(--paper-dim);margin-top:var(--s3);max-width:24ch}

/* ============================ CH IV — COMO TRABALHAMOS ============================ */
.metodo-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,80px);align-items:start}
.metodo-head{position:sticky;top:22vh;align-self:start}
.metodo-prog{margin-top:var(--s6);width:1px;height:120px;background:var(--line);position:relative;overflow:hidden}
.metodo-prog .fill{position:absolute;top:0;left:-1px;width:3px;height:0;background:linear-gradient(var(--amber),var(--amber-deep));box-shadow:0 0 10px 1px rgba(224,162,90,.5)}
.steps{border-top:1px solid var(--line)}
.metodo-grid .steps{margin-top:0}
.steps .step{display:grid;grid-template-columns:120px 1fr auto;gap:clamp(16px,3vw,48px);align-items:baseline;
  padding:clamp(28px,4vh,52px) 0;border-bottom:1px solid var(--line);position:relative}
.steps .step .no{font-family:var(--serif);font-size:clamp(26px,3vw,40px);color:var(--amber)}
.steps .step .h{font-family:var(--serif);font-size:clamp(24px,3.2vw,42px);color:var(--paper)}
.steps .step .h span{display:block;font-family:var(--sans);font-size:14px;letter-spacing:.02em;color:var(--paper-dim);margin-top:var(--s3);max-width:46ch;font-weight:300}
.steps .step .kw{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--paper-dim);white-space:nowrap}

/* ============================ CH V — IMÓVEIS ============================ */
#imoveis{background:#0a0908}
.homes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,22px);margin-top:clamp(44px,8vh,88px)}
.home{position:relative;aspect-ratio:3/4.1;overflow:hidden;background:var(--bg-2);cursor:pointer;border:1px solid var(--line-soft);
  transition:transform .7s var(--ease-soft),box-shadow .7s var(--ease-soft),border-color .7s}
.home:hover{transform:translateY(-8px);box-shadow:0 40px 80px -20px rgba(0,0,0,.65);border-color:rgba(224,162,90,.35)}
.home .ph::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(115deg,transparent 34%,rgba(255,238,208,.22) 50%,transparent 64%);
  transform:translateX(-130%);transition:transform 1s var(--ease-soft)}
.home:hover .ph::after{transform:translateX(130%)}
.home .ph{position:absolute;inset:0}
.home .ph img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 1.1s var(--ease-soft),filter 1.1s var(--ease-soft);filter:brightness(.72) saturate(.96)}
.home .ph .fallback{position:absolute;inset:0;z-index:0;background:linear-gradient(160deg,#241d15,#0b0a08 72%)}
.home .glow{position:absolute;inset:0;opacity:0;transition:opacity .6s var(--ease-soft);
  background:radial-gradient(300px 300px at var(--mx,50%) var(--my,40%),rgba(224,162,90,.22),transparent 60%);z-index:2}
.home .meta{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:clamp(18px,2vw,26px);
  background:linear-gradient(to top,rgba(8,7,6,.82),transparent)}
.home .meta .nm{font-family:var(--serif);font-size:clamp(21px,2vw,27px);color:var(--paper)}
.home .meta .loc{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--paper-dim);margin-top:6px}
.home .meta .row{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s3);margin-top:var(--s3)}
.home .meta .px{font-size:13px;color:var(--travertine);letter-spacing:.02em}
.home .meta .open{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);opacity:0;transform:translateY(6px);transition:.5s var(--ease-soft)}
.home:hover .ph img{transform:scale(1.12);filter:brightness(.92) saturate(1.02)}
.home:hover .glow{opacity:1}
.home:hover .meta .open{opacity:1;transform:none}
@media(hover:none){.home .meta .open{opacity:1;transform:none}}

/* fullscreen property — the card becomes the room */
.viewer{position:fixed;inset:0;z-index:850;pointer-events:none;opacity:0;visibility:hidden}
.viewer.on{pointer-events:auto;opacity:1;visibility:visible}
.viewer .bg{position:absolute;inset:0;background:#080706;border:none;padding:0;margin:0;display:block;cursor:pointer;width:100%;height:100%}
.viewer .gal{position:absolute;inset:0;overflow:hidden;touch-action:none}
.viewer .gal-track{position:absolute;inset:0;display:flex;height:100%;will-change:transform}
.viewer .gal-slide{position:relative;flex:0 0 100%;height:100%;overflow:hidden}
.viewer .gal-slide img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;transform:scale(1.12);will-change:transform}
.viewer .gal-slide .fallback{position:absolute;inset:0;z-index:0;background:linear-gradient(160deg,#241d15,#0b0a08 72%)}
.viewer .gal::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(to top,rgba(6,5,4,.92),rgba(6,5,4,.1) 62%),linear-gradient(to right,rgba(6,5,4,.72),transparent 58%)}
.viewer .gal-ui{position:absolute;inset:0;z-index:3;pointer-events:none}
.viewer .gal-arrow{position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;border-radius:50%;
  border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.18);backdrop-filter:blur(6px);cursor:pointer;pointer-events:auto;
  transition:.4s var(--ease-soft)}
.viewer .gal-arrow:hover{background:#fff;border-color:#fff}
.viewer .gal-arrow::before{content:"";position:absolute;top:50%;left:50%;width:9px;height:9px;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;color:#fff;transition:color .3s}
.viewer .gal-arrow:hover::before{color:#000}
.viewer .gal-arrow.prev{left:clamp(14px,2.5vw,30px)}
.viewer .gal-arrow.prev::before{transform:translate(-30%,-50%) rotate(45deg)}
.viewer .gal-arrow.next{right:clamp(14px,2.5vw,30px)}
.viewer .gal-arrow.next::before{transform:translate(-70%,-50%) rotate(-135deg)}
.viewer .gal-meta{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);margin:var(--s2) 0 var(--s5);flex-wrap:wrap}
.viewer .gal-dots{display:flex;gap:9px}
.viewer .gal-dots button{width:26px;height:3px;border-radius:2px;border:none;background:rgba(255,255,255,.22);cursor:pointer;padding:0;transition:background .4s}
.viewer .gal-dots button.on{background:var(--amber)}
.viewer .gal-cap{font-size:12px;letter-spacing:.12em;color:var(--paper-dim)}
.viewer .gal-cap span{color:var(--travertine);font-variant-numeric:tabular-nums}
.viewer .gal-cap em{font-style:normal;margin-left:12px}
.viewer .panel-info{position:absolute;left:0;bottom:0;z-index:3;width:min(720px,92vw);padding:clamp(28px,5vw,70px);pointer-events:none}
/* let swipes pass through the info panel to the gallery, but keep controls tappable */
.viewer .panel-info a,.viewer .panel-info button,.viewer .gal-dots button{pointer-events:auto}
.viewer .panel-info .eyebrow{margin-bottom:var(--s3)}
.viewer .panel-info h3{font-size:clamp(38px,7vw,86px);margin-bottom:var(--s4)}
.viewer .panel-info .specs{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s5);margin:var(--s4) 0 var(--s5);
  padding-top:var(--s4);border-top:1px solid var(--line)}
.viewer .panel-info .specs .sp{min-width:90px}
.viewer .panel-info .specs .sp b{display:block;font-family:var(--serif);font-size:22px;font-weight:400;color:var(--paper)}
.viewer .panel-info .specs .sp i{font-style:normal;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--paper-dim)}
.viewer .panel-info .cta{display:inline-flex;align-items:center;gap:var(--s3);margin-top:var(--s3);
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);background:var(--amber);
  padding:14px 26px;border-radius:40px;transition:.4s var(--ease-soft)}
.viewer .panel-info .cta:hover{background:var(--paper)}
.viewer .close{position:absolute;top:clamp(18px,3vw,34px);right:clamp(18px,3vw,34px);z-index:4;padding:0;
  width:52px;height:52px;border:1px solid rgba(255,255,255,.4);border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:#fff;background:rgba(0,0,0,.2);backdrop-filter:blur(6px);transition:.4s var(--ease-soft);cursor:pointer}
.viewer .close:hover{background:#fff;color:#000;transform:rotate(90deg)}
.viewer .close::before{content:"";width:16px;height:1px;background:currentColor;position:absolute;transform:rotate(45deg)}
.viewer .close::after{content:"";width:16px;height:1px;background:currentColor;position:absolute;transform:rotate(-45deg)}

/* ============================ CH VI — MORAR ============================ */
#morar{position:relative}
#morar .reveal{position:absolute;inset:0}
#morar .reveal .media{clip-path:inset(0 50% 0 50%)}
#morar .content{position:relative;z-index:20;min-height:104svh;display:flex;align-items:center}
#morar .inner{width:var(--shell);margin:0 auto}
#morar .lines{max-width:min(92%,760px)}
#morar .lines .l{font-family:var(--serif);font-size:clamp(30px,5.2vw,72px);line-height:1.06;font-weight:300}
#morar .lines .l.dim{color:var(--paper-dim)}
#morar .foot{margin-top:var(--s6);max-width:40ch}

/* ============================ CH VII — DEPOIMENTOS ============================ */
#vozes{background:linear-gradient(180deg,#100d0b,var(--bg))}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,44px);margin-top:clamp(44px,8vh,88px)}
.quote{border-top:1px solid var(--amber-deep);padding-top:var(--s5)}
.quote .qt{font-family:var(--serif);font-size:clamp(19px,1.7vw,23px);line-height:1.42;color:var(--paper);font-weight:300}
.quote .by{margin-top:var(--s4);font-size:13px;letter-spacing:.04em;color:var(--paper-dim)}
.quote .by b{color:var(--travertine);font-weight:400}

/* ============================ CH VIII — CONTATO ============================ */
#conversa{position:relative;overflow:hidden;background:#080706}
#conversa .reveal{position:absolute;inset:0;opacity:.5}
#conversa .inner{position:relative;z-index:5;text-align:center;padding:clamp(110px,22vh,220px) 0}
#conversa .display{margin:var(--s4) 0}
#conversa .cta-row{display:flex;gap:var(--s4);justify-content:center;flex-wrap:wrap;margin-top:var(--s6)}
.btn{display:inline-flex;align-items:center;gap:12px;padding:16px 30px;border-radius:44px;font-size:12px;
  letter-spacing:.2em;text-transform:uppercase;transition:.4s var(--ease-soft)}
.btn.primary{background:var(--amber);color:var(--ink)}
.btn.primary:hover{background:var(--paper);transform:translateY(-2px)}
.btn.ghost{border:1px solid var(--line);color:var(--paper)}
.btn.ghost:hover{border-color:var(--paper);background:rgba(255,255,255,.04)}
.dot{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.6}

footer{position:relative;z-index:5;border-top:1px solid var(--line);padding:var(--s7) 0 var(--s6)}
footer .grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--s6);align-items:start}
footer .logo{font-family:var(--serif);font-size:26px;letter-spacing:.3em;padding-left:.3em}
footer .tag{color:var(--paper-dim);margin-top:var(--s3);max-width:32ch;font-size:14px}
footer h5{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--amber);margin-bottom:var(--s4)}
footer ul{list-style:none}
footer li{color:var(--paper-dim);font-size:14px;margin-bottom:10px}
footer li a:hover{color:var(--paper)}
footer .base{display:flex;justify-content:space-between;gap:var(--s4);flex-wrap:wrap;
  margin-top:var(--s7);padding-top:var(--s5);border-top:1px solid var(--line);font-size:12px;color:var(--paper-dim);letter-spacing:.04em}
footer .base .credit b{color:var(--travertine);font-weight:400}
footer .legal{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:var(--s6);
  font-size:11.5px;line-height:1.5;color:var(--paper-dim);letter-spacing:.03em}
footer .legal a:hover{color:var(--paper)}
footer .legal .sep{opacity:.5}
footer .legal .creci{letter-spacing:.12em;text-transform:uppercase;color:var(--travertine)}

/* floating whatsapp (mobile-first default) */
.wa{position:fixed;right:clamp(16px,4vw,28px);bottom:clamp(16px,4vw,28px);z-index:720;
  display:inline-flex;align-items:center;gap:10px;background:var(--amber);color:var(--ink);
  padding:13px 20px;border-radius:44px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  box-shadow:0 10px 40px rgba(0,0,0,.5);transform:translateY(140%);transition:transform .6s var(--ease-soft)}
.wa.show{transform:none}
.wa:hover{background:var(--paper)}

/* ============================ RESPONSIVE ============================ */
@media(max-width:900px){
  #quem .grid{grid-template-columns:1fr;gap:var(--s6)}
  #quem .reveal{height:62vh}
  #confiar .top{grid-template-columns:1fr;gap:var(--s5)}
  .values{grid-template-columns:1fr 1fr}
  .values .v{min-height:170px}
  /* homes -> swipe carousel */
  .homes{display:flex;grid-template-columns:none;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px 0 14px;scroll-padding-left:0;margin-left:calc(var(--s1)*-1)}
  .homes::-webkit-scrollbar{display:none}
  .home{flex:0 0 80%;scroll-snap-align:center;aspect-ratio:3/3.9}
  /* quotes -> swipe carousel */
  .quotes{display:flex;grid-template-columns:none;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:14px}
  .quotes::-webkit-scrollbar{display:none}
  .quote{flex:0 0 84%;scroll-snap-align:center}
  .swipe-hint{display:flex}
  .steps .step{grid-template-columns:60px 1fr;grid-template-areas:"no h" "no kw"}
  .steps .step .no{grid-area:no}.steps .step .h{grid-area:h}.steps .step .kw{grid-area:kw;text-align:left;margin-top:var(--s2)}
  footer .grid{grid-template-columns:1fr;gap:var(--s5)}
  .chrome .to-talk{display:none}
  #hero .sub .scrollcue{display:none}
  .railseam{display:none}
  .dock{display:none}
  .metodo-grid{grid-template-columns:1fr;gap:var(--s5)}
  .metodo-head{position:static}
  .metodo-prog{display:none}
  .viewer .panel-info{width:100%}
  /* keep the arrows on mobile — they are the reliable control (swipe also works) */
  .viewer .gal-arrow{width:46px;height:46px;top:38%}
  .viewer .gal-arrow.prev{left:10px}
  .viewer .gal-arrow.next{right:10px}
  .viewer .gal-dots button{height:6px;width:30px}
  .viewer .gal::after{background:linear-gradient(to top,rgba(6,5,4,.94),rgba(6,5,4,.15) 70%)}
}
@media(max-width:560px){
  .values{grid-template-columns:1fr}
  #morar .lines .l{font-size:clamp(28px,8vw,44px)}
  #hero .content{padding-bottom:clamp(28px,10vh,60px)}
  .menu-list{gap:2px}
}
/* swipe hint (mobile carousels) */
.swipe-hint{display:none;align-items:center;gap:10px;margin-top:var(--s4);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--paper-dim)}
.swipe-hint .ln{width:34px;height:1px;background:var(--line);position:relative;overflow:hidden}
.swipe-hint .ln::after{content:"";position:absolute;inset:0;width:40%;background:var(--amber);animation:slide 2.4s var(--ease-soft) infinite}

/* reduced motion / no-js safety: reveal everything */
.no-anim .reveal .media{clip-path:inset(0 0 0 0)!important}
.no-anim .rise{opacity:1!important;transform:none!important}
.no-anim .qmark .rule{transform:none!important}
@media(prefers-reduced-motion:reduce){
  .grain{animation:none}
  .scrollcue .bar::after{animation:none}
}