/* =========================================================
   TILE REVIVAL TX — DESIGN SYSTEM
   Tokens, base, layout, and reusable components.
   ========================================================= */

:root{
  /* ---- Color tokens ---- */
  --navy-950:#060a16;
  --navy-900:#0a1230;
  --navy-800:#101c42;
  --navy-700:#152a5c;
  --royal-600:#1c4bd6;
  --royal-500:#2657ea;
  --electric-500:#2f7dff;
  --electric-400:#5b9bff;
  --electric-100:#e8f1ff;
  --white:#ffffff;
  --gray-25:#fbfcfe;
  --gray-50:#f5f8fc;
  --gray-100:#eef2f9;
  --gray-200:#dde5f0;
  --gray-300:#c3cee0;
  --gray-500:#63708a;
  --gray-600:#4a5771;
  --gray-700:#333f57;
  --ink:#0a0f1f;

  /* ---- Gradients ---- */
  --grad-brand: linear-gradient(115deg, var(--navy-900) 0%, var(--royal-600) 55%, var(--electric-500) 100%);
  --grad-dark: linear-gradient(180deg, var(--navy-950) 0%, var(--navy-900) 100%);
  --grad-cta: linear-gradient(120deg, var(--royal-600), var(--electric-500));

  /* ---- Typography ---- */
  --font-head: "Sora", "Segoe UI", system-ui, sans-serif;
  --font-body: "Inter", "Segoe UI", system-ui, sans-serif;

  /* ---- Spacing / layout ---- */
  --container: 1200px;
  --container-narrow: 820px;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --shadow-sm: 0 2px 10px rgba(10,15,31,0.06);
  --shadow-md: 0 12px 30px rgba(10,15,31,0.10);
  --shadow-lg: 0 24px 60px rgba(6,10,22,0.18);
  --section-y: clamp(36px, 4.5vw, 64px);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:96px; overflow-x:hidden; max-width:100vw;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
}

body{
  margin:0;
  overflow-x:hidden;
  max-width:100vw;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--white);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  font-size:16.5px;
}

img,video{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{margin:0; padding:0; list-style:none;}
h1,h2,h3,h4{font-family:var(--font-head); line-height:1.15; margin:0 0 .5em; color:var(--navy-950); font-weight:700;}
h1{font-size:clamp(2.1rem, 4.2vw, 3.4rem); letter-spacing:-0.01em;}
h2{font-size:clamp(1.6rem, 3vw, 2.35rem); letter-spacing:-0.01em;}
h3{font-size:clamp(1.15rem, 1.6vw, 1.4rem);}
p{margin:0 0 1em;}
.lede{font-size:1.15rem; color:var(--gray-600);}

:focus-visible{outline:3px solid var(--electric-400); outline-offset:2px;}

.container{max-width:var(--container); margin:0 auto; padding:0 24px;}
.container-narrow{max-width:var(--container-narrow); margin:0 auto; padding:0 24px;}
.section{padding:var(--section-y) 0;}
.section-tight{padding: clamp(20px,3vw,36px) 0;}
.section--gray{background:var(--gray-50);}
.section--navy{background:var(--grad-dark); color:var(--white);}
.section--navy h2, .section--navy h3{color:var(--white);}
.section--navy .lede{color:#c4cfe6;}

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-head); font-size:.78rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--royal-600);
  margin-bottom:14px;
}
.section--navy .eyebrow{color:var(--electric-400);}
.eyebrow::before{content:""; width:22px; height:2px; background:currentColor; display:block;}

.section-head{max-width:680px; margin-bottom:20px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}

/* Safety net: any bare SVG icon dropped into body copy (lists, paragraphs) without
   a sizing context gets a sane default instead of rendering at browser-default 300x150. */
p svg, li svg, .prose svg{width:18px; height:18px; flex:none; vertical-align:-3px; color:var(--royal-600);}
.mini-check{display:inline-flex; align-items:center; gap:9px; margin-bottom:9px;}
.mini-check svg{width:16px; height:16px; flex:none; color:var(--royal-600);}
ul.compact-list{list-style:none; padding:0; margin:0;}
ul.compact-list li{display:flex; align-items:flex-start; gap:9px; margin-bottom:8px; font-size:.94rem;}
ul.compact-list li svg{width:16px; height:16px; margin-top:3px; flex:none; color:var(--royal-600);}

.problem-list{list-style:none; padding:0; margin:0;}
.problem-list li{position:relative; padding-left:20px; margin-bottom:11px; font-size:.94rem; color:var(--gray-700); line-height:1.55;}
.problem-list li::before{content:""; position:absolute; left:0; top:8px; width:7px; height:7px; border-radius:50%; background:var(--electric-500);}
.problem-list li strong{color:var(--navy-950); font-family:var(--font-head); font-weight:600;}

.related-list{list-style:none; padding:0; margin:0;}
.related-list li{padding:12px 0; border-bottom:1px solid var(--gray-100); font-size:.95rem; color:var(--gray-600);}
.related-list li:last-child{border-bottom:none;}
.related-list li a{font-family:var(--font-head); font-weight:700; color:var(--royal-600);}
.related-list li a:hover{text-decoration:underline;}

/* ---------- Consolidated Google + Instagram + Facebook trust section ---------- */
.trust-connect-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:800px; margin:0 auto;}
@media (max-width:700px){.trust-connect-grid{grid-template-columns:1fr;}}
.trust-connect-card{display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; padding:24px 18px; border-radius:16px; border:1px solid var(--gray-200); background:var(--white); box-shadow:var(--shadow-sm); transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;}
.trust-connect-card:hover{transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:var(--royal-300, var(--royal-600));}
.tc-icon{display:flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:50%; background:var(--gray-50);}
.tc-icon-brand svg{width:24px; height:24px; color:var(--royal-600);}
.tc-label{font-family:var(--font-head); font-weight:800; font-size:1.02rem; color:var(--navy-950);}
.tc-action{display:flex; align-items:center; gap:6px; font-size:.86rem; color:var(--gray-600);}
.tc-action svg{width:14px; height:14px; flex:none;}

/* ---------- Instagram post embed (single real post, lazy-loaded) ---------- */
.ig-embed-wrap{text-align:center;}
.ig-carousel-track{display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; padding:6px 2px 16px; -webkit-overflow-scrolling:touch; justify-content:flex-start;}
@media (min-width:900px){.ig-carousel-track.ig-few{justify-content:center;}}
.ig-carousel-card{flex:0 0 auto; scroll-snap-align:start;}
.ig-embed-frame{position:relative; width:100%; min-height:480px; border-radius:14px; overflow:hidden; background:var(--gray-50); border:1px solid var(--gray-200);}
.ig-embed-frame iframe{width:100%; min-height:600px; border:0; display:block;}
.ig-embed-placeholder{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:var(--gray-400); font-size:.85rem;}
.ig-embed-placeholder svg{width:28px; height:28px;}
.ig-embed-fallback-link{display:inline-flex; align-items:center; gap:7px; margin-top:12px; font-family:var(--font-head); font-weight:700; font-size:.86rem; color:var(--royal-600);}
.ig-embed-fallback-link svg{width:16px; height:16px;}
.ig-embed-fallback-link:hover{text-decoration:underline;}

