/* /css/site.css (FULL REWRITE v=27) */
:root{
  --ink:#0c1420;
  --muted:#58657a;

  --paper:#f6f3ee;
  --paper2:#fbfaf7;

  --gold:#c9a24a;
  --gold2:#d8b35b;

  --midnight:#0f1c2e;
  --midnight2:#0b1626;

  --glass:rgba(255,255,255,.80);
  --shadow:0 18px 50px rgba(12,20,32,.14);

  --wrap:min(1160px, calc(100% - 80px));
  --r:7px;

  /* rhythm */
  --s-1:10px;
  --s0:14px;
  --s1:18px;
  --s2:24px;
  --s3:34px;
  --s4:52px;
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
body{
  margin:0;
  font-family:'DM Sans',system-ui,-apple-system,sans-serif;
  color:var(--ink);
  background:
    radial-gradient(900px 520px at 12% 20%, rgba(201,162,74,.16), transparent 62%),
    radial-gradient(900px 620px at 92% 10%, rgba(15,28,46,.28), transparent 58%),
    linear-gradient(180deg, var(--midnight), var(--midnight2));
  line-height:1.7;
}

.wrap{width:var(--wrap); margin-inline:auto}
a{color:inherit}
img{max-width:100%; height:auto}
::selection{background:rgba(201,162,74,.25)}

h1,h2,h3{
  font-family:'DM Sans',sans-serif;
  font-weight:700;
  letter-spacing:-.01em;
  margin:0 0 12px;
}
h1{font-size:clamp(46px, 5.2vw, 76px); line-height:1.0}
h2{font-size:clamp(32px, 3.6vw, 50px); line-height:1.05}
h3{font-size:22px; line-height:1.12}

p{margin:0 0 14px; font-size:16px; color:rgba(12,20,32,.82)}
.lead{font-size:19px; line-height:1.65}

@media (max-width: 980px){
  :root{--wrap:min(1160px, calc(100% - 48px))}
  p{font-size:17px}
  .lead{font-size:18px}
}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 16px;
  border-radius:3px;
  border:1px solid rgba(15,28,46,.14);
  text-decoration:none;
  font-weight:900;
  letter-spacing:.01em;
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease, color .12s ease;
  will-change:transform;
}
.btn--gold{
  background:linear-gradient(180deg, var(--gold2), #c39a3f);
  border-color:rgba(195,154,63,.55);
  color:#0b121c;
  box-shadow:0 14px 30px rgba(195,154,63,.22);
}
.btn--dark{
  background:rgba(12,20,32,.92);
  border-color:rgba(12,20,32,.25);
  color:#fff;
  box-shadow:0 16px 34px rgba(12,20,32,.16);
}
.btn--outline{
  background:rgba(255,255,255,.62);
}

/* SEO block service link chips */
.seoServices{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:26px;
}
.seoService__link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.09em;
  text-transform:uppercase;
  text-decoration:none;
  padding:9px 15px;
  border-radius:3px;
  border:1px solid rgba(15,28,46,.14);
  background:rgba(255,255,255,.55);
  color:rgba(12,20,32,.68);
  transition:color .2s, border-color .2s, background .2s, transform .15s;
}
.seoService__link:hover{
  color:var(--ink);
  border-color:rgba(201,162,74,.50);
  background:rgba(201,162,74,.10);
  transform:translateY(-1px);
}
.seoService__link--all{
  background:linear-gradient(180deg, var(--gold2), #c39a3f);
  border-color:rgba(195,154,63,.55);
  color:#0b121c;
  box-shadow:0 8px 22px rgba(195,154,63,.20);
}
.seoService__link--all:hover{
  background:linear-gradient(180deg, #dfc06a, var(--gold2));
  border-color:rgba(195,154,63,.70);
  box-shadow:0 12px 28px rgba(195,154,63,.28);
}
.btn--lg{padding:14px 18px}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}

/* Skip link */
.skip{
  position:absolute;left:-999px;top:10px;
  background:#fff;color:#000;
  padding:10px 12px;border-radius:4px;z-index:9999
}
.skip:focus{left:12px}

/* ================= HEADER ================= */
.siteHeader{
  position:fixed;
  top:0;left:0;right:0;
  z-index:500;
  transition:background .4s,box-shadow .4s,border-color .4s;
  background:transparent;
  border-bottom:1px solid transparent;
}
.siteHeader.is-elevated{
  /* Opaque instead of frosted: backdrop-filter:blur() re-blurs the moving
     content behind the header every scroll frame, which stutters in Firefox.
     At ~.96 opacity the blur was barely visible anyway. */
  background:rgba(249,245,239,.985);
  border-color:rgba(201,162,74,.28);
  box-shadow:0 2px 24px rgba(0,0,0,.12);
}

.siteHeader__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:24px 0;
  transition:padding .4s;
}
.siteHeader.is-elevated .siteHeader__inner{padding:12px 0}

/* ---- Left: burger + shortcuts ---- */
.siteHeader__left{
  display:flex;
  align-items:center;
  gap:22px;
  flex:1;
}

/* Burger button */
.burger{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  width:52px;height:52px;
  background:none;
  border:none;
  cursor:pointer;
  padding:0;
  flex-shrink:0;
  outline:none;
  transition:gap .4s, width .4s, height .4s;
}
.burger:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:3px;
  border-radius:4px;
}
.burger span{
  display:block;
  width:34px;height:3px;
  background:#fff;
  border-radius:2px;
  transition:transform .25s ease, opacity .25s ease, background .3s, width .4s, height .4s;
}
.siteHeader.is-elevated .burger{gap:5px; width:44px; height:44px}
.siteHeader.is-elevated .burger span{width:26px; height:2px; background:rgba(12,20,32,.72)}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(10px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}

/* Call / Email shortcuts */
.siteHeader__contact{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  color:#fff;
  text-decoration:none;
  transition:color .2s, gap .4s;
}
.siteHeader__contact:hover{color:var(--gold)}
.siteHeader__contact svg{
  opacity:.9;
  width:26px;height:26px;
  transition:width .4s, height .4s;
}
.siteHeader__contact span{
  font-size:11px;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
  line-height:1;
  transition:font-size .4s;
}
.siteHeader.is-elevated .siteHeader__contact{color:rgba(12,20,32,.65); gap:4px}
.siteHeader.is-elevated .siteHeader__contact:hover{color:var(--gold)}
.siteHeader.is-elevated .siteHeader__contact svg{width:20px; height:20px}
.siteHeader.is-elevated .siteHeader__contact span{font-size:9px}
@media(max-width:600px){.siteHeader__contact{display:none}}

/* ---- Center: logo (absolutely centered) ---- */
.brand{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  text-decoration:none;
}
.brand__logo{
  display:block;
  width:168px;
  height:auto;
  /* white glow so logo pops on dark/video backgrounds */
  filter:
    drop-shadow(0 0 14px rgba(255,255,255,.38))
    drop-shadow(0 2px 10px rgba(0,0,0,.70));
  transition:width .4s, filter .4s;
}
.siteHeader.is-elevated .brand__logo{width:100px; filter:none}

/* ---- Right: CTA - hidden on desktop, shown on tablet/mobile ---- */
.siteHeader__cta{
  flex:1;
  display:flex;
  justify-content:flex-end;
  align-items:center;
}
.siteHeader__cta .btn{
  font-size:14px;
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;
  padding:15px 28px;
  width:auto;
  transition:padding .4s, font-size .4s, transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease, color .12s ease;
}
.siteHeader.is-elevated .siteHeader__cta .btn{padding:10px 22px; font-size:13px}
.siteHeader:not(.is-elevated) .siteHeader__cta .btn--gold{
  background:transparent;
  border:1.5px solid rgba(255,255,255,.80);
  color:#fff;
  box-shadow:none;
}
.siteHeader:not(.is-elevated) .siteHeader__cta .btn--gold::before{display:none}
/* Responsive sizing on tablet */
@media(max-width:980px){
  .siteHeader__cta .btn{padding:11px 18px; font-size:12px}
}
/* Hidden on mobile - button moves to bottom of mobile nav instead */
@media(max-width:480px){.siteHeader__cta{display:none}}

