:root{
  --gold:#C49A3C;
  --gold-lt:#E8C96B;
  --gold-dk:#8A6820;
  --gold-dim:rgba(196,154,60,0.18);
  --dark:#0C0C0A;
  --dark2:#131310;
  --dark3:#1C1C18;
  --dark4:#242420;
  --border:rgba(196,154,60,0.15);
  --border-lt:rgba(255,255,255,0.06);
  --silver:#A8A6A0;
  --silver-lt:#D0CEC8;
  --light:#F5F3EE;
  --light2:#EDEAE3;
  --white:#FFFFFF;
  --text:#1A1A16;
  --text2:#555550;
  --text3:#888880;
  /* Light theme — poster palette (warm cream / gold / black) */
  --paper:#EFE9DE;
  --paper-2:#E7E0D2;
  --paper-3:#F3EEE3;
  --ink:#17150E;
  --ink-2:#5F5D54;
  /* Champion gold, deepened until it clears AA as small text on every light
     surface here. --gold is only ~2:1 on the cream bands; --gold-lt is worse. */
  --gold-ink:#755718;
}
*{margin:0;padding:0;box-sizing:border-box;}

/* Smooth momentum scrolling (Lenis) replaces hard CSS snap */
html{scroll-behavior:smooth;scroll-padding-top:66px;}

html{scroll-behavior:smooth;}
body{font-family:'DM Sans',sans-serif;color:var(--text);background:var(--white);overflow-x:hidden;}

/* ─── NAV ─── */
/* Scoped to the site header. A bare `nav` selector also matched every
   <nav class="breadcrumb">, which pinned breadcrumbs behind the header. */
body > nav{position:fixed;top:0;left:0;right:0;z-index:999;background:rgba(12,12,10,0.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:0 5%;}
.nav-inner{max-width:1140px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:66px;}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;height:66px;}
.nav-shield{width:28px;height:28px;flex-shrink:0;}
.nav-wordmark{font-family:'Bebas Neue',sans-serif;font-size:1.25rem;letter-spacing:0.06em;color:var(--white);line-height:1;}
.nav-wordmark span{color:var(--gold);}
.nav-links{display:flex;align-items:center;gap:1.15rem;align-self:stretch;}
.nav-links a{color:var(--silver);font-size:0.78rem;text-decoration:none;letter-spacing:0.07em;text-transform:uppercase;font-weight:500;transition:color 0.3s cubic-bezier(0.25,0.1,0.25,1);}
.nav-links a:hover{color:var(--gold-lt);}
.nav-phone{background:linear-gradient(135deg,var(--gold) 0%,var(--gold-dk) 100%);color:var(--dark)!important;padding:0.5rem 1.2rem;border-radius:3px;font-weight:600!important;letter-spacing:0.08em!important;}
.nav-phone:hover{filter:brightness(1.1);color:var(--dark)!important;}

/* ─── Global dropdown navigation ─── */
/* Built on the existing .nav-links row: each dropdown is a <button> plus an
   absolutely positioned panel. Colours, radius, easing and type all come from
   the tokens already in use above, so it reads as the same header it was. */
/* align-self:stretch makes the item the full 66px of the bar, so the panel's
   top:100% lands on the bar's bottom edge instead of halfway up it, and the
   hover target covers the whole bar height. */
.nav-item{position:relative;display:flex;align-items:center;align-self:stretch;}
.nav-toggle{display:inline-flex;align-items:center;gap:5px;background:none;border:none;padding:0;cursor:pointer;
  font-family:inherit;color:var(--silver);font-size:0.78rem;letter-spacing:0.07em;text-transform:uppercase;font-weight:500;
  transition:color 0.3s cubic-bezier(0.25,0.1,0.25,1);}
.nav-toggle:hover,.nav-item.open > .nav-toggle{color:var(--gold-lt);}
.nav-toggle .caret{width:9px;height:9px;flex:none;transition:transform 0.25s cubic-bezier(0.25,0.1,0.25,1);}
.nav-item.open .caret{transform:rotate(180deg);}

/* The panel sits under the 66px bar. The 10px top padding on .nav-drop doubles
   as the bridge the pointer crosses on its way down, so the menu does not close
   out from under the cursor. */
.nav-drop{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(4px);
  min-width:230px;padding:10px 0 0;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity 0.18s ease,transform 0.18s cubic-bezier(0.25,0.1,0.25,1),visibility 0s linear 0.18s;z-index:1000;}
.nav-item.open > .nav-drop{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);transition-delay:0s;}
.nav-drop-inner{background:rgba(19,19,16,0.98);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:6px;
  box-shadow:0 18px 44px -14px rgba(0,0,0,0.72);padding:0.5rem 0;overflow:hidden;}
.nav-drop a{display:block;padding:0.6rem 1.15rem;font-size:0.76rem;letter-spacing:0.06em;text-transform:uppercase;
  color:var(--silver);white-space:nowrap;transition:color 0.2s,background 0.2s;}
.nav-drop a:hover,.nav-drop a:focus-visible{color:var(--gold-lt);background:rgba(196,154,60,0.09);}
.nav-drop a[aria-current="page"]{color:var(--gold-lt);}
.nav-drop a.is-lead{color:var(--gold-lt);font-weight:600;}
.nav-drop hr{border:none;border-top:1px solid var(--border-lt);margin:0.4rem 0;}

/* Light theme */
html[data-theme="light"] .nav-toggle{color:#5f5d54;}
html[data-theme="light"] .nav-toggle:hover,html[data-theme="light"] .nav-item.open > .nav-toggle{color:var(--gold-ink);}
html[data-theme="light"] .nav-drop-inner{background:rgba(243,238,227,0.99);border-color:rgba(0,0,0,0.10);
  box-shadow:0 18px 44px -16px rgba(0,0,0,0.28);}
html[data-theme="light"] .nav-drop a{color:#4a4842;}
html[data-theme="light"] .nav-drop a:hover,html[data-theme="light"] .nav-drop a:focus-visible{color:var(--gold-ink);background:rgba(196,154,60,0.13);}
html[data-theme="light"] .nav-drop a[aria-current="page"],html[data-theme="light"] .nav-drop a.is-lead{color:var(--gold-ink);}
html[data-theme="light"] .nav-drop hr{border-top-color:rgba(0,0,0,0.08);}

/* Keyboard focus. The site had no visible focus ring on nav items at all. */
.nav-links a:focus-visible,.nav-toggle:focus-visible,.nav-drop a:focus-visible,
.mobile-menu a:focus-visible,.m-toggle:focus-visible{outline:2px solid var(--gold-lt);outline-offset:3px;border-radius:2px;}
html[data-theme="light"] .nav-links a:focus-visible,html[data-theme="light"] .nav-toggle:focus-visible,
html[data-theme="light"] .nav-drop a:focus-visible,html[data-theme="light"] .mobile-menu a:focus-visible,
html[data-theme="light"] .m-toggle:focus-visible{outline-color:var(--gold-dk);}

/* Five dropdowns plus the quote link need more room than the old five plain links,
   so the row gap above is 1.15rem rather than the original 1.8rem. That leaves
   ~98px of slack inside the 1140px .nav-inner cap at every desktop width; the
   hamburger takes over at 1180px where the slack would otherwise run out. */

/* ─── Mobile menu: nested, scrollable ─── */
/* It used to be a flat list that could run off a short screen with no way to
   scroll. It now holds every page, so it needs a height cap and its own scroll. */
.mobile-menu{max-height:calc(100vh - 66px);max-height:calc(100dvh - 66px);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;}
.m-sec{border-bottom:1px solid rgba(255,255,255,0.05);}
.m-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:none;
  font-family:inherit;color:var(--silver);font-size:0.95rem;letter-spacing:0.04em;padding:0.85rem 0;cursor:pointer;text-align:left;}
.m-toggle .caret{width:11px;height:11px;flex:none;transition:transform 0.25s cubic-bezier(0.25,0.1,0.25,1);opacity:0.75;}
.m-sec.open .m-toggle{color:var(--gold-lt);}
.m-sec.open .m-toggle .caret{transform:rotate(180deg);}
.m-panel{display:none;padding:0 0 0.5rem 0.9rem;border-left:1px solid var(--border);margin:0 0 0.7rem;}
.m-sec.open .m-panel{display:block;}
.m-panel a{font-size:0.88rem;padding:0.6rem 0;border-bottom:none;color:var(--silver);}
.m-panel a[aria-current="page"],.m-panel a.is-lead{color:var(--gold-lt);}
.mobile-menu > a[aria-current="page"]{color:var(--gold-lt);}
html[data-theme="light"] .m-sec{border-bottom-color:rgba(0,0,0,0.07);}
html[data-theme="light"] .m-toggle{color:#4a4842;}
html[data-theme="light"] .m-sec.open .m-toggle{color:var(--gold-ink);}
html[data-theme="light"] .m-panel{border-left-color:rgba(0,0,0,0.10);}
html[data-theme="light"] .m-panel a{color:#5a584f;}
html[data-theme="light"] .m-panel a[aria-current="page"],html[data-theme="light"] .m-panel a.is-lead,
html[data-theme="light"] .mobile-menu > a[aria-current="page"]{color:var(--gold-ink);}

.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px;background:none;border:none;}
.hamburger span{width:22px;height:1.5px;background:var(--white);border-radius:2px;transition:all 0.2s;}
.mobile-menu{display:none;position:fixed;top:66px;left:0;right:0;background:rgba(12,12,10,0.99);padding:1.5rem 5%;z-index:998;border-bottom:1px solid var(--border);}
.mobile-menu a{display:block;color:var(--silver);text-decoration:none;font-size:0.95rem;padding:0.85rem 0;border-bottom:1px solid rgba(255,255,255,0.05);letter-spacing:0.04em;}
.mobile-menu .mcta{color:var(--gold-lt);font-weight:600;border-bottom:none;margin-top:0.6rem;font-size:1.05rem;}


body > nav{transition:background 0.4s cubic-bezier(0.25,0.1,0.25,1),box-shadow 0.4s cubic-bezier(0.25,0.1,0.25,1),height 0.4s cubic-bezier(0.25,0.1,0.25,1);}
nav.scrolled{background:rgba(12,12,10,0.99);box-shadow:0 4px 24px rgba(0,0,0,0.35);}

/* ─── HERO ─── */
.hero{min-height:100vh;background:var(--dark);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:8rem 5% 5rem;position:relative;overflow:hidden;}
.hero-bg{position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 40%,rgba(196,154,60,0.06) 0%,transparent 65%);}
.hero-grid{position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,transparent,transparent 79px,rgba(255,255,255,0.014) 80px),repeating-linear-gradient(90deg,transparent,transparent 79px,rgba(255,255,255,0.014) 80px);}
.hero-line{position:absolute;left:0;bottom:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold-dim),transparent);}
/* Hero cross-fade photos */
.hero-photos{position:absolute;inset:0;z-index:0;overflow:hidden;}
.hero-photo{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;animation:heroFade 54s linear infinite;will-change:opacity;}
/* Slide 1 is the LCP image and loads immediately. Slides 2-6 are ~540KB and are
   not seen for at least 9s, so their background-image is held back behind
   html.bg-ready (added on window load) to keep them from competing with the LCP
   fetch. With JS off the hero simply stays on slide 1 instead of fading to blanks. */