/* ---------- Social proof (Instagram/Facebook) ---------- */
.social-proof-grid:empty{display:none;}
.social-proof-grid:not(:empty) + [data-social-fallback]{margin-top:28px;}
.social-card{display:block; border-radius:14px; overflow:hidden; border:1px solid var(--gray-200); background:var(--white); box-shadow:var(--shadow-sm); transition:transform .18s ease, box-shadow .18s ease;}
.social-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-md);}
.social-card-media{aspect-ratio:1/1; overflow:hidden; background:var(--navy-950);}
.social-card-media img{width:100%; height:100%; object-fit:cover;}
.social-card-body{padding:12px 14px;}
.social-card-platform{font-family:var(--font-head); font-weight:700; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--royal-600);}
.social-card-body p{font-size:.85rem; color:var(--gray-600); margin:6px 0 0;}

/* ---------- Showcase carousel (homepage "Real Cleaning. Real Results.") ---------- */
.showcase-carousel{position:relative; display:flex; align-items:center; gap:8px;}
.showcase-track{display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; padding:4px 2px 14px; -webkit-overflow-scrolling:touch;}
.showcase-track::-webkit-scrollbar{height:6px;}
.showcase-track::-webkit-scrollbar-thumb{background:var(--gray-300); border-radius:6px;}
.showcase-card{flex:0 0 auto; width:240px; scroll-snap-align:start; border-radius:14px; overflow:hidden; background:var(--white); border:1px solid var(--gray-200); box-shadow:var(--shadow-sm);}
.showcase-card-media{display:block; aspect-ratio:4/5; overflow:hidden; background:var(--navy-950);}
.showcase-card-media img{width:100%; height:100%; object-fit:cover; transition:transform .3s ease;}
.showcase-card:hover .showcase-card-media img{transform:scale(1.04);}
.showcase-card-media .ctp-video{border-radius:0; border:none; height:100%;}
.showcase-card-cap{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:10px 12px;}
.showcase-card-cap span{font-family:var(--font-head); font-weight:700; font-size:.86rem; color:var(--navy-950);}
.showcase-card-cap a{color:var(--royal-600); flex:none;}
.showcase-card-cap svg{width:16px; height:16px;}
.showcase-nav{flex:none; width:44px; height:44px; border-radius:50%; border:1px solid var(--gray-200); background:var(--white); color:var(--navy-900); display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:var(--shadow-sm);}
.showcase-nav svg{width:16px; height:16px;}
.showcase-nav.prev svg{transform:rotate(90deg);}
.showcase-nav.next svg{transform:rotate(-90deg);}
.showcase-nav:hover{background:var(--royal-600); color:#fff; border-color:var(--royal-600);}
@media (max-width:640px){.showcase-nav{display:none;} .showcase-card{width:200px;}}

/* ---------- Click-to-play video (service pages — never autoplay) ---------- */
.ctp-video{position:relative; width:100%; border-radius:16px; overflow:hidden; background:var(--navy-950); border:1px solid var(--gray-200); box-shadow:var(--shadow-sm);}
.ctp-video-lead-wrap{max-width:420px; margin:0 auto;}
@media (max-width:640px){.ctp-video-lead-wrap{max-width:100%;}}
.ctp-video video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background:#000;}
.ctp-video.is-playing video{object-fit:contain;}
.ctp-play{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:64px; height:64px; border-radius:50%; background:rgba(6,10,22,.72); border:2px solid rgba(255,255,255,.85); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:transform .18s ease, background .18s ease;}
.ctp-play svg{width:24px; height:24px; margin-left:3px;}
.ctp-play:hover{background:var(--royal-600); transform:translate(-50%,-50%) scale(1.06);}
.ctp-video.is-playing .ctp-play{display:none;}
.ctp-video::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(6,10,22,.35), transparent 40%); pointer-events:none;}
.ctp-video.is-playing::after{display:none;}
.location-map-section{display:grid; grid-template-columns:.85fr 1.15fr; gap:32px; align-items:center;}
@media (max-width:900px){.location-map-section{grid-template-columns:1fr;}}
.location-map-copy h2{margin-bottom:10px;}
.location-map-copy p{color:var(--gray-600); font-size:.95rem;}

/* ---------- Custom service-area schematic map (no Google JS API needed) ---------- */
/* ---------- Homepage service-area map (real Google Maps — iframe by default,
   upgrades automatically to the Maps JS API with 16 real markers the moment
   a real API key is configured in /assets/js/gmaps-key.js) ---------- */
.svc-area-map-wrap{position:relative; width:100%; aspect-ratio:16/9; max-height:480px; border-radius:18px; overflow:hidden; border:1px solid var(--gray-200); box-shadow:var(--shadow-sm); background:var(--gray-50);}
.svc-area-map-fallback, .svc-area-map-live{position:absolute; inset:0; width:100%; height:100%;}
.svc-area-map-fallback iframe{width:100%; height:100%; border:0; display:block;}
.svc-area-map-live[hidden]{display:none;}
.gmap-infowin{font-family:var(--font-body); min-width:180px; max-width:230px;}
.gmap-infowin strong{display:block; font-family:var(--font-head); font-size:.92rem; color:var(--navy-950); margin-bottom:2px;}
.gmap-infowin .gmap-tag{display:block; font-size:.65rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--royal-600); margin:2px 0 6px;}
.gmap-infowin a{display:block; font-size:.82rem; font-weight:700; color:var(--royal-600);}
@media (max-width:640px){
  .svc-area-map-wrap{aspect-ratio:auto; height:320px; max-height:340px;}
}
.svc-map-citylist{display:flex; flex-wrap:wrap; gap:6px 4px; justify-content:center; margin-top:20px; font-size:.88rem;}
.svc-map-citylist a{color:var(--gray-700); padding:6px 4px; min-height:44px; display:inline-flex; align-items:center;}
.svc-map-citylist a:hover{color:var(--royal-600); text-decoration:underline;}
.svc-map-citylist .sep{color:var(--gray-300);}