/* Mobile nav CTA button - shown only when header btn is hidden */
.mobileNav__cta{
  display:none;
  width:100%;
  margin-top:28px;
  padding-top:24px;
  border-top:1px solid rgba(255,255,255,.10);
}
.mobileNav__cta .btn{
  display:block;
  width:100%;
  text-align:center;
  font-size:clamp(14px,2vw,16px);
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;
  padding:16px;
}
@media(max-width:480px){.mobileNav__cta{display:block}}

/* ================= MOBILE NAV OVERLAY ================= */
.mobileNav{
  position:fixed;
  inset:0;
  z-index:490;
  color:#fff;
  background:rgba(6,11,20,.97);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  display:flex;
  flex-direction:column;
  align-items:center;
  /* top-aligned so accordion expands downward naturally */
  justify-content:flex-start;
  padding-top:clamp(100px,15vh,150px);
  padding-bottom:60px;
  overflow-y:auto;
}
.mobileNav__inner{
  width:100%;
  max-width:480px;
  padding:0 clamp(24px,5vw,48px);
  display:flex;
  flex-direction:column;
  align-items:center;
}
.mobileNav__inner > a{
  font-family:'DM Sans',sans-serif;
  font-weight:700;
  font-size:clamp(16px,2vw,22px);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#fff !important;
  text-decoration:none;
  padding:14px 0;
  width:100%;
  text-align:center;
  border-bottom:1px solid rgba(255,255,255,.10);
  display:block;
  transition:color .15s;
}
.mobileNav__inner > a:visited{color:#fff !important}
.mobileNav__inner > a:hover{color:var(--gold) !important}

/* Services accordion */
.navAccordion{
  border-bottom:1px solid rgba(255,255,255,.10);
  width:100%;
}
.navAccordion__trigger{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:100%;
  background:none;
  border:none;
  padding:14px 0;
  font-family:'DM Sans',sans-serif;
  font-weight:700;
  font-size:clamp(16px,2vw,22px);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#fff;
  cursor:pointer;
  text-align:center;
  transition:color .15s;
}
.navAccordion__trigger:hover{color:var(--gold)}
.navAccordion__trigger svg{
  width:18px;height:18px;
  flex-shrink:0;
  opacity:.60;
  transition:transform .25s;
}
.navAccordion.is-open .navAccordion__trigger svg{transform:rotate(180deg)}
.navAccordion__body{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:4px 0 14px;
}
.navAccordion__body a{
  font-family:'DM Sans',sans-serif;
  font-size:clamp(13px,1.6vw,16px);
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(255,255,255,.50) !important;
  text-decoration:none;
  padding:8px 0;
  text-align:center;
  display:block;
  border:none;
  transition:color .15s;
}
.navAccordion__body a:visited{color:rgba(255,255,255,.50) !important}
.navAccordion__body a:hover{color:var(--gold) !important}

/* ================= HERO ================= */
.hero{
  position:relative;
  min-height:100vh;            /* fallback */
  min-height:100svh;           /* better fallback */
  min-height:var(--hero-h, 100svh); /* JS locks this to a fixed px so the mobile toolbar can't resize the hero on scroll */
  overflow:hidden;
  margin-top:0;
}
@media (max-width: 980px){
  .hero{border-radius:0px}
}

.hero__media{position:absolute; inset:0}
.hero__video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  object-position:center;
  transform:scale(1.02);
  filter:contrast(1.08) saturate(1.08);
  pointer-events:none; /* it's decorative; also avoids tap-to-pause */
}
/* Hide the iOS/Safari play-button overlay shown when autoplay is blocked (e.g. Low Power Mode) */
.hero__video::-webkit-media-controls,
.hero__video::-webkit-media-controls-start-playback-button,
.hero__video::-webkit-media-controls-play-button,
.hero__video::-webkit-media-controls-overlay-play-button,
.hero__video::-webkit-media-controls-panel{
  display:none !important;
  -webkit-appearance:none;
  appearance:none;
}
.hero__shade{
  position:absolute; inset:0;
  background:
    linear-gradient(to bottom, rgba(0,0,0,.72) 0%, rgba(0,0,0,.38) 45%, rgba(0,0,0,.18) 75%, rgba(0,0,0,.28) 100%),
    linear-gradient(to right, rgba(0,0,0,.22) 0%, rgba(0,0,0,0) 55%);
}
.hero__grain{
  position:absolute; inset:0;
  opacity:.11;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}

.hero__content{
  position:absolute;
  bottom:clamp(40px, 5vw, 62px);
  /* Mirror .wrap centering via absolute */
  left:50%;
  transform:translateX(-50%);
  width:var(--wrap);
  max-width:none;
  z-index:2;
}

.eyebrow{
  display:flex; align-items:center; gap:10px;
  text-transform:uppercase; letter-spacing:.16em;
  font-weight:900; font-size:12px;
  color:rgba(255,255,255,.86);
  margin:0 0 14px;
}
.dot{
  width:10px;height:10px;border-radius:999px;
  background:radial-gradient(circle at 40% 30%, var(--gold2), var(--gold));
  box-shadow:0 10px 18px rgba(201,162,74,.22);
}
.heroTitle{
  font-family:'DM Sans',sans-serif !important;
  font-weight:700;
  font-size:clamp(52px, 6vw, 82px);
  line-height:1.0;
  color:#fff;
  text-shadow:0 16px 50px rgba(0,0,0,.45);
  margin-bottom:16px;
}
.heroLead{
  color:rgba(255,255,255,.88);
  text-shadow:0 14px 44px rgba(0,0,0,.35);
  font-size:17px;
  line-height:1.65;
  max-width:42ch;
  margin-bottom:0;
}
.hero__actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:24px;}

/* Scroll-down arrow */
@keyframes heroBounce{
  0%,100%{transform:translateX(-50%) translateY(0)}
  50%{transform:translateX(-50%) translateY(10px)}
}
@keyframes heroPulse{
  0%,100%{opacity:.85;box-shadow:0 0 0 0 rgba(255,255,255,.25)}
  50%{opacity:1;box-shadow:0 0 0 10px rgba(255,255,255,0)}
}
.heroScroll{
  position:absolute;
  bottom:clamp(24px,4vh,44px);
  left:50%;
  transform:translateX(-50%);
  z-index:10;
  width:48px;height:48px;
  border-radius:999px;
  border:1.5px solid rgba(255,255,255,.50);
  background:rgba(255,255,255,.18); /* no backdrop blur: it repaints over the hero on scroll (Firefox jank) */
  color:#fff;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  animation:heroBounce 2.2s ease-in-out infinite, heroPulse 2.2s ease-in-out infinite;
  transition:background .2s, border-color .2s;
}
.heroScroll:hover{
  background:rgba(255,255,255,.22);
  border-color:rgba(255,255,255,.80);
  animation-play-state:paused;
  transform:translateX(-50%) translateY(4px);
}
.heroScroll svg{width:20px;height:20px}

/* =========================
   SIGNAL SECTION
========================= */
.signal{
  /* No content-visibility here: it's the first section under the hero and
     Firefox flickers/flashes when it renders in. Keep it always-rendered. */
  position:relative;
  padding: clamp(64px, 7vw, 100px) 0;
  overflow:hidden;
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(201,162,74,.14), transparent 60%),
    radial-gradient(900px 700px at 90% -10%, rgba(15,28,46,.10), transparent 55%),
    linear-gradient(180deg, var(--paper2), var(--paper));
  border-top: 1px solid rgba(15,28,46,.08);
  border-bottom: 1px solid rgba(15,28,46,.08);
}

/* Full-width intro block - spans both columns */
.signal__intro{
  width:100%;
  margin-bottom:clamp(36px,5vw,56px);
}
.signal__intro h2{margin-bottom:14px}
.signal__intro .lead{max-width:none;margin:0}