.hero-photo.hp1{background-image:url('../img/hero-1.webp');opacity:1;animation:none;}
html.bg-ready .hero-photo.hp1{opacity:0;animation:heroFade 54s linear infinite;animation-delay:0s;}
.hero-photo.hp2,.hero-photo.hp3,.hero-photo.hp4,.hero-photo.hp5,.hero-photo.hp6{animation:none;}
html.bg-ready .hero-photo.hp2{background-image:url('../img/hero-2.webp');animation:heroFade 54s linear infinite;animation-delay:9s;}
html.bg-ready .hero-photo.hp3{background-image:url('../img/hero-3.webp');animation:heroFade 54s linear infinite;animation-delay:18s;}
html.bg-ready .hero-photo.hp4{background-image:url('../img/hero-4.webp');animation:heroFade 54s linear infinite;animation-delay:27s;}
html.bg-ready .hero-photo.hp5{background-image:url('../img/hero-5.webp');animation:heroFade 54s linear infinite;animation-delay:36s;}
html.bg-ready .hero-photo.hp6{background-image:url('../img/hero-6.webp');animation:heroFade 54s linear infinite;animation-delay:45s;}
.hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,8,6,0.80) 0%,rgba(8,8,6,0.60) 42%,rgba(8,8,6,0.72) 78%,rgba(8,8,6,0.88) 100%);}
/* 6 slides x 9s = 54s. Hold ends at 16.667% (exactly 9s, when the next slide
   starts its fade-in) and the fade-out ends at 18.667% (10.08s), so the two
   cross over symmetrically. It used to hold to 15% (8.1s) and fade out by 18%,
   which left ~0.9s where the outgoing slide was dropping and nothing was rising
   yet, and the hero visibly dipped toward black on every change. */
@keyframes heroFade{0%{opacity:0;}2%{opacity:1;}16.667%{opacity:1;}18.667%{opacity:0;}100%{opacity:0;}}
.hero-content{position:relative;z-index:2;max-width:860px;}
.hero-eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:0.7rem;font-weight:500;letter-spacing:0.26em;text-transform:uppercase;color:var(--gold);margin-bottom:1.6rem;opacity:0;animation:fadeUp 0.9s 0.1s cubic-bezier(0.22,1,0.36,1) forwards;}
.hero-eyebrow::before,.hero-eyebrow::after{content:'';display:block;width:28px;height:1px;background:var(--gold);opacity:0.4;}
h1.hero-h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(3.4rem,9vw,7.5rem);color:var(--white);line-height:0.95;letter-spacing:0.03em;margin-bottom:1.4rem;opacity:0;animation:fadeUp 0.9s 0.25s cubic-bezier(0.22,1,0.36,1) forwards;}
h1.hero-h1 .gold{color:var(--gold);}
h1.hero-h1 .line2{display:block;font-size:clamp(2rem,5.5vw,4.5rem);letter-spacing:0.12em;color:var(--silver-lt);margin-top:0.2rem;}
.hero-sub{font-size:clamp(0.95rem,2vw,1.12rem);font-weight:300;color:var(--silver);line-height:1.8;max-width:600px;margin:0 auto 0.6rem;opacity:0;animation:fadeUp 0.9s 0.4s cubic-bezier(0.22,1,0.36,1) forwards;}
.hero-sub strong{color:var(--silver-lt);font-weight:500;}
.hero-nady{display:inline-flex;align-items:center;gap:8px;background:var(--gold-dim);border:1px solid var(--border);border-radius:3px;padding:0.45rem 1rem;font-size:0.74rem;font-weight:500;color:var(--gold-lt);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:2rem;opacity:0;animation:fadeUp 0.9s 0.5s cubic-bezier(0.22,1,0.36,1) forwards;}
.hero-nady svg{width:14px;height:14px;flex-shrink:0;}
.hero-btns{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;opacity:0;animation:fadeUp 0.9s 0.6s cubic-bezier(0.22,1,0.36,1) forwards;}
.btn-gold{background:linear-gradient(135deg,var(--gold-lt) 0%,var(--gold) 50%,var(--gold-dk) 100%);color:var(--dark);padding:1.05rem 2.4rem;border-radius:3px;font-size:0.84rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;transition:filter 0.35s cubic-bezier(0.25,0.1,0.25,1),transform 0.35s cubic-bezier(0.25,0.1,0.25,1),box-shadow 0.35s cubic-bezier(0.25,0.1,0.25,1);display:inline-flex;align-items:center;gap:9px;}
.btn-gold:hover{filter:brightness(1.08);transform:translateY(-2px);box-shadow:0 12px 28px rgba(196,154,60,0.25);}
.btn-ghost{border:1px solid rgba(196,154,60,0.35);color:var(--gold-lt);padding:1.05rem 2.4rem;border-radius:3px;font-size:0.84rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;transition:all 0.35s cubic-bezier(0.25,0.1,0.25,1);display:inline-flex;align-items:center;gap:9px;}
.btn-ghost:hover{border-color:var(--gold-lt);background:rgba(196,154,60,0.07);transform:translateY(-2px);}
.hero-trust{display:flex;justify-content:center;gap:2.5rem;flex-wrap:wrap;margin-top:3.5rem;padding-top:2.5rem;border-top:1px solid rgba(255,255,255,0.06);opacity:0;animation:fadeUp 0.9s 0.75s cubic-bezier(0.22,1,0.36,1) forwards;}
.tbadge{display:flex;align-items:center;gap:7px;font-size:0.72rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;color:var(--silver);}
.tdot{width:5px;height:5px;border-radius:50%;background:var(--gold);flex-shrink:0;}

/* ─── STAT BAR ─── */
.statbar{background:var(--dark2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:2.5rem 5%;}
.statbar-inner{max-width:1140px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;text-align:center;}
.stat-num{font-family:'Bebas Neue',sans-serif;font-size:2.8rem;color:var(--gold);letter-spacing:0.04em;line-height:1;}
.stat-label{font-size:0.72rem;font-weight:500;letter-spacing:0.14em;text-transform:uppercase;color:var(--silver);margin-top:4px;}

/* ─── SECTION LABELS ─── */
.stag{font-size:0.68rem;font-weight:600;letter-spacing:0.3em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:0.6rem;}
h2.sh2{font-family:'DM Serif Display',serif;font-size:clamp(1.9rem,3.8vw,2.9rem);color:var(--dark);line-height:1.1;margin-bottom:0.7rem;}
.ssub{font-size:0.96rem;font-weight:300;color:var(--text2);line-height:1.82;max-width:520px;}
.sh2.sh2-white,.sh2-white{color:var(--white);}
.ssub-white{color:var(--silver);}

/* ─── WHY US ─── */
.why{background:var(--dark3);padding:5.5rem 5%;min-height:100vh;display:flex;align-items:center;}
.why-inner{max-width:1140px;margin:0 auto;}
.why-header{text-align:center;margin-bottom:3.5rem;}
.why-header .ssub{margin:0 auto;}
.why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;background:var(--border);border:1px solid var(--border);border-radius:10px;overflow:hidden;}
.why-card{background:var(--dark3);padding:2.2rem 2rem;position:relative;transition:background 0.4s cubic-bezier(0.25,0.1,0.25,1);}
.why-card:hover{background:var(--dark4);}
.why-num{font-family:'Bebas Neue',sans-serif;font-size:3.5rem;color:rgba(196,154,60,0.12);line-height:1;position:absolute;top:1.2rem;right:1.5rem;letter-spacing:0.04em;}
.why-icon{width:40px;height:40px;background:var(--gold-dim);border:1px solid var(--border);border-radius:6px;display:flex;align-items:center;justify-content:center;margin-bottom:1.2rem;}
.why-icon svg{width:20px;height:20px;}
.why-title{font-size:1.02rem;font-weight:600;color:var(--white);margin-bottom:0.5rem;}
.why-desc{font-size:0.84rem;color:var(--silver);line-height:1.7;}
.why-card.featured{grid-column:1/-1;background:var(--gold-dim);border-top:2px solid var(--gold);}
.why-card.featured .why-title{font-size:1.25rem;color:var(--gold-lt);}
.why-card.featured .why-desc{font-size:0.92rem;color:var(--silver-lt);max-width:720px;}

/* Recent work gallery */
.work-strip{margin-top:2rem;}
.work-strip-label{font-size:0.68rem;font-weight:600;letter-spacing:0.3em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;}
.work-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;}
.work-grid img{width:100%;height:190px;object-fit:cover;border-radius:6px;border:1px solid var(--border);display:block;cursor:pointer;transition:transform 0.4s cubic-bezier(0.25,0.1,0.25,1),box-shadow 0.4s cubic-bezier(0.25,0.1,0.25,1);}
.work-grid img:hover{transform:scale(1.02);box-shadow:0 10px 28px rgba(0,0,0,0.35);}
@media(max-width:600px){.work-grid{grid-template-columns:repeat(2,1fr);}.work-grid img{height:130px;}}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:2000;background:rgba(8,8,6,0.94);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;opacity:0;transition:opacity 0.25s ease;}
.lightbox.open{display:flex;opacity:1;}
.lightbox-img{max-width:90vw;max-height:82vh;border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,0.6);border:1px solid rgba(196,154,60,0.25);}
.lightbox-close{position:absolute;top:18px;right:22px;width:44px;height:44px;border:none;background:rgba(255,255,255,0.06);color:var(--light);font-size:1.7rem;line-height:1;border-radius:50%;cursor:pointer;transition:background 0.2s;display:flex;align-items:center;justify-content:center;}
.lightbox-close:hover{background:rgba(196,154,60,0.25);}
.lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border:none;background:rgba(255,255,255,0.06);color:var(--light);font-size:1.8rem;line-height:1;border-radius:50%;cursor:pointer;transition:background 0.2s;display:flex;align-items:center;justify-content:center;}
.lightbox-nav:hover{background:rgba(196,154,60,0.25);}
.lightbox-prev{left:22px;}
.lightbox-next{right:22px;}
.lightbox-caption{position:absolute;bottom:24px;left:0;right:0;text-align:center;color:var(--silver);font-size:0.82rem;letter-spacing:0.03em;padding:0 1rem;}
.lightbox-count{position:absolute;top:24px;left:24px;color:var(--silver);font-size:0.78rem;letter-spacing:0.1em;font-family:'Bebas Neue',sans-serif;}
@media(max-width:600px){.lightbox-nav{width:42px;height:42px;font-size:1.4rem;}.lightbox-prev{left:10px;}.lightbox-next{right:10px;}.lightbox-img{max-width:94vw;}}

.why-highlight{background:var(--gold-dim);border:1px solid var(--border);border-radius:8px;padding:2rem 2.5rem;margin-top:2rem;display:flex;align-items:center;gap:2rem;flex-wrap:wrap;}
.why-hl-text{font-family:'DM Serif Display',serif;font-size:1.4rem;color:var(--white);line-height:1.4;flex:1;min-width:200px;}
.why-hl-text em{color:var(--gold-lt);font-style:normal;}
.why-hl-cta{flex-shrink:0;}

