/* ============================================================
   MELHOR GROUP — quiet-luxury real estate
   ============================================================ */
/* Brand palette (Melhor Group Brand Book):
   Deep Emerald #14201A · Cape Cod #39473F · Ebb #E8E5E2 · Hampton #E3D0A7 · Gold #AA7D4A */
:root{
  --ink:#14201A; --ink-soft:#4F564C; --sand:#E8E5E2; --bone:#FAF8F4;
  --stone:#DCD6CC; --clay:#AA7D4A; --clay-deep:#8A6238; --olive:#39473F;
  --olive-deep:#243029; --line:#D6D0C6; --white:#fff;
  --hampton:#E3D0A7; --emerald:#39473F;

  --font-display:"Cormorant Garamond","Lovely",Georgia,serif; /* Lovely = brand primary */
  --font-body:"Helvetica Neue",Helvetica,"Tex Gyre Heros",Arial,sans-serif;

  --h-hero:clamp(2.9rem,8vw,7rem);
  --h1:clamp(2.3rem,5.4vw,4.6rem);
  --h2:clamp(1.9rem,3.6vw,3.2rem);
  --h3:clamp(1.35rem,2vw,1.75rem);
  --body:clamp(1rem,1.06vw,1.15rem);
  --eyebrow:.8rem;

  --container:1320px; --gutter:clamp(1.25rem,5vw,5.5rem);
  --r-img:14px; --r-card:18px; --r-btn:999px;
  --shadow-soft:0 22px 60px -28px rgba(28,27,25,.38);
  --shadow-card:0 30px 70px -34px rgba(28,27,25,.46);
  --ease:cubic-bezier(.22,1,.36,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body); color:var(--ink); background:var(--bone);
  font-size:var(--body); line-height:1.65; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
::selection{background:var(--clay);color:var(--bone)}

/* grain texture overlay */
.grain::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  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='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url%28%23n%29' opacity='0.5'/%3E%3C/svg%3E");
  opacity:.035; mix-blend-mode:multiply;
}

/* ---------- type helpers ---------- */
.eyebrow{
  font-size:var(--eyebrow); letter-spacing:.2em; text-transform:uppercase;
  font-weight:600; color:var(--clay); display:inline-flex; align-items:center; gap:.7em;
}
.eyebrow::before{content:"";width:26px;height:1px;background:currentColor;opacity:.7}
.eyebrow.center::before{display:none}
.display{font-family:var(--font-display);font-weight:500;line-height:1.04;letter-spacing:-.01em}
h1,h2,h3{font-family:var(--font-display);font-weight:500;line-height:1.06;letter-spacing:-.005em}
.serif-italic{font-style:italic;font-weight:400}
.lead{font-size:clamp(1.05rem,1.4vw,1.3rem);color:var(--ink-soft);max-width:46ch;text-wrap:pretty}
.muted{color:var(--ink-soft)}

.container{max-width:var(--container);margin:0 auto;padding-inline:var(--gutter)}
section{position:relative}
.pad{padding-block:clamp(4.5rem,9vw,9rem)}
.dark{background:var(--olive-deep);color:var(--sand)}
.dark .muted{color:#cdd0c2}
.dark .eyebrow{color:#cdb79f}
.ink-bg{background:var(--ink);color:var(--sand)}

/* ---------- buttons ---------- */
.btn{
  position:relative; display:inline-flex; align-items:center; gap:.6em;
  padding:.95em 1.7em; border-radius:var(--r-btn); font-weight:600; font-size:.95rem;
  letter-spacing:.01em; overflow:hidden; transition:transform .5s var(--ease),color .4s var(--ease);
  white-space:nowrap;
}
.btn svg{width:1.05em;height:1.05em;transition:transform .5s var(--ease)}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;transition:transform .55s var(--ease)}
.btn-primary{background:var(--clay);color:var(--bone)}
.btn-primary::after{background:var(--clay-deep);transform:translateY(101%)}
.btn-primary:hover::after{transform:translateY(0)}
.btn-primary:hover svg{transform:translateX(4px)}
.btn-ghost{border:1px solid currentColor;color:inherit}
.btn-ghost::after{background:var(--bone);transform:translateY(101%)}
.btn-ghost:hover{color:var(--ink)}
.btn-ghost:hover::after{transform:translateY(0)}
.dark .btn-ghost:hover{color:var(--ink)}
.btn-dark{background:var(--ink);color:var(--sand)}
.btn-dark::after{background:var(--clay);transform:translateY(101%)}
.btn-dark:hover::after{transform:translateY(0)}

.txtlink{display:inline-flex;align-items:center;gap:.5em;font-weight:600;color:var(--clay);
  letter-spacing:.01em;border-bottom:1px solid transparent;transition:gap .4s var(--ease)}
.txtlink svg{width:1em;height:1em;transition:transform .4s var(--ease)}
.txtlink:hover{gap:.8em}
.txtlink:hover svg{transform:translateX(3px)}

/* ============================================================
   TOP BAR + HEADER
   ============================================================ */
.site-top{position:fixed;inset:0 0 auto 0;z-index:200}
.announce{
  background:var(--olive); color:#eef0e6; font-size:.78rem; letter-spacing:.06em;
  display:flex; align-items:center; justify-content:center; gap:1.5rem; padding:.55rem 3rem;
  position:relative; text-transform:uppercase;
}
.announce b{color:#fff;font-weight:700}
.announce .dot{width:5px;height:5px;border-radius:50%;background:var(--clay);display:inline-block;margin-inline:.2rem}
.announce-close{position:absolute;right:1rem;top:50%;transform:translateY(-50%);
  width:26px;height:26px;display:grid;place-items:center;opacity:.7;border-radius:50%}
.announce-close:hover{opacity:1;background:rgba(255,255,255,.12)}
body.no-announce .announce{display:none}

.header{
  display:flex;align-items:center;justify-content:space-between;gap:2rem;
  padding:1.1rem var(--gutter); transition:background .5s var(--ease),padding .5s var(--ease),box-shadow .5s var(--ease);
}
.header.scrolled{background:rgba(251,249,245,.82);backdrop-filter:blur(16px);
  box-shadow:0 1px 0 var(--line),0 14px 40px -30px rgba(28,27,25,.5);padding-block:.7rem}

.brand{display:flex;align-items:center;gap:.7rem}
.brand .mono{width:38px;height:auto;transition:opacity .4s,transform .5s var(--ease)}
.brand .mono.ink{position:absolute;opacity:0}
.brand-name{display:flex;flex-direction:column;line-height:1}
.brand-name .m{font-family:var(--font-display);font-size:1.35rem;font-weight:600;letter-spacing:.14em;color:var(--bone);transition:color .4s}
.brand-name .g{font-size:.56rem;letter-spacing:.42em;color:#cdb79f;margin-top:.18em;padding-left:.1em}
.brand{position:relative}
.header:not(.scrolled) .brand .mono.cream{opacity:1}
.header:not(.scrolled) .brand .mono.ink{opacity:0}
.header.scrolled .brand .mono.cream{opacity:0}
.header.scrolled .brand .mono.ink{opacity:1}
.header.scrolled .brand-name .m{color:var(--ink)}
.header.scrolled .brand-name .g{color:var(--clay)}

.nav{display:flex;align-items:center;gap:2rem}
.nav-links{display:flex;align-items:center;gap:1.9rem;list-style:none}
.nav-links a{font-size:.9rem;font-weight:500;letter-spacing:.01em;color:var(--bone);
  position:relative;padding:.3em 0;opacity:.9;transition:opacity .3s}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--clay);transition:width .4s var(--ease)}
.nav-links a:hover{opacity:1}.nav-links a:hover::after{width:100%}
.header.scrolled .nav-links a{color:var(--ink-soft)}
.header.scrolled .nav-links a:hover{color:var(--ink)}
.header .header-cta{font-size:.85rem;padding:.7em 1.35em}
.header:not(.scrolled) .header-cta.btn-primary{box-shadow:0 14px 30px -16px rgba(0,0,0,.5)}

.burger{display:none;width:30px;height:22px;position:relative;z-index:320}
.burger span{position:absolute;left:0;height:2px;width:100%;background:var(--bone);transition:.4s var(--ease)}
.burger span:nth-child(1){top:0}.burger span:nth-child(2){top:10px}.burger span:nth-child(3){top:20px}
.header.scrolled .burger span{background:var(--ink)}
body.menu-open .burger span{background:var(--bone)}
body.menu-open .burger span:nth-child(1){top:10px;transform:rotate(45deg)}
body.menu-open .burger span:nth-child(2){opacity:0}
body.menu-open .burger span:nth-child(3){top:10px;transform:rotate(-45deg)}

/* mobile overlay menu */
.mobile-menu{position:fixed;inset:0;z-index:300;background:var(--olive-deep);
  clip-path:circle(0% at calc(100% - 40px) 40px);transition:clip-path .7s var(--ease);
  display:flex;flex-direction:column;justify-content:center;padding:var(--gutter);pointer-events:none}
body.menu-open .mobile-menu{clip-path:circle(150% at calc(100% - 40px) 40px);pointer-events:auto}
.mobile-menu ul{list-style:none;display:flex;flex-direction:column;gap:.2rem}
.mobile-menu a{font-family:var(--font-display);font-size:clamp(2rem,9vw,3rem);color:var(--sand);
  font-weight:500;transform:translateY(30px);opacity:0;transition:.6s var(--ease);display:inline-block}
body.menu-open .mobile-menu a{transform:none;opacity:1}
.mobile-menu li:nth-child(1) a{transition-delay:.15s}.mobile-menu li:nth-child(2) a{transition-delay:.2s}
.mobile-menu li:nth-child(3) a{transition-delay:.25s}.mobile-menu li:nth-child(4) a{transition-delay:.3s}
.mobile-menu li:nth-child(5) a{transition-delay:.35s}.mobile-menu li:nth-child(6) a{transition-delay:.4s}
.mobile-menu .mm-foot{margin-top:2.5rem;color:#cdd0c2;font-size:.85rem;letter-spacing:.04em;
  opacity:0;transition:.6s .5s var(--ease)}
body.menu-open .mobile-menu .mm-foot{opacity:1}
.mobile-menu .mm-banner{margin-top:1.4rem;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--clay)}
.mm-close{position:absolute;top:1.5rem;right:1.5rem;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:var(--sand);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);transition:background .3s,transform .3s;z-index:10}
.mm-close:hover{background:rgba(255,255,255,.2);transform:rotate(90deg)}
.mm-close svg{width:22px;height:22px}