/* ---- Mosaic section divider ---- */
.sigDivider{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 0 16px;
  border-top:1px solid rgba(15,28,46,.12);
  margin-bottom:10px;
}
.sigDivider__label{
  font-family:'DM Sans',sans-serif;
  font-size:13px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(15,28,46,.45);
}
.sigDivider__link{
  font-size:13px;
  font-weight:800;
  color:var(--gold);
  text-decoration:none;
  letter-spacing:.04em;
  transition:color .2s;
}
.sigDivider__link:hover{color:rgba(12,20,32,.80)}

/* ---- Mosaic footer CTA ---- */
.sigCta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:22px 0 0;
  border-top:1px solid rgba(15,28,46,.10);
  margin-top:10px;
}
.sigCta p{
  margin:0;
  font-size:17px;
  font-weight:600;
  color:rgba(12,20,32,.72);
}
@media(max-width:560px){
  .sigCta{flex-direction:column;gap:14px;align-items:flex-start}
}

/* ---- Photo mosaic ---- */
.sigMosaic{
  display:grid;
  grid-template-columns:1.15fr 1fr 1fr;
  grid-template-rows:300px 300px;
  gap:10px;
}

/* Base tile */
.sigTile{
  display:block;
  position:relative;
  border-radius:var(--r);
  overflow:hidden;
  text-decoration:none;
  transition:box-shadow .45s ease;
}
.sigTile:hover{box-shadow:0 28px 70px rgba(12,20,32,.30)}

/* Tall tile spans both rows */
.sigTile--tall{grid-row:span 2}

/* Inner bg layer - scales on hover for smooth zoom */
.sigTile__bg{
  position:absolute;
  inset:-4%;           /* slightly oversized so scale never reveals edges */
  background-size:cover;
  background-position:center;
  transform:scale(1);
  transition:transform .75s cubic-bezier(.25,.46,.45,.94);
  will-change:transform;
}
.sigTile:hover .sigTile__bg{transform:scale(1.07)}

/* Dark gradient overlay */
.sigTile__grad{
  position:absolute;
  inset:0;
  background:
    linear-gradient(to top, rgba(6,11,20,.88) 0%, rgba(6,11,20,.32) 55%, rgba(6,11,20,.06) 100%);
  transition:opacity .45s ease;
  z-index:1;
}
.sigTile:hover .sigTile__grad{opacity:.82}

/* Label row at bottom */
.sigTile__body{
  position:absolute;
  bottom:0;left:0;right:0;
  padding:16px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  z-index:2;
}
.sigTile__cat{
  font-family:'DM Sans',sans-serif;
  font-size:16px;
  font-weight:700;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:#fff;
}
.sigTile--tall .sigTile__cat{font-size:20px}
.sigTile__arrow{
  font-size:18px;
  color:var(--gold2);
  opacity:0;
  transform:translateX(-8px);
  transition:opacity .3s ease, transform .3s ease;
}
.sigTile:hover .sigTile__arrow{opacity:1;transform:translateX(0)}

/* Staggered reveal entrance per tile position */
.sigMosaic .sigTile.reveal{
  transform:translateY(14px) scale(.98);
  transition:opacity .55s ease, transform .55s ease;
}
.sigMosaic .sigTile.reveal.is-in{opacity:1;transform:none}
.sigMosaic .sigTile:nth-child(1){transition-delay:0ms}
.sigMosaic .sigTile:nth-child(2){transition-delay:80ms}
.sigMosaic .sigTile:nth-child(3){transition-delay:160ms}
.sigMosaic .sigTile:nth-child(4){transition-delay:120ms}
.sigMosaic .sigTile:nth-child(5){transition-delay:200ms}

/* Responsive */
@media(max-width:980px){
  .sigMosaic{
    grid-template-columns:1fr 1fr;
    grid-template-rows:240px 240px 240px;
  }
  .sigTile--tall{grid-row:span 1;grid-column:span 2}
}
@media(max-width:560px){
  .sigMosaic{
    grid-template-columns:1fr;
    grid-template-rows:repeat(5,220px);
  }
  .sigTile--tall{grid-column:span 1}
}

.kicker{
  display:flex;
  align-items:center;
  gap:10px;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-weight:900;
  font-size:12px;
  color:rgba(15,28,46,.72);
  margin:0 0 12px;
}
.kdot{
  width:10px;height:10px;border-radius:999px;
  background: radial-gradient(circle at 40% 30%, var(--gold2), var(--gold));
  box-shadow: 0 10px 18px rgba(201,162,74,.22);
}
.gold{color: var(--gold);}

.signal__actions{ margin-top:18px; display:flex; gap:10px; flex-wrap:wrap; }

.signal__bullets{ margin-top:18px; display:grid; gap:12px; }
.bullet{
  display:grid;
  grid-template-columns: 44px 1fr;
  gap:12px;
  padding:14px;
  border-radius:3px;
  background: rgba(255,255,255,.62);
  border:1px solid rgba(15,28,46,.10);
  box-shadow: 0 14px 34px rgba(12,20,32,.10);
}
.bullet__icon{
  width:44px;height:44px;border-radius:4px;
  background: radial-gradient(90px 60px at 30% 30%, rgba(201,162,74,.20), rgba(255,255,255,.60));
  border:1px solid rgba(201,162,74,.18);
  display:flex;align-items:center;justify-content:center;
  color: rgba(15,28,46,.88);
}
.bullet__icon svg{ width:24px; height:24px; }
.bullet__text strong{ display:block; font-weight:800; margin-bottom:2px; }
.bullet__text span{ display:block; color:rgba(12,20,32,.74); font-size:16px; line-height:1.45; }

.signal__bento{ display:grid; gap:14px; }
.bentoCard{
  border-radius:6px;
  padding:18px;
  background: rgba(255,255,255,.74);
  border:1px solid rgba(15,28,46,.10);
  box-shadow: 0 16px 42px rgba(12,20,32,.12);
}
.bentoCard p{ margin-bottom:12px; font-size:17px; }

.bentoCard__meta{ display:flex; gap:8px; flex-wrap:wrap; }
.pill{
  font-size:12px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:8px 10px;
  border-radius:999px;
  background: rgba(15,28,46,.06);
  border:1px solid rgba(15,28,46,.10);
  color: rgba(15,28,46,.78);
}
.pill--gold{
  background: rgba(201,162,74,.16);
  border-color: rgba(201,162,74,.24);
  color: rgba(15,28,46,.86);
}

/* keep your “dark” card but make it feel lighter + consistent */
.bentoCard--dark{
  background:
    radial-gradient(900px 220px at 25% 0%, rgba(201,162,74,.14), transparent 60%),
    linear-gradient(180deg, rgba(15,28,46,.88), rgba(15,28,46,.82));
  border-color: rgba(255,255,255,.14);
}
.bentoCard--dark h3,
.bentoCard--dark p{ color: rgba(255,255,255,.90); }
.bentoCard--dark p{ color: rgba(255,255,255,.78); }
.bentoCard--dark .pill{
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.14);
  color: rgba(255,255,255,.82);
}

.bentoCard--media{ padding:0; overflow:hidden; }
.bentoMedia{ height:220px; background-size:cover; background-position:center; filter:saturate(1.05) contrast(1.05); }
.bentoOverlay{
  padding:16px 18px 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.84), rgba(255,255,255,.62));
}
.bentoOverlay strong{display:block;margin-bottom:2px}
.bentoOverlay span{display:block;color:rgba(12,20,32,.70); margin-bottom:10px}

.bentoLink{
  font-weight:800;
  text-decoration:none;
  border-bottom: 2px solid rgba(201,162,74,.65);
  padding-bottom:2px;
}
.bentoLink:hover{ border-bottom-color: rgba(201,162,74,1); }

.signal__deco{
  position:absolute;
  right:-24px;
  bottom:-24px;
  width:180px;
  opacity:.09;             /* toned down */
  pointer-events:none;
  mix-blend-mode:multiply;
  transform: rotate(10deg);
}

@media (max-width: 980px){
  .signal__grid{grid-template-columns:1fr}
}