/* ─── SERVICES ─── */
.services{background:var(--light);padding:5.5rem 5%;min-height:100vh;}
.services-inner{max-width:1140px;margin:0 auto;}
.svc-header{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:1.5rem;margin-bottom:2.8rem;}
.svc-hero-card{background:var(--dark);border-radius:10px;padding:2.5rem;margin-bottom:1px;border:2px solid var(--gold-dim);position:relative;overflow:hidden;}
.svc-hero-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);}
.svc-hero-inner{display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:center;}
.svc-hero-badge{background:linear-gradient(135deg,var(--gold-lt),var(--gold));color:var(--dark);font-size:0.6rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;padding:4px 10px;border-radius:2px;display:inline-block;margin-bottom:0.7rem;}
.svc-hero-title{font-family:'Bebas Neue',sans-serif;font-size:2.4rem;color:var(--white);letter-spacing:0.05em;line-height:1;margin-bottom:0.6rem;}
.svc-hero-desc{font-size:0.9rem;color:var(--silver);line-height:1.72;max-width:480px;}
.svc-hero-sub{margin-top:1.2rem;display:flex;flex-wrap:wrap;gap:0.5rem;}
.svc-sub-pill{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);border-radius:2px;padding:4px 10px;font-size:0.75rem;color:var(--silver-lt);font-weight:500;}
.svc-hero-stat{text-align:right;}
.svc-hero-stat .big{font-family:'Bebas Neue',sans-serif;font-size:3.8rem;color:var(--gold);line-height:1;}
.svc-hero-stat .lbl{font-size:0.7rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--silver);margin-top:2px;}
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1px;background:rgba(0,0,0,0.08);border:1px solid rgba(0,0,0,0.07);border-radius:10px;overflow:hidden;margin-top:1px;}
.svc{background:var(--white);padding:2rem 1.8rem;transition:background 0.4s cubic-bezier(0.25,0.1,0.25,1),border-color 0.4s cubic-bezier(0.25,0.1,0.25,1),transform 0.4s cubic-bezier(0.25,0.1,0.25,1);position:relative;border-bottom:2px solid transparent;}
.svc:hover{background:#F8F7F3;border-bottom-color:var(--gold);transform:translateY(-3px);}
.svc-icon{width:44px;height:44px;background:linear-gradient(135deg,rgba(196,154,60,0.12),rgba(196,154,60,0.05));border:1px solid rgba(196,154,60,0.2);border-radius:6px;display:flex;align-items:center;justify-content:center;margin-bottom:1.1rem;}
.svc-icon svg{width:22px;height:22px;}
.svc-name{font-size:1rem;font-weight:700;color:var(--dark);margin-bottom:0.4rem;}
.svc-desc{font-size:0.8rem;color:var(--text2);line-height:1.67;}
.combo-callout{margin-top:2rem;background:var(--white);border:1px solid rgba(0,0,0,0.08);border-radius:10px;padding:2rem 2.5rem;display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;}
.combo-text strong{display:block;font-size:1.05rem;color:var(--dark);font-weight:600;margin-bottom:0.3rem;}
.combo-text p{font-size:0.88rem;color:var(--text2);line-height:1.65;max-width:480px;}
.combo-example{background:var(--light2);border-radius:8px;padding:1.2rem 1.5rem;flex-shrink:0;}
.combo-example-label{font-size:0.64rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--text3);margin-bottom:0.6rem;font-weight:600;}
.combo-example-items{display:flex;flex-direction:column;gap:4px;}
.cei{display:flex;align-items:center;gap:8px;font-size:0.82rem;color:var(--text2);}
.cei svg{width:14px;height:14px;flex-shrink:0;color:var(--gold-ink);}

/* ─── REVIEWS ─── */
.reviews{background:var(--white);padding:5.5rem 5%;min-height:100vh;}
.reviews-inner{max-width:1140px;margin:0 auto;}
.rev-header{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:1.5rem;margin-bottom:2.5rem;}
.rev-score{display:flex;align-items:center;gap:12px;background:var(--light);border:1px solid rgba(0,0,0,0.06);border-radius:8px;padding:0.9rem 1.5rem;}
.rev-score-num{font-family:'Bebas Neue',sans-serif;font-size:2.6rem;color:var(--dark);line-height:1;}
.rev-score-stars{color:#C49A3C;font-size:1.1rem;display:flex;gap:3px;}
.rev-score-label{font-size:0.7rem;color:var(--text2);text-transform:uppercase;letter-spacing:0.1em;margin-top:2px;}
.rgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:1.5rem;}
.rcard{background:var(--light);border-radius:10px;padding:1.8rem;border:1px solid rgba(0,0,0,0.05);transition:transform 0.4s cubic-bezier(0.25,0.1,0.25,1),box-shadow 0.4s cubic-bezier(0.25,0.1,0.25,1);}
.rcard:hover{transform:translateY(-3px);box-shadow:0 10px 32px rgba(0,0,0,0.07);}
.rcard-stars{color:var(--gold);font-size:0.95rem;letter-spacing:2px;margin-bottom:0.9rem;}
.rcard-text{font-size:0.92rem;line-height:1.78;color:#444;margin-bottom:1.3rem;font-style:italic;}
.rcard-author{display:flex;align-items:center;gap:10px;}
.ravatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--gold-lt),var(--gold-dk));display:flex;align-items:center;justify-content:center;font-size:0.8rem;font-weight:600;color:var(--dark);flex-shrink:0;}
.rname{font-size:0.88rem;font-weight:600;color:var(--dark);}
.rloc{font-size:0.72rem;color:var(--text2);margin-top:1px;}
.rplatform{font-size:0.66rem;color:var(--gold-ink);font-weight:600;letter-spacing:0.06em;text-transform:uppercase;margin-top:2px;}
.rev-inline-cta{margin-top:2.5rem;background:var(--light);border:1px solid rgba(0,0,0,0.07);border-radius:10px;padding:2rem 2.5rem;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;}
.rev-inline-cta p{font-size:0.95rem;color:var(--text2);line-height:1.65;max-width:480px;}
.rev-inline-cta p strong{color:var(--dark);}

/* ─── HOW IT WORKS ─── */
.how{background:var(--dark);padding:5.5rem 5%;min-height:100vh;display:flex;align-items:center;}
.how-inner{max-width:960px;margin:0 auto;text-align:center;}
.how .ssub{margin:0 auto 3.5rem;}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;position:relative;margin-bottom:3rem;}
.steps::before{content:'';position:absolute;top:28px;left:calc(16.67% + 18px);right:calc(16.67% + 18px);height:1px;background:linear-gradient(90deg,var(--gold-dim),var(--border),var(--gold-dim));}
.step{position:relative;z-index:1;}
.snum{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--gold-lt) 0%,var(--gold) 50%,var(--gold-dk) 100%);color:var(--dark);font-family:'Bebas Neue',sans-serif;font-size:1.5rem;display:flex;align-items:center;justify-content:center;margin:0 auto 1.3rem;letter-spacing:0.04em;}
.stitle{font-size:0.95rem;font-weight:600;color:var(--white);margin-bottom:0.5rem;}
.sdesc{font-size:0.82rem;color:var(--silver);line-height:1.68;}
.how-guarantee{background:var(--gold-dim);border:1px solid var(--border);border-radius:8px;padding:1.8rem 2.5rem;text-align:center;margin-top:0.5rem;}
.how-guarantee-title{font-family:'DM Serif Display',serif;font-size:1.3rem;color:var(--white);margin-bottom:0.5rem;}
.how-guarantee-text{font-size:0.87rem;color:var(--silver);line-height:1.68;max-width:520px;margin:0 auto 1.2rem;}
.how-note{font-size:0.73rem;color:rgba(255,255,255,0.2);margin-top:0.8rem;letter-spacing:0.06em;}

/* ─── TEAM ─── */

.team{background:var(--light);padding:5.5rem 5%;}
.team-inner{max-width:1140px;margin:0 auto;}
.team-header{text-align:center;margin-bottom:3.5rem;}
.team-header .ssub{margin:0 auto;}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin-bottom:2.5rem;}
.tmember{background:var(--white);border-radius:10px;overflow:hidden;border:1px solid rgba(0,0,0,0.06);transition:transform 0.45s cubic-bezier(0.25,0.1,0.25,1),box-shadow 0.45s cubic-bezier(0.25,0.1,0.25,1);}
.tmember:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,0,0,0.08);}
.tmember-photo{background:var(--dark);height:320px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.5rem;padding:2rem;position:relative;overflow:hidden;}
.tmember-photo.has-img{padding:0;}
.tmember-photo.has-img img{width:100%;height:100%;object-fit:cover;display:block;}
.tmember-photo.has-img::after{display:none;}
.tmember-photo::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);}
.tmember-initials{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,var(--gold-lt),var(--gold-dk));display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',sans-serif;font-size:1.8rem;color:var(--dark);letter-spacing:0.06em;}
.tmember-photo-hint{font-size:0.66rem;color:rgba(255,255,255,0.2);text-transform:uppercase;letter-spacing:0.1em;text-align:center;margin-top:0.3rem;}
.tmember-info{padding:1.5rem 1.8rem;}
.tmember-name{font-size:1.05rem;font-weight:600;color:var(--dark);margin-bottom:2px;}
.tmember-role{font-size:0.78rem;color:var(--gold-ink);font-weight:600;text-transform:uppercase;letter-spacing:0.1em;margin-bottom:0.8rem;}
.tmember-bio{font-size:0.85rem;color:var(--text2);line-height:1.7;}
.tmember-badge{display:inline-flex;align-items:center;gap:5px;background:var(--gold-dim);border:1px solid rgba(196,154,60,0.25);border-radius:2px;padding:3px 8px;font-size:0.65rem;font-weight:600;color:var(--gold-ink);letter-spacing:0.1em;text-transform:uppercase;margin-top:0.8rem;}
.team-values{background:var(--white);border-radius:10px;padding:2.5rem;border:1px solid rgba(0,0,0,0.06);}
.team-values-title{font-family:'DM Serif Display',serif;font-size:1.4rem;color:var(--dark);margin-bottom:1.5rem;}
.vals-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;}
.val{display:flex;align-items:flex-start;gap:12px;padding:1rem;background:var(--light);border-radius:6px;}
.vcheck{width:22px;height:22px;min-width:22px;border-radius:50%;background:linear-gradient(135deg,var(--gold-lt),var(--gold-dk));display:flex;align-items:center;justify-content:center;margin-top:1px;}
.vcheck svg{width:10px;height:10px;}
.vtext{font-size:0.86rem;color:var(--text2);line-height:1.55;}
.vtext strong{display:block;color:var(--dark);font-weight:600;margin-bottom:2px;}

