:root{
  --ink:#15171b;
  --ink-soft:#3c4148;
  --paper:#f5f2ea;
  --paper-2:#ece7db;
  --amber:#f2a900;
  --amber-deep:#b87900;
  --line:rgba(21,23,27,.14);
  --card:#ffffff;
  --safe-t: env(safe-area-inset-top,0px);
  --safe-b: env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#f1efe8; --ink-soft:#c3bfb4; --paper:#15171b; --paper-2:#1c1f24;
    --card:#1c1f24; --line:rgba(241,239,232,.14); --amber-deep:#f2a900;
  }
}
:root[data-theme="dark"]{
  --ink:#f1efe8; --ink-soft:#c3bfb4; --paper:#15171b; --paper-2:#1c1f24;
  --card:#1c1f24; --line:rgba(241,239,232,.14); --amber-deep:#f2a900;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--paper); color:var(--ink);
  font-family:"IBM Plex Sans",-apple-system,Segoe UI,Roboto,sans-serif;
  font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
h1,h2,h3{
  font-family:"Oswald",Impact,"Arial Narrow",sans-serif;
  text-transform:uppercase; letter-spacing:.01em; font-weight:600;
  text-wrap:balance; margin:0; color:var(--ink);
}
a{color:inherit;}
.wrap{max-width:1180px;margin:0 auto;padding-inline:24px;}
section{padding-block:88px;}
@media (max-width:640px){ section{padding-block:56px;} }

.eyebrow{
  font-family:"IBM Plex Mono",monospace; font-size:.72rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--amber-deep);
  display:flex; align-items:center; gap:10px; margin-bottom:14px;
}
.eyebrow::before{content:"";width:26px;height:3px;background:var(--amber);flex:none;}

.route{
  height:6px; background-repeat:repeat-x; background-size:34px 6px;
  background-image:linear-gradient(90deg, var(--amber) 0 18px, transparent 18px 34px);
}

/* ---------- header ---------- */
header{
  position:sticky; top:var(--safe-t); z-index:50;
  background:var(--paper); border-bottom:1px solid var(--line);
}
.navbar{
  max-width:1180px;margin:0 auto;padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.brand{display:block;line-height:0;}
.brand img{height:28px;width:auto;}
:root[data-theme="dark"] .brand img{filter:invert(1) brightness(1.15);}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .brand img{filter:invert(1) brightness(1.15);} }
nav{display:flex;gap:26px;font-size:.9rem;}
nav a{text-decoration:none;color:var(--ink-soft);white-space:nowrap;}
nav a:hover{color:var(--amber-deep);}
.navcta{
  font-family:"IBM Plex Mono",monospace;font-size:.78rem;
  background:var(--ink);color:var(--paper);
  padding:10px 16px;border-radius:2px;text-decoration:none;white-space:nowrap;
}
@media (max-width:820px){ nav{display:none;} .navcta{display:none;} }

/* ---------- mobile nav ---------- */
.hamburger{
  display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;
  width:36px;height:36px;border:none;background:none;padding:0;cursor:pointer;flex:none;
}
.hamburger span{display:block;width:22px;height:2px;background:var(--ink);border-radius:1px;transition:transform .2s ease,opacity .2s ease;}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
@media (max-width:820px){ .hamburger{display:flex;} }
.mobile-nav{
  display:none;flex-direction:column;
  border-top:1px solid var(--line);background:var(--paper);
}
.mobile-nav a{
  padding:16px 24px;font-size:1rem;text-decoration:none;color:var(--ink);
  border-bottom:1px solid var(--line);
}
.mobile-nav a.navcta{
  display:inline-block;border-bottom:none;margin:16px 24px 4px;text-align:center;
}
.mobile-nav.open{display:flex;}
@media (min-width:821px){ .mobile-nav{display:none !important;} }