/* ================= WORK GRID ================= */
.workGrid{
  content-visibility:auto;
  contain-intrinsic-size:0 600px;
  padding: var(--s4) 0 calc(var(--s4) + 6px);
  position:relative;
}
.workGrid::before{
  content:"";
  position:absolute; inset:0;
  background:radial-gradient(900px 560px at 60% 0%, rgba(201,162,74,.12), transparent 60%);
  pointer-events:none;
}
.workGrid__head{
  position:relative;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
}
.arrow{
  font-weight:800;
  text-decoration:none;
  color:rgba(12,20,32,.80);
}
.arrow:hover{text-decoration:underline; text-decoration-color:rgba(201,162,74,.85)}
.workGrid__tiles{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
}
.tile{
  text-decoration:none;
  border-radius:var(--r);
  overflow:hidden;
  display:block;
  position:relative;
  box-shadow:0 20px 60px rgba(12,20,32,.18);
  transition:box-shadow .14s ease, transform .14s ease;
}
.tile__img{
  height:300px;
  background-size:cover;
  background-position:center;
  position:relative;
  display:flex;
  align-items:flex-end;
}
.tile__img::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(8,14,24,.85) 0%, rgba(8,14,24,.18) 55%, transparent 100%);
  pointer-events:none;
}
.tile__cap{
  position:relative;
  z-index:1;
  padding:18px 20px;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.tile__label{
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--gold2);
}
.tile__title{
  font-family:'DM Sans',sans-serif;
  font-size:22px;
  font-weight:700;
  color:#fff;
  line-height:1.1;
}

@media (hover:hover){
  .tile{ transition:box-shadow .14s ease, transform .14s ease; }
  .tile:hover{ box-shadow:0 26px 70px rgba(12,20,32,.15); transform: translateY(-1px); }
}
@media (max-width: 980px){
  .workGrid__tiles{grid-template-columns:1fr}
  .tile__img{height:220px}
}

/* ================= GALLERY CAROUSEL ================= */
.gallery{
  position:relative;
}
.gallery__viewport{
  overflow:hidden;
  padding:4px 0;
}
.gallery__track{
  display:flex;
  gap:14px;
  width:max-content;
  padding:0 4px;
  will-change:transform;        /* GPU-composited auto-scroll (smooth on mobile) */
  touch-action:pan-y;           /* allow vertical page scroll; we handle horizontal */
}
.gallery__slide{
  flex:0 0 auto;
  display:block;
  text-decoration:none;
  /* vw-based (not %) so it doesn't resolve against the max-content track width */
  width:clamp(260px, 30vw, 400px);
  border-radius:var(--r);
  overflow:hidden;
  box-shadow:0 20px 60px rgba(12,20,32,.28);
}
.gallery__slide img{
  display:block;
  width:100%;
  height:300px;
  object-fit:cover;
}
.gallery__nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:2;
  width:46px;
  height:46px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.22);
  background:linear-gradient(180deg, rgba(30,35,44,.92), rgba(30,35,44,.74));
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 18px 40px rgba(0,0,0,.32);
  transition:background .2s, border-color .2s, opacity .2s;
}
.gallery__nav:hover{
  background:linear-gradient(180deg, rgba(40,46,58,.96), rgba(40,46,58,.82));
  border-color:rgba(255,255,255,.45);
}
.gallery__nav svg{width:22px;height:22px}
.gallery__nav--prev{left:-10px}
.gallery__nav--next{right:-10px}
@media (max-width: 980px){
  .gallery__slide{width:min(78vw,360px)}
  .gallery__slide img{height:240px}
  .gallery__nav--prev{left:6px}
  .gallery__nav--next{right:6px}
}

/* ================= SEO BLOCK ================= */
.seoBlock{ content-visibility:auto; contain-intrinsic-size:0 500px; padding: var(--s4) 0; }
.seoBlock__grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
  align-items:start;
}
.seoBlock__list{
  padding:18px;
  border-radius:var(--r);
  background:rgba(255,255,255,.62);
  border:1px solid rgba(15,28,46,.10);
  box-shadow:0 14px 34px rgba(12,20,32,.08);
}
.seoBlock__list h3{margin:0 0 10px}
.seoBlock__list ul{margin:0; padding-left:18px}
.seoBlock__list li{margin:8px 0; color:rgba(12,20,32,.76)}
@media (max-width: 980px){
  .seoBlock__grid{grid-template-columns:1fr}
}

/* ================= POWERED-BY LOGO STRIP ================= */
.techStrip{
  padding:clamp(44px,5vw,68px) 0;
  background:#fff;
  border-top:1px solid rgba(15,28,46,.08);
  text-align:center;
}
.techStrip__label{
  font-family:'DM Sans',sans-serif;
  font-size:clamp(14px,1.7vw,18px);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:rgba(12,20,32,.72);
  margin:0 0 clamp(26px,3.5vw,40px);
}
/* Continuous logo marquee — consistent height, even spacing, seamless loop */
.logoMarquee{
  --logo-gap:clamp(40px,5vw,72px);
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}
.logoMarquee__track{
  display:flex;
  width:max-content;
  will-change:transform;        /* JS drives transform; pausing never jumps in Safari */
}
.logoMarquee__set{
  display:flex;
  align-items:center;
  gap:var(--logo-gap);
  padding-right:var(--logo-gap); /* trailing gap so the two sets tile seamlessly */
}
.logoMarquee__set img{
  width:auto;
  opacity:.6;
  transition:opacity .25s ease;
}
/* Optical sizing so compact/square marks aren't dwarfed by long wordmarks */
.logoMarquee__set .logo--tall{height:clamp(54px,6.6vw,74px)}
.logoMarquee__set .logo--mid{height:clamp(46px,5.6vw,62px)}
.logoMarquee__set .logo--wide{height:clamp(28px,3.4vw,40px)}
@media (hover:hover){
  .logoMarquee__set img:hover{opacity:1}
}
@media (prefers-reduced-motion: reduce){
  .logoMarquee{-webkit-mask-image:none; mask-image:none; overflow:visible}
  .logoMarquee__track{width:auto; flex-wrap:wrap; justify-content:center; transform:none !important}
  .logoMarquee__set{flex-wrap:wrap; justify-content:center; padding-right:0; row-gap:clamp(20px,3vw,32px)}
  .logoMarquee__set[aria-hidden]{display:none}
}

/* ================= UNIFIED DARK FOOTER ================= */
/* Includes CTA band + footer columns in one dark section  */

.siteFooter{
  margin-top:0;
  padding:0 0 0;
  background:
    radial-gradient(900px 520px at 12% 20%, rgba(201,162,74,.14), transparent 62%),
    radial-gradient(900px 620px at 92% 10%, rgba(15,28,46,.28), transparent 58%),
    linear-gradient(180deg, var(--midnight), var(--midnight2));
  color:rgba(255,255,255,.80);
}

/* ---- CTA band at top of footer ---- */
.footerCta{
  display:grid;
  grid-template-columns:1fr auto;
  gap:clamp(24px,4vw,64px);
  align-items:center;
  padding:clamp(52px,7vw,88px) 0 clamp(48px,6vw,80px);
}
.footerCta__copy h2{
  color:#fff;
  margin-bottom:10px;
}
.footerCta__copy p{
  color:rgba(255,255,255,.58);
  max-width:52ch;
  margin:0;
}
.footerCta__actions{
  display:flex;
  flex-direction:column;
  gap:10px;
  flex-shrink:0;
}
.btn--ghost{
  background:transparent;
  border:1.5px solid rgba(255,255,255,.28);
  color:#fff;
  box-shadow:none;
}
.btn--ghost:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.55);
}
@media(max-width:720px){
  .footerCta{
    grid-template-columns:1fr;
    gap:clamp(22px,4vw,32px);
  }
  .footerCta__actions{
    flex-direction:row;
    flex-wrap:wrap;
  }
}

/* ---- Divider between CTA and footer columns ---- */
.footerDivider{
  border:none;
  margin:0;
}
.footerDivider__inner{
  border-top:1px solid rgba(255,255,255,.10);
  padding:0;
}