/* ─── AREA ─── */
.area{background:var(--white);padding:5.5rem 5%;min-height:100vh;}
.area-inner{max-width:1140px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start;}
.area-copy p{font-size:0.94rem;color:var(--text2);line-height:1.8;margin-bottom:1.2rem;}
.area-copy p strong{color:var(--dark);}
.area-promises{margin-top:1.5rem;display:flex;flex-direction:column;gap:0.9rem;}
.pi{display:flex;align-items:flex-start;gap:10px;}
.pcheck{width:20px;height:20px;min-width:20px;border-radius:50%;background:linear-gradient(135deg,var(--gold-lt),var(--gold-dk));display:flex;align-items:center;justify-content:center;margin-top:2px;}
.pcheck svg{width:10px;height:10px;}
.ptext{font-size:0.88rem;color:var(--text2);line-height:1.55;}
.ptext strong{color:var(--dark);font-weight:600;}
.amap-card{background:var(--light);border-radius:10px;padding:2.5rem;border:1px solid rgba(0,0,0,0.05);}
.amap-title{font-size:0.66rem;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;color:var(--text2);margin-bottom:1.4rem;}
.towns{display:flex;flex-wrap:wrap;gap:0.5rem;margin-bottom:1.3rem;}
.town{background:var(--white);border:1px solid rgba(0,0,0,0.1);border-radius:2px;padding:0.4rem 0.9rem;font-size:0.8rem;font-weight:500;color:var(--dark);}
.town.main{background:linear-gradient(135deg,var(--gold-lt),var(--gold-dk));border-color:transparent;color:var(--dark);font-weight:600;}
.area-note{font-size:0.76rem;color:var(--text2);font-style:italic;padding-top:1rem;border-top:1px solid rgba(0,0,0,0.07);}
.area-cta{margin-top:1.5rem;}

/* ─── FINAL CTA ─── */
.cta-sec{background:var(--dark);padding:5.5rem 5%;text-align:center;position:relative;overflow:hidden;min-height:100vh;display:flex;align-items:center;justify-content:center;}
.cta-sec::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 50%,rgba(196,154,60,0.07) 0%,transparent 70%);}
.cta-inner{max-width:700px;margin:0 auto;position:relative;z-index:1;}
.cta-sec .sh2{color:var(--white);font-size:clamp(2.2rem,5vw,3.5rem);margin-bottom:0.8rem;}
.cta-sec .ssub{color:var(--silver);margin:0 auto 2.5rem;}
a.cta-phone{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.8rem,7vw,5rem);color:var(--gold-lt);text-decoration:none;display:block;margin-bottom:0.2rem;letter-spacing:0.04em;line-height:1;transition:color 0.2s;}
a.cta-phone:hover{color:var(--gold);}
.cta-email{font-size:0.85rem;color:var(--silver);margin-bottom:1.5rem;display:block;}
.cta-email a{color:var(--gold);text-decoration:none;}
.cta-or{font-size:0.7rem;letter-spacing:0.24em;text-transform:uppercase;color:rgba(255,255,255,0.58);margin:1rem 0;}
a.cta-txt{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(196,154,60,0.3);color:var(--gold-lt);padding:0.9rem 2rem;border-radius:3px;text-decoration:none;font-size:0.82rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;transition:all 0.2s;}
a.cta-txt:hover{border-color:var(--gold-lt);background:var(--gold-dim);}
.cta-hours{margin-top:1.5rem;font-size:0.76rem;color:rgba(255,255,255,0.62);letter-spacing:0.08em;}
.cta-hours strong{color:rgba(255,255,255,0.85);}
.cta-badges{display:flex;justify-content:center;gap:2rem;flex-wrap:wrap;margin-top:2.5rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,0.05);}
.cbadge{font-size:0.68rem;font-weight:500;letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,0.62);}



/* ─── SECTION REVEAL ANIMATIONS ─── */
.reveal{opacity:0;transform:translateY(42px) scale(0.985);transition:opacity 1.1s cubic-bezier(0.16,1,0.3,1),transform 1.1s cubic-bezier(0.16,1,0.3,1);will-change:opacity,transform;}
.reveal.visible{opacity:1;transform:translateY(0);}
.reveal-delay-1{transition-delay:0.12s;}
.reveal-delay-2{transition-delay:0.24s;}
.reveal-delay-3{transition-delay:0.36s;}

/* ─── CONTACT MODAL ─── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.75);z-index:2000;display:flex;align-items:center;justify-content:center;padding:1rem;opacity:0;pointer-events:none;transition:opacity 0.4s cubic-bezier(0.25,0.1,0.25,1);backdrop-filter:blur(4px);}
.modal-overlay.open{opacity:1;pointer-events:all;}
.modal-box{background:var(--white);border-radius:12px;max-width:520px;width:100%;padding:2.5rem;position:relative;transform:translateY(30px) scale(0.98);transition:transform 0.45s cubic-bezier(0.22,1,0.36,1);box-shadow:0 24px 80px rgba(0,0,0,0.4);}
.modal-overlay.open .modal-box{transform:translateY(0) scale(1);}
.modal-close{position:absolute;top:1rem;right:1.2rem;background:none;border:none;font-size:1.4rem;cursor:pointer;color:var(--text2);line-height:1;padding:4px;}
.modal-close:hover{color:var(--dark);}
.modal-eyebrow{font-size:0.65rem;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:0.4rem;}
.modal-title{font-family:'DM Serif Display',serif;font-size:1.7rem;color:var(--dark);line-height:1.15;margin-bottom:0.5rem;}
.modal-subtitle{font-size:0.88rem;color:var(--text2);margin-bottom:1.8rem;line-height:1.6;}
.modal-subtitle strong{color:var(--dark);}
.modal-service-tag{display:inline-block;background:var(--gold-dim);border:1px solid var(--border);border-radius:3px;padding:3px 10px;font-size:0.72rem;font-weight:600;color:var(--gold-ink);letter-spacing:0.08em;text-transform:uppercase;margin-bottom:1.4rem;}
.mfield{margin-bottom:1.1rem;}
.mfield label{display:block;font-size:0.76rem;font-weight:600;color:var(--text);letter-spacing:0.06em;text-transform:uppercase;margin-bottom:0.4rem;}
.mfield input,.mfield textarea,.mfield select{width:100%;padding:0.75rem 1rem;border:1.5px solid #ddd;border-radius:6px;font-family:'DM Sans',sans-serif;font-size:0.92rem;color:var(--dark);background:var(--light);transition:border-color 0.15s;}
.mfield input:focus,.mfield textarea:focus,.mfield select:focus{outline:none;border-color:var(--gold);background:var(--white);}
.mfield textarea{min-height:90px;resize:vertical;line-height:1.55;}
.mfield-row{display:grid;grid-template-columns:1fr 1fr;gap:0.9rem;}
.modal-submit{width:100%;padding:1rem;background:linear-gradient(135deg,var(--gold-lt),var(--gold),var(--gold-dk));color:var(--dark);border:none;border-radius:6px;font-family:'DM Sans',sans-serif;font-size:0.9rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;cursor:pointer;transition:filter 0.2s,transform 0.15s;margin-top:0.5rem;}
.modal-submit:hover{filter:brightness(1.08);transform:translateY(-1px);}
.modal-submit:disabled{opacity:0.6;cursor:not-allowed;transform:none;}
.modal-success{text-align:center;padding:1.5rem 0;}
.modal-success-icon{font-size:3rem;margin-bottom:1rem;}
.modal-success h3{font-family:'DM Serif Display',serif;font-size:1.5rem;color:var(--dark);margin-bottom:0.5rem;}
.modal-success p{font-size:0.9rem;color:var(--text2);line-height:1.6;}
.modal-note{font-size:0.72rem;color:var(--text2);text-align:center;margin-top:0.8rem;line-height:1.5;}
@media(max-width:480px){.mfield-row{grid-template-columns:1fr;gap:0;}}

/* ─── FOOTER ─── */
.site-footer{--fbg:#0A0A08;--ftext:rgba(255,255,255,0.55);--fhead:#ffffff;--fmuted:rgba(255,255,255,0.58);--fborder:rgba(255,255,255,0.09);background:var(--fbg);color:var(--ftext);border-top:1px solid var(--fborder);padding:3.6rem 5% 1.8rem;}
html[data-theme="light"] .site-footer{--fbg:#E7E0D2;--ftext:#5f5d54;--fhead:#17150E;--fmuted:#84826f;--fborder:rgba(0,0,0,0.10);}
.footer-inner{max-width:1140px;margin:0 auto;display:grid;grid-template-columns:1.7fr 1fr 1fr 1.5fr;gap:2.5rem;}
.footer-logo{display:flex;align-items:center;gap:9px;text-decoration:none;margin-bottom:1rem;}
.footer-logo img{width:38px;height:auto;display:block;}
.footer-wordmark{font-family:'Bebas Neue',sans-serif;font-size:1.15rem;letter-spacing:0.05em;color:var(--fhead);line-height:1;}
.footer-wordmark b{color:var(--gold);font-weight:400;}
.footer-blurb{font-size:0.84rem;line-height:1.7;max-width:330px;margin-bottom:1.3rem;}
.footer-social{display:flex;gap:0.6rem;}
.footer-social a{width:36px;height:36px;border:1px solid var(--fborder);border-radius:7px;display:flex;align-items:center;justify-content:center;color:var(--ftext);transition:color 0.25s,border-color 0.25s,background 0.25s;}
.footer-social a:hover{color:var(--gold);border-color:var(--gold);background:rgba(196,154,60,0.09);}
.footer-social svg{width:17px;height:17px;}
.footer-h{font-size:0.68rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;font-weight:600;}
.footer-col a{display:block;color:var(--ftext);text-decoration:none;font-size:0.86rem;padding:0.3rem 0;transition:color 0.25s;}
.footer-col a:hover{color:var(--gold);}
.footer-contact-line{display:flex;align-items:flex-start;gap:0.55rem;color:var(--ftext);font-size:0.85rem;padding:0.34rem 0;text-decoration:none;line-height:1.5;transition:color 0.25s;}
a.footer-contact-line:hover{color:var(--gold);}
.footer-contact-line svg{width:15px;height:15px;flex-shrink:0;margin-top:2px;color:var(--gold);}
.footer-bottom{max-width:1140px;margin:2.6rem auto 0;padding-top:1.5rem;border-top:1px solid var(--fborder);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;}
.footer-copy{font-size:0.74rem;color:var(--fmuted);letter-spacing:0.03em;}
.footer-legal{display:flex;gap:1.4rem;flex-wrap:wrap;}
.footer-legal a{font-size:0.74rem;color:var(--fmuted);text-decoration:none;letter-spacing:0.04em;}
.footer-legal a:hover{color:var(--gold);}

/* ─── STICKY BAR ─── */
.sticky{display:none;position:fixed;bottom:0;left:0;right:0;z-index:998;background:rgba(10,10,8,0.98);border-top:1px solid var(--border);padding:0.8rem 5%;gap:0.7rem;}
.sticky a{flex:1;text-align:center;padding:0.85rem;border-radius:3px;font-size:0.79rem;font-weight:600;letter-spacing:0.09em;text-transform:uppercase;text-decoration:none;}
.scall{background:linear-gradient(135deg,var(--gold-lt),var(--gold-dk));color:var(--dark);}
.stxt{border:1px solid rgba(196,154,60,0.3);color:var(--gold-lt);}

@keyframes fadeUp{from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);}}

@media(max-width:900px){
  .area-inner{grid-template-columns:1fr;gap:2.5rem;}
  .statbar-inner{grid-template-columns:repeat(2,1fr);}
}
/* The nav row alone switches to the hamburger at 1180px now that it carries five
   dropdowns; every other 768px rule below is unchanged. Tablets and small laptops
   get the full nested mobile menu, which carries every page the dropdowns do. */