/* ============================================================
   HERO
   ============================================================ */
.hero{height:100svh;min-height:620px;position:relative;overflow:hidden;display:flex;align-items:flex-end}
.hero-media{position:absolute;inset:0;z-index:0}
.hero-media img{width:100%;height:120%;object-fit:cover;will-change:transform;
  animation:kenburns 22s ease-in-out infinite alternate}
@keyframes kenburns{from{transform:scale(1.05)}to{transform:scale(1.16) translateY(-2%)}}
.hero-scrim{position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(28,27,25,.55) 0%,rgba(28,27,25,.12) 32%,rgba(28,27,25,.2) 60%,rgba(28,27,25,.86) 100%)}
.hero-inner{position:relative;z-index:2;width:100%;padding-bottom:clamp(2.5rem,6vw,5rem);color:var(--bone)}
.hero h1{font-size:var(--h-hero);color:var(--bone);max-width:16ch;font-weight:500;text-wrap:balance}
.hero .eyebrow{color:#e6c9aa;margin-bottom:1.4rem}
.hero-sub{font-size:clamp(1.05rem,1.5vw,1.35rem);max-width:42ch;margin-top:1.5rem;color:#ece7df}
.hero-actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.2rem}
.hero-foot{position:absolute;left:var(--gutter);right:var(--gutter);bottom:1.3rem;z-index:2;
  display:flex;justify-content:space-between;align-items:center;gap:1rem;color:#d9d4ca;
  font-size:.78rem;letter-spacing:.05em;border-top:1px solid rgba(255,255,255,.16);padding-top:1rem}
.hero-foot .tag{font-style:italic;font-family:var(--font-display);font-size:1.05rem;letter-spacing:0;color:#ece7df}
.scroll-cue{display:flex;align-items:center;gap:.6em;text-transform:uppercase;letter-spacing:.18em;font-size:.7rem}
.scroll-cue .line{width:46px;height:1px;background:#d9d4ca;position:relative;overflow:hidden}
.scroll-cue .line::after{content:"";position:absolute;inset:0;background:var(--clay);animation:scrollline 2.4s var(--ease) infinite}
@keyframes scrollline{0%{transform:translateX(-100%)}60%,100%{transform:translateX(100%)}}

/* word reveal */
.word{display:inline-block;overflow:hidden;vertical-align:top}
.word>span{display:inline-block;transform:translateY(110%);transition:transform .9s var(--ease)}
.hero.in .word>span{transform:none}
.hero .word>span{transition-delay:calc(var(--i)*.08s)}

/* ============================================================
   REVEAL
   ============================================================ */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.08s}.reveal[data-d="2"]{transition-delay:.16s}
.reveal[data-d="3"]{transition-delay:.24s}.reveal[data-d="4"]{transition-delay:.32s}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .hero-media img{animation:none}.hero .word>span{transform:none}
}

/* ============================================================
   SECTION HEADER
   ============================================================ */
.sec-head{max-width:54ch}
.sec-head h2{font-size:var(--h2);margin-top:1rem}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head.center .eyebrow{justify-content:center}

/* ---------- brand statement ---------- */
.brand-stmt{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.brand-stmt h2{font-size:clamp(2.2rem,4.4vw,4rem)}
.brand-stmt .copy p+p{margin-top:1.1rem}
.brand-stmt .media{position:relative}
.brand-stmt .media img{width:100%;border-radius:var(--r-img);box-shadow:var(--shadow-card);aspect-ratio:4/5;object-fit:cover}
.brand-stmt .media .float{position:absolute;left:-12%;bottom:-9%;width:46%;border-radius:12px;
  box-shadow:var(--shadow-card);aspect-ratio:1/1;object-fit:cover;border:6px solid var(--bone)}
.brand-stmt .badge-quote{position:absolute;top:-1.6rem;right:1rem;background:var(--clay);color:var(--bone);
  font-family:var(--font-display);font-style:italic;font-size:1.1rem;padding:.7em 1.1em;border-radius:12px;
  box-shadow:var(--shadow-soft);max-width:13ch;line-height:1.2}

/* ---------- stat band ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1.5rem,3vw,3rem)}
.stat{border-left:1px solid rgba(255,255,255,.16);padding-left:1.4rem}
.stat .num{font-family:var(--font-display);font-size:clamp(2.8rem,5vw,4.4rem);font-weight:500;line-height:1;color:#fff}
.stat .num .suf{color:var(--clay)}
.stat .lab{margin-top:.6rem;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:#cdd0c2}
.stat-note{margin-top:2.5rem;font-family:var(--font-display);font-style:italic;font-size:clamp(1.3rem,2.4vw,2rem);color:var(--sand);max-width:30ch}

/* ============================================================
   FEATURED PROJECTS (asymmetric trio)
   ============================================================ */
.featured-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.8rem);align-items:end}
.pcard{position:relative;border-radius:var(--r-card);overflow:hidden;box-shadow:var(--shadow-card);
  display:block;background:var(--ink)}
.pcard:nth-child(1){transform:translateY(0)}
.pcard:nth-child(2){transform:translateY(-2.6rem)}
.pcard:nth-child(3){transform:translateY(1.4rem)}
.pcard .ph{overflow:hidden;aspect-ratio:3/4.1}
.pcard img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.pcard:hover img{transform:scale(1.06)}
.pcard .pgrad{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 40%,rgba(0,0,0,.78) 100%);z-index:1}
.pcard .pbody{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:1.7rem;color:var(--bone)}
.pcard .pname{font-family:var(--font-display);font-size:2rem;font-weight:500;line-height:1}
.pcard .ploc{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:#e6dfd4;margin-top:.5rem;opacity:.85}
.pcard .pmore{margin-top:1rem;display:inline-flex;align-items:center;gap:.5em;font-weight:600;font-size:.86rem;
  color:#fff;opacity:0;transform:translateY(8px);transition:.45s var(--ease)}
.pcard:hover .pmore{opacity:1;transform:none}
.pcard .pmore svg{width:1em;height:1em}
.badge{position:absolute;top:1.1rem;left:1.1rem;z-index:3;font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;font-weight:700;padding:.5em .9em;border-radius:var(--r-btn)}
.badge.selling{background:var(--clay);color:var(--bone)}
.badge.selling .pulse{width:7px;height:7px;border-radius:50%;background:#fff;display:inline-block;margin-right:.5em;
  vertical-align:middle;box-shadow:0 0 0 0 rgba(255,255,255,.7);animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.6)}70%{box-shadow:0 0 0 8px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
.badge.sold{background:rgba(251,249,245,.14);color:var(--bone);border:1px solid rgba(255,255,255,.5);backdrop-filter:blur(4px)}

/* ============================================================
   WHY (pillars) + OFFER
   ============================================================ */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,3rem);margin-top:3rem}
.pillar{border-top:1px solid var(--line);padding-top:1.5rem}
.pillar .pn{font-family:var(--font-display);font-size:1.1rem;color:var(--clay);font-style:italic}
.pillar h3{font-size:var(--h3);margin:.7rem 0 .7rem}
.pillar p{color:var(--ink-soft);font-size:.98rem}
.pillar .ico{width:30px;height:30px;color:var(--clay);margin-bottom:1rem}

.offer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,2.4vw,2rem)}
.ocard .ph{overflow:hidden;border-radius:var(--r-img);aspect-ratio:4/3.2;box-shadow:var(--shadow-soft)}
.ocard img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.ocard:hover img{transform:scale(1.05)}
.ocard h3{font-size:var(--h3);margin:1.2rem 0 .4rem}
.ocard .tagn{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--clay);font-weight:600}
.ocard p{color:var(--ink-soft);font-size:.96rem}

/* ---------- rental teaser ---------- */
.rental{position:relative;overflow:hidden}
.rental .bg{position:absolute;inset:0;z-index:0}
.rental .bg img{width:100%;height:100%;object-fit:cover}
.rental .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(28,27,25,.9) 0%,rgba(28,27,25,.6) 50%,rgba(28,27,25,.25) 100%)}
.rental .inner{position:relative;z-index:2;color:var(--bone);max-width:42ch}
.rental h2{font-size:var(--h2);margin:1rem 0 1.2rem;color:var(--bone)}
.rental .soon{font-family:var(--font-display);font-style:italic;color:#e6c9aa}

/* ---------- elevated living accordion ---------- */
.elevated{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.elevated .media img{width:100%;border-radius:var(--r-img);box-shadow:var(--shadow-card);aspect-ratio:4/4.4;object-fit:cover}
.acc-item{border-bottom:1px solid var(--line)}
.acc-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;text-align:left;
  padding:1.25rem 0;font-family:var(--font-display);font-size:clamp(1.3rem,2vw,1.7rem);color:var(--ink);transition:color .3s}
.acc-head:hover{color:var(--clay)}
.acc-head .pm{position:relative;width:20px;height:20px;flex:none}
.acc-head .pm::before,.acc-head .pm::after{content:"";position:absolute;background:var(--clay);transition:.4s var(--ease)}
.acc-head .pm::before{left:0;top:9px;width:20px;height:2px}
.acc-head .pm::after{left:9px;top:0;width:2px;height:20px}
.acc-item.open .pm::after{transform:rotate(90deg);opacity:0}
.acc-body{max-height:0;overflow:hidden;transition:max-height .5s var(--ease)}
.acc-body p{color:var(--ink-soft);padding-bottom:1.3rem;max-width:48ch}

/* ============================================================
   ABOUT
   ============================================================ */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem)}