/* ---------- hero ---------- */
.hero{
  position:relative; overflow:hidden;
  height:clamp(540px, 84vh, 860px);
  background:#bcd6ea;
}
.scene{position:absolute;inset:0;width:100%;height:100%;display:block;}
.hero-scrim{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(128% 92% at 0% 0%, rgba(247,245,239,.97) 0%, rgba(247,245,239,.88) 30%, rgba(247,245,239,.48) 52%, rgba(247,245,239,0) 72%);
}
@media (max-width:720px){
  .hero-scrim{background:linear-gradient(180deg, rgba(247,245,239,.96) 0%, rgba(247,245,239,.78) 38%, rgba(247,245,239,0) 64%);}
}
.hero-copy{
  position:absolute;inset:0;pointer-events:none;
  display:flex;flex-direction:column;justify-content:flex-start;
}
.hero-copy .wrap{width:100%;padding-top:clamp(26px,6vh,64px);}
.hero-eyebrow{
  font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;color:#8a5c05;display:flex;align-items:center;gap:10px;margin-bottom:14px;
  text-shadow:0 0 12px rgba(247,245,239,.95);
}
.hero-eyebrow::before{content:"";width:26px;height:3px;background:#f2a900;flex:none;}
.hero h1{
  color:#15171b; font-size:clamp(1.6rem, 2.7vw, 2.25rem); line-height:1.08; max-width:26ch;
  text-shadow:0 0 22px rgba(247,245,239,.92), 0 1px 0 rgba(247,245,239,.9);
}
.hero h1 em{font-style:normal;color:#a86f00;}
.hero p.sub{
  color:#22262b;max-width:34ch;font-size:.95rem;margin-top:14px;
  text-shadow:0 0 14px rgba(247,245,239,.98), 0 0 5px rgba(247,245,239,1);
}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px;pointer-events:auto;}
.btn{
  font-family:"IBM Plex Mono",monospace;font-size:.82rem;
  padding:14px 22px;border-radius:2px;text-decoration:none;display:inline-block;
  border:1px solid transparent;
}
.btn-primary{background:#f2a900;color:#191305;font-weight:600;}
.btn-primary:hover{background:#d99800;}
.btn-ghost{border-color:rgba(21,23,27,.45);color:#15171b;}
.btn-ghost:hover{border-color:#15171b;background:rgba(21,23,27,.05);}

/* construction note under the hero */
.hero-note{
  background:var(--paper-2);border-bottom:1px solid var(--line);
  padding-block:16px;font-family:"IBM Plex Mono",monospace;font-size:.74rem;
  line-height:1.8;color:var(--ink-soft);
}
.hero-note .wrap{display:flex;gap:10px 40px;flex-wrap:wrap;}
.hero-note b{color:var(--amber-deep);font-weight:500;}

/* ---------- stats band ---------- */
.stats{background:var(--ink);color:#f4f1e9;padding-block:36px;}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;}
@media (max-width:760px){ .stats .wrap{grid-template-columns:repeat(2,1fr);gap:24px;} }
.stats b{
  font-family:"IBM Plex Mono",monospace;font-size:clamp(1.5rem,3vw,2.1rem);
  color:var(--amber);display:block;font-variant-numeric:tabular-nums;line-height:1.1;
}
.stats span{font-size:.8rem;color:#b3afa3;display:block;margin-top:6px;}

/* ---------- about ---------- */
.about-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:54px;align-items:start;}
@media (max-width:860px){ .about-grid{grid-template-columns:1fr;gap:34px;} }
.lede{font-size:1.15rem;color:var(--ink-soft);max-width:46ch;margin-top:18px;}
.fact-list{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:16px;}
.fact-list li{
  display:grid;grid-template-columns:54px 1fr;gap:16px;align-items:start;
  padding-top:16px;border-top:1px solid var(--line);font-size:.94rem;color:var(--ink-soft);
}
.fact-list b{font-family:"IBM Plex Mono",monospace;color:var(--amber-deep);font-size:.9rem;}
.office-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.office-grid figure{margin:0;position:relative;overflow:hidden;border:1px solid var(--line);}
.office-grid img{width:100%;height:100%;object-fit:cover;}
.office-grid .wide{grid-column:1 / -1;aspect-ratio:16/9;}
.office-grid .tall{aspect-ratio:4/5;}
.office-cap{
  grid-column:1 / -1;font-family:"IBM Plex Mono",monospace;font-size:.72rem;
  color:var(--ink-soft);margin-top:2px;
}

/* ---------- services ---------- */
.services{background:var(--paper-2);}
.svc-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:42px;}
.svc-head h2{font-size:clamp(1.9rem,4vw,2.6rem);max-width:16ch;}
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:760px){ .svc-grid{grid-template-columns:1fr;} }
.svc{background:var(--card);padding:32px 30px;}
.svc .num{font-family:"IBM Plex Mono",monospace;color:var(--amber-deep);font-size:.85rem;}
.svc h3{font-size:1.22rem;margin-top:10px;}
.svc p{color:var(--ink-soft);margin-top:10px;font-size:.93rem;}

/* ---------- portfolio ---------- */
.port-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-top:38px;}
@media (max-width:860px){ .port-grid{grid-template-columns:1fr;} }
.pcard{position:relative;overflow:hidden;border:1px solid var(--line);background:var(--ink);min-height:220px;}
.pcard img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;opacity:.85;}
.pcard .tag{
  position:relative;z-index:2;padding:20px;height:100%;
  display:flex;flex-direction:column;justify-content:flex-end;
  background:linear-gradient(180deg, rgba(10,10,10,0) 40%, rgba(6,7,8,.86) 100%);
}
.pcard .tag h3{color:#f7f4ea;font-size:1.1rem;}
.pcard .tag span{font-family:"IBM Plex Mono",monospace;font-size:.7rem;color:var(--amber);letter-spacing:.05em;}
.pcard.big{grid-row:span 2;}
@media (max-width:860px){ .pcard.big{min-height:280px;} }

/* ---------- bim ---------- */
.bim-head{display:grid;grid-template-columns:1.15fr 1fr;gap:48px;align-items:end;margin-bottom:34px;}
@media (max-width:860px){ .bim-head{grid-template-columns:1fr;gap:20px;} }
.bim-head h2{font-size:clamp(1.65rem,3vw,2.15rem);line-height:1.1;max-width:30ch;}
.viewer{
  position:relative;border:1px solid var(--line);background:#0e0f11;
  aspect-ratio:16/9;overflow:hidden;
}
.viewer-video{display:block;width:100%;height:100%;object-fit:cover;background:#0e0f11;}
.viewer-tag{
  position:absolute;left:16px;top:14px;z-index:2;
  font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;color:#f7f3e8;text-shadow:0 1px 6px rgba(0,0,0,.7);pointer-events:none;
  transition:opacity .2s ease;
}
.viewer-hint{
  position:absolute;right:16px;top:14px;z-index:2;
  font-family:"IBM Plex Mono",monospace;font-size:.7rem;color:#f7f3e8;text-shadow:0 1px 6px rgba(0,0,0,.7);
  pointer-events:none;transition:opacity .2s ease;
}
.viewer.playing .viewer-tag,.viewer.playing .viewer-hint{opacity:0;}
.bim-grid{
  list-style:none;margin:34px 0 0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);
}
@media (max-width:860px){ .bim-grid{grid-template-columns:1fr;} }
.bim-grid li{background:var(--card);padding:24px 22px;font-size:.93rem;color:var(--ink-soft);}
.bim-grid li b{
  display:block;font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--amber-deep);margin-bottom:8px;
}

/* ---------- contact ---------- */
.contact{background:var(--paper-2);}
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:54px;}
@media (max-width:860px){ .contact-grid{grid-template-columns:1fr;gap:34px;} }
.contact-card{background:var(--card);border:1px solid var(--line);padding:32px;}
.contact-row{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-top:1px solid var(--line);font-size:.95rem;}
.contact-row:first-of-type{border-top:none;padding-top:0;}
.contact-row span:first-child{color:var(--ink-soft);}
.contact-row a{text-decoration:none;font-weight:500;}
.contact-row a:hover{color:var(--amber-deep);}

/* ---------- cookie banner ---------- */
#cookie-banner {
  position: fixed; bottom: 0; left: 0; width: 100%;
  background: #333; color: #fff; padding: 15px; text-align: center;
  z-index: 9999; display: none; font-family: sans-serif;
}
#cookie-banner a { color: #f2a900; text-decoration: underline; }
#cookie-banner button {
  background: #f2a900; color: white; border: none; padding: 8px 15px;
  cursor: pointer; margin-left: 15px; border-radius: 3px;
}