@media(max-width:1180px){
  .nav-links{display:none;}
  .hamburger{display:flex;}
}
@media(max-width:768px){
  .steps{grid-template-columns:1fr;gap:1.5rem;}
  .steps::before{display:none;}
  .svc-hero-inner{grid-template-columns:1fr;}
  .svc-hero-stat{display:none;}
  .sticky{display:flex;}
  body{padding-bottom:70px;}
  .why-highlight{flex-direction:column;gap:1rem;}
  .combo-callout{flex-direction:column;}
  .rev-inline-cta{flex-direction:column;}
  .hero-trust{gap:1.2rem;}
}
@media(max-width:480px){
  .statbar-inner{grid-template-columns:repeat(2,1fr);}
  .rgrid{grid-template-columns:1fr;}
  .cta-badges{gap:1rem;}
  .team-grid{grid-template-columns:1fr;}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important;}
  .reveal{opacity:1;transform:none;}
}


.tmember-photo{height:170px;}
.tmember-photo.has-img{height:300px;}
.tmember-photo.has-img img{object-position:center top;}
.tmember-photo-hint{display:none;}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px;border-radius:2px;}

/* ─── THEME TOGGLE BUTTON ─── */
.theme-toggle{background:none;border:1px solid var(--border);border-radius:5px;width:36px;height:36px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--silver);transition:color 0.3s,border-color 0.3s,background 0.3s;padding:0;}
.theme-toggle:hover{color:var(--gold-lt);border-color:var(--gold);background:rgba(196,154,60,0.08);}
.theme-toggle svg{width:17px;height:17px;}
.theme-toggle .ic-sun{display:none;}
html[data-theme="light"] .theme-toggle .ic-moon{display:none;}
html[data-theme="light"] .theme-toggle .ic-sun{display:inline;}
.mtheme{cursor:pointer;}

/* ─── LIGHT THEME (poster palette) ─── */
html[data-theme="light"] body{background:var(--paper);}
/* Nav */
html[data-theme="light"] body > nav{background:rgba(240,234,222,0.96);border-bottom-color:rgba(0,0,0,0.08);}
html[data-theme="light"] nav.scrolled{background:rgba(240,234,222,0.98);box-shadow:0 4px 24px rgba(0,0,0,0.10);}
html[data-theme="light"] .nav-wordmark{color:var(--ink);}
html[data-theme="light"] .nav-links a{color:#5f5d54;}
html[data-theme="light"] .nav-links a:hover{color:var(--gold-ink);}
html[data-theme="light"] .theme-toggle{color:#5f5d54;border-color:rgba(0,0,0,0.15);}
html[data-theme="light"] .theme-toggle:hover{color:var(--gold-ink);border-color:var(--gold-dk);background:rgba(196,154,60,0.10);}
html[data-theme="light"] .hamburger span{background:var(--ink);}
html[data-theme="light"] .mobile-menu{background:rgba(240,234,222,0.99);border-bottom-color:rgba(0,0,0,0.08);}
html[data-theme="light"] .mobile-menu a{color:#4a4842;border-bottom-color:rgba(0,0,0,0.07);}
/* Stat bar */
html[data-theme="light"] .statbar{background:var(--paper-2);border-top-color:rgba(0,0,0,0.08);border-bottom-color:rgba(0,0,0,0.08);}
html[data-theme="light"] .stat-label{color:var(--ink-2);}
/* Why section */
html[data-theme="light"] .why{background:var(--paper-2);}
html[data-theme="light"] .why-grid{background:rgba(0,0,0,0.08);border-color:rgba(0,0,0,0.08);}
html[data-theme="light"] .why-card{background:var(--paper-3);}
html[data-theme="light"] .why-card:hover{background:#EAE3D5;}
html[data-theme="light"] .why-card.featured{background:var(--gold-dim);}
html[data-theme="light"] .why-title{color:var(--ink);}
html[data-theme="light"] .why-desc{color:var(--ink-2);}
html[data-theme="light"] .sh2-white{color:var(--ink);}
html[data-theme="light"] .ssub-white{color:var(--ink-2);}
html[data-theme="light"] .why-card.featured .why-desc{color:#6a5a2c;}

/* ─── SERVICE-AREA MAP + LINKED CITY BUTTONS ─── */
.area-map{position:relative;border-radius:10px;overflow:hidden;border:1px solid rgba(0,0,0,0.08);aspect-ratio:16/10;margin-bottom:1.5rem;background:var(--light2);}
.area-map iframe{width:100%;height:100%;border:0;display:block;}
.area-map-ring{position:absolute;top:50%;left:50%;width:56%;aspect-ratio:1;transform:translate(-50%,-50%);border:2px solid rgba(196,154,60,0.85);border-radius:50%;background:rgba(196,154,60,0.13);pointer-events:none;}
.area-map-badge{position:absolute;bottom:10px;left:10px;background:rgba(12,12,10,0.82);color:var(--gold-lt);font-size:0.64rem;font-weight:600;letter-spacing:0.09em;text-transform:uppercase;padding:4px 9px;border-radius:3px;pointer-events:none;}
a.town{text-decoration:none;cursor:pointer;transition:transform 0.2s,filter 0.2s,box-shadow 0.2s;}
a.town.main:hover{filter:brightness(1.06);transform:translateY(-1px);box-shadow:0 5px 14px rgba(196,154,60,0.32);}
.amap-sub{font-size:0.7rem;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--text2);margin:1.4rem 0 0.7rem;}

/* ─── EXPLORE (Our Work / Blog) ─── */
.explore{background:var(--light2);padding:5rem 5%;}
.explore-inner{max-width:1000px;margin:0 auto;}
.explore-head{text-align:center;margin-bottom:2.6rem;}
.explore-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;}
.explore-card{display:block;background:var(--white);border:1px solid rgba(0,0,0,0.07);border-radius:12px;padding:2.2rem;text-decoration:none;transition:transform 0.4s cubic-bezier(0.25,0.1,0.25,1),box-shadow 0.4s,border-color 0.3s;position:relative;overflow:hidden;}
.explore-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold-lt),var(--gold),var(--gold-dk));transform:scaleX(0);transform-origin:left;transition:transform 0.4s cubic-bezier(0.25,0.1,0.25,1);}
.explore-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,0,0,0.10);border-color:var(--gold-dim);}
.explore-card:hover::before{transform:scaleX(1);}
.explore-icon{width:46px;height:46px;background:var(--gold-dim);border:1px solid var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center;margin-bottom:1.2rem;}
.explore-icon svg{width:23px;height:23px;stroke:var(--gold-dk);fill:none;}
.explore-card-title{font-family:'DM Serif Display',serif;font-size:1.5rem;color:var(--dark);margin-bottom:0.5rem;}
.explore-card-desc{font-size:0.9rem;color:var(--text2);line-height:1.65;margin-bottom:1.1rem;}
.explore-link{font-size:0.78rem;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--gold-ink);}
@media(max-width:600px){.explore-grid{grid-template-columns:1fr;}}

/* Footer responsive */
@media(max-width:768px){
  .footer-inner{grid-template-columns:1fr 1fr;gap:2rem;}
  .footer-brand{grid-column:1/-1;}
  .footer-bottom{flex-direction:column;text-align:center;justify-content:center;}
}
@media(max-width:480px){.footer-inner{grid-template-columns:1fr;}}

/* ─── FAQ ─── */
.faq{background:var(--light);padding:5.5rem 5%;}
.faq-inner{max-width:820px;margin:0 auto;}
.faq-head{text-align:center;margin-bottom:2.4rem;}
.faq-group-label{font-size:0.66rem;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold-ink);margin:2.2rem 0 0.4rem;}
.faq-group-label.first{margin-top:0;}
.faq-item{border-bottom:1px solid rgba(0,0,0,0.1);}
.faq-item summary{list-style:none;cursor:pointer;padding:1.15rem 2.6rem 1.15rem 0;position:relative;font-size:1rem;font-weight:600;color:var(--dark);line-height:1.45;transition:color 0.2s;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary:hover{color:var(--gold-ink);}
.faq-item summary::after{content:'';position:absolute;right:8px;top:1.4rem;width:9px;height:9px;border-right:2px solid var(--gold);border-bottom:2px solid var(--gold);transform:rotate(45deg);transition:transform 0.3s;}
.faq-item[open] summary::after{transform:rotate(-135deg);}
.faq-item summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:3px;}
.faq-answer{padding:0 2.6rem 1.35rem 0;font-size:0.92rem;color:var(--text2);line-height:1.75;}
.faq-answer strong{color:var(--dark);}
.faq-foot{text-align:center;margin-top:2.4rem;font-size:0.92rem;color:var(--text2);}
.faq-foot a{color:var(--gold-ink);font-weight:600;text-decoration:none;}
.faq-foot a:hover{text-decoration:underline;}

/* ─── FINAL CTA — light theme ─── */
html[data-theme="light"] .cta-sec{background:var(--paper-2);}
html[data-theme="light"] .cta-sec .sh2{color:var(--ink);}
html[data-theme="light"] .cta-sec .ssub{color:var(--ink-2);}
html[data-theme="light"] a.cta-phone{color:var(--gold-ink);}
html[data-theme="light"] a.cta-phone:hover{color:var(--gold);}
html[data-theme="light"] .cta-email{color:var(--ink-2);}
html[data-theme="light"] .cta-or{color:rgba(0,0,0,0.30);}
html[data-theme="light"] a.cta-txt{color:var(--gold-ink);border-color:rgba(196,154,60,0.55);}
html[data-theme="light"] a.cta-txt:hover{border-color:var(--gold-dk);background:rgba(196,154,60,0.12);}
html[data-theme="light"] .cta-hours{color:var(--ink-2);}
html[data-theme="light"] .cta-hours strong{color:var(--ink);}
html[data-theme="light"] .cta-badges{border-top-color:rgba(0,0,0,0.10);}
html[data-theme="light"] .cbadge{color:#8a8578;}

/* ─── Inline icons (replace emoji; house rule: no emoji anywhere) ─── */
.ico{width:1em;height:1em;display:inline-block;vertical-align:-0.125em;flex:none;}
.ico-fill{fill:currentColor;}
.ico-stroke{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.ico-lead{width:0.95em;height:0.95em;margin-right:0.42em;}

/* ─── CITY SPOTLIGHTS ─── */
.city-spot{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--dark);}
.city-band{position:relative;min-height:400px;display:flex;align-items:flex-end;padding:2.6rem;text-decoration:none;overflow:hidden;isolation:isolate;background:var(--dark2);}
/* The photo is a real <img> rather than a CSS background: it gets alt text, it is
   indexable, and it does not depend on an inline style attribute surviving CSP. */
.city-band-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2;display:block;}
.city-band::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,8,6,0.20) 0%,rgba(8,8,6,0.46) 55%,rgba(8,8,6,0.86) 100%);z-index:-1;transition:background 0.45s;}
.city-band:hover::before{background:linear-gradient(180deg,rgba(8,8,6,0.26) 0%,rgba(8,8,6,0.54) 55%,rgba(8,8,6,0.90) 100%);}
.city-band-inner{position:relative;max-width:460px;}
.city-eyebrow{display:inline-block;font-size:0.64rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold-lt);margin-bottom:0.7rem;font-weight:600;}
.city-name{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.4rem,5vw,3.6rem);color:#fff;letter-spacing:0.03em;line-height:1;margin-bottom:0.6rem;}
.city-desc{font-size:0.9rem;color:rgba(255,255,255,0.82);line-height:1.62;margin-bottom:1.1rem;}
.city-cta{font-size:0.76rem;font-weight:600;letter-spacing:0.09em;text-transform:uppercase;color:var(--gold-lt);display:inline-flex;align-items:center;gap:7px;transition:gap 0.25s,color 0.25s;}
.city-band:hover .city-cta{gap:12px;color:var(--gold);}
.city-tag{position:absolute;top:1.4rem;right:1.4rem;background:rgba(196,154,60,0.92);color:var(--dark);font-size:0.6rem;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;padding:4px 9px;border-radius:3px;}
@media(max-width:768px){.city-spot{grid-template-columns:1fr;}.city-band{min-height:320px;}}