.about-col h2{font-size:var(--h2);margin-bottom:1.1rem}
.about-col h3{font-family:var(--font-display);font-size:1.3rem;color:var(--clay);margin:1.6rem 0 .5rem}
.about-col p{color:var(--ink-soft)}
.about-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:3rem}
.about-strip .ph{overflow:hidden;border-radius:12px;aspect-ratio:1/1.15;box-shadow:var(--shadow-soft)}
.about-strip img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.about-strip .ph:hover img{transform:scale(1.07)}
.mini-stats{display:flex;gap:clamp(1.5rem,4vw,3.5rem);flex-wrap:wrap;margin-top:2.2rem}
.mini-stats .num{font-family:var(--font-display);font-size:clamp(2.2rem,4vw,3.2rem);font-weight:500;line-height:1;color:var(--ink)}
.mini-stats .num .suf{color:var(--clay)}
.mini-stats .lab{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-top:.4rem}

/* ============================================================
   PROJECTS (tabbed)
   ============================================================ */
.proj-tabs{display:flex;gap:.5rem;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:2.6rem}
.proj-tab{padding:.9rem 1.4rem;font-family:var(--font-display);font-size:1.5rem;color:var(--ink-soft);
  position:relative;display:flex;align-items:center;gap:.6rem;transition:color .3s}
.proj-tab .st{font-family:var(--font-body);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  padding:.32em .6em;border-radius:var(--r-btn)}
.proj-tab .st.selling{background:var(--clay);color:var(--bone)}
.proj-tab .st.sold{background:var(--stone);color:var(--ink-soft)}
.proj-tab::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--clay);transition:width .4s var(--ease)}
.proj-tab[aria-selected="true"]{color:var(--ink)}
.proj-tab[aria-selected="true"]::after{width:100%}
.proj-panel{display:none}
.proj-panel.active{display:block;animation:fadeUp .6s var(--ease)}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

.proj-top{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,4vw,4rem);align-items:start}
.proj-top h3{font-size:clamp(2rem,3.4vw,3rem);margin:.6rem 0 1rem}
.proj-meta{display:flex;gap:1.2rem;flex-wrap:wrap;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:1.2rem}
.proj-meta .philo{color:var(--clay);font-weight:700}
.proj-top p{color:var(--ink-soft)}
.proj-spec{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-img);overflow:hidden}
.spec{background:var(--bone);padding:1.2rem 1.3rem}
.spec .ico{width:24px;height:24px;color:var(--clay);margin-bottom:.7rem}
.spec .sv{font-family:var(--font-display);font-size:1.7rem;font-weight:500;line-height:1}
.spec .sl{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-top:.3rem}

/* narrative band */
.narr{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem 2.4rem;margin-top:3rem}
.narr .n{border-top:1px solid var(--line);padding-top:1rem}
.narr .n .nt{font-family:var(--font-display);font-size:1.2rem;color:var(--ink)}
.narr .n .nd{font-size:.9rem;color:var(--ink-soft);margin-top:.3rem}

/* ---------- gallery ---------- */
.gal-filter{display:flex;gap:.5rem;flex-wrap:wrap;margin:2.4rem 0 1.6rem}
.chip{padding:.5em 1.1em;border:1px solid var(--line);border-radius:var(--r-btn);font-size:.82rem;font-weight:600;
  color:var(--ink-soft);transition:.3s var(--ease)}
.chip:hover{border-color:var(--clay);color:var(--clay)}
.chip.active{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.gallery{columns:3;column-gap:1rem}
.gitem{break-inside:avoid;margin-bottom:1rem;border-radius:12px;overflow:hidden;position:relative;cursor:pointer;
  box-shadow:var(--shadow-soft);transition:opacity .4s,transform .4s var(--ease)}
.gitem img{width:100%;transition:transform 1.1s var(--ease)}
.gitem:hover img{transform:scale(1.06)}
.gitem::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.5));opacity:0;transition:.4s}
.gitem:hover::after{opacity:1}
.gitem .glab{position:absolute;left:1rem;bottom:.9rem;z-index:2;color:#fff;font-size:.8rem;letter-spacing:.1em;
  text-transform:uppercase;opacity:0;transform:translateY(8px);transition:.4s var(--ease)}
.gitem:hover .glab{opacity:1;transform:none}
.gitem.hide{display:none}

/* floor plans */
.floor-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(1.5rem,3vw,2.5rem);align-items:center;margin-top:2.5rem}
.floor-main{border-radius:var(--r-img);overflow:hidden;box-shadow:var(--shadow-card);background:var(--bone)}
.floor-main img{width:100%}
.floor-list .fl{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--line);padding:1rem 0}
.floor-list .fl .ft{font-family:var(--font-display);font-size:1.3rem}
.floor-list .fl .fa{font-size:.85rem;color:var(--ink-soft);letter-spacing:.06em}

/* amenities + nearby */
.amen-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);
  border-radius:var(--r-img);overflow:hidden;margin-top:2.4rem}
.amen{background:var(--bone);padding:1.5rem;display:flex;align-items:center;gap:1rem}
.amen .ico{width:26px;height:26px;color:var(--clay);flex:none}
.amen span{font-size:.96rem;font-weight:500}
.nearby{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2.4rem}
.near{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--line);padding-bottom:.8rem}
.near .nn{font-weight:500}.near .nd{font-family:var(--font-display);font-size:1.2rem;color:var(--clay)}

.brochure{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;
  background:var(--ink);color:var(--sand);border-radius:var(--r-card);padding:clamp(1.6rem,3vw,2.6rem);margin-top:3rem}
.brochure h3{font-size:var(--h3);color:var(--bone)}
.brochure p{color:#cfcabf;font-size:.92rem;margin-top:.3rem}

/* ---------- architects ---------- */
.arch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem;margin-top:2.8rem}
.arch{text-align:left}
.arch .ph{aspect-ratio:5/6;border-radius:12px;overflow:hidden;background:
  repeating-linear-gradient(135deg,var(--stone) 0 12px,#ddd2c2 12px 24px);
  display:grid;place-items:center;position:relative}
.arch .ph .plabel{font-family:ui-monospace,Menlo,monospace;font-size:.72rem;letter-spacing:.05em;color:var(--ink-soft);
  background:var(--bone);padding:.4em .7em;border-radius:6px;opacity:.9}
.arch .an{font-family:var(--font-display);font-size:1.35rem;margin-top:.9rem}
.arch .ar{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--clay)}

/* testimonials */
.revs{display:grid;grid-template-columns:auto 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.rev-rating{text-align:center}
.rev-rating .big{font-family:var(--font-display);font-size:clamp(3.5rem,7vw,5.5rem);line-height:1;color:var(--ink)}
.rev-rating .stars{color:var(--clay);letter-spacing:.15em;font-size:1.1rem;margin-top:.3rem}
.rev-rating .src{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-top:.5rem}
.rev-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.rev{background:var(--bone);border:1px solid var(--line);border-radius:var(--r-card);padding:1.5rem}
.rev p{font-family:var(--font-display);font-style:italic;font-size:1.15rem;color:var(--ink);line-height:1.4}
.rev .who{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--clay);margin-top:1rem;font-weight:600}

/* ============================================================
   HOSPITALITY
   ============================================================ */
.hosp-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2.8rem}
.hosp{background:var(--bone);border:1px solid var(--line);border-radius:var(--r-card);padding:1.8rem;transition:.5s var(--ease)}
.hosp:hover{transform:translateY(-5px);box-shadow:var(--shadow-card);border-color:transparent}
.hosp .hn{font-family:var(--font-display);font-size:1.05rem;color:var(--clay);font-style:italic}
.hosp h3{font-size:1.3rem;margin:.5rem 0 .6rem}
.hosp p{font-size:.94rem;color:var(--ink-soft)}

/* ============================================================
   LEAD FORM
   ============================================================ */
.form-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.form-split .pitch h2{font-size:var(--h2);margin:1rem 0}
.form-card{background:var(--bone);border:1px solid var(--line);border-radius:var(--r-card);padding:clamp(1.6rem,3vw,2.4rem);box-shadow:var(--shadow-soft)}
.field{margin-bottom:1.1rem;position:relative}
.field label{display:block;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.5rem;font-weight:600}
.field input,.field textarea,.field select{width:100%;padding:.9em 1em;border:1px solid var(--line);border-radius:10px;background:var(--white);
  font-family:inherit;font-size:1rem;color:var(--ink);transition:border-color .3s,box-shadow .3s}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--clay);box-shadow:0 0 0 3px rgba(176,122,82,.15)}