/* ---- 3-col footer grid ---- */
.siteFooter__inner{
  display:grid;
  grid-template-columns:1.2fr 0.7fr 1.1fr;
  gap:clamp(32px,4vw,64px);
  align-items:start;
  padding:clamp(44px,5.5vw,68px) 0 clamp(32px,4vw,52px);
}

/* Brand column */
.siteFooter__brand{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
}
.siteFooter__logoLink{display:inline-block; line-height:0; text-decoration:none}
.siteFooter__logo{
  width:130px;height:auto;
  filter:brightness(0) invert(1);
  opacity:.90;
  transition:opacity .2s;
}
.siteFooter__logoLink:hover .siteFooter__logo{opacity:1}
.siteFooter__name{font-weight:800;font-size:16px;color:rgba(255,255,255,.88);line-height:1.2;margin:0}
.siteFooter__meta{font-size:13px;color:rgba(255,255,255,.40);line-height:1.55;margin:0}
.siteFooter__social{display:flex;gap:14px;align-items:center;margin-top:4px}
.siteFooter__social a{
  color:rgba(255,255,255,.32);
  display:flex;align-items:center;
  text-decoration:none;
  transition:color .2s;
}
.siteFooter__social a:hover{color:var(--gold)}

/* Nav column */
.siteFooter__navHead{
  display:block;
  font-size:11px;
  font-weight:700;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:rgba(255,255,255,.30);
  margin-bottom:14px;
}
.siteFooter__nav{display:flex;flex-direction:column;gap:9px}
.siteFooter__nav a{
  color:rgba(255,255,255,.60);
  text-decoration:none;
  font-weight:700;
  font-size:15px;
  transition:color .2s;
}
.siteFooter__nav a:hover{color:var(--gold)}
.siteFooter__nav a:visited{color:rgba(255,255,255,.60)}

/* Info / contact column */
.siteFooter__info{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.siteFooter__infoItem{
  display:flex;
  align-items:flex-start;
  gap:9px;
  color:rgba(255,255,255,.52);
  text-decoration:none;
  font-size:14px;
  line-height:1.5;
  transition:color .2s;
}
.siteFooter__infoItem:hover{color:var(--gold)}
.siteFooter__infoItem:visited{color:rgba(255,255,255,.52)}
.siteFooter__infoItem svg{flex-shrink:0;margin-top:2px;opacity:.55}

/* Bottom bar */
.siteFooter__bottom{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:8px 20px;
  padding:16px 0 24px;
  border-top:1px solid rgba(255,255,255,.08);
  color:rgba(255,255,255,.28);
  font-size:12px;
}
.siteFooter__bottom > :last-child{justify-self:end}
.siteFooter__legal{display:flex;gap:16px;justify-self:center}
.siteFooter__legal a{
  color:rgba(255,255,255,.28);
  text-decoration:none;
  font-size:12px;
  transition:color .2s;
}
.siteFooter__legal a:hover{color:rgba(255,255,255,.65)}
.siteFooter__legal a:visited{color:rgba(255,255,255,.28)}
.siteFooter__bottom span a{color:inherit;text-decoration:none;transition:color .2s}
.siteFooter__bottom span a:hover{color:rgba(255,255,255,.65)}

@media(max-width:980px){
  .siteFooter__inner{grid-template-columns:1fr 1fr;gap:32px}
  .siteFooter__brand{grid-column:1/-1}
}
@media(max-width:599px){
  .siteFooter__inner{grid-template-columns:1fr;gap:28px}
  .siteFooter__brand{grid-column:auto}
  .siteFooter__bottom{grid-template-columns:1fr;justify-items:start;gap:10px}
  .siteFooter__bottom > :last-child{justify-self:start}
  .siteFooter__legal{flex-wrap:wrap;gap:12px;justify-self:start}
}

/* ================= RESPONSIVE ================= */

/* Tablet: 2-col work grid */
@media (min-width:600px) and (max-width:979px){
  .workGrid__tiles{grid-template-columns:repeat(2,1fr)}
  .tile__img{height:260px}
  .signal__bento{grid-template-columns:1fr 1fr}
}

/* Mobile: ≤599px - tighten everything */
@media (max-width:599px){
  h1{font-size:clamp(36px,9vw,52px)}
  h2{font-size:clamp(26px,7vw,36px)}
  h3{font-size:18px}
  .lead{font-size:16px}
  .heroTitle{font-size:clamp(38px,10vw,56px) !important}
  .hero__actions{flex-direction:column; align-items:flex-start; gap:10px}
  .hero__actions .btn{width:100%; justify-content:center}
  .heroScroll{display:none}
  .signal__grid{grid-template-columns:1fr; gap:32px}
  .signal__bento{grid-template-columns:1fr}
  .bentoCard{padding:18px}
  .workGrid__tiles{grid-template-columns:1fr}
  .tile__img{height:220px}
  .seoBlock__grid{grid-template-columns:1fr}
  .siteFooter__inner{grid-template-columns:1fr}
  .siteFooter__cta{text-align:left}
  .btn--lg{padding:13px 22px; font-size:15px}
}

/* Nav drawer accessible overrides */
@media (max-width:980px){
  .mobileNav a{display:block; color:rgba(255,255,255,.85)}
  .mobileNav .btn--gold{
    display:block;
    text-align:center;
    margin-top:8px;
    color:#0b121c !important;
  }
}

/* ================= MOTION ================= */
.reveal{
  opacity:0;
  transform:translateY(8px);
  transition:opacity .45s ease, transform .45s ease;
}
.reveal.is-in{opacity:1; transform:none}

/* Directional + scale reveal variants - override the base translateY */
.reveal.reveal--left  { transform:translateX(-10px); }
.reveal.reveal--right { transform:translateX(10px); }
.reveal.reveal--scale { transform:translateY(6px) scale(.98); }

.hero-in{
  opacity:0;
  transform:translateY(8px);
  transition:opacity .55s ease, transform .55s ease;
}
.hero-in.is-in{opacity:1; transform:none}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .reveal,.hero-in{transition:none !important; transform:none !important; opacity:1 !important;}
  .magnetic{transform:none !important;}
}

/* ================= ENHANCED INTERACTIONS ================= */

/* Brand dot pulse - subtle, slow */
@keyframes dotPulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(201,162,74,.4); }
  55%    { box-shadow:0 0 0 5px rgba(201,162,74,0); }
}
.dot,.kdot{ animation:dotPulse 4s ease-in-out infinite; }

/* Gold button shimmer sweep */
@keyframes goldShimmer{
  0%  { transform:translateX(-130%) skewX(-15deg); }
  100%{ transform:translateX(290%)  skewX(-15deg); }
}
.btn{ position:relative; }
.btn--gold{ overflow:hidden; }
.btn--gold::before{
  content:"";
  position:absolute; top:0; left:0; width:36%; height:100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
  animation:goldShimmer 5s ease-in-out 2s infinite;
  pointer-events:none;
}

/* BentoCard hover lift */
@media(hover:hover){
  .bentoCard{
    transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease;
  }
  .bentoCard:hover{
    transform:translateY(-3px);
    box-shadow:0 22px 48px rgba(12,20,32,.15);
    border-color:rgba(201,162,74,.2);
  }

  /* Bullet hover */
  .bullet{
    transition:border-color .12s ease, box-shadow .12s ease, transform .12s ease;
  }
  .bullet:hover{
    transform:translateX(3px);
    border-color:rgba(201,162,74,.26);
    box-shadow:0 14px 34px rgba(12,20,32,.11);
  }
}


/* ====== ASH HYBRID THEME OVERRIDES (v1 clean) ====== */

/* Header */
/* is-elevated on .siteHeader handles full-width frosted bar */


/* Progress bar */
#progressBar{
  position:fixed;
  top:0; left:0;
  height:3px;
  width:0%;
  background:linear-gradient(90deg, var(--gold), var(--gold2));
  z-index:9999;
  opacity:0;
  transition:width .15s ease, opacity .2s ease;
}
#progressBar.is-on{opacity:1}
#progressBar.is-off{opacity:0}