/* ─── SKIP LINK (a11y) ─── */
.skip-link{position:fixed;top:-60px;left:12px;z-index:3000;background:var(--gold);color:var(--dark);padding:0.7rem 1.2rem;border-radius:5px;font-size:0.82rem;font-weight:700;text-decoration:none;letter-spacing:0.03em;transition:top 0.2s;}
.skip-link:focus{top:12px;outline:2px solid #fff;outline-offset:2px;}

/* ─── SCROLL PROGRESS ─── */
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--gold-dk),var(--gold),var(--gold-lt));z-index:1001;transition:width 0.08s linear;pointer-events:none;}

/* ─── BACK TO TOP ─── */
.back-top{position:fixed;right:20px;bottom:24px;width:46px;height:46px;border-radius:50%;border:1px solid var(--border);background:rgba(12,12,10,0.9);color:var(--gold-lt);cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity 0.3s,transform 0.3s,visibility 0.3s,background 0.3s,color 0.3s;z-index:997;backdrop-filter:blur(6px);}
.back-top.show{opacity:1;visibility:visible;transform:translateY(0);}
.back-top:hover{background:var(--gold);color:var(--dark);border-color:var(--gold);}
.back-top svg{width:20px;height:20px;}
html[data-theme="light"] .back-top{background:rgba(240,234,222,0.95);color:var(--gold-ink);border-color:rgba(0,0,0,0.12);}
html[data-theme="light"] .back-top:hover{background:var(--gold-dk);color:#fff;}
@media(max-width:768px){.back-top{bottom:80px;right:14px;}}

/* ─── COPY BUTTON ─── */
.footer-contact-row{display:flex;align-items:center;gap:0.35rem;}
.footer-contact-row .footer-contact-line{flex:1;min-width:0;}
.copy-btn{background:none;border:none;cursor:pointer;color:var(--gold);opacity:0.6;padding:3px 4px;display:inline-flex;align-items:center;justify-content:center;transition:opacity 0.2s,color 0.2s;flex-shrink:0;border-radius:4px;}
.copy-btn:hover{opacity:1;}
.copy-btn:focus-visible{outline:2px solid var(--gold);outline-offset:1px;}
.copy-btn svg{width:14px;height:14px;}
.copy-btn.copied{color:#4caf50;opacity:1;}

/* ─── PRINT ─── */
@media print{
  body > nav,.sticky,.back-top,.scroll-progress,.skip-link,.hero-photos,.hero-overlay,.footer-social,.theme-toggle,.mobile-menu,.modal-overlay,.area-map,.city-spot{display:none!important;}
  *{background:#fff!important;color:#000!important;box-shadow:none!important;text-shadow:none!important;}
  .hero,.why,.cta-sec,.statbar,.services,.reviews,.team,.area,.explore{min-height:auto!important;padding:1.2rem 0!important;}
  a[href^="http"]::after,a[href^="tel"]::after,a[href^="mailto"]::after{content:" (" attr(href) ")";font-size:0.85em;color:#444;}
  body{padding:0!important;}
}

/* Hero on mobile: the same cross-fade as desktop, but every slide swapped for its
   800px variant. Slide 1 is still the eager LCP image; slides 2-6 stay behind
   html.bg-ready so they only download after window load and never compete with it.
   This block used to kill the animation outright and pin mobile to slide 1. It no
   longer does, but it MUST still out-specify the html.bg-ready rules above so the
   full-size desktop files are never the ones a phone fetches. */
@media(max-width:768px){
  .hero-photo.hp1{background-image:url('../img/hero-1-800.webp');}
  html.bg-ready .hero-photo.hp1{background-image:url('../img/hero-1-800.webp');}
  html.bg-ready .hero-photo.hp2{background-image:url('../img/hero-2-800.webp');}
  html.bg-ready .hero-photo.hp3{background-image:url('../img/hero-3-800.webp');}
  html.bg-ready .hero-photo.hp4{background-image:url('../img/hero-4-800.webp');}
  html.bg-ready .hero-photo.hp5{background-image:url('../img/hero-5-800.webp');}
  html.bg-ready .hero-photo.hp6{background-image:url('../img/hero-6-800.webp');}
}
@media(prefers-reduced-motion:reduce){
  .hero-photo{animation:none!important;}
  .hero-photo.hp1{opacity:1!important;}
  .hero-photo.hp2,.hero-photo.hp3,.hero-photo.hp4,
  .hero-photo.hp5,.hero-photo.hp6{opacity:0!important;background-image:none!important;}
}

/* ═══════════════════════════════════════════════════════════
   SERVICE / DETAIL PAGES  (shared by all service pages)
   Reuses the homepage design system; adds only the pieces a
   service page needs. Sections keep the homepage's alternating
   dark → cream rhythm so every service page reads as a clone.
   ═══════════════════════════════════════════════════════════ */
.svc-hero{position:relative;min-height:74vh;display:flex;align-items:center;padding:8.5rem 5% 4rem;background:var(--dark);overflow:hidden;}
.svc-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0;}
.svc-hero-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,8,6,0.80) 0%,rgba(8,8,6,0.62) 45%,rgba(8,8,6,0.86) 100%);}
.svc-hero-wrap{position:relative;z-index:2;max-width:1140px;margin:0 auto;width:100%;}
.breadcrumb{font-size:0.7rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--silver);margin-bottom:1.4rem;display:flex;gap:0.55rem;flex-wrap:wrap;align-items:center;}
.breadcrumb a{color:var(--gold-lt);text-decoration:none;transition:color 0.25s;}
.breadcrumb a:hover{color:var(--gold);}
.breadcrumb .sep{color:rgba(255,255,255,0.55);}
.svc-hero-eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:0.7rem;font-weight:500;letter-spacing:0.24em;text-transform:uppercase;color:var(--gold);margin-bottom:1.2rem;}
.svc-hero-eyebrow::before{content:'';display:block;width:26px;height:1px;background:var(--gold);opacity:0.5;}
.svc-hero h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.8rem,6.4vw,5.2rem);color:#fff;line-height:0.98;letter-spacing:0.02em;margin-bottom:1.1rem;max-width:920px;}
.svc-hero h1 .gold{color:var(--gold);}
.svc-hero-lead{font-size:clamp(1rem,2vw,1.16rem);font-weight:300;color:var(--silver-lt);line-height:1.78;max-width:640px;margin-bottom:2rem;}
.svc-hero-btns{display:flex;gap:1rem;flex-wrap:wrap;}
.svc-hero-trust{display:flex;gap:2rem;flex-wrap:wrap;margin-top:2.4rem;padding-top:1.8rem;border-top:1px solid rgba(255,255,255,0.08);}

/* Generic content section (follows homepage light/dark rhythm) */
.svc-section{padding:5.2rem 5%;}
.svc-section .inner{max-width:1040px;margin:0 auto;}
.svc-section.cream{background:var(--light);}
.svc-section.cream2{background:var(--light2);}
html[data-theme="light"] .svc-section.cream{background:var(--paper);}
html[data-theme="light"] .svc-section.cream2{background:var(--paper-2);}
.svc-head{margin-bottom:0.5rem;}
.svc-prose{max-width:770px;}
.svc-prose p{font-size:0.98rem;color:var(--text2);line-height:1.86;margin-bottom:1.15rem;}
.svc-prose p strong{color:var(--dark);}
.svc-prose p:last-child{margin-bottom:0;}
html[data-theme="light"] .svc-prose p{color:var(--ink-2);}
html[data-theme="light"] .svc-prose p strong{color:var(--ink);}
html[data-theme="light"] h2.sh2{color:var(--ink);}