.field input.invalid,.field textarea.invalid,.field select.invalid{border-color:#b5482f;box-shadow:0 0 0 3px rgba(181,72,47,.12)}
.field .err{color:#b5482f;font-size:.78rem;margin-top:.35rem;display:none}
.field.show-err .err{display:block}
.consent{display:flex;gap:.7rem;align-items:flex-start;font-size:.85rem;color:var(--ink-soft);margin-bottom:1rem}
.consent input{width:18px;height:18px;margin-top:.2rem;accent-color:var(--clay);flex:none}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-ok{display:none;text-align:center;padding:2rem 1rem}
.form-ok.show{display:block;animation:fadeUp .5s var(--ease)}
.form-ok .ic{width:54px;height:54px;border-radius:50%;background:var(--olive);color:#fff;display:grid;place-items:center;margin:0 auto 1rem}
.form-ok h3{font-size:1.6rem}

/* ============================================================
   FAQ
   ============================================================ */
.faq{max-width:820px;margin-inline:auto}
.faq .acc-head{font-size:clamp(1.15rem,1.7vw,1.5rem)}

/* ============================================================
   CONTACT
   ============================================================ */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem)}
.contact-card{background:var(--olive-deep);color:var(--sand);border-radius:var(--r-card);padding:clamp(1.8rem,3vw,2.6rem);position:relative;overflow:hidden}
.contact-card h3{color:var(--bone);font-size:var(--h3)}
.cc-block{border-top:1px solid rgba(255,255,255,.14);padding:1.1rem 0}
.cc-block .l{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:#cdb79f;margin-bottom:.3rem}
.cc-block .v{color:#ece7df;font-size:.98rem}
.cc-block a:hover{color:#fff}
.respond{display:inline-flex;align-items:center;gap:.6em;background:var(--clay);color:var(--bone);font-size:.78rem;
  font-weight:600;letter-spacing:.06em;padding:.5em 1em;border-radius:var(--r-btn);margin-bottom:1.4rem}
.respond .d{width:7px;height:7px;border-radius:50%;background:#fff;animation:pulse 1.8s infinite}
.map-mock{margin-top:1.4rem;border-radius:12px;overflow:hidden;aspect-ratio:16/7;position:relative;
  background:linear-gradient(135deg,#3a4233,#2c3225);border:1px solid rgba(255,255,255,.12)}
.map-mock iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.socials{display:flex;gap:.7rem;margin-top:1.4rem}
.socials a{width:40px;height:40px;border:1px solid rgba(255,255,255,.2);border-radius:50%;display:grid;place-items:center;transition:.3s}
.socials a:hover{background:var(--clay);border-color:var(--clay)}
.socials svg{width:17px;height:17px}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{background:var(--ink);color:var(--sand)}
.foot-banner{background:var(--clay);color:var(--bone);text-align:center;padding:.9rem;font-size:.8rem;
  letter-spacing:.12em;text-transform:uppercase;font-weight:600}
.foot-main{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.1fr;gap:clamp(2rem,4vw,3.5rem);padding-block:clamp(3rem,5vw,4.5rem)}
.foot-brand .mono{width:54px;margin-bottom:1.2rem}
.foot-brand .tag{font-family:var(--font-display);font-style:italic;font-size:1.4rem;color:#ece7df;max-width:22ch;line-height:1.3}
.foot-col h4{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:#cdb79f;margin-bottom:1.1rem;font-weight:700}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:.65rem}
.foot-col a{color:#cfcabf;font-size:.92rem;transition:color .3s}.foot-col a:hover{color:#fff}
.foot-col .v{color:#cfcabf;font-size:.9rem;margin-bottom:.6rem}
.foot-legal{border-top:1px solid rgba(255,255,255,.12);padding-block:1.5rem;display:flex;justify-content:space-between;
  gap:1rem;flex-wrap:wrap;font-size:.8rem;color:#9c988e}
.foot-legal a{color:#9c988e}.foot-legal a:hover{color:#fff}

/* ============================================================
   MOBILE DOCK
   ============================================================ */
.dock{position:fixed;bottom:0;left:0;right:0;z-index:160;display:none;background:rgba(251,249,245,.95);
  backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:.6rem;gap:.5rem;grid-template-columns:1fr 1fr 1.4fr}
.dock a{display:flex;align-items:center;justify-content:center;gap:.45em;padding:.85em;border-radius:12px;
  font-size:.85rem;font-weight:600}
.dock .wa{background:#25d366;color:#fff}.dock .call{background:var(--stone);color:var(--ink)}
.dock .vis{background:var(--clay);color:var(--bone)}
.dock svg{width:1.1em;height:1.1em}

/* ============================================================
   LIGHTBOX
   ============================================================ */
.lightbox{position:fixed;inset:0;z-index:400;background:rgba(20,19,17,.94);backdrop-filter:blur(8px);
  display:none;align-items:center;justify-content:center;opacity:0;transition:opacity .4s}
.lightbox.open{display:flex;opacity:1}
.lightbox img{max-width:90vw;max-height:82vh;border-radius:8px;box-shadow:0 40px 90px -30px #000;
  transform:scale(.96);transition:transform .4s var(--ease)}
.lightbox.open img{transform:scale(1)}
.lb-btn{position:absolute;width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;
  display:grid;place-items:center;transition:.3s;top:50%;transform:translateY(-50%)}
.lb-btn:hover{background:var(--clay)}
.lb-prev{left:2vw}.lb-next{right:2vw}
.lb-close{top:2vh;right:2vw;transform:none;width:46px;height:46px}
.lb-close:hover{transform:rotate(90deg);background:var(--clay)}
.lb-cap{position:absolute;bottom:2.5vh;left:0;right:0;text-align:center;color:#e6dfd4;font-size:.85rem;letter-spacing:.1em;text-transform:uppercase}
.lb-btn svg{width:22px;height:22px}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
  .brand-stmt,.elevated,.proj-top,.form-split,.contact-grid,.floor-grid,.revs{grid-template-columns:1fr}
  .brand-stmt .media{max-width:520px}
  .featured-grid{grid-template-columns:1fr 1fr}
  .pcard:nth-child(n){transform:none}
  .pcard:nth-child(3){grid-column:1/-1;max-width:60%}
  .gallery{columns:2}
  .foot-main{grid-template-columns:1fr 1fr}
  .rev-cards{grid-template-columns:1fr 1fr}
  .arch-grid{grid-template-columns:1fr 1fr}
  .revs{justify-items:start}
}
@media (max-width:760px){
  .nav-links,.header .header-cta{display:none}
  .burger{display:block}
  .dock{display:grid}
  body{padding-bottom:64px}
  .stats,.pillars,.offer-grid,.narr,.amen-grid,.nearby,.hosp-cards,.about-grid,.about-strip,.rev-cards,.arch-grid,.proj-spec,.form-row,.people{grid-template-columns:1fr}
  .featured-grid{grid-template-columns:1fr;gap:1.2rem}
  .pcard:nth-child(3){max-width:none}
  .gallery{columns:1}
  .foot-main{grid-template-columns:1fr 1fr}
  .hero-foot{position:static;margin-top:1.2rem;flex-direction:column;align-items:flex-start;gap:.6rem;font-size:.7rem}
  .hero{height:auto;min-height:0;padding-top:100px;padding-bottom:1.5rem}
  .hero h1{font-size:clamp(2rem,7vw,3rem);max-width:18ch}
  .hero-sub{font-size:.95rem;margin-top:.8rem;max-width:36ch}
  .hero-actions{flex-direction:column;margin-top:1.2rem}
  .hero-actions .btn{width:100%;justify-content:center}
  .hero-inner{padding-bottom:1.5rem}
  .hero-scrim{background:linear-gradient(180deg,rgba(20,25,21,.72) 0%,rgba(20,25,21,.35) 35%,rgba(20,25,21,.45) 65%,rgba(20,25,21,.92) 100%)}
  .stats{grid-template-columns:1fr 1fr;gap:1.2rem 1rem}
  .stat{border-left:none;padding-left:0;text-align:center}
  .stat .num{font-size:clamp(2rem,7vw,3rem)}
  .stat-note{font-size:1rem;max-width:26ch;text-align:center;margin-inline:auto}
  .pcard:nth-child(n){transform:none}
  .pcard .pmore{opacity:1;transform:none}
  .pcard:hover img{transform:none}
  .rental .bg::after{background:linear-gradient(180deg,rgba(28,27,25,.92) 0%,rgba(28,27,25,.65) 40%,rgba(28,27,25,.35) 100%)}
  .amen-grid,.proj-spec{gap:1px}
  .about-strip{gap:.8rem}
  .proj-tab{font-size:1.05rem;padding:.6rem .8rem}
  .announce{font-size:.6rem;gap:.4rem;padding-inline:.8rem;flex-wrap:wrap;justify-content:center}
  .announce .hide-sm{display:none}
  .mobile-menu{padding:1.2rem}
  .mobile-menu a{font-size:clamp(1.6rem,8vw,2.4rem)}
  .marquee span{font-size:clamp(1.05rem,3.5vw,1.4rem);gap:1.2rem}
  .foot-socials{flex-wrap:wrap;gap:.6rem}
  .foot-brand .tag{font-size:1.1rem;max-width:24ch}
  .btn{padding:.8em 1.3em;font-size:.88rem}
  .page-hero h1{font-size:clamp(1.5rem,5vw,2.2rem)}
  .page-hero p{font-size:.9rem}
  .hero .eyebrow{margin-bottom:1rem}
  .scroll-cue{display:none}
}
@media (max-width:480px){
  .foot-main{grid-template-columns:1fr}
  .about-strip{grid-template-columns:1fr 1fr}
  .foot-socials a{width:38px;height:38px}
  .announce{font-size:.55rem;padding-inline:.6rem}
  .proj-tab{font-size:.95rem;padding:.5rem .65rem}
  .page-hero{min-height:32vh;padding-top:90px}
  .page-hero.short{min-height:24vh}
  .hero h1{font-size:clamp(1.8rem,6.5vw,2.6rem)}
  .stats{gap:1rem .8rem}
  .stat .lab{font-size:.72rem}
}

/* laptop / short viewport fixes */
@media (max-height:900px) and (min-width:761px){
  .hero{min-height:520px;height:auto;padding-top:120px;padding-bottom:2.5rem}
  .hero h1{font-size:clamp(2.4rem,5.2vw,4.2rem)}
  .hero-sub{font-size:clamp(0.95rem,1.2vw,1.15rem);margin-top:1.2rem}
  .hero-actions{margin-top:1.6rem}
  .hero-foot{position:static;margin-top:1.5rem}
  .scroll-cue{display:none}
  .page-hero{min-height:34vh;padding-top:110px}
  .page-hero.short{min-height:26vh}
  .page-hero .container{padding-bottom:clamp(1.6rem,2.5vw,2.4rem)}
  .page-hero h1{font-size:clamp(1.8rem,3.6vw,3rem)}
  .page-hero p{font-size:clamp(0.9rem,1.05vw,1.05rem);margin-top:.7rem}
}

@media (max-height:750px) and (min-width:761px){
  .hero{min-height:460px;padding-top:100px;padding-bottom:2rem}
  .hero h1{font-size:clamp(2.2rem,4.8vw,3.6rem)}
  .hero-sub{margin-top:1rem}
  .hero-actions{margin-top:1.2rem}
  .hero-foot{margin-top:1.2rem}
  .page-hero{min-height:30vh;padding-top:100px}
  .page-hero.short{min-height:22vh}
  .page-hero .container{padding-bottom:clamp(1.2rem,2vw,2rem)}
  .page-hero h1{font-size:clamp(1.6rem,3.2vw,2.6rem);margin-top:.6rem}
  .page-hero p{font-size:clamp(0.85rem,1vw,1rem);margin-top:.5rem}
}

/* ============================================================
   MULTI-PAGE ADDITIONS
   ============================================================ */

/* ---- nav dropdowns ---- */
.has-drop{position:relative}
.nav-links .chev{width:.7em;height:.7em;margin-left:.25em;transition:transform .35s var(--ease);vertical-align:middle}
.has-drop:hover .chev{transform:rotate(180deg)}
.drop{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(10px);min-width:240px;
  background:var(--bone);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-card);
  padding:.6rem;opacity:0;visibility:hidden;transition:.35s var(--ease);margin-top:.6rem;z-index:50}
.has-drop:hover .drop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.drop::before{content:"";position:absolute;top:-10px;left:0;right:0;height:14px}
.drop a{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem .9rem;border-radius:9px;
  font-size:.9rem;color:var(--ink-soft) !important;font-weight:500;transition:.25s}
.drop a:hover{background:var(--sand);color:var(--ink) !important}
.drop a::after{display:none}
.drop .ds{font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;padding:.3em .55em;border-radius:var(--r-btn)}
.drop .ds.selling{background:var(--clay);color:var(--bone)}
.drop .ds.sold{background:var(--stone);color:var(--ink-soft)}
.drop .drop-all{color:var(--clay) !important;font-weight:600;border-top:1px solid var(--line);margin-top:.3rem;border-radius:0 0 9px 9px}
.nav-links a[aria-current="page"]{color:var(--clay)}
.header:not(.scrolled) .nav-links a[aria-current="page"]{color:#e6c9aa}
.nav-links a[aria-current="page"]::after{width:100%}
.has-drop[data-section-active] > a{color:var(--clay)}
.header:not(.scrolled) .has-drop[data-section-active] > a{color:#e6c9aa}

/* ---- scroll progress ---- */
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:100%;background:var(--clay);z-index:250;
  transform:scaleX(0);transform-origin:0 50%;transition:transform .1s linear}

/* ---- custom cursor ---- */
.cursor-dot,.cursor-ring{position:fixed;top:0;left:0;z-index:500;pointer-events:none;border-radius:50%;
  margin-left:-4px;margin-top:-4px;mix-blend-mode:difference}
.cursor-dot{width:8px;height:8px;background:#fff}
.cursor-ring{width:38px;height:38px;margin-left:-19px;margin-top:-19px;border:1px solid rgba(255,255,255,.7);
  display:grid;place-items:center;transition:width .3s var(--ease),height .3s var(--ease),background .3s,border-color .3s}
.cursor-ring.hot{width:54px;height:54px;background:rgba(255,255,255,.12)}
.cursor-ring.view{width:84px;height:84px;margin-left:-42px;margin-top:-42px;background:var(--clay);border-color:var(--clay);mix-blend-mode:normal}
.cursor-label{font-family:var(--font-body);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;opacity:0;transition:opacity .3s;font-weight:600}
.cursor-ring.view .cursor-label{opacity:1}
body.has-cursor{cursor:none}
body.has-cursor a,body.has-cursor button,body.has-cursor input,body.has-cursor .gitem,body.has-cursor .gal-item{cursor:none}
@media (hover:none){.cursor-dot,.cursor-ring{display:none}}

/* ---- page-transition curtain ---- */
.curtain{position:fixed;inset:0;z-index:600;background:var(--olive-deep);display:grid;place-items:center;
  transform:translateY(0);pointer-events:none}
.curtain img{width:80px;opacity:.95;animation:curtspin 1.2s var(--ease) infinite alternate}
@keyframes curtspin{from{transform:scale(.94);opacity:.55}to{transform:scale(1);opacity:1}}
body.loaded .curtain{transform:translateY(-100%);transition:transform .7s var(--ease) .05s}
body.leaving .curtain{transform:translateY(0);transition:transform .55s var(--ease);pointer-events:all}
@media (prefers-reduced-motion:reduce){.curtain{display:none}}

/* ---- interior page hero ---- */
.page-hero{position:relative;min-height:48vh;padding-top:clamp(110px,12vh,140px);display:flex;align-items:flex-end;overflow:hidden;background:var(--ink)}
.page-hero.short{min-height:34vh}
.page-hero .ph-media{position:absolute;inset:0;z-index:0}
.page-hero .ph-media img{width:100%;height:115%;object-fit:cover;will-change:transform}
.page-hero::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(20,32,26,.5) 0%,rgba(20,32,26,.15) 40%,rgba(20,32,26,.85) 100%)}
.page-hero .container{position:relative;z-index:2;color:var(--bone);padding-bottom:clamp(2.5rem,5vw,4.5rem);width:100%}
.page-hero .eyebrow{color:#e6c9aa}
.page-hero h1{font-size:var(--h1);color:var(--bone);max-width:18ch;margin-top:1rem}
.page-hero p{color:#ece7df;max-width:46ch;margin-top:1.1rem;font-size:clamp(1.02rem,1.3vw,1.2rem)}
.breadcrumb{display:flex;gap:.5rem;align-items:center;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:#cdd0c2}
.breadcrumb a{color:#cdd0c2}.breadcrumb a:hover{color:#fff}.breadcrumb .sep{opacity:.5}

/* ---- marquee ribbon ---- */
.marquee{background:var(--olive-deep);color:var(--sand);overflow:hidden;padding:1.1rem 0;border-block:1px solid rgba(255,255,255,.08)}
.marquee-track{display:flex;gap:3rem;white-space:nowrap;width:max-content;animation:marq 26s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee span{font-family:var(--font-display);font-size:clamp(1.4rem,2.4vw,2.1rem);font-style:italic;color:#cdd0c2;display:inline-flex;align-items:center;gap:3rem}
.marquee span::after{content:"✦";color:var(--clay);font-style:normal;font-size:.7em}
@keyframes marq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none}}

/* ---- tilt ---- */
.tilt{transition:transform .4s var(--ease),box-shadow .4s var(--ease);transform-style:preserve-3d;will-change:transform}

/* ---- projects index ---- */
.pindex{display:grid;grid-template-columns:1fr;gap:clamp(1.5rem,3vw,2.4rem)}
.pindex .prow{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center;
  background:var(--bone);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden}
.pindex .prow:nth-child(even){grid-template-columns:1fr 1.2fr}
.pindex .prow:nth-child(even) .prow-media{order:2}
.prow-media{overflow:hidden;aspect-ratio:4/3;position:relative}
.prow-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.prow:hover .prow-media img{transform:scale(1.05)}
.prow-body{padding:clamp(1.6rem,3vw,2.6rem)}
.prow-body h3{font-size:clamp(1.8rem,3vw,2.6rem)}
.prow-body .ploc{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin:.6rem 0 1rem}
.prow-body p{color:var(--ink-soft);margin-bottom:1.4rem}
.filter-bar{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin-bottom:2.4rem}
.filter-bar .fl{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-right:.4rem}

/* ---- standalone gallery page ---- */
.gal-page{columns:4;column-gap:1rem}
.gal-item{break-inside:avoid;margin-bottom:1rem;border-radius:12px;overflow:hidden;position:relative;cursor:pointer;box-shadow:var(--shadow-soft)}
.gal-item img{width:100%;transition:transform 1.1s var(--ease)}
.gal-item:hover img{transform:scale(1.06)}
.gal-item::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.5));opacity:0;transition:.4s}
.gal-item:hover::after{opacity:1}
.gal-item .glab{position:absolute;left:1rem;bottom:.9rem;z-index:2;color:#fff;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;opacity:0;transform:translateY(8px);transition:.4s var(--ease)}
.gal-item:hover .glab{opacity:1;transform:none}
.gal-item.hide{display:none}
@media (max-width:1024px){.gal-page{columns:2}}
@media (max-width:600px){.gal-page{columns:1}}

/* ---- prose / legal / article ---- */
.prose{max-width:760px;margin-inline:auto}
.prose h2{font-size:var(--h2);margin:2.4rem 0 1rem}
.prose h3{font-size:var(--h3);margin:1.8rem 0 .6rem;color:var(--clay)}
.prose p{color:var(--ink-soft);margin-bottom:1.1rem}
.prose ul{margin:0 0 1.2rem 1.2rem;color:var(--ink-soft);display:flex;flex-direction:column;gap:.5rem}
.prose .lead{max-width:none;font-family:var(--font-display);font-size:clamp(1.4rem,2.4vw,2rem);font-style:italic;color:var(--ink);line-height:1.4;margin-bottom:1.6rem}
.prose .meta{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:2rem}

/* ---- blog grid ---- */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.4rem,2.6vw,2rem)}
.bcard{display:flex;flex-direction:column;border-radius:var(--r-card);overflow:hidden;background:var(--bone);border:1px solid var(--line);transition:.5s var(--ease)}
.bcard:hover{transform:translateY(-5px);box-shadow:var(--shadow-card)}
.bcard .ph{overflow:hidden;aspect-ratio:3/2}
.bcard .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.bcard:hover .ph img{transform:scale(1.06)}
.bcard .bbody{padding:1.4rem 1.5rem 1.7rem}
.bcard .bcat{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--clay);font-weight:600}
.bcard h3{font-size:1.4rem;margin:.6rem 0 .5rem;line-height:1.2}
.bcard p{font-size:.92rem;color:var(--ink-soft)}
.bcard .bmeta{font-size:.78rem;color:var(--ink-soft);margin-top:1rem;letter-spacing:.04em}
.blog-feature{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:center;
  background:var(--ink);color:var(--sand);border-radius:var(--r-card);overflow:hidden;margin-bottom:3rem}
.blog-feature .ph{aspect-ratio:16/11;overflow:hidden}
.blog-feature .ph img{width:100%;height:100%;object-fit:cover}
.blog-feature .bf-body{padding:clamp(1.8rem,3vw,3rem)}
.blog-feature h2{color:var(--bone);font-size:clamp(1.8rem,3vw,2.8rem);margin:.7rem 0 1rem}
.blog-feature p{color:#cfcabf}

/* ---- centered states (thank-you / 404) ---- */
.state{min-height:88vh;display:grid;place-items:center;text-align:center;position:relative;overflow:hidden;background:var(--ink);color:var(--bone)}
.state .bg{position:absolute;inset:0;z-index:0}
.state .bg img{width:100%;height:100%;object-fit:cover;opacity:.35}
.state::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,rgba(20,32,26,.4),rgba(20,32,26,.92))}
.state .inner{position:relative;z-index:2;max-width:600px;padding:2rem}
.state .ic{width:72px;height:72px;border-radius:50%;background:var(--clay);display:grid;place-items:center;margin:0 auto 1.6rem}
.state h1{font-size:clamp(2.6rem,7vw,5rem);color:var(--bone)}
.state .big404{font-size:clamp(6rem,18vw,13rem);line-height:.9;color:var(--clay);font-family:var(--font-display)}
.state p{color:#ece7df;margin:1.2rem 0 2rem;font-size:1.1rem}
.state .acts{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* ---- leadership ---- */
.lead-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1.4rem,3vw,2.4rem)}
.lead-card{display:grid;grid-template-columns:auto 1fr;gap:1.6rem;background:var(--bone);border:1px solid var(--line);border-radius:var(--r-card);padding:1.6rem;align-items:start}
.lead-card .ph{width:130px;aspect-ratio:5/6;border-radius:12px;background:repeating-linear-gradient(135deg,var(--stone) 0 12px,#ddd2c2 12px 24px);display:grid;place-items:center;flex:none}
.lead-card .ph .plabel{font-family:ui-monospace,monospace;font-size:.66rem;color:var(--ink-soft);background:var(--bone);padding:.35em .6em;border-radius:6px;text-align:center}
.lead-card h3{font-size:1.5rem}
.lead-card .role{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--clay);margin:.2rem 0 .7rem;font-weight:600}
.lead-card p{font-size:.92rem;color:var(--ink-soft)}

/* ---- duties timeline ---- */
.timeline{position:relative;margin-top:3rem;padding-left:2rem}
.timeline::before{content:"";position:absolute;left:0;top:.6rem;bottom:.6rem;width:2px;background:var(--line)}
.tstep{position:relative;padding:0 0 2.4rem 1.8rem}
.tstep::before{content:"";position:absolute;left:-2.05rem;top:.35rem;width:14px;height:14px;border-radius:50%;background:var(--clay);box-shadow:0 0 0 5px var(--bone)}
.tstep .tn{font-family:var(--font-display);font-size:.95rem;color:var(--clay);font-style:italic}
.tstep h3{font-size:1.5rem;margin:.2rem 0 .5rem}
.tstep p{color:var(--ink-soft);max-width:52ch}

/* ---- footer socials ---- */
.foot-socials{display:flex;gap:.7rem;margin-top:1.3rem}
.foot-socials a{width:38px;height:38px;border:1px solid rgba(255,255,255,.2);border-radius:50%;display:grid;place-items:center;transition:.3s}
.foot-socials a:hover{background:var(--clay);border-color:var(--clay)}
.foot-socials svg{width:16px;height:16px;color:#cfcabf}
.foot-socials a:hover svg{color:#fff}
.foot-legal-links a{color:#9c988e}.foot-legal-links a:hover{color:#fff}

/* ---- pre-filled project notice ---- */
.proj-note{display:none;align-items:center;gap:.6em;background:var(--hampton);color:var(--ink);font-size:.85rem;font-weight:600;
  padding:.6em 1em;border-radius:var(--r-btn);margin-bottom:1.4rem}
body.has-project .proj-note{display:inline-flex}

/* ---- generic section intro centering helper already exists ---- */
.cta-band{background:var(--clay);color:var(--bone);border-radius:var(--r-card);padding:clamp(2rem,4vw,3.4rem);
  display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.cta-band h2{color:var(--bone);font-size:var(--h2);max-width:18ch}
.cta-band .btn-ghost{border-color:var(--bone)}

@media (max-width:1024px){
  .blog-grid{grid-template-columns:1fr 1fr}
  .lead-grid{grid-template-columns:1fr}
  .pindex .prow,.pindex .prow:nth-child(even){grid-template-columns:1fr}
  .pindex .prow:nth-child(even) .prow-media{order:0}
  .blog-feature{grid-template-columns:1fr}
}
@media (max-width:760px){
  .nav-links{display:none}
  .blog-grid{grid-template-columns:1fr}
  .lead-card{grid-template-columns:1fr}
  .lead-card .ph{width:100%;max-width:200px}
  .page-hero{min-height:40vh;padding-top:110px}
  .page-hero.short{min-height:30vh}
}

/* ============================================================
   SPA ADDITIONS
   ============================================================ */
.spa-page{display:none}
.spa-page.active{display:block;animation:pageIn .45s var(--ease)}
@keyframes pageIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
#pages{transition:opacity .3s var(--ease),transform .3s var(--ease)}
#pages.pg-out{opacity:0;transform:translateY(-10px)}
@media (prefers-reduced-motion:reduce){
  .spa-page.active{animation:none}
  #pages,.tslide{transition:none}
}

/* ---- floating action buttons ---- */
.fabs{position:fixed;right:1.2rem;bottom:1.2rem;z-index:180;display:flex;flex-direction:column;gap:.7rem}
.fab{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;box-shadow:var(--shadow-soft);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.fab:hover{transform:translateY(-3px) scale(1.06);box-shadow:0 18px 40px -14px rgba(20,32,26,.5)}
.fab svg{width:22px;height:22px}
.fab.wa{background:#25d366;color:#fff}
.fab.call{background:var(--clay);color:var(--bone)}

/* ---- why grid (4 icon cards) ---- */
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-top:3rem}
.why{background:var(--bone);border:1px solid var(--line);border-radius:var(--r-card);padding:1.7rem;transition:.45s var(--ease)}
.why:hover{transform:translateY(-5px);box-shadow:var(--shadow-card);border-color:transparent}
.why .ico{width:30px;height:30px;color:var(--clay);margin-bottom:1.1rem}
.why h3{font-size:1.25rem;margin-bottom:.5rem}
.why p{font-size:.92rem;color:var(--ink-soft)}

/* ---- testimonial carousel ---- */
.tcar{position:relative;max-width:780px;margin:2.6rem auto 0;text-align:center;min-height:230px}
.tslide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .6s var(--ease);padding:0 1rem}
.tslide.on{opacity:1;visibility:visible;position:relative}
.tslide .q{font-family:var(--font-display);font-style:italic;font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.35;color:var(--ink)}
.tslide .q::before{content:"“";display:block;font-size:3.4rem;line-height:.6;color:var(--clay);margin-bottom:.6rem;font-style:normal}
.tslide .who{margin-top:1.3rem;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--clay);font-weight:600}
.tdots{display:flex;gap:.5rem;justify-content:center;margin-top:1.8rem}
.tdots button{width:8px;height:8px;border-radius:50%;background:var(--stone);transition:.3s;padding:0}
.tdots button.on{background:var(--clay);transform:scale(1.4)}

/* ---- full-width CTA banner ---- */
.cta-hero{position:relative;overflow:hidden;padding-block:clamp(5rem,10vw,9rem);text-align:center}
.cta-hero .bg{position:absolute;inset:0;z-index:0}
.cta-hero .bg img{width:100%;height:100%;object-fit:cover}
.cta-hero .bg::after{content:"";position:absolute;inset:0;background:rgba(20,32,26,.72)}
.cta-hero .inner{position:relative;z-index:2;color:var(--bone)}
.cta-hero h2{font-size:clamp(2.2rem,5vw,4rem);color:var(--bone);max-width:18ch;margin:1rem auto 1.6rem}

/* ---- horizontal milestone timeline ---- */
.htimeline{display:flex;gap:0;overflow-x:auto;padding:2.6rem 0 1rem;scroll-snap-type:x proximity;position:relative}
.htimeline::-webkit-scrollbar{height:6px}
.htimeline::-webkit-scrollbar-thumb{background:var(--stone);border-radius:3px}
.ms{min-width:250px;flex:1;position:relative;padding:1.6rem 1.6rem 0 0;scroll-snap-align:start}
.ms::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--line)}
.ms::after{content:"";position:absolute;top:-5px;left:0;width:12px;height:12px;border-radius:50%;background:var(--clay)}
.ms .yr{font-family:var(--font-display);font-size:2rem;color:var(--clay);line-height:1}
.ms h3{font-size:1.15rem;margin:.5rem 0 .4rem}
.ms p{font-size:.88rem;color:var(--ink-soft)}

/* ---- people (leadership w/ hover bio) ---- */
.people{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:2.8rem}
.person{position:relative;border-radius:var(--r-card);overflow:hidden;background:repeating-linear-gradient(135deg,var(--stone) 0 12px,#ddd2c2 12px 24px);aspect-ratio:4/4.6}
.person img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.person .plabel{position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);font-family:ui-monospace,monospace;
  font-size:.7rem;color:var(--ink-soft);background:var(--bone);padding:.4em .7em;border-radius:6px;opacity:.9;white-space:nowrap;z-index:1}
.person .pinfo{position:absolute;left:0;right:0;bottom:0;padding:1.2rem 1.4rem;background:linear-gradient(180deg,transparent,rgba(20,32,26,.55) 30%,rgba(20,32,26,.92));color:var(--bone);z-index:1}
.person .pn{font-family:var(--font-display);font-size:1.4rem}
.person .pr{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--hampton);margin-top:.2rem}
.person .pbio{font-size:.86rem;color:#e3ddd2;max-height:0;overflow:hidden;opacity:0;transition:max-height .5s var(--ease),opacity .5s var(--ease),margin .5s var(--ease)}
.person:hover .pbio{max-height:120px;opacity:1;margin-top:.6rem}

/* ---- partners row ---- */
.partners{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2.2rem}
.partner{border:1px solid var(--line);border-radius:var(--r-btn);padding:.7em 1.4em;font-size:.82rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);font-weight:600;background:var(--bone)}

/* ---- project rows (catalogue) ---- */
.proj-meta-row{display:flex;gap:1.4rem 2rem;flex-wrap:wrap;margin:1.2rem 0 1.5rem;padding:1rem 0;border-block:1px solid var(--line)}
.proj-meta-row .pm-item .l{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.proj-meta-row .pm-item .v{font-family:var(--font-display);font-size:1.2rem;color:var(--ink)}
.prow-acts{display:flex;gap:.8rem;flex-wrap:wrap}
.loc-pin{display:inline-flex;align-items:center;gap:.4em}
.loc-pin svg{width:.95em;height:.95em;color:var(--clay)}
.prow.hide{display:none}

/* ---- project modal ---- */
.pmodal{position:fixed;inset:0;z-index:380;display:none;align-items:center;justify-content:center;padding:1.5rem;
  background:rgba(20,25,21,.8);backdrop-filter:blur(8px);opacity:0;transition:opacity .35s}
.pmodal.open{display:flex;opacity:1}
.pmodal-card{background:var(--bone);border-radius:var(--r-card);max-width:1060px;width:100%;max-height:90vh;
  overflow-y:auto;display:grid;grid-template-columns:1.15fr 1fr;box-shadow:0 50px 120px -30px #000;
  transform:scale(.96) translateY(10px);transition:transform .4s var(--ease)}
.pmodal.open .pmodal-card{transform:none}
.pm-carousel{position:sticky;top:0;height:90vh;min-height:320px;background:var(--ink)}
.pm-carousel img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.pm-nav{position:absolute;bottom:1rem;right:1rem;display:flex;gap:.5rem;z-index:2}
.pm-nav button{width:42px;height:42px;border-radius:50%;background:rgba(250,248,244,.92);color:var(--ink);display:grid;place-items:center;transition:.3s}
.pm-nav button:hover{background:var(--clay);color:#fff}
.pm-nav svg{width:18px;height:18px}
.pm-count{position:absolute;bottom:1.7rem;left:1.2rem;color:#fff;font-size:.78rem;letter-spacing:.1em;z-index:2;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.pm-body{padding:clamp(1.6rem,3vw,2.4rem)}
.pm-body h3{font-size:clamp(1.7rem,2.6vw,2.3rem)}
.pm-body .pm-loc{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin:.4rem 0 1rem}
.pm-body p{color:var(--ink-soft);font-size:.95rem}
.pm-sec{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--clay);font-weight:700;margin:1.5rem 0 .7rem}
.pm-amens{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}
.pm-amens span{display:flex;align-items:center;gap:.55em;font-size:.88rem;color:var(--ink)}
.pm-amens svg{width:16px;height:16px;color:var(--clay);flex:none}
.pm-specs{display:flex;flex-direction:column;gap:.45rem;font-size:.9rem}
.pm-specs .row{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px dashed var(--line);padding-bottom:.45rem}
.pm-specs .row .l{color:var(--ink-soft)}
.pm-specs .row .v{font-weight:600;text-align:right}
.pm-rera{font-size:.78rem;color:var(--ink-soft);margin-top:1.2rem;padding:.7rem .9rem;background:var(--sand);border-radius:10px}
.pm-close{position:absolute;top:1rem;right:1rem;z-index:3;width:42px;height:42px;border-radius:50%;
  background:rgba(20,32,26,.55);color:#fff;display:grid;place-items:center;transition:.3s}
.pm-close:hover{background:var(--clay);transform:rotate(90deg)}
.pm-close svg{width:18px;height:18px}

/* ---- gallery sticky CTA ---- */
.gal-cta{position:sticky;bottom:1.1rem;z-index:60;margin-top:2.2rem;display:flex;align-items:center;justify-content:space-between;
  gap:1rem;flex-wrap:wrap;background:rgba(20,32,26,.92);backdrop-filter:blur(10px);color:var(--bone);
  border-radius:var(--r-card);padding:1.1rem 1.4rem;box-shadow:var(--shadow-card)}
.gal-cta .t{font-family:var(--font-display);font-size:1.3rem;font-style:italic}

/* ---- form extras ---- */
.field textarea{min-height:104px;resize:vertical}
.btn .spinner{display:none;width:1.05em;height:1.05em;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}
.btn.loading .spinner{display:inline-block}
.btn.loading .btn-label{opacity:.6}
@keyframes spin{to{transform:rotate(360deg)}}
.enq-info .cc-block .v a:hover{color:var(--clay)}
.hours{display:flex;flex-direction:column;gap:.3rem;font-size:.92rem;color:var(--ink-soft)}

/* ---- filter tabs (projects) ---- */
.ftabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2.4rem}

@media (max-width:1024px){
  .why-grid{grid-template-columns:1fr 1fr}
  .people{grid-template-columns:1fr 1fr}
  .pmodal-card{grid-template-columns:1fr;max-height:92vh;overflow-y:auto}
  .pm-carousel{position:relative;height:auto;min-height:260px;aspect-ratio:16/10}
}
@media (max-width:760px){
  .why-grid{grid-template-columns:1fr}
  .people{grid-template-columns:1fr}
  .fabs{bottom:1rem;right:1rem}
  .htimeline .ms{min-width:210px}
  .pm-amens{grid-template-columns:1fr}
}

/* ============================================================
   MOTION PASS — premium animation upgrade
   ============================================================ */

/* ---- preloader ---- */
#preloader{position:fixed;inset:0;z-index:700;background:var(--olive-deep);display:grid;place-items:center;
  transition:opacity .6s var(--ease),visibility .6s}
#preloader .pl-inner{position:relative;display:grid;place-items:center;gap:1.1rem}
#preloader img{width:84px;animation:plPulse 1.6s var(--ease) infinite alternate}
#preloader .pl-bar{width:120px;height:2px;background:rgba(232,229,226,.18);border-radius:2px;overflow:hidden}
#preloader .pl-bar::after{content:"";display:block;height:100%;width:40%;background:var(--clay);animation:plSweep 1.1s var(--ease) infinite}
@keyframes plPulse{from{transform:scale(.94);opacity:.7}to{transform:scale(1);opacity:1}}
@keyframes plSweep{from{transform:translateX(-110%)}to{transform:translateX(280%)}}
body.booted #preloader{opacity:0;visibility:hidden;pointer-events:none}

/* ---- route transition bar ---- */
.route-bar{position:fixed;top:0;left:0;right:0;height:3px;background:var(--clay);z-index:650;
  transform:scaleX(0);transform-origin:left;opacity:0}
body.routing .route-bar{opacity:1;animation:routeBar .75s var(--ease) forwards}
@keyframes routeBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* ---- page transitions (400ms) ---- */
#pages{transition:opacity .4s var(--ease),transform .4s var(--ease)}
#pages.pg-out{opacity:0;transform:translateY(16px)}
.spa-page.active{animation:pageIn .55s var(--ease)}
@keyframes pageIn{from{opacity:0;transform:translateY(-22px) scale(.998)}to{opacity:1;transform:none}}

/* ---- heading clip reveals + staggered copy + eyebrow line draw ---- */
.sec-head.reveal h2,.copy.reveal h2,.pitch.reveal h2{
  clip-path:inset(0 0 102% 0);transform:translateY(26px);
  transition:clip-path .85s var(--ease) .1s,transform .85s var(--ease) .1s}
.sec-head.reveal.in h2,.copy.reveal.in h2,.pitch.reveal.in h2{clip-path:inset(-8% 0 -18% 0);transform:none}
.sec-head.reveal p,.copy.reveal p,.pillar.reveal p,.why.reveal p,.pitch.reveal p{
  opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease) .22s,transform .7s var(--ease) .22s}
.sec-head.reveal.in p,.copy.reveal.in p,.pillar.reveal.in p,.why.reveal.in p,.pitch.reveal.in p{opacity:1;transform:none}
.reveal .eyebrow::before{transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease) .25s}
.reveal.in .eyebrow::before{transform:scaleX(1)}

/* ---- nav sliding underline ---- */
.nav-links{position:relative}
.nav-ind{position:absolute;bottom:-2px;height:2px;background:var(--clay);border-radius:1px;
  transition:left .45s var(--ease),width .45s var(--ease),opacity .3s;pointer-events:none}
.nav-links a::after{display:none}

/* ---- buttons: lift + glow + ripple ---- */
.btn{transition:transform .45s var(--ease),color .4s var(--ease),box-shadow .45s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn-primary:hover{box-shadow:0 12px 32px -10px rgba(170,125,74,.55)}
.btn-dark:hover{box-shadow:0 12px 32px -12px rgba(20,32,26,.55)}
.ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.35);transform:scale(0);
  animation:rip .6s var(--ease) forwards;pointer-events:none}
@keyframes rip{to{transform:scale(2.6);opacity:0}}

/* ---- card depth + icon pop ---- */
.pcard:hover,.prow:hover{box-shadow:0 44px 90px -36px rgba(20,32,26,.6)}
.pcard,.prow{transition:box-shadow .5s var(--ease)}
.why:hover .ico,.pillar:hover .ico{animation:icoPop .5s var(--ease)}
@keyframes icoPop{0%{transform:scale(1)}40%{transform:scale(1.18) rotate(-3deg)}100%{transform:scale(1)}}

/* ---- hero load-in sequence ---- */
.hero-media{animation:heroSettle 1.6s var(--ease) both}
@keyframes heroSettle{from{transform:scale(1.08)}to{transform:scale(1)}}
.hero-sub,.hero-actions{opacity:0;transform:translateY(20px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.hero.in .hero-sub{opacity:1;transform:none;transition-delay:.85s}
.hero.in .hero-actions{opacity:1;transform:none;transition-delay:1.05s}
.hero-foot{opacity:0;transition:opacity .8s var(--ease) 1.3s}
.hero.in .hero-foot{opacity:1}
.scroll-cue{animation:cueBob 2.6s var(--ease) infinite}
@keyframes cueBob{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}

/* ---- stat tick underline ---- */
.stat .num{position:relative;display:inline-block}
.stat .num::after{content:"";position:absolute;left:2px;bottom:-12px;width:36px;height:3px;background:var(--clay);
  transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease) .6s}
.stat.in .num::after{transform:scaleX(1)}

/* ---- testimonials: crossfade + slide, animated quote ---- */
.tslide{transform:translateX(28px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.tslide.on{transform:none}
.tslide .q::before{display:inline-block;transform:scale(0);transition:transform .5s var(--ease) .2s}
.tslide.on .q::before{transform:scale(1)}

/* ---- projects FLIP-ish filter ---- */
.row-pop{animation:rowPop .5s var(--ease) both}
@keyframes rowPop{from{opacity:0;transform:scale(.97) translateY(12px)}to{opacity:1;transform:none}}

/* ---- modal zoom-from-card ---- */
.pmodal-card{transition:transform .45s var(--ease),opacity .45s var(--ease);opacity:0}
.pmodal.open .pmodal-card{opacity:1}
.pm-carousel img{transition:opacity .35s var(--ease)}

/* ---- gallery: cascade + blur-up ---- */
.gal-item{opacity:0;transform:translateY(24px) scale(.98)}
.gal-item.gin{opacity:1;transform:none;transition:opacity .7s var(--ease),transform .7s var(--ease)}
.gal-item img.blur-up{filter:blur(16px);transform:scale(1.06)}
.gal-item img{transition:transform 1.1s var(--ease),filter .7s var(--ease)}
.gal-item img.blur-up.loaded,.gal-item img:not(.blur-up){filter:none}

/* ---- timeline draw ---- */
.htimeline .ms::before{transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease)}
.htimeline .ms::after{transform:scale(0);transition:transform .45s var(--ease)}
.htimeline.in .ms::before{transform:scaleX(1)}
.htimeline.in .ms::after{transform:scale(1)}
.htimeline.in .ms:nth-child(1)::before{transition-delay:.05s}.htimeline.in .ms:nth-child(1)::after{transition-delay:.15s}
.htimeline.in .ms:nth-child(2)::before{transition-delay:.25s}.htimeline.in .ms:nth-child(2)::after{transition-delay:.4s}
.htimeline.in .ms:nth-child(3)::before{transition-delay:.5s}.htimeline.in .ms:nth-child(3)::after{transition-delay:.65s}
.htimeline.in .ms:nth-child(4)::before{transition-delay:.75s}.htimeline.in .ms:nth-child(4)::after{transition-delay:.9s}
.htimeline.in .ms:nth-child(5)::before{transition-delay:1s}.htimeline.in .ms:nth-child(5)::after{transition-delay:1.15s}
.htimeline.in .ms:nth-child(6)::before{transition-delay:1.25s}.htimeline.in .ms:nth-child(6)::after{transition-delay:1.4s}

/* ---- floating labels (enquire) ---- */
.ffield{position:relative}
.ffield label{position:absolute;left:1.05em;top:1.05em;margin:0;pointer-events:none;z-index:2;
  font-size:.95rem;letter-spacing:.01em;text-transform:none;font-weight:500;color:#8e887c;
  transition:top .35s var(--ease),font-size .35s var(--ease),letter-spacing .35s var(--ease),color .35s}
.ffield input,.ffield textarea{padding:1.5em 1em .6em}
.ffield.on label{top:.5em;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--clay)}
.ffield::after{content:"";position:absolute;left:50%;right:50%;bottom:0;height:2px;background:var(--clay);
  border-radius:0 0 2px 2px;transition:left .45s var(--ease),right .45s var(--ease)}
.ffield:focus-within::after{left:8px;right:8px}

/* ---- success state: flip + checkmark draw ---- */
.form-ok.show{animation:flipIn .8s var(--ease)}
@keyframes flipIn{from{transform:perspective(900px) rotateY(28deg) translateY(8px);opacity:0}to{transform:none;opacity:1}}
.form-ok .draw{stroke-dasharray:30;stroke-dashoffset:30}
.form-ok.show .draw{animation:drawCheck .7s var(--ease) .35s forwards}
@keyframes drawCheck{to{stroke-dashoffset:0}}

/* ---- scroll-to-top ---- */
.fab.totop{background:var(--ink);color:var(--sand);opacity:0;pointer-events:none;transform:translateY(10px)}
body.show-totop .fab.totop{opacity:1;pointer-events:auto;transform:none}

/* ---- depth: cinematic vignette ---- */
.page-hero .container{z-index:3}
.page-hero::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  box-shadow:inset 0 0 200px rgba(20,32,26,.5)}
.cta-hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  box-shadow:inset 0 0 220px rgba(20,32,26,.6)}
.hero-scrim{box-shadow:inset 0 0 240px rgba(20,32,26,.45)}

/* ---- performance hints ---- */
.reveal,.gal-item,.tslide,#pages{will-change:transform,opacity}
.hero-media img,.ph-media img,.cta-hero .bg img{will-change:transform}

/* ---- mobile: shorter, faster ---- */
@media (max-width:760px){
  .reveal{transform:translateY(16px);transition-duration:.55s}
  .sec-head.reveal h2,.copy.reveal h2{transition-duration:.6s}
  .gal-item{transform:translateY(14px)}
  #pages{transition-duration:.3s}
}

/* ---- reduced motion ---- */
@media (prefers-reduced-motion:reduce){
  #preloader{display:none}
  .route-bar,.scroll-cue,.hero-media{animation:none}
  .sec-head.reveal h2,.copy.reveal h2,.pitch.reveal h2{clip-path:none;transform:none;transition:none}
  .sec-head.reveal p,.copy.reveal p,.pillar.reveal p,.why.reveal p,.pitch.reveal p{opacity:1;transform:none;transition:none}
  .hero-sub,.hero-actions,.hero-foot{opacity:1;transform:none;transition:none}
  .gal-item{opacity:1;transform:none}
  .gal-item img.blur-up{filter:none;transform:none}
  .tslide{transform:none}
  .htimeline .ms::before{transform:scaleX(1)}.htimeline .ms::after{transform:scale(1)}
  .nav-ind{transition:none}
  .form-ok .draw{stroke-dashoffset:0;animation:none}
}