/* Back-to-top */
#backToTop{
  position:fixed;
  right:22px;
  bottom:22px;
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg, rgba(30,35,44,.92), rgba(30,35,44,.74));
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 18px 60px rgba(0,0,0,.28);
  cursor:pointer;
  opacity:0;
  transform:translateY(8px);
  pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
  z-index:9998;
}
#backToTop.is-on{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
#backToTop svg{width:18px;height:18px}

/* ================= COOKIE CONSENT BAR ================= */
.cookieBar{
  position:fixed;
  bottom:0; left:0; right:0;
  z-index:8000;
  background:rgba(9,15,25,.985); /* opaque; no backdrop blur to avoid scroll repaint (Firefox jank) */
  border-top:1px solid rgba(255,255,255,.09);
  padding:16px 0;
  transform:translateY(100%);
  transition:transform .4s cubic-bezier(.22,.68,0,1.2);
}
.cookieBar.is-on{transform:translateY(0)}
.cookieBar__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:clamp(14px,3vw,32px);
}
.cookieBar p{
  margin:0;
  font-size:13px;
  color:rgba(255,255,255,.52);
  line-height:1.55;
}
.cookieBar p a{color:var(--gold); text-decoration:underline; text-underline-offset:2px}
.cookieBar__btn{
  flex-shrink:0;
  font-size:12px;
  padding:9px 22px;
  letter-spacing:.08em;
}
@media(max-width:560px){
  .cookieBar__inner{flex-direction:column; align-items:flex-start; gap:12px}
}

/* Dark band - used for stats sections on interior pages */
.darkBand{
  background:
    radial-gradient(900px 520px at 12% 20%, rgba(201,162,74,.16), transparent 62%),
    radial-gradient(900px 620px at 92% 10%, rgba(15,28,46,.28), transparent 58%),
    linear-gradient(180deg, var(--midnight), var(--midnight2));
  color:rgba(255,255,255,.88);
}

/* Hybrid section alternation without touching layout */
.workGrid{
  background:
    radial-gradient(900px 520px at 12% 20%, rgba(201,162,74,.16), transparent 62%),
    radial-gradient(900px 620px at 92% 10%, rgba(15,28,46,.28), transparent 58%),
    linear-gradient(180deg, var(--midnight), var(--midnight2));
  color:rgba(255,255,255,.92);
}
.workGrid h2, .workGrid h3, .workGrid p, .workGrid .arrow{color:rgba(255,255,255,.92)}
.workGrid .arrow{color:rgba(255,255,255,.85)}
.workGrid .arrow:hover{color:#fff}

.seoBlock{
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(201,162,74,.14), transparent 60%),
    radial-gradient(900px 700px at 90% -10%, rgba(15,28,46,.10), transparent 55%),
    linear-gradient(180deg, var(--paper2), var(--paper));
  color:var(--ink);
}

/* Prevent blue visited/active states */
a:visited{color:inherit}
a:active{color:inherit}


/* ================= INTERIOR PAGES ================= */

/* Page Hero - static image */
.pageHero{
  position:relative;
  min-height:72vh;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
}
.pageHero--dark{
  background:
    radial-gradient(900px 520px at 12% 20%, rgba(201,162,74,.18), transparent 62%),
    radial-gradient(900px 620px at 92% 10%, rgba(15,28,46,.28), transparent 58%),
    linear-gradient(180deg, var(--midnight), var(--midnight2));
}
.pageHero__bg{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  filter:saturate(1.05) contrast(1.04);
}
.pageHero__shade{
  position:absolute;
  inset:0;
  background:
    linear-gradient(to top, rgba(0,0,0,.84) 0%, rgba(0,0,0,.44) 45%, rgba(0,0,0,.22) 100%),
    linear-gradient(to right, rgba(0,0,0,.18) 0%, rgba(0,0,0,0) 55%);
}
.pageHero__content{
  position:relative;
  z-index:2;
  padding:clamp(40px,5vw,70px) 0 clamp(36px,4.5vw,58px);
}
.breadcrumb{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:rgba(255,255,255,.50);
  margin:0 0 14px;
}
.breadcrumb a{color:rgba(255,255,255,.50);text-decoration:none;transition:color .2s}
.breadcrumb a:hover{color:var(--gold)}
.breadcrumb__sep{color:rgba(255,255,255,.22)}
.pageHero__title{
  font-family:'DM Sans',sans-serif;
  font-weight:700;
  font-size:clamp(40px,5vw,66px);
  line-height:1.0;
  color:#fff;
  text-shadow:0 16px 50px rgba(0,0,0,.45);
  margin:0 0 14px;
}
.pageHero__lead{
  color:rgba(255,255,255,.80);
  font-size:17px;
  line-height:1.65;
  max-width:52ch;
  margin:0;
}
.pageHero__actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}

/* ---- Service Cards Grid ---- */
.servicesOverview{
  padding:clamp(56px,6vw,88px) 0;
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(201,162,74,.12), transparent 60%),
    linear-gradient(180deg, var(--paper2), var(--paper));
}
.servicesGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:36px;
}
@media(max-width:980px){.servicesGrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:599px){.servicesGrid{grid-template-columns:1fr}}

/* Photo-tile service cards */
.serviceCard{
  position:relative;
  border-radius:var(--r);
  overflow:hidden;
  text-decoration:none;
  height:320px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  box-shadow:0 16px 42px rgba(12,20,32,.18);
  transition:box-shadow .4s ease;
}
.serviceCard:hover{
  box-shadow:0 26px 60px rgba(12,20,32,.30);
}

/* Background photo layer - zooms on hover */
.serviceCard__bg{
  position:absolute;
  inset:-4%;
  background-size:cover;
  background-position:center;
  transform:scale(1);
  transition:transform .75s cubic-bezier(.25,.46,.45,.94);
  will-change:transform;
}
.serviceCard:hover .serviceCard__bg{transform:scale(1.07)}

/* Gradient overlay - heavier at bottom for legibility */
.serviceCard__grad{
  position:absolute;
  inset:0;
  background:
    linear-gradient(to top,
      rgba(6,11,20,.92) 0%,
      rgba(6,11,20,.55) 50%,
      rgba(6,11,20,.18) 100%);
  transition:opacity .4s ease;
}
.serviceCard:hover .serviceCard__grad{opacity:.88}

/* Text content sits above both layers */
.serviceCard__body{
  position:relative;
  z-index:2;
  padding:22px 24px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.serviceCard h3{
  margin:0;
  font-size:22px;
  color:#fff;
  line-height:1.1;
}
.serviceCard p{
  margin:0;
  color:rgba(255,255,255,.68);
  font-size:14px;
  line-height:1.55;
  flex:1;
}
.serviceCard__link{
  font-weight:800;font-size:12px;
  color:var(--gold2);
  text-decoration:none;
  display:inline-flex;align-items:center;gap:5px;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-top:4px;
  transition:color .2s, gap .2s;
}
.serviceCard:hover .serviceCard__link{
  color:#fff;
  gap:8px;
}

/* ---- Page Intro - dark, like homepage signal section ---- */
.pageIntro{
  content-visibility:auto;
  contain-intrinsic-size:0 600px;
  padding:clamp(56px,6vw,92px) 0;
  background:
    radial-gradient(1000px 560px at 10% 0%, rgba(201,162,74,.14), transparent 60%),
    radial-gradient(900px 600px at 92% 10%, rgba(15,28,46,.30), transparent 55%),
    linear-gradient(180deg, var(--midnight), var(--midnight2));
  color:rgba(255,255,255,.90);
}
.pageIntro__grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:clamp(36px,4vw,72px);
  align-items:center;
}
.pageIntro__img{
  border-radius:var(--r);
  overflow:hidden;
  aspect-ratio:4/3;
  box-shadow:0 32px 80px rgba(0,0,0,.45);
}
.pageIntro__img img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:980px){.pageIntro__grid{grid-template-columns:1fr}}