/* Feature / "what's included" grid — each card is a clickable button that opens the quote form */
.feat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(238px,1fr));gap:1px;background:rgba(0,0,0,0.08);border:1px solid rgba(0,0,0,0.07);border-radius:10px;overflow:hidden;margin-top:2.6rem;}
.feat{background:var(--white);padding:1.8rem;transition:background 0.4s cubic-bezier(0.25,0.1,0.25,1),transform 0.4s cubic-bezier(0.25,0.1,0.25,1);text-align:left;width:100%;border:none;font:inherit;cursor:pointer;display:block;position:relative;}
.feat:hover{background:#F8F7F3;transform:translateY(-3px);z-index:1;}
.feat:focus-visible{outline:2px solid var(--gold-lt);outline-offset:-2px;z-index:1;}
.feat h3{font-size:0.98rem;font-weight:700;color:var(--dark);margin-bottom:0.45rem;display:flex;align-items:center;gap:0.55rem;}
.feat h3 svg{width:18px;height:18px;flex-shrink:0;color:var(--gold-ink);}
.feat p{font-size:0.85rem;color:var(--text2);line-height:1.68;}
.feat-cta{display:inline-flex;align-items:center;gap:5px;margin-top:0.9rem;font-size:0.72rem;font-weight:600;letter-spacing:0.07em;text-transform:uppercase;color:var(--gold-ink);}
.feat-cta svg{width:13px;height:13px;transition:transform 0.25s;}
.feat:hover .feat-cta svg{transform:translateX(3px);}
html[data-theme="light"] .feat{background:var(--paper-3);}
html[data-theme="light"] .feat:hover{background:#EAE3D5;}
html[data-theme="light"] .feat h3{color:var(--ink);}
html[data-theme="light"] .feat p{color:var(--ink-2);}

/* Service-page hero cross-fade (per-page images set in the page's own <style>) */
.svc-hero-photos{position:absolute;inset:0;z-index:0;overflow:hidden;}
/* Same deferral as the homepage hero: slide 1 (the LCP image) is eager, slides 2-5
   only get their background-image once html.bg-ready is set on window load. Each
   page declares the sp2-sp5 URLs behind that same class in its own <style>. */
.svc-hero-photo{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;animation:none;will-change:opacity;}
.svc-hero-photo.sp1{opacity:1;}
/* Every slide holds for 9s, so the cycle has to be 9s x the number of slides on
   THAT page, and the keyframe percentages have to be recomputed for each length.
   A single fixed 45s cycle assumed 5 slides, so a 2-slide hero showed its photos
   for 18s and then sat on the bare dark background for 27s, every loop. The
   .svc-hero-photos wrapper already carried data-count; it is now actually used. */
html.bg-ready .svc-hero-photo{animation:svcHeroFade5 45s linear infinite;}
html.bg-ready .svc-hero-photo.sp1{opacity:0;animation-delay:0s;}
html.bg-ready .svc-hero-photo.sp2{animation-delay:9s;}
html.bg-ready .svc-hero-photo.sp3{animation-delay:18s;}
html.bg-ready .svc-hero-photo.sp4{animation-delay:27s;}
html.bg-ready .svc-hero-photo.sp5{animation-delay:36s;}
/* Longhands, not the `animation` shorthand: these rules out-specify the .spN
   rules below, and the shorthand would reset their animation-delay to 0 and
   stack every slide on top of the others. */
html.bg-ready .svc-hero-photos[data-count="2"] .svc-hero-photo{animation-name:svcHeroFade2;animation-duration:18s;}
html.bg-ready .svc-hero-photos[data-count="3"] .svc-hero-photo{animation-name:svcHeroFade3;animation-duration:27s;}
html.bg-ready .svc-hero-photos[data-count="4"] .svc-hero-photo{animation-name:svcHeroFade4;animation-duration:36s;}
html.bg-ready .svc-hero-photos[data-count="5"] .svc-hero-photo{animation-name:svcHeroFade5;animation-duration:45s;}
/* Same shape in every one: fade up over ~1.2s, hold to the end of the 9s slot,
   fade out over the next ~1.2s while the following slide fades in. */
@keyframes svcHeroFade2{0%{opacity:0;}6.7%{opacity:1;}50%{opacity:1;}56.7%{opacity:0;}100%{opacity:0;}}
@keyframes svcHeroFade3{0%{opacity:0;}4.4%{opacity:1;}33.3%{opacity:1;}37.8%{opacity:0;}100%{opacity:0;}}
@keyframes svcHeroFade4{0%{opacity:0;}3.3%{opacity:1;}25%{opacity:1;}28.3%{opacity:0;}100%{opacity:0;}}
@keyframes svcHeroFade5{0%{opacity:0;}2.6%{opacity:1;}20%{opacity:1;}22.6%{opacity:0;}100%{opacity:0;}}
/* Mobile keeps the cross-fade. Each page points sp1-sp5 at its own 800px variants
   in its <style> block; nothing needs disabling here. */
@media(prefers-reduced-motion:reduce){
  .svc-hero-photo{animation:none!important;}
  .svc-hero-photo.sp1{opacity:1!important;}
  .svc-hero-photo.sp2,.svc-hero-photo.sp3,.svc-hero-photo.sp4,
  .svc-hero-photo.sp5{opacity:0!important;background-image:none!important;}
}

/* Theme-aware process section (unlike the homepage's always-dark .how band) */
.svc-process{background:var(--light2);padding:5.2rem 5%;}
html[data-theme="light"] .svc-process{background:var(--paper-2);}
.svc-process-inner{max-width:960px;margin:0 auto;text-align:center;}
.svc-process .ssub{margin:0.6rem auto 3.4rem;}
.svc-process .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;position:relative;margin-bottom:3rem;}
.svc-process .steps::before{content:'';position:absolute;top:28px;left:calc(16.67% + 18px);right:calc(16.67% + 18px);height:1px;background:linear-gradient(90deg,var(--gold-dim),rgba(196,154,60,0.35),var(--gold-dim));}
.svc-process .step{position:relative;z-index:1;}
.svc-process .snum{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--gold-lt) 0%,var(--gold) 50%,var(--gold-dk) 100%);color:var(--dark);font-family:'Bebas Neue',sans-serif;font-size:1.5rem;display:flex;align-items:center;justify-content:center;margin:0 auto 1.3rem;letter-spacing:0.04em;}
.svc-process .stitle{font-size:0.98rem;font-weight:700;color:var(--dark);margin-bottom:0.5rem;}
.svc-process .sdesc{font-size:0.84rem;color:var(--text2);line-height:1.72;}
html[data-theme="light"] .svc-process .stitle{color:var(--ink);}
html[data-theme="light"] .svc-process .sdesc{color:var(--ink-2);}
.svc-guarantee{background:var(--gold-dim);border:1px solid var(--border);border-radius:8px;padding:1.8rem 2.5rem;text-align:center;max-width:640px;margin:0 auto;}
.svc-guarantee-title{font-family:'DM Serif Display',serif;font-size:1.3rem;color:var(--dark);margin-bottom:0.5rem;}
.svc-guarantee-text{font-size:0.87rem;color:#4A4842;line-height:1.7;}
html[data-theme="light"] .svc-guarantee-title{color:var(--ink);}
html[data-theme="light"] .svc-guarantee-text{color:#4A4842;}
@media(max-width:768px){.svc-process .steps{grid-template-columns:1fr;gap:1.5rem;}.svc-process .steps::before{display:none;}}

/* Inline quote band */
.quote-band{background:var(--gold-dim);border:1px solid var(--border);border-radius:10px;padding:2.1rem 2.5rem;display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;margin-top:2.8rem;}
.quote-band-txt{font-family:'DM Serif Display',serif;font-size:1.32rem;color:var(--dark);line-height:1.4;flex:1;min-width:220px;}
.quote-band-txt em{color:var(--gold-ink);font-style:normal;}
html[data-theme="light"] .quote-band-txt{color:var(--ink);}

/* Related services chips */
.related{display:flex;flex-wrap:wrap;gap:0.6rem;margin-top:1.6rem;}
.related a{background:var(--white);border:1px solid rgba(0,0,0,0.1);border-radius:3px;padding:0.5rem 1rem;font-size:0.82rem;font-weight:500;color:var(--dark);text-decoration:none;transition:border-color 0.25s,color 0.25s,transform 0.2s;}
.related a:hover{border-color:var(--gold);color:var(--gold-ink);transform:translateY(-1px);}
html[data-theme="light"] .related a{background:var(--paper-3);}

@media(max-width:768px){.svc-hero{min-height:auto;padding:7rem 5% 3rem;}.quote-band{padding:1.8rem;}}

/* ─── Theme-aware DARK BAND section (dark in dark mode, cream in light mode) ───
   Lets service pages alternate dark/cream like the homepage so dark mode reads dark. */
.svc-band{background:var(--dark3);}
html[data-theme="light"] .svc-band{background:var(--paper-2);}
.svc-band .sh2{color:var(--white);}
html[data-theme="light"] .svc-band .sh2{color:var(--ink);}
.svc-band .ssub{color:var(--silver);}
html[data-theme="light"] .svc-band .ssub{color:var(--ink-2);}
.svc-band .svc-prose p{color:var(--silver);}
.svc-band .svc-prose p strong{color:var(--white);}
html[data-theme="light"] .svc-band .svc-prose p{color:var(--ink-2);}
html[data-theme="light"] .svc-band .svc-prose p strong{color:var(--ink);}
/* dark-band feature cards */
.svc-band .feat-grid{background:var(--border);border-color:var(--border);}
.svc-band .feat{background:var(--dark2);}
.svc-band .feat:hover{background:var(--dark4);}
.svc-band .feat h3{color:var(--white);}
.svc-band .feat h3 svg{color:var(--gold-lt);}
.svc-band .feat p{color:var(--silver);}
.svc-band .feat-cta{color:var(--gold-lt);}
html[data-theme="light"] .svc-band .feat-grid{background:rgba(0,0,0,0.08);border-color:rgba(0,0,0,0.07);}
html[data-theme="light"] .svc-band .feat{background:var(--paper-3);}
html[data-theme="light"] .svc-band .feat:hover{background:#EAE3D5;}
html[data-theme="light"] .svc-band .feat h3{color:var(--ink);}
html[data-theme="light"] .svc-band .feat h3 svg{color:var(--gold-ink);}
html[data-theme="light"] .svc-band .feat p{color:var(--ink-2);}
html[data-theme="light"] .svc-band .feat-cta{color:var(--gold-ink);}
/* dark-band quote strip + gallery "see more" line */
.svc-band .quote-band-txt{color:var(--white);}
html[data-theme="light"] .svc-band .quote-band-txt{color:var(--ink);}
.svc-band .svc-more{color:var(--silver);}
.svc-band .svc-more a{color:var(--gold-lt);}
html[data-theme="light"] .svc-band .svc-more{color:var(--ink-2);}
html[data-theme="light"] .svc-band .svc-more a{color:var(--gold-ink);}
.svc-band .work-grid img{border-color:var(--border);}

/* The 4-photo hero used to be special-cased here with its own duplicate
   @keyframes svcHeroFade4 and its own mobile freeze. Both fought the generic
   data-count rules above (this block came later, so it won) and it was the
   reason 4-slide heroes still dropped to a dark frame between slides. The
   generic rules handle counts 2-5, so it is gone. */

/* ─── BEFORE / AFTER component (shared) ─── */
.ba-project{margin-top:2.4rem;}
.ba-project + .ba-project{margin-top:1.6rem;}
.ba-project-title{font-size:0.72rem;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:0.9rem;}
.svc-band .ba-project-title{color:var(--gold-lt);}
html[data-theme="light"] .svc-band .ba-project-title{color:var(--gold-ink);}
.ba-pair{display:grid;grid-template-columns:1fr 1fr;gap:0.8rem;}
.ba-item{position:relative;border-radius:10px;overflow:hidden;border:1px solid var(--border);aspect-ratio:4/3;background:var(--dark2);}
.ba-item img{width:100%;height:100%;object-fit:cover;display:block;}
/* Opt-in tap-to-enlarge for before/after pairs. main.js binds the lightbox to
   images inside .lightbox-set, so they need the same affordance as .work-grid. */
.lightbox-set .ba-item img{cursor:pointer;transition:transform 0.4s cubic-bezier(0.25,0.1,0.25,1);}
.lightbox-set .ba-item:hover img{transform:scale(1.03);}
.lightbox-set .ba-item img:focus-visible{outline:2px solid var(--gold-lt);outline-offset:3px;}
.ba-badge{position:absolute;top:10px;left:10px;font-size:0.62rem;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;padding:4px 10px;border-radius:3px;background:rgba(12,12,10,0.82);color:var(--gold-lt);}
.ba-item.is-after .ba-badge{background:linear-gradient(135deg,var(--gold-lt),var(--gold));color:var(--dark);}
@media(max-width:520px){.ba-item{aspect-ratio:1/1;}.ba-pair{gap:0.5rem;}}


/* ============ BLOG (promoted from page-scoped styles, 2026-09-03) ============ */
/* ─── Blog ─── */
/* No hero on these pages, so the first section clears the fixed header itself. */
.blog-top{padding-top:8.5rem;}
@media(max-width:768px){.blog-top{padding-top:7rem;}}

/* Post cards (index) */
.post-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.6rem;margin-top:2.2rem;}
.post-card{display:flex;flex-direction:column;text-decoration:none;border-radius:12px;overflow:hidden;
  border:1px solid var(--border-lt);background:var(--dark3);transition:transform .35s cubic-bezier(.25,.1,.25,1),border-color .35s,box-shadow .35s;}
.post-card:hover{transform:translateY(-4px);border-color:var(--gold-dim);box-shadow:0 14px 34px rgba(0,0,0,.32);}
.post-card img{width:100%;height:210px;object-fit:cover;display:block;}
.post-card-body{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.55rem;flex:1;}
.post-cat{font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-lt);}
.post-card h2{font-family:'DM Serif Display',serif;font-size:1.24rem;line-height:1.28;color:var(--white);font-weight:400;}
.post-card p{font-size:.88rem;line-height:1.7;color:var(--silver);flex:1;}
.post-meta{font-size:.72rem;letter-spacing:.05em;color:var(--silver);display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;}
.post-meta .dot{opacity:.5;}
.post-card-cta{font-size:.8rem;font-weight:600;color:var(--gold-lt);display:flex;align-items:center;gap:6px;transition:gap .3s;}
.post-card:hover .post-card-cta{gap:12px;}
html[data-theme="light"] .post-card{background:var(--paper);border-color:rgba(0,0,0,.09);}
html[data-theme="light"] .post-card h2{color:var(--ink);}
html[data-theme="light"] .post-card p{color:var(--ink-2);}
html[data-theme="light"] .post-cat,html[data-theme="light"] .post-card-cta{color:var(--gold-ink);}

.blog-soon{margin-top:2.6rem;padding-top:1.6rem;border-top:1px solid var(--border-lt);font-size:.86rem;line-height:1.75;color:var(--ink-2);}
.blog-soon a{color:var(--gold-ink);text-decoration:none;font-weight:600;}
.blog-soon a:hover{text-decoration:underline;}

/* Article */
.article-wrap{max-width:74ch;margin:0 auto;}
.article-title{font-family:'DM Serif Display',serif;font-size:clamp(1.9rem,4.2vw,2.9rem);line-height:1.16;
  color:var(--ink);font-weight:400;margin-top:.9rem;}
.article-byline{display:flex;align-items:center;gap:.85rem;margin-top:1.6rem;padding-bottom:1.6rem;border-bottom:1px solid var(--border-lt);}
.article-byline img{width:46px;height:46px;border-radius:50%;object-fit:cover;border:1px solid var(--gold-dim);flex:none;}
.article-byline .who{font-size:.9rem;font-weight:600;color:var(--ink);line-height:1.35;}
.article-byline .role{font-size:.75rem;color:var(--ink-2);}
.article-figure{margin:2rem 0 .6rem;}
.article-figure img{width:100%;height:auto;border-radius:10px;border:1px solid var(--border);display:block;}
.article-figure figcaption{font-size:.78rem;line-height:1.65;color:var(--ink-2);margin-top:.7rem;font-style:italic;}
.article-body{margin-top:1.8rem;}
.article-body p{font-size:1.005rem;line-height:1.9;color:var(--ink-2);margin-bottom:1.15rem;}
.article-body p.lead{font-size:1.1rem;color:var(--ink);line-height:1.8;}
.article-body h2{font-family:'DM Serif Display',serif;font-size:1.55rem;line-height:1.3;color:var(--ink);
  font-weight:400;margin:2.4rem 0 .9rem;}
.article-body h3{font-size:1.02rem;font-weight:600;color:var(--ink);margin:1.9rem 0 .5rem;letter-spacing:.005em;}
.article-body strong{color:var(--ink);font-weight:600;}
.article-body a{color:var(--gold-ink);text-decoration:none;font-weight:600;border-bottom:1px solid var(--gold-dim);}
.article-body a:hover{border-bottom-color:var(--gold-dk);}
.article-body ul{margin:0 0 1.15rem 1.1rem;}
.article-body li{font-size:1.005rem;line-height:1.85;color:var(--ink-2);margin-bottom:.5rem;padding-left:.25rem;}
.article-pull{border-left:3px solid var(--gold-dim);padding:.3rem 0 .3rem 1.2rem;margin:1.9rem 0;}
.article-pull p{font-family:'DM Serif Display',serif;font-size:1.22rem;line-height:1.55;color:var(--ink);font-style:italic;margin:0;}
.article-end{margin-top:2.6rem;padding-top:1.7rem;border-top:1px solid var(--border-lt);font-size:.86rem;line-height:1.8;color:var(--ink-2);}
.article-end a{color:var(--gold-ink);text-decoration:none;font-weight:600;}
.article-end a:hover{text-decoration:underline;}

/* Data tables inside articles (pricing / materials posts) */
.article-table-wrap{overflow-x:auto;margin:1.7rem 0 1.3rem;-webkit-overflow-scrolling:touch;}
.article-table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:30rem;}
.article-table caption{caption-side:bottom;font-size:.78rem;font-style:italic;color:var(--ink-2);
  text-align:left;padding-top:.75rem;line-height:1.6;}