.location-map-wrap{
  position:relative; width:100%; aspect-ratio:16/10; max-height:500px;
  border-radius:16px; overflow:hidden; border:1px solid var(--gray-200); box-shadow:var(--shadow-sm);
}
.location-map-wrap iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}
@media (max-width:640px){.location-map-wrap{aspect-ratio:4/3; max-height:340px;}}
.quick-answer{background:var(--gray-50); border:1px solid var(--gray-200); border-left:4px solid var(--electric-500); border-radius:10px; padding:20px 24px; margin:22px 0;}
.quick-answer .label{font-family:var(--font-head); font-weight:700; font-size:.74rem; text-transform:uppercase; letter-spacing:.1em; color:var(--royal-600); margin-bottom:8px; display:block;}
.quick-answer .qa-heading{font-family:var(--font-head); font-weight:700; font-size:.98rem; text-transform:uppercase; letter-spacing:.06em; color:var(--royal-600); margin-bottom:8px;}
.quick-answer p{margin:0; color:var(--gray-700); font-size:.98rem;}
.compact-cta{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:18px 0 6px;}
.compact-cta .btn{padding:11px 20px; min-height:42px; font-size:.9rem;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--font-head); font-weight:600; font-size:.98rem;
  padding:14px 26px; border-radius:999px; border:2px solid transparent;
  cursor:pointer; transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
  min-height:48px; line-height:1;
}
.btn-primary{background:var(--grad-cta); color:var(--white); box-shadow:0 10px 24px rgba(38,87,234,.28);}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 16px 30px rgba(38,87,234,.36);}
.btn-outline{background:transparent; border-color:var(--navy-900); color:var(--navy-900);}
.btn-outline:hover{background:var(--navy-900); color:var(--white); transform:translateY(-2px);}
.section--navy .btn-outline{border-color:rgba(255,255,255,.5); color:var(--white);}
.section--navy .btn-outline:hover{background:var(--white); color:var(--navy-950);}
.btn-ghost{background:rgba(255,255,255,.08); color:var(--white); border-color:rgba(255,255,255,.28);}
.btn-ghost:hover{background:rgba(255,255,255,.18);}
.btn-sm{padding:10px 18px; font-size:.88rem; min-height:40px;}