/* ---- Feature Cards - light, 2-col icon grid ---- */
.pageFeatures{
  content-visibility:auto;
  contain-intrinsic-size:0 700px;
  padding:clamp(56px,6vw,88px) 0;
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(201,162,74,.12), transparent 60%),
    linear-gradient(180deg, var(--paper2), var(--paper));
  border-top:1px solid rgba(15,28,46,.07);
}
.featureCards{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
  margin-top:36px;
}
@media(max-width:599px){.featureCards{grid-template-columns:1fr}}
.featureCard{
  display:grid;
  grid-template-columns:46px 1fr;
  gap:16px;
  align-items:flex-start;
  padding:20px;
  border-radius:var(--r);
  background:rgba(255,255,255,.76);
  border:1px solid rgba(15,28,46,.10);
  box-shadow:0 12px 30px rgba(12,20,32,.08);
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
@media(hover:hover){
  .featureCard:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 42px rgba(12,20,32,.12);
    border-color:rgba(201,162,74,.22);
  }
}
.featureCard__icon{
  width:46px;height:46px;
  border-radius:4px;
  background:radial-gradient(90px 60px at 30% 30%, rgba(201,162,74,.22), rgba(255,255,255,.60));
  border:1px solid rgba(201,162,74,.20);
  display:flex;align-items:center;justify-content:center;
  color:rgba(15,28,46,.88);
  flex-shrink:0;
}
.featureCard__icon svg{width:22px;height:22px}
.featureCard strong{display:block;font-weight:800;font-size:16px;margin-bottom:4px}
.featureCard span{display:block;color:rgba(12,20,32,.68);font-size:15px;line-height:1.5}

/* ---- Stats Row ---- */
.statsRow{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:2px;
}
.stat{
  padding:clamp(24px,3vw,36px) 20px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  text-align:center;
}
.stat__num{
  font-family:'DM Sans',sans-serif;
  font-size:clamp(40px,4.5vw,60px);
  font-weight:700;
  color:var(--gold2);
  line-height:1;
  display:block;
}
.stat__label{
  font-size:12px;
  color:rgba(255,255,255,.58);
  letter-spacing:.10em;
  text-transform:uppercase;
  font-weight:700;
  display:block;
  margin-top:6px;
}
@media(max-width:599px){.statsRow{grid-template-columns:repeat(2,1fr)}}

/* ---- Work Full Grid ---- */
.workFull{
  padding:clamp(56px,6vw,88px) 0;
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(201,162,74,.10), transparent 60%),
    linear-gradient(180deg, var(--paper2), var(--paper));
  border-top:1px solid rgba(15,28,46,.07);
}
.workFull .kicker{color:rgba(15,28,46,.72)}
.workFull h2{color:var(--ink)}
.workFull__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:32px;
}
@media(max-width:980px){.workFull__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:599px){.workFull__grid{grid-template-columns:1fr}}

/* Work page photo gallery (uniform grid) */
.workGallery{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-top:32px;
}
.workGallery__item{
  margin:0;
  position:relative;
  aspect-ratio:4/3;
  border-radius:var(--r);
  overflow:hidden;
  box-shadow:0 14px 34px rgba(12,20,32,.12);
  background:rgba(255,255,255,.5);
}
.workGallery__item img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .5s ease;
}
@media (hover:hover){
  .workGallery__item:hover img{transform:scale(1.05)}
}
.workGallery__item{cursor:zoom-in}
@media(max-width:980px){.workGallery{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.workGallery{grid-template-columns:1fr}}

/* Lightbox */
.lightbox{
  position:fixed;
  inset:0;
  z-index:10000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(8,12,20,.93);
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease, visibility .25s ease;
}
.lightbox.is-open{opacity:1; visibility:visible}
.lightbox__img{
  max-width:92vw;
  max-height:88vh;
  border-radius:6px;
  box-shadow:0 30px 90px rgba(0,0,0,.55);
  object-fit:contain;
}
.lightbox__close,
.lightbox__nav{
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.24);
  background:rgba(255,255,255,.08);
  color:#fff;
  cursor:pointer;
  transition:background .2s, border-color .2s;
}
.lightbox__close:hover,
.lightbox__nav:hover{background:rgba(255,255,255,.18); border-color:rgba(255,255,255,.5)}
.lightbox__close{top:18px; right:22px; width:44px; height:44px}
.lightbox__close svg{width:20px; height:20px}
.lightbox__nav{top:50%; transform:translateY(-50%); width:50px; height:50px}
.lightbox__nav svg{width:24px; height:24px}
.lightbox__nav--prev{left:18px}
.lightbox__nav--next{right:18px}
@media(max-width:600px){
  .lightbox__nav{width:42px; height:42px}
  .lightbox__nav--prev{left:8px}
  .lightbox__nav--next{right:8px}
}

/* Legal / content pages (Privacy, Terms, Accessibility) */
.legal{
  padding:clamp(48px,6vw,80px) 0;
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(201,162,74,.08), transparent 60%),
    linear-gradient(180deg, var(--paper2), var(--paper));
}
.legal--standalone{padding-top:clamp(112px,14vh,156px)}
.legal__body{max-width:820px}
.legal__title{
  font-family:'DM Sans',sans-serif;
  font-weight:700;
  font-size:clamp(32px,4vw,48px);
  line-height:1.05;
  color:var(--ink);
  margin:0 0 10px;
}
.legal__intro{
  font-size:17px;
  line-height:1.65;
  color:rgba(12,20,32,.7);
  margin:0 0 4px;
  max-width:60ch;
}
.legal__updated{
  font-size:13px;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:rgba(12,20,32,.5);
  margin:0 0 28px;
}
.legal__body h2{
  font-size:clamp(20px,2.4vw,26px);
  margin:38px 0 12px;
  color:var(--ink);
}
.legal__body h2:first-of-type{margin-top:0}
.legal__body h3{font-size:18px; margin:22px 0 8px; color:var(--ink)}
.legal__body p,
.legal__body li{color:rgba(12,20,32,.78); line-height:1.7}
.legal__body p{margin:0 0 14px}
.legal__body ul{margin:0 0 18px; padding-left:22px}
.legal__body li{margin-bottom:8px}
.legal__body a{color:var(--gold); text-decoration:underline; text-underline-offset:2px}
.legal__body strong{color:var(--ink)}

/* ---- About Page ---- */
.aboutSection{padding:clamp(56px,6vw,88px) 0}
.aboutSection--dark{
  background:
    radial-gradient(900px 520px at 12% 20%, rgba(201,162,74,.16), transparent 62%),
    linear-gradient(180deg, var(--midnight), var(--midnight2));
  color:rgba(255,255,255,.90);
}
.aboutSection--light{
  background:linear-gradient(180deg, var(--paper2), var(--paper));
}
.aboutGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(32px,4vw,64px);
  align-items:center;
}
.aboutGrid--flip{direction:rtl}
.aboutGrid--flip>*{direction:ltr}
.aboutImg{
  border-radius:var(--r);
  overflow:hidden;
  aspect-ratio:4/3;
}
.aboutImg img{width:100%;height:100%;object-fit:cover;display:block}
/* About: inline divider between story + how-we-work */
.aboutDivider{
  display:flex;
  align-items:center;
  gap:16px;
  margin:clamp(40px,5vw,64px) 0 clamp(32px,4vw,48px);
}
.aboutDivider::before,
.aboutDivider::after{
  content:'';
  flex:1;
  height:1px;
  background:rgba(15,28,46,.12);
}
.aboutDivider__label{
  font-family:'DM Sans',sans-serif;
  font-size:11px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(15,28,46,.38);
  white-space:nowrap;
}