.article-table th,.article-table td{text-align:left;padding:.62rem .7rem;border-bottom:1px solid var(--border-lt);
  color:var(--ink-2);line-height:1.55;vertical-align:top;}
.article-table thead th{color:var(--ink);font-weight:600;font-size:.74rem;letter-spacing:.09em;
  text-transform:uppercase;border-bottom:1.5px solid var(--gold-dim);}
.article-table td.num,.article-table th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;}
.article-table tbody tr:last-child td{border-bottom:none;}
.article-table tbody tr:hover td{background:rgba(0,0,0,.025);}

/* ============ GBP TRUST CARD (service area panel, 2026-09-03) ============ */
.gbp-card{margin-top:1.5rem;padding-top:1.3rem;border-top:1px solid rgba(0,0,0,.12);}
.gbp-head{display:flex;align-items:center;gap:.55rem;}
.gbp-stars{display:inline-flex;gap:2px;color:var(--gold-ink);font-size:1rem;line-height:1;}
.gbp-score{font-family:'Bebas Neue',sans-serif;font-size:1.5rem;line-height:1;color:var(--dark);letter-spacing:.02em;}
.gbp-sub{font-size:.78rem;line-height:1.6;color:rgba(0,0,0,.62);margin:.5rem 0 .85rem;}
.gbp-links{display:flex;flex-wrap:wrap;gap:.45rem;}
.gbp-links a{font-size:.76rem;font-weight:600;text-decoration:none;color:var(--dark);
  border:1px solid rgba(0,0,0,.18);border-radius:999px;padding:.32rem .72rem;transition:border-color .25s,background .25s;}
.gbp-links a:hover{border-color:var(--gold-dk);background:rgba(196,154,60,.09);}
.gbp-write{display:inline-block;margin-top:.85rem;font-size:.78rem;font-weight:600;
  color:var(--gold-ink);text-decoration:none;border-bottom:1px solid var(--gold-dim);}
.gbp-write:hover{border-bottom-color:var(--gold-dk);}

/* ─── Contrast pass, 2026-09-07 ──────────────────────────────────────────
   Everything below was found by measuring computed colour against the
   composited background on every text node, in both themes, and fixing what
   fell under WCAG AA (4.5:1 normal, 3:1 large). Notes on the two judgement
   calls are at the bottom. */

/* Light theme: gold that works on dark bands is far too pale on the cream
   ones. These all sit on --paper / --paper-2 / --paper-3 in light mode. */
html[data-theme="light"] .nav-wordmark span,
html[data-theme="light"] .stat-num,
html[data-theme="light"] .cta-email a,
html[data-theme="light"] .footer-wordmark b,
html[data-theme="light"] .footer-h{color:var(--gold-ink);}
html[data-theme="light"] a.cta-txt{color:var(--gold-ink);border-color:rgba(117,87,24,0.45);}
html[data-theme="light"] a.cta-txt:hover{border-color:var(--gold-ink);}
html[data-theme="light"] .footer-legal a:hover{color:var(--gold-ink);}

/* Light theme: greys that landed in the 2.8-3.3 band. */
html[data-theme="light"] .cta-or{color:rgba(0,0,0,0.62);}
html[data-theme="light"] .cbadge{color:#5C5850;}
html[data-theme="light"] .site-footer{--fmuted:#595747;}

/* Light theme: the featured "why" card and the pull-quote strip both sit on a
   gold tint. White text and --gold-lt effectively disappear there (1.06-1.48). */
html[data-theme="light"] .why-card.featured .why-title{color:#5F4711;}
html[data-theme="light"] .why-card.featured .why-desc{color:#4A3F1C;}
html[data-theme="light"] .why-hl-text{color:var(--ink);}
html[data-theme="light"] .why-hl-text em{color:var(--gold-ink);}

/* Inline style="color:var(--gold)" / "var(--gold-lt)" / "var(--text3)" is
   written directly onto elements in 27 page files (the nav "Get a Quote", two
   .stag eyebrows, the modal's privacy line). An inline style outranks every
   selector, so !important is the only way CSS can reach it. Kept as narrow as
   possible rather than editing 27 files. */
html[data-theme="light"] .stag[style*="--gold"],
html[data-theme="light"] .nav-links a[style*="--gold-lt"],
html[data-theme="light"] .mobile-menu > a[style*="--gold-lt"]{color:var(--gold-ink)!important;}
.modal-box [style*="var(--text3)"]{color:var(--text2)!important;}

/* Deliberately left alone: .why-num, the big "01".."05" watermark numerals on
   the why-cards, sit at rgba(gold,0.12) in both themes (~1.1:1). They are
   ornament layered behind a heading that states the same thing, so raising
   them would turn a texture into a second, competing set of numbers. */

/* Breadcrumbs were written for the dark hero on the service and city pages.
   The blog, legal, projects and accessibility pages put the same component on
   a cream section, where --gold-lt links and a white separator are invisible
   (1.06-1.34:1). Give it a light-surface palette when it sits in a section. */
.svc-section .breadcrumb{color:var(--text2);}
.svc-section .breadcrumb a{color:var(--gold-ink);}
.svc-section .breadcrumb a:hover{color:var(--gold-dk);}
.svc-section .breadcrumb .sep{color:rgba(0,0,0,0.6);}
html[data-theme="light"] .svc-section .breadcrumb{color:var(--ink-2);}

/* .stag is deep gold so it reads on the cream bands. Where a page puts it
   on a dark hero instead, hand back the bright gold. */
.svc-hero .stag,.careers-hero .stag,.cta-sec .stag{color:var(--gold);}
html[data-theme="light"] .cta-sec .stag{color:var(--gold-ink);}

/* ─── Surface-aware corrections ──────────────────────────────────────────
   These components sit on a DARK surface in dark mode and a CREAM one in
   light mode, so a single colour cannot serve both. Base = the dark-surface
   value; the light override carries the deep gold / ink. */

/* .stag defaults to the deep gold because most of its homes are cream. The
   dark bands need the bright gold back, and those bands turn cream in light
   mode, so they swing back again there. */
.svc-hero .stag,.careers-hero .stag,.svc-band .stag,.cta-sec .stag,.csec.apply .stag{color:var(--gold);}
html[data-theme="light"] .svc-band .stag,
html[data-theme="light"] .cta-sec .stag,
html[data-theme="light"] .csec.apply .stag{color:var(--gold-ink);}

.svc-band .quote-band-txt em{color:var(--gold-lt);}
html[data-theme="light"] .svc-band .quote-band-txt em{color:var(--gold-ink);}
html[data-theme="light"] .post-meta{color:var(--text2);}

/* Blog category pill: bright gold on the dark blog cards, deep gold when it
   sits directly on a cream section (the article header on a post page, where
   --gold-lt measured 1.46:1). */
.post-cat{color:var(--gold-ink);}
.post-card .post-cat{color:var(--gold-lt);}