footer{padding:26px 0 calc(26px + var(--safe-b));border-top:1px solid var(--line);font-size:.8rem;color:var(--ink-soft);}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;}

.privacy-block {
    font-size: 12px; 
    color: #666; 
    margin-top: 10px;
    max-width: 1180px;
    margin: 0 auto;
    padding-inline: 24px;
}

.single-spacer {
  padding-top: 20px;
}

#hintDot{animation:hintPulse 1.9s ease-in-out infinite;transform-origin:center;transform-box:fill-box;}
@keyframes hintPulse{0%,100%{opacity:.35;}50%{opacity:1;}}
@media (prefers-reduced-motion: reduce){ #hintDot{animation:none;} }
.fx{pointer-events:none;}
.fx circle{fill:#ffe6a8;transform-box:fill-box;transform-origin:center;animation:spTwinkle 2.6s ease-in-out infinite;}
.fx path{fill:#fff2cc;transform-box:fill-box;transform-origin:center;animation:stTwinkle 3.6s ease-in-out infinite;}
@keyframes spTwinkle{
  0%,100%{opacity:0;transform:translateY(3px) scale(.35);}
  35%{opacity:1;transform:translateY(-1px) scale(1.15);}
  70%{opacity:.45;transform:translateY(-7px) scale(.7);}
}
@keyframes stTwinkle{
  0%,100%{opacity:0;transform:scale(.25) rotate(0deg);}
  45%{opacity:1;transform:scale(1) rotate(18deg);}
  78%{opacity:.2;transform:scale(.55) rotate(30deg);}
}
@media (prefers-reduced-motion: reduce){ .fx circle,.fx path{animation:none;opacity:.8;} }
#hotspot,#facadeHot,#lawnHot,#lawnHot2,#swHotA,#swHotB,#swHotC,#parkHot{cursor:pointer;}