/* About: 4-col how-we-work strip */
.aboutHow{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:clamp(20px,3vw,36px);
}
.aboutHow__item{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding-top:20px;
  border-top:2px solid rgba(201,162,74,.28);
}
.aboutHow__num{
  font-family:'DM Sans',sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.18em;
  color:var(--gold);
  margin-bottom:2px;
}
.aboutHow__item strong{
  display:block;
  font-family:'DM Sans',sans-serif;
  font-size:17px;
  font-weight:700;
  color:var(--ink);
  line-height:1.2;
}
.aboutHow__item p{
  margin:0;
  font-size:14px;
  color:rgba(12,20,32,.58);
  line-height:1.6;
}
@media(max-width:980px){
  .aboutHow{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .aboutHow{grid-template-columns:1fr}
}

/* Values 2×2 editorial grid */
.valuesList{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2px;
  margin-top:clamp(32px,4vw,52px);
  border:1px solid rgba(15,28,46,.10);
  border-radius:var(--r);
  overflow:hidden;
}
.valueItem{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:clamp(28px,3.5vw,44px) clamp(24px,3vw,40px);
  background:rgba(255,255,255,.55);
  border:none;
  position:relative;
  transition:background .25s;
}
.valueItem:nth-child(odd){background:rgba(255,255,255,.75)}
.valueItem:hover{background:rgba(255,255,255,.92)}
.valueItem__num{
  font-family:'DM Sans',sans-serif;
  font-size:clamp(56px,6vw,80px);
  font-weight:700;
  color:rgba(201,162,74,.18);
  line-height:1;
  letter-spacing:-.02em;
  /* large decorative number sits at top-left */
  position:absolute;
  top:clamp(16px,2vw,24px);
  right:clamp(16px,2vw,24px);
}
.valueItem__content{position:relative;z-index:1}
.valueItem__content strong{
  display:block;
  font-family:'DM Sans',sans-serif;
  font-size:clamp(20px,2.2vw,26px);
  font-weight:700;
  color:var(--ink);
  line-height:1.1;
  margin-bottom:10px;
  letter-spacing:.01em;
}
.valueItem p{
  margin:0;
  font-size:15px;
  color:rgba(12,20,32,.65);
  line-height:1.65;
}
@media(max-width:980px){
  .aboutGrid{grid-template-columns:1fr}
  .aboutGrid--flip{direction:ltr}
  .valuesList{grid-template-columns:1fr}
}

/* Form error banner */
.formError{
  background:rgba(200,50,50,.10);
  border:1px solid rgba(200,50,50,.30);
  color:rgba(160,30,30,.90);
  border-radius:var(--r);
  padding:12px 16px;
  font-size:14px;
  line-height:1.5;
  margin-bottom:20px;
}

/* ---- Contact Page ---- */
.contactSection{
  padding:clamp(56px,6vw,88px) 0;
  background:linear-gradient(180deg, var(--paper2), var(--paper));
}
.contactGrid{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:clamp(32px,4vw,56px);
  align-items:start;
}
.contactForm{
  background:rgba(255,255,255,.76);
  border:1px solid rgba(15,28,46,.10);
  border-radius:var(--r);
  padding:clamp(24px,3vw,38px);
  box-shadow:0 16px 42px rgba(12,20,32,.10);
}
.formGroup{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.formGroup label{
  font-weight:700;font-size:12px;
  letter-spacing:.06em;text-transform:uppercase;
  color:rgba(12,20,32,.60);
}
.formGroup input,
.formGroup select,
.formGroup textarea{
  font-family:'DM Sans',sans-serif;
  font-size:15px;
  padding:11px 13px;
  border-radius:3px;
  border:1px solid rgba(15,28,46,.18);
  background:#fff;
  color:var(--ink);
  outline:none;
  transition:border-color .2s, box-shadow .2s;
  width:100%;
  box-sizing:border-box;
}
.formGroup input:focus,
.formGroup select:focus,
.formGroup textarea:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(201,162,74,.14);
}
.formGroup textarea{resize:vertical;min-height:110px}
.formRow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.contactSide{display:flex;flex-direction:column;gap:14px}
.contactCard{
  display:flex;gap:14px;align-items:flex-start;
  padding:20px;
  border-radius:var(--r);
  background:rgba(255,255,255,.68);
  border:1px solid rgba(15,28,46,.10);
  box-shadow:0 10px 28px rgba(12,20,32,.08);
}
.contactCard__icon{
  width:42px;height:42px;flex-shrink:0;
  border-radius:4px;
  background:radial-gradient(90px 60px at 30% 30%, rgba(201,162,74,.22), rgba(255,255,255,.60));
  border:1px solid rgba(201,162,74,.20);
  display:flex;align-items:center;justify-content:center;
  color:rgba(15,28,46,.88);
}
.contactCard__icon svg{width:20px;height:20px}
.contactCard__label{
  display:block;font-weight:700;font-size:11px;
  letter-spacing:.08em;text-transform:uppercase;
  color:rgba(12,20,32,.50);margin-bottom:3px;
}
.contactCard__value{
  font-size:16px;font-weight:700;color:rgba(12,20,32,.88);
}
.contactCard__value a{color:inherit;text-decoration:none;transition:color .2s}
.contactCard__value a:hover{color:var(--gold)}
.serviceAreas{
  padding:20px;
  border-radius:var(--r);
  background:rgba(255,255,255,.68);
  border:1px solid rgba(15,28,46,.10);
}
.serviceAreas h3{margin:0 0 10px;font-size:18px}
.areaList{
  display:flex;flex-wrap:wrap;gap:6px;
  list-style:none;padding:0;margin:0;
}
.areaList li{
  font-size:12px;font-weight:700;
  padding:5px 10px;
  border-radius:999px;
  background:rgba(201,162,74,.12);
  border:1px solid rgba(201,162,74,.22);
  color:rgba(15,28,46,.80);
  letter-spacing:.04em;
  text-transform:uppercase;
}
@media(max-width:980px){
  .contactGrid{grid-template-columns:1fr}
  .formRow{grid-template-columns:1fr}
}

/* =================================================================
   FLUENT FORMS SKIN — make the embedded quote form match the site's
   custom form design (.contactForm container holds the form).
   ================================================================= */
.contactForm__embed .fluentform .ff-el-group{margin-bottom:14px}
.contactForm__embed .fluentform .ff-el-input--label label{
  font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  color:rgba(12,20,32,.60);margin-bottom:5px;
}
.contactForm__embed .fluentform .ff-el-input--label label .ff-el-is-required{color:var(--gold)}
.contactForm__embed .fluentform input[type=text],
.contactForm__embed .fluentform input[type=email],
.contactForm__embed .fluentform input[type=tel],
.contactForm__embed .fluentform input[type=date],
.contactForm__embed .fluentform input[type=number],
.contactForm__embed .fluentform select,
.contactForm__embed .fluentform textarea{
  font-family:'DM Sans',sans-serif;font-size:15px;
  padding:11px 13px;border-radius:3px;
  border:1px solid rgba(15,28,46,.18);background:#fff;color:var(--ink);
  width:100%;box-sizing:border-box;outline:none;
  transition:border-color .2s, box-shadow .2s;
}
.contactForm__embed .fluentform input:focus,
.contactForm__embed .fluentform select:focus,
.contactForm__embed .fluentform textarea:focus{
  border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,162,74,.14);
}
.contactForm__embed .fluentform textarea{resize:vertical;min-height:110px}
/* two-column rows (first/last name, etc.) */
.contactForm__embed .fluentform .ff-t-cell{padding-left:6px;padding-right:6px}
/* submit button → site gold button, full width */
.contactForm__embed .fluentform .ff-btn-submit{
  width:100%;justify-content:center;display:inline-flex;align-items:center;
  padding:14px 18px;border-radius:3px;border:1px solid rgba(195,154,63,.55);
  font-family:'DM Sans',sans-serif;font-weight:900;letter-spacing:.01em;font-size:16px;
  background:linear-gradient(180deg, var(--gold2), #c39a3f);color:#0b121c;
  box-shadow:0 14px 30px rgba(195,154,63,.22);cursor:pointer;margin-top:6px;
  transition:transform .12s ease, box-shadow .12s ease;
}
.contactForm__embed .fluentform .ff-btn-submit:hover{transform:translateY(-1px)}
.contactForm__embed .fluentform .ff-message-success{
  border-radius:var(--r);padding:16px;background:rgba(201,162,74,.10);
  border:1px solid rgba(201,162,74,.30);color:var(--ink);
}