/* ---------- Cookie preference banner ---------- */
.cookie-banner{position:fixed; left:16px; right:16px; bottom:16px; z-index:200; max-width:640px; margin:0 auto; background:var(--navy-950); color:#fff; border-radius:14px; box-shadow:0 12px 32px rgba(6,10,22,.35); padding:16px 20px;}
.cookie-banner[hidden]{display:none;}
.cookie-banner-inner p{font-size:.85rem; color:#d7deef; margin:0 0 12px; line-height:1.5;}
.cookie-banner-inner p a{color:var(--electric-400); text-decoration:underline;}
.cookie-banner-actions{display:flex; gap:10px; flex-wrap:wrap;}
@media (max-width:640px){
  .cookie-banner{bottom:76px; left:12px; right:12px; padding:14px 16px;}
  .cookie-banner-actions{flex-direction:column;}
  .cookie-banner-actions .btn{width:100%; text-align:center;}
}
.btn-block{width:100%;}
.btn svg{width:18px; height:18px; flex:none;}

.cta-row{display:flex; gap:14px; flex-wrap:wrap; align-items:center;}

/* ---------- Header: slim two-layer system ---------- */
.topbar{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg, #0a1330 0%, #07111f 100%);
  color:#aebadd; font-size:.78rem; font-weight:500;
  border-bottom:1px solid rgba(47,125,255,.28);
}
.topbar-sweep{
  position:absolute; top:0; left:-30%; width:30%; height:100%;
  background:radial-gradient(ellipse at center, rgba(47,125,255,.16) 0%, transparent 70%);
  animation:topbar-sweep 11s linear infinite;
  pointer-events:none;
}
@keyframes topbar-sweep{ from{left:-30%;} to{left:110%;} }
@media (prefers-reduced-motion: reduce){ .topbar-sweep{ animation:none; display:none; } }
.topbar .container{display:flex; justify-content:space-between; align-items:center; padding-top:6px; padding-bottom:6px; gap:16px; min-height:30px;}
.topbar-links{display:flex; align-items:center; gap:18px; white-space:nowrap; overflow:hidden;}
.topbar a{color:#c7d2ec; display:inline-flex; align-items:center; gap:6px; transition:color .18s ease;}
.topbar a:hover{color:var(--electric-400);}
.topbar svg{width:13px; height:13px; flex:none;}
.topbar-hours{display:inline-flex; align-items:center; gap:6px; color:#8ea0cc;}
.topbar-social{display:flex; gap:10px; align-items:center; flex:none;}
.topbar-social a{opacity:.75; transition:opacity .18s ease, color .18s ease;}
.topbar-social a:hover{opacity:1; color:var(--electric-400);}
.topbar-social svg{width:15px; height:15px;}
@media (max-width:900px){ .topbar-email{display:none;} }
@media (max-width:700px){ .topbar-hours{display:none;} }

.site-header{
  position:sticky; top:0; z-index:60;
  background:rgba(255,255,255,.85); backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--gray-200);
  box-shadow:0 1px 0 rgba(47,125,255,.06);
  transition:box-shadow .25s ease;
}
.site-header .container{display:flex; align-items:center; justify-content:space-between; padding-top:11px; padding-bottom:11px; gap:24px; transition:padding .25s ease;}
.site-header.is-scrolled .container{padding-top:8px; padding-bottom:8px;}
.site-header.is-scrolled{box-shadow:0 8px 24px rgba(6,10,22,.08);}
.brand{display:flex; align-items:center; gap:11px;}
.brand img{height:58px; width:auto; transition:height .25s ease;}
.site-header.is-scrolled .brand img{height:44px;}
.brand-word{font-family:var(--font-head); font-weight:700; font-size:1.02rem; color:var(--navy-950); line-height:1.15;}
.brand-word span{display:block; font-family:var(--font-body); font-weight:500; font-size:.7rem; color:var(--gray-500); letter-spacing:.04em; text-transform:uppercase;}

.main-nav{display:flex; align-items:center; gap:6px;}
.main-nav > ul{display:flex; align-items:center; gap:2px;}
.main-nav > ul > li{position:relative;}
.nav-link{display:flex; align-items:center; gap:5px; padding:10px 13px; font-family:var(--font-head); font-weight:600; font-size:.92rem; color:var(--navy-900); border-radius:8px; position:relative;}
.nav-link::after{content:""; position:absolute; left:13px; right:13px; bottom:4px; height:2px; background:var(--electric-500); border-radius:2px; transform:scaleX(0); transform-origin:left; transition:transform .2s ease;}
.nav-link:hover::after, .nav-link[aria-current="page"]::after{transform:scaleX(1);}
.nav-link:hover, .nav-link[aria-current="page"]{color:var(--royal-600);}
.nav-link svg{width:14px; height:14px; transition:transform .18s ease;}
li:hover > .nav-link svg, li:focus-within > .nav-link svg{transform:rotate(180deg);}

.mega{position:absolute; top:100%; left:50%; transform:translateX(-50%); width:min(860px,88vw); background:var(--white); border-radius:var(--radius-md); box-shadow:var(--shadow-lg); border:1px solid var(--gray-200); padding:26px; display:none; gap:32px; grid-template-columns:1.2fr 1fr;}
li:hover > .mega, li:focus-within > .mega{display:grid;}
.mega h4{font-size:.75rem; text-transform:uppercase; letter-spacing:.1em; color:var(--royal-600); margin-bottom:12px;}
.mega ul li a{display:block; padding:7px 10px; border-radius:8px; font-size:.9rem; color:var(--gray-700);}
.mega-residential-list{columns:2; column-gap:10px;}
.mega ul li a:hover{background:var(--gray-50); color:var(--royal-600);}
.mega-foot{margin-top:14px; padding-top:14px; border-top:1px solid var(--gray-100);}

.mega-locations{width:min(420px,88vw); grid-template-columns:1fr 1fr;}
.mega-locations ul li a{padding:6px 8px; font-size:.88rem;}

.header-actions{display:flex; align-items:center; gap:10px;}
.header-call{display:flex; align-items:center; gap:7px; font-family:var(--font-head); font-weight:700; color:var(--navy-950); font-size:.9rem; transition:color .18s ease;}
.header-call:hover{color:var(--royal-600);}
.header-call svg{width:16px; height:16px; color:var(--royal-600);}
.header-actions .btn-primary{height:40px; padding:0 20px; box-shadow:0 6px 16px rgba(38,87,234,.22);}
.header-actions .btn-primary:hover{box-shadow:0 10px 22px rgba(38,87,234,.3);}

.nav-toggle{display:none; background:none; border:none; cursor:pointer; padding:10px; min-width:44px; min-height:44px; align-items:center; justify-content:center;}
.nav-toggle svg{width:24px; height:24px; color:var(--navy-950);}
.mobile-phone-icon{display:none;}

/* Mobile nav */
.mobile-nav{position:fixed; inset:0; background:var(--navy-950); color:var(--white); z-index:100; transform:translateX(100%); transition:transform .28s ease; overflow-y:auto;}
.mobile-nav.open{transform:translateX(0);}
.mobile-nav .container{padding-top:18px;}
.mobile-nav-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:24px;}
.mobile-nav-close{background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.2); border-radius:10px; padding:8px; color:#fff;}
.mobile-nav ul{display:flex; flex-direction:column;}
.mobile-nav > .container > ul > li{border-bottom:1px solid rgba(255,255,255,.1);}
.mobile-nav .m-link{display:flex; justify-content:space-between; align-items:center; padding:16px 4px; font-family:var(--font-head); font-weight:600; font-size:1.05rem;}
.mobile-sub{max-height:0; overflow:hidden; transition:max-height .28s ease;}
.mobile-sub.open{max-height:1400px;}
.mobile-sub a{display:block; padding:10px 4px 10px 16px; color:#c4cfe6; font-size:.95rem; border-top:1px solid rgba(255,255,255,.06);}
.mobile-sub-label{padding:10px 4px 4px; font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; color:var(--electric-400); font-weight:700;}
.mobile-nav-cta{display:flex; flex-direction:column; gap:10px; margin:22px 0 30px;}
.mobile-caret{width:18px; height:18px; transition:transform .2s ease; flex:none;}
.mobile-caret.rot{transform:rotate(180deg);}

/* ---------- Sticky mobile CTA bar ---------- */
.mobile-cta-bar{display:none; position:fixed; left:0; right:0; bottom:0; z-index:70; background:var(--white); border-top:1px solid var(--gray-200); box-shadow:0 -8px 24px rgba(6,10,22,.12);}
.mobile-cta-bar .row{display:flex;}
.mobile-cta-bar a{flex:1; display:flex; align-items:center; justify-content:center; gap:8px; padding:14px 8px; font-family:var(--font-head); font-weight:700; font-size:.92rem;}
.mobile-cta-bar a svg{width:18px; height:18px;}
.mobile-cta-bar .call{color:var(--navy-950); border-right:1px solid var(--gray-200);}
.mobile-cta-bar .quote{background:var(--grad-cta); color:#fff;}

/* ---------- Hero ---------- */
.hero{position:relative; overflow:hidden; background:var(--navy-950); color:#fff;}
.hero-media{position:absolute; inset:0; z-index:0;}
.hero-media img{width:100%; height:100%; object-fit:cover; opacity:.55;}
.hero-media::after{content:""; position:absolute; inset:0; background:linear-gradient(115deg, rgba(6,10,22,.92) 10%, rgba(10,18,48,.72) 45%, rgba(28,75,214,.55) 100%);}
.hero-inner{position:relative; z-index:1; padding:clamp(56px,9vw,110px) 0 clamp(40px,6vw,72px);}
.hero-inner .eyebrow{color:var(--electric-400);}
.hero h1{color:#fff; max-width:820px;}
.hero .lede{color:#d7deef; max-width:600px; font-size:1.15rem;}
.hero-trust{display:flex; flex-wrap:wrap; gap:22px; margin-top:34px; padding-top:26px; border-top:1px solid rgba(255,255,255,.16);}
.hero-trust div{display:flex; align-items:center; gap:9px; font-size:.86rem; color:#c9d4ea; font-weight:600;}
.hero-trust svg{width:18px; height:18px; color:var(--electric-400); flex:none;}

.page-hero{background:var(--grad-dark); color:#fff; padding:40px 0 32px;}
.page-hero h1{color:#fff; margin-bottom:.3em;}
.page-hero .lede{color:#c4cfe6; max-width:680px;}
.breadcrumbs{font-size:.82rem; color:#93a2c4; margin-bottom:18px;}
.breadcrumbs a{color:#c4cfe6;}
.breadcrumbs a:hover{color:var(--electric-400);}
.breadcrumbs span[aria-hidden]{margin:0 6px; opacity:.6;}

/* ---------- Trust strip ---------- */
.trust-strip{background:var(--white); border-bottom:1px solid var(--gray-100);}
.trust-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:16px; padding:20px 0;}
.trust-item{display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; font-size:.85rem; font-weight:600; color:var(--gray-700);}
.trust-item svg{width:26px; height:26px; color:var(--royal-600);}
@media (max-width:900px){.trust-grid{grid-template-columns:repeat(2,1fr);} }

/* ---------- Cards ---------- */
.grid{display:grid; gap:26px;}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:980px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}}

.card{background:var(--white); border:1px solid var(--gray-100); border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .2s ease, box-shadow .2s ease; display:flex; flex-direction:column;}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow-md);}
.card-media{aspect-ratio:4/3; overflow:hidden; background:var(--gray-100);}
/* ---------- Homepage "What We Do" photo-card grid ---------- */
.svc-photo-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px 24px;}
@media (max-width:900px){.svc-photo-grid{grid-template-columns:repeat(2,1fr); gap:24px 18px;}}
@media (max-width:560px){.svc-photo-grid{grid-template-columns:1fr;}}
.svc-photo-card{display:flex; flex-direction:column;}
.svc-photo-media{position:relative; display:block; aspect-ratio:4/3; border-radius:14px; overflow:hidden; box-shadow:var(--shadow-sm);}
.svc-photo-media img{width:100%; height:100%; object-fit:cover; transition:transform .3s ease;}
.svc-photo-card:hover .svc-photo-media img{transform:scale(1.05);}
.svc-photo-label{
  position:absolute; left:14px; bottom:-14px; z-index:1;
  background:var(--navy-950); color:#fff; font-family:var(--font-head); font-weight:700;
  font-size:1.05rem; line-height:1.25; padding:9px 16px; border-radius:8px 8px 8px 2px;
  box-shadow:0 6px 16px rgba(6,10,22,.28); border-left:3px solid var(--electric-500);
  max-width:calc(100% - 28px);
}
.svc-photo-card p{margin:34px 0 8px; color:var(--gray-600); font-size:.92rem; line-height:1.55;}
@media (max-width:480px){
  .svc-photo-label{font-size:.92rem; padding:8px 13px; left:10px;}
  .svc-photo-card p{margin-top:38px;}
}
.svc-photo-link{display:inline-flex; align-items:center; gap:5px; font-family:var(--font-head); font-weight:700; font-size:.9rem; color:var(--royal-600); min-height:44px; align-self:flex-start;}

/* ---------- Location page: alternating image+text service rows ---------- */
.svc-img-row{display:grid; grid-template-columns:42% 1fr; gap:36px; align-items:center; margin-bottom:52px;}
.svc-img-row:last-child{margin-bottom:0;}
.svc-img-row-media{border-radius:16px; overflow:hidden; box-shadow:var(--shadow-sm); border:1px solid var(--gray-200); aspect-ratio:4/3; max-height:420px;}
.svc-img-row-media img{width:100%; height:100%; object-fit:cover; display:block;}
.svc-img-row-text h3{margin-bottom:10px;}
.svc-img-row-text p{color:var(--gray-700);}
.svc-img-row-text .svc-photo-link{margin-top:12px;}
@media (max-width:760px){
  .svc-img-row{grid-template-columns:1fr; gap:16px; margin-bottom:36px;}
  .svc-img-row-media{order:1 !important; max-height:280px;}
  .svc-img-row-text{order:2 !important;}
}

/* ---------- Location page: non-slider transformation treatments ---------- */
.transform-photo-media{aspect-ratio:16/11; border-radius:18px; overflow:hidden; box-shadow:var(--shadow-md); border:1px solid var(--gray-200);}
.transform-photo-media img{width:100%; height:100%; object-fit:cover;}
.transform-grid-2{display:grid; grid-template-columns:1fr 1fr; gap:8px; aspect-ratio:16/11; border-radius:18px; overflow:hidden; box-shadow:var(--shadow-md); border:1px solid var(--gray-200);}
.transform-grid-2 img{width:100%; height:100%; object-fit:cover;}
.transform-photo figcaption{margin-top:14px;}
.transform-photo figcaption strong{display:block; font-family:var(--font-head); font-weight:700; color:var(--navy-950); margin-bottom:4px;}
.transform-photo figcaption span{color:var(--gray-600); font-size:.92rem;}
.svc-photo-link svg{width:15px; height:15px;}
.svc-photo-link:hover{text-decoration:underline;}

.hero-media-frame{aspect-ratio:4/3; overflow:hidden; border-radius:16px; background:var(--gray-100);}
.hero-media-frame img{width:100%; height:100%; object-fit:cover;}
.blog-featured-frame{aspect-ratio:8/5; overflow:hidden; border-radius:14px; background:var(--gray-100); margin:0 0 24px;}
.blog-featured-frame img{width:100%; height:100%; object-fit:cover;}
.card-media img{width:100%; height:100%; object-fit:cover; transition:transform .4s ease;}
.card:hover .card-media img{transform:scale(1.05);}
.card-body{padding:18px; display:flex; flex-direction:column; gap:8px; flex:1;}
.card-body h3{margin-bottom:2px;}
.card-body p{color:var(--gray-600); font-size:.94rem; margin-bottom:6px;}
.card-link{margin-top:auto; display:inline-flex; align-items:center; gap:6px; font-family:var(--font-head); font-weight:700; font-size:.88rem; color:var(--royal-600);}
.card-link svg{width:15px; height:15px; transition:transform .18s ease;}
.card:hover .card-link svg{transform:translateX(3px);}

.icon-card{padding:20px 22px; border-radius:var(--radius-md); background:var(--white); border:1px solid var(--gray-100); box-shadow:var(--shadow-sm);}
.icon-card .icon{width:46px; height:46px; border-radius:12px; background:var(--electric-100); color:var(--royal-600); display:flex; align-items:center; justify-content:center; margin-bottom:16px;}
.icon-card .icon svg{width:24px; height:24px;}
.icon-card h3{font-size:1.05rem; margin-bottom:6px;}
.icon-card p{color:var(--gray-600); font-size:.92rem; margin:0;}

/* ---------- Before / After slider ---------- */
.ba-slider{position:relative; aspect-ratio:4/3; border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-md); user-select:none; touch-action:pan-y; background:var(--gray-100);}
.ba-slider img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; pointer-events:none;}
.ba-slider .ba-after{position:absolute; inset:0; width:100%; height:100%;}
.ba-slider .ba-before-wrap{position:absolute; inset:0; width:100%; height:100%; overflow:hidden;}
.ba-slider .ba-handle{position:absolute; top:0; bottom:0; width:3px; background:#fff; box-shadow:0 0 0 1px rgba(0,0,0,.15); left:50%; transform:translateX(-50%); cursor:ew-resize;}
.ba-slider .ba-handle::after{content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:44px; height:44px; border-radius:50%; background:#fff; box-shadow:var(--shadow-md); background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c4bd6' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='8 7 4 12 8 17'%3E%3C/polyline%3E%3Cpolyline points='16 7 20 12 16 17'%3E%3C/polyline%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:center; background-size:22px;}
.ba-tag{position:absolute; top:14px; z-index:3; font-family:var(--font-head); font-weight:700; font-size:.72rem; letter-spacing:.08em; color:#fff; background:rgba(6,10,22,.72); padding:6px 12px; border-radius:999px;}
.ba-tag.before{left:14px;}
.ba-tag.after{right:14px;}
.ba-caption{margin-top:14px; font-size:.92rem; color:var(--gray-600);}
.ba-caption strong{color:var(--navy-950); display:block; font-family:var(--font-head); font-size:1rem; margin-bottom:2px;}

/* ---------- Reviews ---------- */
.review-card{background:var(--white); border:1px solid var(--gray-100); border-radius:var(--radius-md); padding:26px; box-shadow:var(--shadow-sm); height:100%; display:flex; flex-direction:column; gap:12px;}
.review-stars{display:flex; gap:3px; color:var(--electric-500);}
.review-stars svg{width:16px; height:16px;}
.review-card p{color:var(--gray-700); font-size:.95rem; margin:0;}
.review-name{font-family:var(--font-head); font-weight:700; font-size:.9rem; color:var(--navy-950); margin-top:auto;}
.review-source{font-size:.78rem; color:var(--gray-500);}
.google-review-block .google-review-grid:empty{display:none;}
.google-review-block .google-review-grid:not(:empty) + [data-review-fallback]{margin-top:28px;}

/* ---------- Process steps ---------- */
.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; counter-reset:step;}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.steps{grid-template-columns:1fr;}}
.step{position:relative; padding-top:8px;}
.step .num{font-family:var(--font-head); font-weight:800; font-size:2.1rem; background:linear-gradient(120deg,var(--royal-600),var(--electric-500)); -webkit-background-clip:text; background-clip:text; color:transparent; margin-bottom:8px; display:block;}
.step h3{font-size:1.02rem; margin-bottom:6px;}
.step p{color:var(--gray-600); font-size:.9rem; margin:0;}

/* ---------- FAQ ---------- */
.faq-item{border-bottom:1px solid var(--gray-200);}
.faq-q{width:100%; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 4px; background:none; border:none; text-align:left; cursor:pointer; font-family:var(--font-head); font-weight:600; font-size:1.02rem; color:var(--navy-950);}
.faq-q svg{width:20px; height:20px; flex:none; transition:transform .2s ease; color:var(--royal-600);}
.faq-item.open .faq-q svg{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .25s ease;}
.faq-item.open .faq-a{max-height:600px;}
.faq-a p{padding:0 4px 20px; color:var(--gray-600); margin:0;}

/* ---------- Gallery / video reel ---------- */

/* ---------- Final CTA ---------- */
.final-cta{background:var(--grad-brand); color:#fff; text-align:center; position:relative; overflow:hidden;}
.final-cta .container{position:relative;}
.final-cta-mark{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); height:340px; width:auto; opacity:.06; pointer-events:none; z-index:0; filter:brightness(0) invert(1);}
.final-cta .container > *:not(.final-cta-mark){position:relative; z-index:1;}
.final-cta h2{color:#fff;}
.final-cta p{color:#dbe4f6;}
.final-cta .cta-row{justify-content:center; margin-top:24px;}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy-950); color:#aab7d4; padding:64px 0 0;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1fr; gap:32px; padding-bottom:40px;}
@media (max-width:980px){.footer-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr;}}
.footer-brand img{height:72px; width:auto; margin-bottom:16px;}
.footer-brand p{font-size:.88rem; color:#93a2c4; max-width:280px;}
.footer-social{display:flex; gap:10px; margin-top:16px;}
.footer-social a{width:44px; height:44px; border-radius:10px; background:rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.12);}
.footer-social a:hover{background:var(--royal-600); border-color:var(--royal-600);}
.footer-social svg{width:17px; height:17px; color:#fff;}
.footer-col h4{font-family:var(--font-head); font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; color:#fff; margin-bottom:16px;}
.footer-col ul li{margin-bottom:10px;}
.footer-col a{font-size:.9rem; color:#aab7d4;}
.footer-col a:hover{color:var(--electric-400);}
.footer-contact li{display:flex; align-items:flex-start; gap:10px; font-size:.9rem; margin-bottom:14px;}
.footer-contact svg{width:17px; height:17px; color:var(--electric-400); margin-top:2px; flex:none;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1); padding:22px 0; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.8rem; color:#7c8ab0;}
.footer-bottom a{color:#7c8ab0;}
.footer-bottom a:hover{color:var(--electric-400);}

/* ---------- Forms ---------- */
.form-card{background:var(--white); border:1px solid var(--gray-100); border-radius:var(--radius-lg); box-shadow:var(--shadow-md); padding:clamp(24px,3vw,40px);}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
@media (max-width:640px){.form-grid{grid-template-columns:1fr;}}
.field{display:flex; flex-direction:column; gap:6px; margin-bottom:18px;}
.field.full{grid-column:1/-1;}
.field label{font-size:.86rem; font-weight:600; color:var(--navy-900);}
.field .req{color:var(--royal-600);}
.field input,.field select,.field textarea{
  font-family:var(--font-body); font-size:16px; padding:12px 14px; border-radius:10px;
  border:1.5px solid var(--gray-200); background:var(--gray-25); color:var(--ink);
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--royal-600); outline:none; background:#fff;}
.field-file{border:1.5px dashed var(--gray-300); border-radius:10px; padding:18px; text-align:center; font-size:.86rem; color:var(--gray-500); background:var(--gray-25);}
.field-file-compact{padding:12px 16px; min-height:44px; max-height:110px; display:flex; align-items:center; justify-content:center; gap:8px; font-size:.84rem; cursor:pointer;}
.field-file-compact svg{width:18px; height:18px; flex:none;}
.photo-thumbs{display:flex; flex-wrap:wrap; gap:8px; margin-top:8px;}
.photo-thumbs .thumb{position:relative; width:52px; height:52px; border-radius:8px; overflow:hidden; border:1px solid var(--gray-200);}
.photo-thumbs .thumb img{width:100%; height:100%; object-fit:cover;}
.photo-thumbs .thumb button{position:absolute; top:1px; right:1px; width:16px; height:16px; border-radius:50%; background:rgba(6,10,22,.75); color:#fff; border:none; font-size:10px; line-height:16px; cursor:pointer; padding:0;}

.svc-check-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-bottom:8px;}
@media (max-width:640px){.svc-check-grid{grid-template-columns:1fr;}}
.svc-check-label{font-family:var(--font-head); font-weight:700; font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:var(--royal-600); margin-bottom:8px;}
.svc-check{display:flex; align-items:center; gap:8px; font-size:.9rem; color:var(--gray-700); padding:6px 0; cursor:pointer;}
.svc-check input{width:16px; height:16px; flex:none; accent-color:var(--royal-600);}

.cond-block{background:var(--gray-50); border:1px solid var(--gray-200); border-radius:12px; padding:18px 20px; margin:14px 0;}
.cond-block h4{font-size:.92rem; margin-bottom:12px; color:var(--navy-900);}
.cond-block[hidden]{display:none;}
.form-note{font-size:.78rem; color:var(--gray-500); margin-top:6px;}
.form-success{display:none; text-align:center; padding:40px 10px;}
.form-success.show{display:block;}
.form-success svg{width:52px; height:52px; color:#1fa66b; margin-bottom:14px;}

/* ---------- Content / prose (blog, legal) ---------- */
.prose{max-width:760px; margin:0 auto;}
.prose h2{margin-top:1.6em;}
.prose h3{margin-top:1.3em;}
.prose p,.prose li{color:var(--gray-700); font-size:1.03rem;}
.prose ul{list-style:disc; padding-left:1.3em; margin-bottom:1em;}
.prose ul li{margin-bottom:.4em;}
.prose img{border-radius:var(--radius-md); margin:1.6em 0;}
.prose blockquote{border-left:4px solid var(--electric-500); padding:4px 0 4px 20px; color:var(--gray-600); font-style:italic; margin:1.6em 0;}
.blog-meta{display:flex; gap:14px; align-items:center; color:#c4cfe6; font-size:.85rem; margin-bottom:6px;}
.tag{display:inline-block; padding:4px 12px; border-radius:999px; background:var(--electric-100); color:var(--royal-600); font-size:.74rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;}

/* ---------- City chip grid ---------- */
.city-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:12px;}
@media (max-width:900px){.city-grid{grid-template-columns:repeat(3,1fr);}}
@media (max-width:640px){.city-grid{grid-template-columns:repeat(2,1fr);}}
.city-chip{display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border:1px solid var(--gray-200); border-radius:12px; font-weight:600; font-size:.92rem; background:#fff;}
.city-chip:hover{border-color:var(--royal-600); color:var(--royal-600); box-shadow:var(--shadow-sm);}
.city-chip.primary{background:var(--grad-cta); color:#fff; border-color:transparent;}
.city-chip svg{width:15px; height:15px;}

/* ---------- misc ---------- */
.badge-row{display:flex; gap:10px; flex-wrap:wrap; margin-top:18px;}
.badge{display:inline-flex; align-items:center; gap:7px; font-size:.8rem; font-weight:600; color:var(--gray-600); background:var(--gray-50); border:1px solid var(--gray-200); padding:7px 13px; border-radius:999px;}
.badge svg{width:14px; height:14px; color:var(--royal-600);}
.divider{height:1px; background:var(--gray-200); margin:32px 0;}
.two-col{display:grid; grid-template-columns:1.05fr .95fr; gap:36px; align-items:center;}
@media (max-width:900px){.two-col{grid-template-columns:1fr;}}
.related-row{display:flex; flex-wrap:wrap; gap:10px;}
.pill-link{border:1.5px solid var(--gray-200); border-radius:999px; padding:9px 18px; font-size:.86rem; font-weight:600; color:var(--navy-900);}
.pill-link:hover{border-color:var(--royal-600); color:var(--royal-600);}

@media (max-width:980px){
  .main-nav, .header-call{display:none;}
  .nav-toggle{display:inline-flex;}
  .mobile-phone-icon{display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; color:var(--royal-600);}
  .mobile-phone-icon svg{width:19px; height:19px;}
  .header-actions .btn-primary{display:none;}
  .mobile-cta-bar{display:block;}
  body{padding-bottom:64px;}
  .footer-grid{gap:28px;}
  :root{ --section-y: clamp(32px, 8vw, 52px); }
  .section-tight{padding: 20px 0;}

  /* Slim mobile header: logo + menu only; phone/email/social move into the mobile nav panel */
  .topbar-links > a{display:none;}
  .topbar-social{display:none;}
  .topbar .container{min-height:0; padding-top:5px; padding-bottom:5px; justify-content:center;}
  .topbar-links{justify-content:center; width:100%;}
  .topbar-hours{font-size:.72rem;}
  .site-header .container{padding-top:7px; padding-bottom:7px;}
  .brand img{height:48px;}
}

/* =========================================================
   EDITORIAL / CINEMATIC UPGRADE — v2
   Skip link, marquee ticker, oversized hero, numbered index,
   pathway cards, stat strip, angular accents.
   ========================================================= */

.skip-link{
  position:fixed; top:-60px; left:12px; z-index:200; background:var(--electric-500); color:#fff;
  padding:12px 20px; border-radius:8px; font-family:var(--font-head); font-weight:700; font-size:.9rem;
  transition:top .15s ease;
}
.skip-link:focus{top:12px;}

/* ---- Marquee ticker ---- */
.marquee{background:var(--navy-950); color:#fff; overflow:hidden; border-top:1px solid rgba(255,255,255,.08); border-bottom:1px solid rgba(255,255,255,.08); padding:16px 0;}
.marquee-track{display:flex; width:max-content; gap:0; animation:marquee-scroll 34s linear infinite;}
.marquee:hover .marquee-track{animation-play-state:paused;}
.marquee-item{display:flex; align-items:center; gap:14px; padding:0 28px; font-family:var(--font-head); font-weight:700; font-size:1rem; letter-spacing:.04em; text-transform:uppercase; white-space:nowrap; color:#dfe7f7;}
.marquee-item .dot{width:6px; height:6px; border-radius:50%; background:var(--electric-500);}
@keyframes marquee-scroll{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
@media (prefers-reduced-motion: reduce){ .marquee-track{animation:none; overflow-x:auto;} }

/* ---- Cinematic hero v2 ---- */
.hero-v2{position:relative; overflow:hidden; background:var(--navy-950); color:#fff; min-height:min(88vh,900px); display:flex; align-items:flex-end;}
.hero-v2 .hero-media{position:absolute; inset:0; z-index:0;}
.hero-v2 .hero-media img, .hero-v2 .hero-media video{width:100%; height:100%; object-fit:cover; object-position:center 55%; opacity:.96;}
.hero-v2 .hero-media video{display:block;}
.hero-v2 .hero-media [data-hero-poster-img]{display:none;}
@media (prefers-reduced-motion: reduce){
  .hero-v2 .hero-media video{display:none !important;}
  .hero-v2 .hero-media [data-hero-poster-img]{display:block !important;}
}
.hero-v2 .hero-media::after{content:""; position:absolute; inset:0; background:
  linear-gradient(115deg, rgba(28,75,214,.10) 0%, rgba(47,125,255,.22) 100%),
  linear-gradient(rgba(17,41,110,.26), rgba(17,41,110,.26)),
  linear-gradient(0deg, rgba(6,10,22,.62) 0%, rgba(6,10,22,.26) 32%, rgba(6,10,22,.08) 55%, rgba(6,10,22,0) 80%);
}
.hero-v2-inner{position:relative; z-index:1; padding:120px 0 64px; width:100%;}
.hero-v2 .eyebrow{color:var(--electric-400);}
.hero-v2 h1{
  color:#fff; font-size:clamp(1.7rem, 4.6vw, 3.4rem); line-height:1.12; letter-spacing:-0.01em;
  margin-bottom:10px; max-width:min(92vw, 680px); text-shadow:0 2px 16px rgba(0,0,0,.45);
}
.hero-v2 h1 .accent{color:var(--electric-400);}
.hero-brandline{
  font-family:var(--font-head); font-weight:800; text-transform:uppercase; letter-spacing:.04em;
  font-size:clamp(1.1rem,2vw,1.5rem); color:var(--electric-400); margin:0 0 18px;
}
.hero-v2 .lede{color:#d7deef; max-width:560px; font-size:1.15rem; text-shadow:0 1px 10px rgba(0,0,0,.4);}
.hero-stats{display:flex; gap:clamp(18px,3.5vw,44px); margin-top:40px; padding-top:28px; border-top:1px solid rgba(255,255,255,.16); flex-wrap:wrap;}
.hero-stats > div{max-width:180px;}
.hero-stats .stat-num{font-family:var(--font-head); font-weight:800; font-size:clamp(1.1rem,2vw,1.5rem); line-height:1.15; color:#fff; display:block;}
.hero-stats .stat-label{font-size:.76rem; text-transform:uppercase; letter-spacing:.06em; color:#9fadcf;}

/* ---- Angular section divider ---- */
.angle-divider{height:64px; background:var(--white); position:relative; margin-top:-1px;}
.angle-divider.to-navy{background:linear-gradient(115deg, transparent 49.7%, var(--navy-950) 50%);}
.angle-divider.from-navy{background:linear-gradient(115deg, var(--navy-950) 49.7%, transparent 50%);}

/* ---- Pathways (residential / commercial) ---- */
.pathways{display:grid; grid-template-columns:1fr 1fr; gap:2px; background:var(--navy-950);}
@media (max-width:820px){.pathways{grid-template-columns:1fr;}}
.pathway{position:relative; min-height:420px; display:flex; align-items:flex-end; overflow:hidden; color:#fff;}
.pathway img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s ease;}
.pathway::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(6,10,22,.92) 20%, rgba(6,10,22,.35) 65%, rgba(6,10,22,.55) 100%);}
.pathway:hover img{transform:scale(1.06);}
.pathway-content{position:relative; z-index:1; padding:44px; width:100%;}
.pathway-content .tag-label{font-family:var(--font-head); font-weight:700; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--electric-400); margin-bottom:10px; display:block;}
.pathway-content h3{color:#fff; font-size:clamp(1.6rem,3vw,2.2rem); text-transform:uppercase; letter-spacing:-0.01em; margin-bottom:10px;}
.pathway-content p{color:#d7deef; max-width:420px; margin-bottom:18px;}

/* ---- Numbered editorial services index ---- */
.svc-index{border-top:1px solid var(--gray-200);}
.svc-row{display:grid; grid-template-columns:80px 1fr auto; align-items:center; gap:24px; padding:26px 4px; border-bottom:1px solid var(--gray-200); transition:background .2s ease;}
.svc-row:hover, .svc-row:focus-within{background:var(--gray-50);}
.svc-row .svc-num{font-family:var(--font-head); font-weight:800; font-size:1.3rem; color:var(--gray-300); transition:color .2s ease;}
.svc-row:hover .svc-num{color:var(--royal-600);}
.svc-row h3{margin:0; font-size:clamp(1.1rem,2vw,1.5rem);}
.svc-row p{margin:4px 0 0; color:var(--gray-600); font-size:.92rem;}
.svc-row .svc-arrow{width:38px; height:38px; border-radius:50%; border:1.5px solid var(--gray-200); display:flex; align-items:center; justify-content:center; transition:all .2s ease; flex:none;}
.svc-row .svc-arrow svg{width:16px; height:16px;}
.svc-row:hover .svc-arrow{background:var(--grad-cta); border-color:transparent; color:#fff; transform:rotate(45deg);}
@media (max-width:640px){.svc-row{grid-template-columns:50px 1fr auto; gap:14px; padding:20px 2px;}}

/* ---- Editorial split (Why section) ---- */
.editorial-split{display:grid; grid-template-columns:.85fr 1.15fr; gap:56px; align-items:start;}
@media (max-width:900px){.editorial-split{grid-template-columns:1fr;}}
.editorial-split .statement{font-family:var(--font-head); font-weight:800; font-size:clamp(1.9rem,4vw,3rem); line-height:1.05; text-transform:uppercase; letter-spacing:-0.01em; color:#fff;}
.editorial-split .statement .accent{color:var(--electric-400);}
.reason-row{display:flex; gap:16px; padding:20px 0; border-top:1px solid rgba(255,255,255,.14);}
.reason-row:last-child{border-bottom:1px solid rgba(255,255,255,.14);}
.reason-row .icon{width:40px; height:40px; border-radius:10px; background:rgba(47,125,255,.16); color:var(--electric-400); display:flex; align-items:center; justify-content:center; flex:none;}
.reason-row .icon svg{width:20px; height:20px;}
.reason-row h4{color:#fff; margin:0 0 4px; font-size:1.02rem;}
.reason-row p{color:#aab7d4; margin:0; font-size:.9rem;}

/* ---- Featured transformation (single, large) ---- */

/* ---- Branded placeholder texture (for services without real photography yet) ---- */
.branded-placeholder{
  position:relative; aspect-ratio:4/3; border-radius:var(--radius-md); overflow:hidden;
  background:linear-gradient(135deg, var(--navy-950) 0%, var(--navy-800) 45%, var(--royal-600) 100%);
  display:flex; align-items:center; justify-content:center; text-align:center; color:#fff; padding:24px;
  border:1px solid rgba(255,255,255,.08);
}
.branded-placeholder::before{
  content:""; position:absolute; inset:0; opacity:.15;
  background-image:repeating-linear-gradient(135deg, #fff 0 2px, transparent 2px 34px);
}
.branded-placeholder .bp-inner{position:relative; z-index:1;}
.branded-placeholder svg{width:52px; height:52px; margin:0 auto 14px; color:var(--electric-400);}
.branded-placeholder .bp-title{font-family:var(--font-head); font-weight:700; font-size:1.05rem;}
.branded-placeholder .bp-sub{font-size:.8rem; color:#c4cfe6; margin-top:6px; max-width:220px; margin-left:auto; margin-right:auto;}

/* ---- Stat strip (Forza-style trust numbers) ---- */
.stat-strip{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; text-align:center;}
@media (max-width:700px){.stat-strip{grid-template-columns:repeat(2,1fr);}}
.stat-strip .stat-num{display:block; font-family:var(--font-head); font-weight:800; font-size:clamp(1.8rem,4vw,2.6rem); color:var(--navy-950);}
.stat-strip .stat-label{font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:var(--gray-500); font-weight:700;}

/* ---- Blog: published vs queued distinction ---- */
.featured-article{display:grid; grid-template-columns:1fr 1fr; gap:0; background:var(--navy-950); color:#fff; border-radius:var(--radius-lg); overflow:hidden;}
@media (max-width:820px){.featured-article{grid-template-columns:1fr;}}
.featured-article-media{min-height:280px; background:linear-gradient(135deg,var(--navy-900),var(--royal-600)); overflow:hidden;}
.featured-article-body{padding:clamp(28px,4vw,48px);}
.featured-article-body h2{color:#fff;}
.editorial-calendar-row{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 4px; border-bottom:1px solid var(--gray-100); font-size:.92rem; color:var(--gray-500);}
.editorial-calendar-row .cal-title{color:var(--gray-700); font-weight:600;}