/* Self-hosted Inter variable font — no external request */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/InterVariable.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/InterVariable-Italic.woff2') format('woff2');
}

/* ===================================================================
   ALEGRE SOLUTIONS GS - DESIGN SYSTEM
   Brand logic: built by a former electrician who scaled trades businesses.
   Palette pulls from job-site materials: blackout night sky, navy uniform,
   sky-blue daywork, hazard-orange signage. The "system" motif (circuit /
   conduit lines connecting service cards) is the signature element -
   it's literal: this agency installs connected systems, not a menu of services.
   =================================================================== */

:root{
  --bg: #ffffff;
  --navy: #155f8f;
  --blue: #1a8abf;
  --orange: #d4620a;
  --orange-text: #b85506;
  --white: #111111;
  --pure-white: #111111;
  --muted: #555555;
  --gray: #666666;
  --border: rgba(0,0,0,0.1);

  --orange-glow: rgba(231,108,8,0.25);
  --blue-glow: rgba(26,138,191,0.2);
  --navy-soft: rgba(21,95,143,0.15);

  --font-sans:
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Helvetica,
    Arial,
    sans-serif;
  --heading-font: var(--font-sans);
  --body-font: var(--font-sans);

  --text-strong: #1d1d1f;
  --text-body: #333336;
  --text-muted: #6e6e73;
  --text-subtle: #86868b;
  --body-size: clamp(1.0625rem, 0.98rem + 0.3vw, 1.1875rem);
  --body-line: 1.72;
  --copy-width: 70ch;
  --heading-tight: -0.022em;
  --heading-soft: -0.012em;
  --section-space: clamp(76px, 8vw, 128px);
  --section-space-tight: clamp(56px, 5.5vw, 88px);

  --r-xl: 26px;
  --r-lg: 18px;
  --r-md: 14px;
  --r-sm: 8px;

  --shadow-soft: 0 10px 30px rgba(0,0,0,0.5);
  --shadow: 0 18px 70px rgba(0,0,0,.55);
  --ease: cubic-bezier(.2,.9,.2,1);

  /* ----- Card design tokens (single source of truth) ----- */
  --card-bg: #ffffff;
  --card-bg-alt: #f5f5f7;
  --card-border: rgba(21,95,143,0.14);
  --card-radius: var(--r-lg);
  --card-padding: clamp(24px, 2.4vw, 34px);
  --card-shadow: 0 5px 18px rgba(0,0,0,0.08);
  /* Apple-style hover: soft, even halo — 0 x/y offset on every layer so it wraps
     top/bottom/left/right equally (no drop-shadow bias), feathered and light */
  --card-shadow-hover:
    0 0 22px rgba(0,0,0,0.14),
    0 0 50px rgba(0,0,0,0.09),
    0 0 0 1px rgba(0,0,0,0.04);
  --card-focus-ring: 0 0 0 3px rgba(212,98,10,0.22);
  /* Slow, calm, premium glide — longer, gentler deceleration at the end */
  --card-transition: 0.38s cubic-bezier(0.32, 0.72, 0, 1);
  /* Subtle forward zoom on hover (single source for every card site-wide) */
  --card-zoom: 1.018;

  --container: 1280px;
  --wide-container: 1440px;
  --topbar-h: 58px;
  --header-h: 64px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; background:#ffffff; scroll-padding-top: calc(var(--header-h) + 16px); transition: background-color 0.7s ease; -webkit-text-size-adjust:100%; text-size-adjust:100%;}
body{
  margin:0;
  background: var(--bg);
  color: var(--white);
  font-family: var(--body-font);
  font-size:var(--body-size);
  font-weight:400;
  line-height:var(--body-line);
  letter-spacing:0;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
/* Page transitions — native MPA cross-fade with fade-in (Chrome 126+) */
@view-transition { navigation: auto; }
@media(prefers-reduced-motion:reduce){ @view-transition { navigation: none; } }
::view-transition-old(root){ animation:180ms ease both vt-fade-out; }
::view-transition-new(root){ animation:280ms ease both vt-fade-in; }
@keyframes vt-fade-out{ from{opacity:1;} to{opacity:0;} }
@keyframes vt-fade-in{ from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:translateY(0);} }

a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
ul{list-style:none; margin:0; padding:0;}
button{font-family:inherit; cursor:pointer; border:none; background:none; color:inherit;}
:focus-visible{outline:2px solid var(--blue); outline-offset:3px; border-radius:4px;}
a:focus-visible, button:focus-visible{outline:2px solid var(--blue); outline-offset:3px; border-radius:4px;}
input:focus-visible, textarea:focus-visible, select:focus-visible{outline:2px solid var(--blue); outline-offset:0; border-radius:var(--r-sm); border-color:var(--blue); box-shadow:0 0 0 3px rgba(26,138,191,0.15);}

.container{max-width:var(--container); margin:0 auto; padding:0 24px;}
@media (min-width:1600px){
  .container{max-width:var(--wide-container);}
}

main{
  position:relative;
  background-color:transparent;
}

/* ---------- Top Bar ---------- */
.top-bar{
  position:relative;
  z-index:900;
  height:var(--topbar-h);
  background:#e8e8e6;
  border-bottom:1px solid rgba(0,0,0,0.08);
}
.top-bar .container{
  height:100%;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:18px;
}
.top-bar-center{
  display:contents;
}
.top-bar-message,
.top-bar-phone{
  font-family:var(--heading-font);
  font-weight:500;
  text-transform:none;
  letter-spacing:0.005em;
  white-space:nowrap;
}
.top-bar-message{
  grid-column:2;
  justify-self:center;
  font-size:0.95rem;
  color:var(--text-body);
}
.top-bar-phone{
  grid-column:3;
  justify-self:end;
  color:var(--blue);
  position:relative;
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border:1px solid transparent;
  border-radius:2px;
  transition:color .22s var(--ease), background-color .22s var(--ease), border-color .22s var(--ease), box-shadow .22s var(--ease), transform .22s var(--ease);
}
.top-bar-phone::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:5px;
  height:1px;
  background:var(--orange);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .22s var(--ease);
}
.top-bar-phone:hover,
.top-bar-phone:focus-visible{
  color:var(--orange);
  background:transparent;
  border-color:transparent;
  box-shadow:none;
  transform:translateY(-1px);
}
.top-bar-phone:hover::after,
.top-bar-phone:focus-visible::after{
  transform:scaleX(1);
}
@media (min-width:981px){
  .header-actions .btn-primary{
    white-space:nowrap;
  }
}

@media (max-width:768px){
  .top-bar{
    height:auto;
    padding:10px 0;
  }
  .top-bar .container{
    display:flex;
    justify-content:center;
    gap:10px;
  }
  .top-bar-center{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    width:auto;
    gap:10px;
    text-align:center;
  }
  .top-bar-message,
  .top-bar-phone{
    grid-column:auto;
    justify-self:auto;
  }
  .top-bar-message{
    white-space:normal;
    font-size:0.85rem;
  }
}
.section{padding:var(--section-space) 0; position:relative; z-index:1; background:var(--bg);}
.section-tight{padding:var(--section-space-tight) 0; position:relative; z-index:1; background:var(--bg);}
@media (max-width:768px){
  .section{padding:60px 0;}
  .section-tight{padding:44px 0;}
}

/* Light hairline divider at the top of every section (Apple-style separators) */
.section::before,
.section-tight::before{
  content:"";
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:min(var(--container), 100% - 48px);
  height:1px;
  background:var(--border);
  pointer-events:none;
}
@media (min-width:1600px){
  .section::before,
  .section-tight::before{ width:min(var(--wide-container), 100% - 48px); }
}

/* ---------- Typography ---------- */
h1,h2,h3,h4,h5,h6{
  font-family: var(--heading-font);
  color:var(--text-strong);
  text-transform:none;
  margin:0;
  text-wrap:balance;
}
h1{font-size:clamp(2.75rem,5.4vw,5.65rem); font-weight:800; line-height:1.05; letter-spacing:var(--heading-tight);}
h2{font-size:clamp(2.05rem,3.6vw,3.75rem); font-weight:700; line-height:1.08; letter-spacing:var(--heading-soft);}
h3{font-size:clamp(1.35rem,1.45vw + 1rem,2.15rem); font-weight:600; line-height:1.18; letter-spacing:-0.006em;}
h4{font-size:clamp(1.1rem,0.6vw + 0.95rem,1.35rem); font-weight:600; line-height:1.24; letter-spacing:0;}
h5,h6{font-size:clamp(1rem,0.35vw + 0.95rem,1.15rem); font-weight:600; line-height:1.3; letter-spacing:0;}
p{max-width:var(--copy-width); margin:0 0 1.15em; color:var(--text-body); font-size:var(--body-size); font-weight:400; line-height:var(--body-line); text-wrap:pretty;}
.lead{max-width:68ch; font-size:clamp(1.125rem,0.7vw + 1rem,1.45rem); line-height:1.56; color:var(--text-body); font-weight:400; letter-spacing:0;}
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--heading-font);
  color:var(--blue);
  font-size:clamp(0.86rem,0.15vw + 0.82rem,0.96rem);
  font-weight:600;
  letter-spacing:0.02em;
  margin-bottom:20px;
}
.eyebrow::before{display:none;}
.accent{color:var(--orange-text); font-style:normal;}
.accent-blue{color:var(--blue); font-style:normal;}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0, 0, 0, 0);
  white-space:nowrap;
  border:0;
}
.headline-word-swap{
  position:relative;
  display:inline-block;
  min-width:16ch;
  color:inherit;
  font-family:var(--heading-font);
  font-style:normal;
  line-height:1;
  text-align:left;
  vertical-align:baseline;
}
.headline-word-current{
  display:inline-block;
  white-space:nowrap;
}
.slide-word-swap{
  position:relative;
  display:inline-block;
  color:inherit;
  vertical-align:baseline;
}
.slide-word-swap.is-enhanced{
  height:1.18em;
  overflow:hidden;
  text-align:left;
  vertical-align:-0.13em;
}
.slide-word-next{
  display:none;
}
.slide-word-swap.is-enhanced .slide-word-current,
.slide-word-swap.is-enhanced .slide-word-next{
  position:absolute;
  top:0;
  left:0;
  display:inline-block;
  white-space:nowrap;
  transform:translateY(0);
  opacity:1;
  transition:transform .48s var(--ease), opacity .48s var(--ease);
}
.slide-word-swap.is-enhanced .slide-word-next{
  transform:translateY(100%);
  opacity:0;
}
.slide-word-swap.is-sliding .slide-word-current{
  transform:translateY(-100%);
  opacity:0;
}
.slide-word-swap.is-sliding .slide-word-next{
  transform:translateY(0);
  opacity:1;
}
@media (prefers-reduced-motion: reduce){
  .slide-word-current,
  .slide-word-next{
    transition:none;
  }
}

/* Headlines always white — no accent colors */
h1 .accent, h1 .accent-blue,
h2 .accent, h2 .accent-blue,
h3 .accent, h3 .accent-blue,
h4 .accent, h4 .accent-blue { color: inherit; }
.text-center{text-align:center;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--heading-font);
  font-weight:600;
  font-size:clamp(0.95rem,0.18vw + 0.9rem,1.02rem);
  letter-spacing:0.01em;
  padding:18px 32px;
  border-radius:0;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease);
  white-space:nowrap;
}
.btn-primary{
  background: var(--blue);
  color: #ffffff;
}
.btn-primary:hover{
  background: var(--orange);
  color: #0a0a0a;
  transform:translateY(-2px);
}
.btn-primary:active{transform:scale(0.96) translateY(1px); transition:transform 0.08s ease;}
.btn-outline{
  background:transparent;
  color:var(--blue);
  border:1px solid var(--border);
}
.btn-outline:hover{
  border-color:var(--orange);
  background:var(--orange);
  color:#ffffff;
  transform:translateY(-2px);
}
.btn-outline:active{transform:scale(0.96) translateY(1px); transition:transform 0.08s ease;}
.btn-sm{padding:12px 22px; font-size:0.85rem;}
.btn-block{width:100%;}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; left:0; right:0; z-index:1100; overflow:visible;
  height:var(--header-h);
  display:flex; align-items:center;
  background:rgba(255,255,255,0.10);
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  border-bottom:1px solid rgba(21,95,143,0.18);
  transition: background .3s var(--ease), border-color .3s var(--ease), height .3s var(--ease);
}

.site-header.is-scrolled .brand img{height:58px; transform:translate(-8px, 0);}
.site-header .container{display:flex; align-items:center; justify-content:space-between; gap:24px; width:100%; height:100%; overflow:visible;}
.brand{display:flex; align-items:center; gap:0; flex-shrink:0; position:relative; z-index:2; font-family:var(--heading-font); font-size:1.3rem; font-weight:600; letter-spacing:0;}
.brand .accent{margin-left:-8px;}
.brand img{height:112px; width:auto; transform:translate(-18px, -16px); transition:height .3s var(--ease), transform .3s var(--ease);}
.main-nav{display:flex; align-items:center; gap:36px; margin-left:auto; align-self:stretch;}
.main-nav a,
.main-nav .nav-dropdown-toggle{font-size:0.94rem; font-weight:500; letter-spacing:0; color:var(--white); position:relative; padding:4px 0; transition:color .4s var(--ease);}
.site-header.nav-light .main-nav a,
.site-header.nav-light .main-nav .nav-dropdown-toggle{color:#ffffff;}


.main-nav .nav-dropdown-toggle{
  font-family:var(--body-font);
  line-height:inherit;
}
.main-nav .btn{display:none;}
.mobile-nav-home{display:none;}
.main-nav a::after,
.main-nav .nav-dropdown-toggle::after{content:""; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:var(--blue); transition:width .25s var(--ease);}
.main-nav a:hover::after,
.main-nav a.active::after,
.main-nav .nav-dropdown-toggle:hover::after{width:100%;}
.header-actions{display:flex; align-items:center; gap:18px;}
.nav-toggle{display:none; flex-direction:column; gap:5px; width:28px;}
.nav-toggle span{height:2px; background:var(--white); width:100%; transition:.3s var(--ease);}

/* ---------- Services nav dropdown ---------- */
.nav-dropdown{position:relative; display:flex; align-items:center; align-self:stretch;}
.nav-dropdown-menu{
  position:fixed; top:0; left:0;
  transform:translateY(6px);
  display:grid; grid-template-columns:repeat(2, max-content); gap:10px 14px;
  padding:22px 24px;
  width:500px; max-width:calc(100vw - 48px);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .25s var(--ease), transform .25s var(--ease);
  z-index:2000;
}
.nav-dropdown-menu.is-open{
  opacity:1; visibility:visible; pointer-events:auto;
  transform:translateY(0);
}
.nav-dropdown-menu a{
  padding:9px 14px; border-radius:0;
  font-size:0.9rem; font-weight:500; color:var(--white); white-space:nowrap;
  transition:background .2s var(--ease), color .2s var(--ease);
}
.nav-dropdown-menu a::after{display:none;}
.nav-dropdown-menu.nav-light-menu a{color:#ffffff;}
.nav-dropdown-menu a:hover,
.nav-dropdown-menu a:focus-visible{background:var(--blue); color:#ffffff;}
@media (max-width: 980px){
  .nav-dropdown{width:100%; flex-direction:column; align-items:stretch;}
  .nav-dropdown-menu{
    position:static; transform:none; opacity:1; visibility:visible; pointer-events:auto;
    grid-template-columns:1fr; width:100%; max-width:none; min-width:0; margin-top:0; padding:0 0 0 14px;
    background:transparent; border:0; box-shadow:none;
    max-height:0; overflow:hidden;
    transition:max-height .3s var(--ease);
  }
  .nav-dropdown.is-expanded .nav-dropdown-menu{max-height:640px;}
  .nav-dropdown-menu::before{display:none;}
  .main-nav .nav-dropdown-menu a{width:100%; padding:12px; font-size:1rem; font-weight:300; color:rgba(0,0,0,0.55);}
  .main-nav .nav-dropdown-toggle{display:flex; align-items:center; justify-content:space-between;}
  .main-nav .nav-dropdown-toggle::after,
  .main-nav .nav-dropdown-toggle:hover::after,
  .main-nav .nav-dropdown-toggle.active::after{
    content:""; display:inline-block; position:static; flex:none;
    width:8px; height:8px; margin-left:10px; background:transparent;
    border-right:2px solid currentColor; border-bottom:2px solid currentColor;
    transform:rotate(45deg); transition:transform .25s var(--ease);
  }
  .nav-dropdown.is-expanded .nav-dropdown-toggle::after{transform:rotate(-135deg);}
}

@media (max-width: 980px){
  body::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:1190;
    background:rgba(0,0,0,0.35);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    opacity:0;
    pointer-events:none;
    transition:opacity .25s var(--ease);
  }
  body.nav-open::before{
    opacity:1;
    pointer-events:auto;
  }
  .main-nav{
    position:fixed;
    top:50%;
    left:50%;
    width:min(400px, calc(100vw - 32px));
    max-height:calc(100vh - 24px);
    overflow-y:auto;
    scrollbar-width:none;
    -ms-overflow-style:none;
    z-index:1200;
    flex-direction:column;
    justify-content:flex-start;
    align-items:stretch;
    gap:0;
    padding:56px 24px 24px;
    background:rgba(255,255,255,0.45);
    backdrop-filter:blur(40px) saturate(180%);
    -webkit-backdrop-filter:blur(40px) saturate(180%);
    border:1px solid rgba(255,255,255,0.60);
    border-radius:0;
    box-shadow:none;
    opacity:0;
    pointer-events:none;
    transform:translate(-50%, -48%) scale(0.96);
    transition:opacity .25s var(--ease), transform .25s var(--ease);
  }
  .main-nav::-webkit-scrollbar{display:none;}
  .main-nav.is-open{
    opacity:1;
    pointer-events:auto;
    transform:translate(-50%, -50%) scale(1);
  }
  .main-nav a,
  .main-nav .nav-dropdown-toggle{
    width:100%;
    padding:16px 12px;
    text-align:left;
    font-family:var(--body-font);
    font-size:1.1rem;
    font-weight:600;
    line-height:1.2;
    letter-spacing:0;
    text-transform:none;
    color:#1d1d1f;
    border-bottom:1px solid rgba(0,0,0,0.08);
  }
  .main-nav a::after{display:none;}
  .main-nav a:hover,
  .main-nav .nav-dropdown-toggle:hover{color:var(--orange);}
  .mobile-nav-home{display:none !important;}
  .main-nav .btn{
    display:inline-flex;
    width:100%;
    min-height:52px;
    margin-top:16px;
    border-bottom:0;
    font-family:var(--heading-font);
    font-size:0.95rem;
    border-radius:0;
  }
  .mobile-nav-close{
    position:absolute;
    top:14px;
    right:14px;
    width:36px;
    height:36px;
    border-radius:50%;
    background:rgba(0,0,0,0.07);
    color:#1d1d1f;
  }
  .mobile-nav-close::before,
  .mobile-nav-close::after{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    width:16px;
    height:2px;
    background:currentColor;
    border-radius:999px;
  }
  .mobile-nav-close::before{transform:translate(-50%, -50%) rotate(45deg);}
  .mobile-nav-close::after{transform:translate(-50%, -50%) rotate(-45deg);}
  .mobile-nav-close:hover{background:rgba(0,0,0,0.12);}
  .nav-toggle{display:flex;}
  .nav-toggle[aria-expanded="true"]{opacity:0; pointer-events:none;}
  .header-actions .btn{display:none;}
}

[data-theme="dark"] .main-nav a,
[data-theme="dark"] .main-nav .nav-dropdown-toggle{color:#f5f5f7; border-bottom-color:rgba(255,255,255,0.08);}
[data-theme="dark"] .main-nav > a:hover,
[data-theme="dark"] .main-nav .nav-dropdown-toggle:hover{color:var(--orange);}
[data-theme="dark"] .mobile-nav-close{background:rgba(255,255,255,0.1); color:#f5f5f7;}
[data-theme="dark"] .mobile-nav-close:hover{background:rgba(255,255,255,0.18);}
.mobile-nav-close{display:none;}
@media (max-width: 980px){
  [data-theme="dark"] .main-nav{background:rgba(10,10,10,0.82); border-color:rgba(255,255,255,0.10); box-shadow:none;}
  .mobile-nav-close{display:block;}
}

/* ---------- Back to top ---------- */
.back-to-top{
  position:fixed; bottom:24px; left:24px; z-index:900;
  width:40px; height:40px; border-radius:50%;
  background:linear-gradient(160deg, rgba(21,95,143,0.45) 0%, rgba(10,50,90,0.48) 55%, rgba(15,70,115,0.44) 100%);
  backdrop-filter:blur(40px) saturate(200%); -webkit-backdrop-filter:blur(40px) saturate(200%);
  border:1px solid rgba(255,255,255,0.14); color:#fff;
  box-shadow:0 8px 32px rgba(0,0,0,0.22), inset 0 1.5px 0 rgba(255,255,255,0.18), inset 0 -1px 0 rgba(0,0,0,0.30);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transform:translateY(10px);
  transition:.3s var(--ease); outline:none;
}
.back-to-top.is-visible{opacity:1; pointer-events:auto; transform:translateY(0);}
.back-to-top:hover{color:var(--orange);}

/* ---------- Dark mode toggle ---------- */
#theme-toggle{
  position:fixed; bottom:24px; right:24px; z-index:900;
  display:flex; align-items:center; gap:2px; padding:4px;
  background:linear-gradient(160deg, rgba(21,95,143,0.45) 0%, rgba(10,50,90,0.48) 55%, rgba(15,70,115,0.44) 100%);
  backdrop-filter:blur(40px) saturate(200%);
  -webkit-backdrop-filter:blur(40px) saturate(200%);
  border:1px solid rgba(255,255,255,0.14);
  border-radius:999px;
  box-shadow:0 8px 32px rgba(0,0,0,0.22), inset 0 1.5px 0 rgba(255,255,255,0.18), inset 0 -1px 0 rgba(0,0,0,0.30);
}
#theme-toggle button{
  width:32px; height:32px; border-radius:50%;
  border:none; background:transparent;
  color:rgba(255,255,255,0.60);
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s, color .2s, box-shadow .2s;
  flex-shrink:0;
}
#theme-toggle button.is-active{
  background:rgba(255,255,255,0.20);
  color:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,0.20), inset 0 1px 0 rgba(255,255,255,0.30);
}
#theme-toggle button:hover:not(.is-active){
  color:rgba(255,255,255,0.90);
}

/* ===================================================================
   DARK MODE
   =================================================================== */
[data-theme="dark"]{
  --bg: #000000;
  --border: rgba(255,255,255,0.1);
  --muted: #ababab;
  --white: #f5f5f7;
  --pure-white: #f5f5f7;
  --text-strong: #f5f5f7;
  --text-body: #d1d1d6;
  --text-muted: #ababab;
  --text-subtle: #86868b;
  --card-bg: #1c1c1e;
  --card-bg-alt: #1c1c1e;
  --card-border: rgba(255,255,255,0.10);
  --card-shadow: 0 8px 22px rgba(0,0,0,0.28);
  /* Apple-style hover on dark: depth shadow + soft white halo wrapping all sides */
  /* Even, feathered halo on dark — soft white ambient all around, ~50% lighter */
  --card-shadow-hover:
    0 0 26px rgba(0,0,0,0.58),
    0 0 55px rgba(255,255,255,0.06),
    0 0 0 1px rgba(255,255,255,0.06);
  --card-focus-ring: 0 0 0 3px rgba(212,98,10,0.30);
}
[data-theme="dark"] html,
[data-theme="dark"] body{background:#000000; color:#f5f5f7;}

/* text */
[data-theme="dark"] h1,[data-theme="dark"] h2,[data-theme="dark"] h3,
[data-theme="dark"] h4,[data-theme="dark"] h5,[data-theme="dark"] h6{color:#f5f5f7;}
[data-theme="dark"] p{color:var(--text-muted);}
[data-theme="dark"] .lead{color:var(--text-body);}
[data-theme="dark"] .eyebrow{color:var(--blue);}

/* header */
[data-theme="dark"] .site-header{background:rgba(0,0,0,0.72); border-bottom:1px solid rgba(255,255,255,0.10);}
[data-theme="dark"] .site-header.is-scrolled{background:rgba(0,0,0,0.85);}
[data-theme="dark"] .main-nav a,
[data-theme="dark"] .main-nav .nav-dropdown-toggle{color:rgba(255,255,255,0.75);}
[data-theme="dark"] .main-nav > a:hover,
[data-theme="dark"] .main-nav > a.active,
[data-theme="dark"] .main-nav .nav-dropdown-toggle:hover{color:var(--orange);}
@media (min-width:981px){
  [data-theme="dark"] .nav-dropdown-menu{
    background:rgba(10,10,10,0.82);
    border-color:rgba(255,255,255,0.10);
  }
  [data-theme="dark"] .nav-dropdown-menu a{
    color:#f5f5f7;
  }
  [data-theme="dark"] .nav-dropdown-menu a:hover,
  [data-theme="dark"] .nav-dropdown-menu a:focus-visible{
    background:var(--blue);
    color:#ffffff;
  }
}
[data-theme="dark"] .top-bar{background:#0a0a0a; border-bottom:1px solid rgba(255,255,255,0.06);}

/* sections */
[data-theme="dark"] .section{background:#000000;}
[data-theme="dark"] .grid-pattern-light{background:#000000;}
[data-theme="dark"] .grid-pattern-light h1,[data-theme="dark"] .grid-pattern-light h2,
[data-theme="dark"] .grid-pattern-light h3,[data-theme="dark"] .grid-pattern-light h4{color:#f5f5f7;}
[data-theme="dark"] .grid-pattern-light p{color:var(--text-muted);}

/* cards */
[data-theme="dark"] .card,
[data-theme="dark"] .system-card,
[data-theme="dark"] .step,
[data-theme="dark"] .testimonial,
[data-theme="dark"] .fit-box,
[data-theme="dark"] .panel,
[data-theme="dark"] .price-card,
[data-theme="dark"] .mini-link-grid a,
[data-theme="dark"] .article-cta,
[data-theme="dark"] .cookie-settings-card,
[data-theme="dark"] .sitemap-section,
[data-theme="dark"] .grid-pattern-light .card,
[data-theme="dark"] .grid-pattern-light .step{
  background:var(--card-bg);
  border-color:var(--card-border);
}
[data-theme="dark"] .card :is(h3,h4),
[data-theme="dark"] .system-card :is(h3,h4),
[data-theme="dark"] .step :is(h3,h4),
[data-theme="dark"] .testimonial :is(h3,h4),
[data-theme="dark"] .fit-box :is(h3,h4),
[data-theme="dark"] .panel :is(h3,h4),
[data-theme="dark"] .price-card :is(h3,h4),
[data-theme="dark"] .mini-link-grid a :is(h3,h4),
[data-theme="dark"] .article-cta :is(h3,h4),
[data-theme="dark"] .cookie-settings-card :is(h3,h4),
[data-theme="dark"] .sitemap-section :is(h2,h3,h4){
  color:#f5f5f7;
}
[data-theme="dark"] .card :is(p,li),
[data-theme="dark"] .system-card :is(p,li),
[data-theme="dark"] .step :is(p,li),
[data-theme="dark"] .testimonial :is(p,li),
[data-theme="dark"] .fit-box :is(p,li),
[data-theme="dark"] .panel :is(p,li),
[data-theme="dark"] .price-card :is(p,li),
[data-theme="dark"] .article-cta :is(p,li),
[data-theme="dark"] .cookie-settings-card :is(p,li),
[data-theme="dark"] .sitemap-section :is(a,li){
  color:#ababab;
}

/* pricing cards */
[data-theme="dark"] .pricing-stack .price-card,
[data-theme="dark"] .pricing-grid .price-card{background:var(--card-bg); border-color:var(--card-border);}
[data-theme="dark"] .pricing-stack .price-card h3{color:#f5f5f7;}
[data-theme="dark"] .pricing-grid .price-card p,
[data-theme="dark"] .pricing-grid .price-card li,
[data-theme="dark"] .pricing-stack .price-card p,
[data-theme="dark"] .pricing-stack .price-card li{color:#ababab;}
[data-theme="dark"] .price-number,[data-theme="dark"] .price-currency,[data-theme="dark"] .price-term{color:#f5f5f7;}
[data-theme="dark"] .price-divider{background:rgba(255,255,255,0.12);}
[data-theme="dark"] .price-group span{color:#5bc4f0;}
[data-theme="dark"] .price-group li::before{color:#f5f5f7; border-color:rgba(255,255,255,0.3);}
[data-theme="dark"] .price-status{background:rgba(255,255,255,0.08); border-color:rgba(255,255,255,0.15); color:#d1d1d6;}

/* page hero */
[data-theme="dark"] .page-hero{background:#000000;}
[data-theme="dark"] .page-hero h1{color:#f5f5f7;}
[data-theme="dark"] .page-hero p{color:#ababab;}

/* footer */
[data-theme="dark"] .site-footer{background:#0a0a0a; border-top:1px solid rgba(255,255,255,0.08);}
[data-theme="dark"] .footer-grid{border-bottom:1px solid rgba(255,255,255,0.08);}
[data-theme="dark"] .footer-grid h4{color:#f5f5f7;}
[data-theme="dark"] .footer-grid a{color:#6e6e73;}
[data-theme="dark"] .footer-grid a:hover{color:#f5f5f7;}
[data-theme="dark"] .footer-bottom{border-top:1px solid rgba(255,255,255,0.08); color:#6e6e73;}
[data-theme="dark"] .footer-bottom a{color:#6e6e73;}
[data-theme="dark"] .footer-bottom a:hover{color:#f5f5f7;}
[data-theme="dark"] .sms-disclosure{color:#515154;}
[data-theme="dark"] .sms-disclosure a{color:#6e6e73 !important;}
[data-theme="dark"] .footer-grid .btn-primary{background:var(--orange); color:#ffffff;}

/* misc */
[data-theme="dark"] .faq-item{border-color:rgba(255,255,255,0.08);}
[data-theme="dark"] .faq-q{color:#f5f5f7;}
[data-theme="dark"] .faq-a p{color:#ababab;}
[data-theme="dark"] #theme-toggle{
  background:linear-gradient(160deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.04) 55%, rgba(255,255,255,0.10) 100%);
  border-color:rgba(255,255,255,0.24);
  box-shadow:0 4px 24px rgba(0,0,0,0.35), inset 0 1.5px 0 rgba(255,255,255,0.28), inset 0 -1px 0 rgba(0,0,0,0.12);
}
[data-theme="dark"] #theme-toggle button{color:rgba(255,255,255,0.50);}
[data-theme="dark"] #theme-toggle button.is-active{background:rgba(255,255,255,0.20); color:#fff; box-shadow:0 2px 8px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.30);}
[data-theme="dark"] #theme-toggle button:hover:not(.is-active){color:rgba(255,255,255,0.85);}
[data-theme="dark"] .back-to-top{background:linear-gradient(160deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.04) 55%, rgba(255,255,255,0.10) 100%); border-color:rgba(255,255,255,0.24); color:#fff; box-shadow:0 4px 24px rgba(0,0,0,0.35), inset 0 1.5px 0 rgba(255,255,255,0.28), inset 0 -1px 0 rgba(0,0,0,0.12);}
[data-theme="dark"] .cookie-banner{background:rgba(10,10,10,0.82); border-color:rgba(255,255,255,0.10);}
[data-theme="dark"] .cookie-banner-text strong{color:#f5f5f7;}
[data-theme="dark"] .cookie-banner-text p{color:#c7c7c7;}
[data-theme="dark"] .cookie-banner-text .cookie-banner-links{color:#9a9a9a;}
[data-theme="dark"] .cookie-banner-text a{color:#5bc4f0;}
[data-theme="dark"] .stat .num{color:#f5f5f7;}
[data-theme="dark"] .stat .label{color:#ababab;}
[data-theme="dark"] .counters{background:rgba(255,255,255,0.06); border-color:rgba(255,255,255,0.08);}
[data-theme="dark"] .counters .stat{background:#0a0a0a;}
[data-theme="dark"] .testimonial .who .name{color:#f5f5f7;}
[data-theme="dark"] .site-header .btn-outline{border-color:rgba(255,255,255,0.2); color:#f5f5f7;}
[data-theme="dark"] .top-bar-message{color:rgba(255,255,255,0.6);}
[data-theme="dark"] input,[data-theme="dark"] textarea,[data-theme="dark"] select{background:#1c1c1e; border-color:rgba(255,255,255,0.15); color:#f5f5f7;}
[data-theme="dark"] input::placeholder,[data-theme="dark"] textarea::placeholder{color:#6e6e73;}
[data-theme="dark"] label{color:#d1d1d6;}
[data-theme="dark"] .price-copy{color:#ababab;}
[data-theme="dark"] .price-note{color:#6e6e73;}
[data-theme="dark"] .eyebrow{color:var(--blue);}

/* ---------- Hero ---------- */
.hero{
  position:relative; min-height:100vh;
  display:flex; flex-direction:column; justify-content:center; align-items:stretch;
  overflow:hidden;
  z-index:0;
}
.hero-media{
  position:absolute; inset:0; z-index:0;
  background-image:url("../images/hero-poster.jpg");
  background-size:cover;
  background-position:center;
}
.hero-media video, .hero-media img{width:100%; height:100%; object-fit:cover;}
.hero-media video{display:block;}
body.hero-video-unavailable .hero-media video{opacity:0;}
.hero-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.6) 100%);
  z-index:1;
}
.hero-grid{
  position:absolute; inset:0; z-index:1; opacity:0.18;
  background-image:
    linear-gradient(var(--border) 1px, transparent 1px),
    linear-gradient(90deg, var(--border) 1px, transparent 1px);
  background-size:64px 64px;
  background-attachment:fixed;
  background-position:top center;
  mask-image:linear-gradient(180deg, rgba(0,0,0,0.9), transparent 75%);
}
.hero-content{position:relative; z-index:2; width:100%; padding-top:clamp(48px, 6vh, 80px);}
.hero > .container.hero-content{max-width:var(--wide-container);}
.hero-tag{
  font-family:var(--heading-font); color:var(--blue); letter-spacing:0.16em;
  font-size:0.95rem; margin-bottom:10px; display:block; text-align:center;
}
.hero h1{max-width:1120px; margin-left:auto; margin-right:auto; text-align:center; color:#ffffff;}
.hero h1 em{font-style:normal; color:var(--orange);}
.hero-sub{max-width:680px; font-size:clamp(1.12rem,0.55vw + 1rem,1.35rem); line-height:1.58; color:rgba(255,255,255,0.9); margin-top:20px; text-align:center; margin-left:auto; margin-right:auto;}
.hero-cta-row{display:flex; gap:18px; margin-top:42px; flex-wrap:wrap; justify-content:center;}
.hero-stats-wrap{
  position:relative;
  z-index:2;
  margin-top:clamp(34px, 4vh, 56px);
  margin-bottom:clamp(4px, 1vh, 14px);
  width:100%;
}
.hero-stats{
  max-width:640px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  overflow:hidden;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.hero-stat{
  min-height:58px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:5px 16px;
  text-align:center;
}
.hero-stat + .hero-stat{
  border-left:1px solid rgba(255,255,255,0.28);
}
.hero-stat-num{
  font-family:var(--heading-font);
  font-size:clamp(1.35rem, 1.65vw, 1.95rem);
  font-weight:600;
  line-height:1;
  letter-spacing:0;
  color:var(--orange);
}
.hero-stat p{
  margin:0;
  color:#ffffff;
  font-size:clamp(0.72rem, 0.14vw + 0.7rem, 0.82rem);
  line-height:1.35;
  font-weight:600;
}
@media (max-width:760px){
  .hero-stats{
    grid-template-columns:1fr;
  }
  .hero-stat{
    min-height:auto;
    padding:12px 18px;
  }
  .hero-stat + .hero-stat{
    border-left:0;
    border-top:1px solid rgba(255,255,255,0.18);
  }
}

/* Center all content in page-hero sections */
.page-hero{ text-align:center; }
.page-hero h1, .page-hero h2, .page-hero h3,
.page-hero p, .page-hero .eyebrow, .page-hero .hero-sub,
.page-hero .hero-cta-row{ text-align:center; margin-left:auto; margin-right:auto; }
.page-hero .hero-cta-row{ justify-content:center; }
.page-hero .container{ max-width:980px; }
.page-hero h1{ font-size:clamp(2.35rem,4.2vw,4.4rem); font-weight:800; line-height:1.06; letter-spacing:var(--heading-tight); color:var(--text-strong); }
.page-hero p{ color:var(--text-body); line-height:1.68; margin-top:18px; }
.trade-hero h1, .trade-hero h2{ color:#ffffff; }
.trade-hero p{ color:rgba(255,255,255,0.85); }
.service-hero h1, .service-hero h2{ color:#ffffff; }
.service-hero p{ color:rgba(255,255,255,0.88); }
.service-hero .eyebrow{ color:var(--blue); }
.hero .btn-outline, .trade-hero .btn-outline, .service-hero .btn-outline{ border-color:#5bc4f0; color:#5bc4f0; }
.hero .btn-outline:hover, .trade-hero .btn-outline:hover, .service-hero .btn-outline:hover{ border-color:var(--orange); background:var(--orange); color:#0a0a0a; }

.stat-bar{
  position:relative; z-index:2;
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  margin-top:64px; border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden;
  background:var(--border);
}
.stat-bar .stat{background:rgba(0,0,0,0.55); padding:26px 22px;}
.stat .num{font-family:var(--heading-font); font-size:2.4rem; color:#e8e8e8; display:block;}
.stat .num .accent{color:var(--orange);}
.stat .label{font-size:0.82rem; color:rgba(255,255,255,0.55); text-transform:uppercase; letter-spacing:0.06em;}
@media (max-width:768px){
  .stat-bar{grid-template-columns:repeat(2,1fr);}
}

.marquee{
  position:relative; z-index:2; overflow:hidden;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:22px 0;
  background:#1a8abf;
}
.marquee-track{display:flex; align-items:center; gap:40px; white-space:nowrap; animation:scrollx 28s linear infinite;}
.marquee-dot{color:#fff; opacity:0.3;}
.marquee-track span{
  font-family:var(--heading-font);
  font-size:1.1rem;
  font-weight:900;
  color:#ffffff;
  letter-spacing:0.04em;
  text-transform:uppercase;
}
@keyframes scrollx{from{transform:translateX(0);} to{transform:translateX(-50%);}}

/* ---------- Section headers ---------- */
.section-head{max-width:820px; margin-bottom:clamp(42px,5vw,72px);}
.section-head p,
.section-head .lead{margin-top:18px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}

/* ---------- Spacing scale utilities ---------- */
.mt-0{margin-top:0 !important;}
.mt-sm{margin-top:16px !important;}
.mt-md{margin-top:32px !important;}
.mt-lg{margin-top:48px !important;}
.mb-0{margin-bottom:0 !important;}
.mb-sm{margin-bottom:16px !important;}
.mb-md{margin-bottom:32px !important;}
.mb-lg{margin-bottom:48px !important;}

/* ---------- Service / System cards with connector signature ---------- */
.system-grid{position:relative;}
.system-line{
  position:absolute; left:70px; top:54px; bottom:54px; width:2px; z-index:0;
  background:repeating-linear-gradient(180deg, var(--orange) 0 6px, transparent 6px 14px);
  opacity:0.55;
}
@media (max-width:860px){ .system-line{display:none;} }
.system-card{
  position:relative; z-index:1;
  display:grid; grid-template-columns:80px 1fr; gap:28px;
  margin-bottom:20px;
}
.system-card .node{
  width:80px; height:80px; border-radius:50%;
  border:1px solid var(--border); background:#000;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--heading-font); font-size:1.6rem; color:var(--orange);
}
.system-card a.learn{display:inline-flex; gap:8px; margin-top:10px; color:var(--blue); font-size:0.9rem; font-weight:600;}

/* ================================================================
   UNIFIED CARD SYSTEM — single source of truth (ALL cards, site-wide)
   One reusable hover for every card on every page: a subtle Apple-style
   forward zoom (scale) with a soft shadow that wraps the whole card.
   The zoom is driven by --card-scale so it composes cleanly with the
   .reveal scroll-entrance instead of conflicting with it.
   ================================================================ */
.card,
.system-card,
.step,
.testimonial,
.fit-box,
.panel,
.price-card,
.mini-link-grid a,
.article-cta,
.cookie-settings-card,
.sitemap-section{
  position:relative;
  background:var(--card-bg);
  border:1px solid var(--card-border);
  border-radius:var(--card-radius);
  padding:var(--card-padding);
  box-shadow:var(--card-shadow);
  transform-origin:center;
  transform:scale(var(--card-scale, 1));
  transition:transform var(--card-transition), box-shadow var(--card-transition);
}

.card :is(h3,h4),
.system-card :is(h3,h4),
.step :is(h3,h4),
.testimonial :is(h3,h4),
.fit-box :is(h3,h4),
.panel :is(h3,h4),
.price-card :is(h3,h4),
.mini-link-grid a :is(h3,h4),
.article-cta :is(h3,h4),
.cookie-settings-card :is(h3,h4),
.sitemap-section :is(h2,h3,h4){
  margin-bottom:12px;
  color:var(--pure-white);
  font-size:clamp(1.18rem, 0.8vw + 1rem, 1.55rem);
  font-weight:600;
  line-height:1.22;
  letter-spacing:-0.004em;
  text-transform:none;
}

.card :is(p,li),
.system-card :is(p,li),
.step :is(p,li),
.testimonial :is(p,li),
.fit-box :is(p,li),
.panel :is(p,li),
.price-card :is(p,li),
.article-cta :is(p,li),
.cookie-settings-card :is(p,li),
.sitemap-section :is(a,li){
  color:var(--muted);
  font-size:clamp(0.98rem,0.2vw + 0.94rem,1.06rem);
  line-height:1.66;
  letter-spacing:0;
}

/* ---------- Global Apple-style hover: subtle forward zoom + wrap shadow ---------- */
@media (hover:hover){
  .card:hover,
  .system-card:hover,
  .step:hover,
  .testimonial:hover,
  .fit-box:hover,
  .panel:hover,
  .price-card:hover,
  .mini-link-grid a:hover,
  .article-cta:hover,
  .cookie-settings-card:hover,
  .sitemap-section:hover{
    --card-scale:var(--card-zoom);
    box-shadow:var(--card-shadow-hover);
  }

  /* Stagger groups set transition-delay (up to 450ms for card 6) to cascade the
     reveal animation — but that delay lingers and blocks hover. Reset it on hover
     so the zoom fires immediately. Specificity 0,4,0 beats the stagger rule 0,3,0. */
  [data-stagger] > *.reveal.is-visible:hover{
    transition-delay:0s;
  }
}

/* Keyboard focus gets the same forward zoom plus a visible ring */
a.card:focus-visible,
.mini-link-grid a:focus-visible,
.card:focus-within,
.system-card:focus-within,
.step:focus-within,
.testimonial:focus-within,
.fit-box:focus-within,
.panel:focus-within,
.price-card:focus-within,
.article-cta:focus-within,
.cookie-settings-card:focus-within,
.sitemap-section:focus-within{
  outline:none;
  --card-scale:var(--card-zoom);
  box-shadow:var(--card-shadow-hover), var(--card-focus-ring);
}

/* Reduced motion: keep the depth/shadow, drop the zoom movement */
@media (prefers-reduced-motion: reduce){
  .card:hover,
  .system-card:hover,
  .step:hover,
  .testimonial:hover,
  .fit-box:hover,
  .panel:hover,
  .price-card:hover,
  .mini-link-grid a:hover,
  .article-cta:hover,
  .cookie-settings-card:hover,
  .sitemap-section:hover,
  a.card:focus-visible,
  .mini-link-grid a:focus-visible,
  .card:focus-within,
  .system-card:focus-within,
  .step:focus-within,
  .testimonial:focus-within,
  .fit-box:focus-within,
  .panel:focus-within,
  .price-card:focus-within,
  .article-cta:focus-within,
  .cookie-settings-card:focus-within,
  .sitemap-section:focus-within{
    --card-scale:1;
  }
}
.grid{display:grid; gap:24px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,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;}}

/* ---------- Process steps ---------- */
.process-steps{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:860px){.process-steps{grid-template-columns:1fr;}}
.step .step-num{font-family:var(--heading-font); font-size:3.4rem; color:transparent; -webkit-text-stroke:1.5px var(--orange); display:block; margin-bottom:8px;}
.step .tag{display:inline-block; margin-top:18px; font-size:0.78rem; letter-spacing:0.06em; color:var(--blue); text-transform:uppercase; border:1px solid var(--border); padding:6px 12px; border-radius:999px;}

/* ---------- Counters ---------- */
.counters{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden;}
.counters .stat{background:#000; padding:40px 24px; text-align:center;}
.counters .num{font-family:var(--heading-font); font-size:3rem; color:var(--orange);}
@media (max-width:768px){.counters{grid-template-columns:repeat(2,1fr);}}

/* ---------- Testimonials ---------- */
.testimonial .stars{color:var(--orange); letter-spacing:2px; margin-bottom:14px;}
.testimonial .who{display:flex; align-items:center; gap:12px; margin-top:18px;}
.testimonial .who .avatar{width:44px; height:44px; border-radius:50%; background:var(--navy); display:flex; align-items:center; justify-content:center; font-family:var(--heading-font); color:var(--blue);}

/* ---------- Comparison: this is for you / not for you ---------- */
.fit-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
@media (max-width:768px){.fit-grid{grid-template-columns:1fr;}}
.fit-box.yes{background:linear-gradient(160deg, rgba(231,108,8,0.08), transparent);}
.fit-box li{display:flex; gap:12px; margin-bottom:16px; color:var(--white); font-size:0.96rem;}
.fit-box.yes li::before{content:"✓"; color:var(--orange); font-weight:700;}
.fit-box.no li::before{content:"✕"; color:var(--muted); font-weight:700;}

/* ---------- FAQ accordion ---------- */
.faq-list{border-top:1px solid var(--border);}
.faq-item{border-bottom:1px solid var(--border);}
.faq-q{
  width:100%; display:flex; justify-content:space-between; align-items:center;
  padding:26px 4px; text-align:left; font-family:var(--heading-font); font-size:1.45rem;
  letter-spacing:0.025em; line-height:1.3; color:var(--white);
}
.faq-q .plus{font-size:1.5rem; color:var(--orange); transition:transform .3s var(--ease); flex-shrink:0; margin-left:20px;}
.faq-item.is-open .faq-q .plus{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .35s var(--ease);}
.faq-a-inner{padding:0 4px 24px; color:var(--muted); max-width:780px;}

/* ---------- Lead magnet / form section ---------- */
.split{display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;}
@media (max-width:900px){.split{grid-template-columns:1fr; gap:40px;}}

/* ---------- Legal document pages ---------- */
body.legal-doc main {
  --white: #111;
  --muted: #444;
  --blue: var(--navy);
  background: #fff;
  background-image: none;
  color: #111;
}
body.legal-doc .page-hero {
  border-bottom: 1px solid rgba(0,0,0,0.1);
  padding-top: 40px;
  padding-bottom: 28px;
}
body.legal-doc .page-hero .container { max-width: 820px; }
body.legal-doc .page-hero::before { display: none; }
body.legal-doc .section-tight { padding-top: 16px; }
body.legal-doc main h2:first-of-type { margin-top: 24px !important; }
body.legal-doc .divider { border-color: rgba(0,0,0,0.12); }

/* Document-style headings — override the marketing display font */
body.legal-doc main h1,
body.legal-doc main h2,
body.legal-doc main h3,
body.legal-doc main h4 {
  font-family: var(--body-font);
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.3;
  color: #111;
}
body.legal-doc main h1 { font-size: clamp(1.5rem, 3vw, 2rem); }
body.legal-doc main h2 { font-size: 1rem; margin-top: 32px !important; border-bottom: 1px solid rgba(0,0,0,0.08); padding-bottom: 6px; }
body.legal-doc main h3 { font-size: 0.92rem; }
body.legal-doc main p  { font-size: 0.9rem; line-height: 1.75; color: #444; }

/* Strip accent colors inside legal content */
body.legal-doc main .accent,
body.legal-doc main .accent-blue { color: inherit; }

/* Eyebrow stays as a small nav label */
body.legal-doc .eyebrow { font-family: var(--body-font); font-size: 0.75rem; letter-spacing: 0.08em; color: #888; }
body.legal-doc .eyebrow::before { background: #ccc; }

/* Dark mode overrides for legal pages */
[data-theme="dark"] body.legal-doc main { color: #f5f5f7; }
[data-theme="dark"] body.legal-doc main h1,
[data-theme="dark"] body.legal-doc main h2,
[data-theme="dark"] body.legal-doc main h3,
[data-theme="dark"] body.legal-doc main h4 { color: #f5f5f7; }
[data-theme="dark"] body.legal-doc main p { color: #ababab; }
[data-theme="dark"] body.legal-doc main h2 { border-bottom-color: rgba(255,255,255,0.10); }
[data-theme="dark"] body.legal-doc .page-hero { border-bottom-color: rgba(255,255,255,0.10); }
[data-theme="dark"] body.legal-doc .divider { border-color: rgba(255,255,255,0.10); }
[data-theme="dark"] body.legal-doc .eyebrow { color: #6e6e73; }
[data-theme="dark"] body.legal-doc .eyebrow::before { background: #444; }

/* ---------- Sitemap page ---------- */
.sitemap-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 40px 32px;
  padding: 32px 0 56px;
}
.sitemap-section h2 {
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: #111 !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 12px;
}
.sitemap-section ul { display: flex; flex-direction: column; gap: 7px; }
.sitemap-section a { font-size: 0.85rem; color: #444; transition: color .15s; }
.sitemap-section a:hover { color: var(--orange); }
@media (max-width:600px) { .sitemap-grid { grid-template-columns: 1fr 1fr; gap: 28px 20px; } }

/* ---------- Footer (Apple-style) ---------- */
.site-footer{
  position:relative;
  background-color:#f5f5f7;
  border-top:1px solid #d2d2d7;
  padding:48px 0 0;
  color:#6e6e73;
  font-size:0.78rem;
}
.footer-grid{
  display:flex;
  flex-wrap:wrap;
  gap:32px 48px;
  align-items:flex-start;
  padding-bottom:40px;
  border-bottom:1px solid #d2d2d7;
}
.footer-brand{flex:1 1 240px; max-width:300px;}
.footer-grid > div:not(.footer-brand){flex:1 1 120px;}
.footer-grid > div{
  min-height:0;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.footer-logo-link{
  display:inline-block;
  margin-bottom:14px;
}
.footer-logo{
  width:72px;
  height:auto;
  background:transparent;
  border-radius:0;
  padding:0;
}
@media (max-width:600px){.footer-grid{gap:24px 0;} .footer-brand{max-width:100%;}}
.footer-grid h4{
  color:#1d1d1f;
  font-size:0.72rem;
  font-weight:600;
  letter-spacing:0;
  text-transform:none;
  margin-bottom:12px;
}
.footer-grid p{color:#6e6e73; font-size:0.78rem;}
.footer-grid li{margin-bottom:8px;}
.footer-grid a{color:#6e6e73; font-size:0.78rem; transition:color .15s;}
.footer-grid a:hover{color:#1d1d1f; text-decoration:underline;}

.site-footer .footer-grid a.btn-primary{
  margin-top:10px; background:var(--orange); font-size:0.82rem; color:#ffffff; text-decoration:none;
}
.site-footer .footer-grid a.btn-primary:hover{
  background:var(--blue); color:#ffffff; text-decoration:none;
}

.contact-line{display:flex; align-items:center; gap:10px;}
.icon-sm{width:16px; height:16px; flex-shrink:0; filter:none; opacity:0.5;}
.icon-md{width:22px; height:22px; flex-shrink:0; filter:none; opacity:0.5;}
[data-theme="dark"] .icon-sm,
[data-theme="dark"] .icon-md{
  filter:brightness(0) invert(1);
  opacity:1;
}
.footer-brand .brand{margin-bottom:12px;}
.footer-bottom{
  border-top:1px solid #d2d2d7;
  margin:0;
  padding:16px 0;
  font-family:var(--body-font);
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
  font-size:0.72rem;
  color:#6e6e73;
}
.footer-bottom a{color:#6e6e73;}
.footer-bottom a:hover{color:#1d1d1f; text-decoration:underline;}
.footer-legal-links{display:flex; gap:14px; flex-wrap:wrap;}
.sms-disclosure{
  font-size:0.72rem;
  color:#6e6e73;
  margin:0;
  padding:14px 0;
  max-width:none;
}
.sms-disclosure a{color:#515154 !important; text-decoration:underline;}
.sms-disclosure a:hover{color:#1d1d1f !important;}

.page-hero{padding:40px 0 56px; position:relative; overflow:hidden;}
.page-hero::before{
  content:"";
  position:absolute; inset:0; z-index:0; opacity:0.16;
  background-image:
    linear-gradient(var(--border) 1px, transparent 1px),
    linear-gradient(90deg, var(--border) 1px, transparent 1px);
  background-size:56px 56px;
  background-attachment:fixed;
  background-position:top center;
  mask-image:linear-gradient(180deg, rgba(0,0,0,0.9), transparent 85%);
}
.page-hero .container{position:relative; z-index:1;}
.page-hero.has-bg-image{
  background-image:
    linear-gradient(180deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.78) 100%),
    var(--page-hero-image);
  background-size:cover;
  background-position:center;
}
.page-hero.has-bg-image::before{display:none;}
.page-hero.has-bg-image h1,
.page-hero.has-bg-image h2,
.page-hero.has-bg-image p{color:#ffffff;}
.page-hero.has-bg-image .eyebrow{color:var(--blue); opacity:1;}

.page-hero.trade-hero{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  position:sticky;
  top:0;
  z-index:0;
  background-image:
    linear-gradient(180deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.82) 100%),
    var(--trade-hero-image);
  background-size:cover;
  background-position:center;
  border-bottom:1px solid rgba(119,203,241,.14);
}
/* Page-specific trade hero layout. Keep these separate so one page can be tuned without moving the others. */
.page-hero.trade-hero-hvac,
.page-hero.trade-hero-roofing,
.page-hero.trade-hero-plumbing,
.page-hero.trade-hero-landscaping,
.page-hero.trade-hero-general{
  align-items:center;
}
.page-hero.trade-hero h1,
.page-hero.trade-hero h2,
.page-hero.trade-hero p,
.page-hero.trade-hero .eyebrow{
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
.hero-tag,
.page-hero .eyebrow{
  color:var(--blue);
  opacity:1;
}
body.legal-doc .page-hero .eyebrow,
[data-theme="dark"] body.legal-doc .page-hero .eyebrow{
  color:#1a8abf;
  opacity:1;
}

@media (min-width:981px){
  .page-hero.trade-hero .container{max-width:860px;}
}
@media (max-width:980px){
  .page-hero.trade-hero{ min-height:80vh; }
}
.page-hero.trade-hero::before{
  opacity:.20;
  mix-blend-mode:screen;
}
.page-hero.trade-hero .lead{
  max-width:760px;
  text-shadow:none;
}
.page-hero.trade-hero .hero-cta-row{
  gap:14px;
}
.page-hero.trade-hero .btn{
  min-height:52px;
  padding:15px 28px;
  font-size:.9rem;
  letter-spacing:.035em;
}
.page-hero.service-hero{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  position:sticky;
  top:0;
  z-index:0;
  background-image:
    linear-gradient(180deg, rgba(0,0,0,.70) 0%, rgba(0,0,0,.82) 100%);
  background-size:cover;
  background-position:center;
  border-bottom:1px solid rgba(119,203,241,.14);
}
.page-hero.service-hero::before{
  opacity:.22;
  mix-blend-mode:screen;
}
.page-hero.service-hero .container{
  max-width:920px;
}
.page-hero.service-hero .lead{
  max-width:760px;
  text-shadow:none;
}
.page-hero.service-hero .hero-cta-row{
  gap:14px;
}
.page-hero.service-hero .btn{
  min-height:52px;
  padding:15px 28px;
  font-size:.9rem;
  letter-spacing:.035em;
}
.trade-secondary-nav.service-secondary-nav .container{
  gap:26px;
}
@media (max-width:980px){
  .page-hero.service-hero{ min-height:80vh; }
}
@media (max-width:640px){
  .trade-secondary-nav.service-secondary-nav .container{
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    gap:22px;
    padding-left:20px;
    padding-right:20px;
    -webkit-overflow-scrolling:touch;
  }
  .trade-secondary-nav.service-secondary-nav a{white-space:nowrap;}
}
.trade-secondary-nav{
  position:sticky;
  top:var(--header-h);
  z-index:1000;
  background:var(--blue);
  border-top:1px solid rgba(255,255,255,.16);
  border-bottom:1px solid rgba(0,0,0,.34);
  box-shadow:0 12px 34px rgba(119,203,241,.10);
}
.trade-secondary-nav .container{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:34px;
  flex-wrap:wrap;
  padding-top:18px;
  padding-bottom:18px;
}
.trade-secondary-nav a{
  position:relative;
  font-family:var(--body-font);
  font-size:.92rem;
  font-weight:700;
  color:rgba(255,255,255,0.70);
  letter-spacing:0;
  text-transform:none;
  padding:4px 0;
  transition:color .2s var(--ease);
}
.trade-secondary-nav a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-4px;
  width:0;
  height:2px;
  background:#ffffff;
  transition:width .25s var(--ease);
}
.trade-secondary-nav a:hover,
.trade-secondary-nav a.active{
  color:#ffffff;
}
.trade-secondary-nav a:hover::after,
.trade-secondary-nav a.active::after{
  width:100%;
}
@media(max-width:640px){
  .trade-secondary-nav .container{
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    gap:24px;
    padding-left:20px;
    padding-right:20px;
    -webkit-overflow-scrolling:touch;
  }
  .trade-secondary-nav a{white-space:nowrap;}
}



/* ---------- Grid-pattern section backgrounds (reusable signature texture) ---------- */
.grid-pattern-dark{
  position:relative;
  background-image:
    linear-gradient(var(--border) 1px, transparent 1px),
    linear-gradient(90deg, var(--border) 1px, transparent 1px);
  background-size:64px 64px;
  background-attachment:fixed;
  background-position:top center;
}
.grid-pattern-light{
  position:relative;
  background-color:#ffffff;
}
.grid-pattern-light h1, .grid-pattern-light h2, .grid-pattern-light h3, .grid-pattern-light h4{color:#111;}
.grid-pattern-light p{color:#4a4a4a;}
.grid-pattern-light .lead{color:#111;}
.grid-pattern-light .eyebrow{color:var(--blue);}
.grid-pattern-light .eyebrow::before{background:var(--blue);}
.grid-pattern-light .card{background:var(--card-bg); border-color:var(--card-border);}
.grid-pattern-light .badge{color:var(--navy); border-color:rgba(0,0,0,0.18);}
.grid-pattern-light .step{background:var(--card-bg); border-color:var(--card-border);}
.grid-pattern-light .step .step-num{-webkit-text-stroke:1.5px var(--navy); color:transparent;}
.grid-pattern-light .step .tag{color:var(--navy); border-color:rgba(0,0,0,0.18);}

/* ---------- Card system refinements ---------- */

.system-card .node{
  background:rgba(2,15,23,.86);
  border-color:rgba(119,203,241,.25);
  color:var(--blue);
}

.grid-pattern-light .step .step-num{color:transparent; -webkit-text-stroke:1.5px var(--blue);}
.step .tag{color:var(--blue); border-color:rgba(119,203,241,.24);}

.testimonial .who .avatar{background:rgba(2,15,23,.86); color:var(--blue);}

.fit-box.yes,
.fit-box.no{background:var(--card-bg);}
.grid-pattern-light .fit-box.yes li::before{color:var(--blue);}

.mini-link-grid a{
  display:block;
  color:var(--pure-white);
}

/* ---------- Utility ---------- */
.badge{display:inline-flex; align-items:center; gap:8px; font-size:0.78rem; letter-spacing:0.06em; text-transform:uppercase; padding:7px 14px; border-radius:999px; border:1px solid var(--border); color:var(--blue);}
.divider{height:1px; background:var(--border); margin:60px 0;}
.reveal{opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease), transform var(--card-transition), box-shadow var(--card-transition);}
.reveal.is-visible{opacity:1; transform:scale(var(--card-scale, 1));}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  .marquee-track{animation:none;}
}
.skip-link{position:absolute; left:-9999px; top:0; background:var(--orange); color:#000; padding:10px 16px; z-index:2000;}
.skip-link:focus{left:12px; top:12px;}

/* ---------- Cookie consent ---------- */
.cookie-banner{
  position:fixed; left:24px; bottom:24px; z-index:1900; max-width:420px;
  background:rgba(255,255,255,0.45);
  backdrop-filter:blur(40px) saturate(180%);
  -webkit-backdrop-filter:blur(40px) saturate(180%);
  border:1px solid rgba(255,255,255,0.60);
  border-radius:0; box-shadow:none;
  opacity:0; pointer-events:none;
  transition:opacity .3s var(--ease);
}
.cookie-banner,
.nav-dropdown-menu{
  background:rgba(255,255,255,0.45);
  backdrop-filter:blur(40px) saturate(180%);
  -webkit-backdrop-filter:blur(40px) saturate(180%);
  border:1px solid rgba(21,95,143,0.18);
  border-radius:0;
  box-shadow:none;
}
[data-theme="dark"] .cookie-banner,
[data-theme="dark"] .nav-dropdown-menu{
  background:rgba(10,10,10,0.82);
  border-color:rgba(255,255,255,0.10);
}
@media (max-width:980px){
  .nav-dropdown-menu,
  [data-theme="dark"] .nav-dropdown-menu{
    background:transparent;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    border:0;
    box-shadow:none;
  }
}
.cookie-banner.is-visible{
  opacity:1; pointer-events:auto;
}
.cookie-banner-inner{
  padding:22px 24px; display:flex; flex-direction:column; gap:18px;
}
.cookie-banner-text{flex:1;}
.cookie-banner-text strong{font-family:var(--heading-font); font-size:1.05rem; letter-spacing:0.03em; color:#0a0a0a; display:block; margin-bottom:8px;}
.cookie-banner-text p{font-size:0.85rem; line-height:1.5; margin:0; color:#333333;}
.cookie-banner-text .cookie-banner-links{margin-top:8px; font-size:0.8rem; color:#666666;}
.cookie-banner-text a{color:var(--blue); text-decoration:underline;}
.cookie-banner-actions{display:flex; gap:10px; flex-wrap:wrap;}
.cookie-banner-actions .btn{flex:1 1 calc(50% - 5px);}
.cookie-banner-actions .btn-primary{flex-basis:100%;}

.cookie-settings-panel{
  position:fixed; inset:0; z-index:1950; display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,0.30);
  padding:20px;
  opacity:0; pointer-events:none;
  transition:opacity .25s var(--ease);
}
.cookie-settings-panel.is-visible{
  opacity:1; pointer-events:auto;
}
.cookie-settings-card{
  max-width:480px; width:100%;
  background:rgba(20,20,20,0.80);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,0.10);
  box-shadow:none;
}
.cookie-settings-card h4{margin-bottom:10px; color:#f5f5f7;}
.cookie-settings-card > p{font-size:0.88rem; margin-bottom:24px; color:rgba(255,255,255,0.72);}
.cookie-toggle-row{display:flex; justify-content:space-between; align-items:flex-start; gap:18px; padding:16px 0; border-top:1px solid rgba(255,255,255,0.10);}
.cookie-toggle-row strong{color:#f5f5f7; font-size:0.92rem;}
.cookie-toggle-row p{font-size:0.8rem; margin:4px 0 0; color:rgba(255,255,255,0.55);}
.cookie-toggle-row input{width:20px; height:20px; accent-color:var(--orange); margin-top:4px; flex-shrink:0;}
.cookie-settings-actions{display:flex; justify-content:flex-end; gap:10px; margin-top:24px;}

@media (max-width:600px){
  .cookie-banner{left:12px; right:12px; bottom:12px; max-width:none;}
  .cookie-banner-inner{align-items:stretch;}
}

/* ---------- Blueprint content utilities ---------- */
.pricing-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.price{font-family:var(--heading-font);font-size:clamp(2.1rem,4vw,3.4rem);line-height:1;margin:18px 0;color:var(--pure-white);}
.check-list{display:grid;gap:10px;margin:24px 0 30px;}
.check-list li{position:relative;padding-left:24px;color:var(--muted);}
.check-list li:before{content:"";position:absolute;left:0;top:.7em;width:9px;height:9px;background:var(--orange);}
.mini-link-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.article-body{max-width:840px;}
.article-body h2{margin:46px 0 16px;}
.article-cta{margin-top:58px;}
@media(max-width:980px){.pricing-grid{grid-template-columns:1fr}.mini-link-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.mini-link-grid{grid-template-columns:1fr}}


/* ---------- Pricing proposal cards ---------- */
.pricing-stack{grid-template-columns:repeat(3, minmax(0, 1fr));max-width:1280px;margin:0 auto;gap:24px;align-items:start;}
.pricing-stack .price-card{overflow:visible;margin-top:20px;}
.pricing-stack .price-card:first-child,
.pricing-stack .price-card:last-child{margin-top:40px;}
.price-status{display:inline-flex;width:max-content;margin-bottom:12px;padding:4px 9px;border-radius:4px;background:rgba(18,57,94,0.1);border:1px solid rgba(18,57,94,0.3);color:#12395e;font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.price-status::before{content:"✓";margin-right:5px;}
.price-popular{position:absolute;top:-14px;left:50%;transform:translate(-50%, 0);padding:4px 14px;border-radius:999px;background:#5bc4f0;border:2px solid #5bc4f0;color:#0a0a0a;font-family:var(--heading-font);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;opacity:1;pointer-events:none;}
.price-kicker{display:block;font-size:.68rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:3px;}
.pricing-stack .price-card h3{font-size:clamp(1.8rem,3vw,2.4rem);letter-spacing:.045em;color:#111111;margin-bottom:0;}
.price-card p.price-copy{max-width:720px;margin:0 0 18px;color:#444444;font-size:.92rem;line-height:1.5;}
.price-row{display:flex;align-items:flex-end;gap:3px;margin:8px 0 2px;}
.price-currency{font-family:var(--heading-font);font-size:2rem;color:#111111;line-height:1;transform:translateY(-.15em);}
.price-number{font-family:var(--heading-font);font-size:clamp(3.4rem,7vw,5.8rem);line-height:.88;color:#111111;letter-spacing:.02em;}
.price-term{color:#555555;font-size:.9rem;margin-bottom:.55rem;}
.price-note{margin:0;color:#666666;font-size:.82rem;letter-spacing:0;line-height:1.5;font-weight:400;}
.price-divider{height:1px;background:rgba(0,0,0,0.1);margin:18px 0;}
.price-group{display:grid;grid-template-columns:1fr;gap:8px;padding:13px 0;border-top:1px solid rgba(0,0,0,0.08);}
.price-group:first-of-type{border-top:0;}
.price-group span{font-family:var(--heading-font);font-size:.98rem;letter-spacing:.08em;text-transform:uppercase;color:var(--navy);}
.price-group ul{display:grid;gap:7px;}
.price-group li{position:relative;padding-left:28px;color:#333333;font-size:.92rem;}
.price-group li::before{content:"✓";position:absolute;left:0;top:.08em;width:16px;height:16px;display:grid;place-items:center;background:transparent;color:#111111;border:2px solid #111111;border-radius:1px;font-size:.78rem;font-weight:900;line-height:1;}
.pricing-stack .btn{margin-top:22px;}
@media(max-width:1100px){.pricing-stack{grid-template-columns:1fr;max-width:760px;}.price-group{grid-template-columns:1fr;}}@media(max-width:720px){.price-number{font-size:3.8rem}.price-popular{left:50%;right:auto;}}

/* Neutral badge (no checkmark) for value / commitment notes */
.price-badge{display:inline-flex;width:max-content;margin:0 8px 12px 0;padding:4px 9px;border-radius:4px;background:rgba(0,0,0,0.05);border:1px solid rgba(0,0,0,0.14);color:#333333;font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.price-status{margin-right:8px;}

/* Center-card itemized value breakdown */
.price-lineitems{margin:14px 0 4px;border-top:1px solid rgba(0,0,0,0.1);border-bottom:1px solid rgba(0,0,0,0.1);}
.price-line{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 14px;padding:12px 0;border-top:1px solid rgba(0,0,0,0.08);}
.price-line:first-child{border-top:0;}
.price-line-name{color:#333333;font-size:.94rem;font-weight:600;flex:1 1 60%;}
.price-line-name em{font-style:normal;color:#666666;font-weight:400;}
.price-line-cost{font-family:var(--heading-font);font-size:1.02rem;color:#111111;white-space:nowrap;}
.price-line-sub{flex:1 1 100%;margin:0;color:#666666;font-size:.8rem;line-height:1.45;}
.price-line.is-total{border-top:2px solid rgba(0,0,0,0.2);}
.price-line.is-total .price-line-name{color:#111111;text-transform:uppercase;letter-spacing:.06em;font-size:.9rem;}
.price-line.is-total .price-line-cost{font-size:1.25rem;color:var(--navy);text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:rgba(0,0,0,0.45);}

/* Dark theme */
[data-theme="dark"] .price-badge{background:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.15);color:#d1d1d6;}
[data-theme="dark"] .price-lineitems{border-color:rgba(255,255,255,0.14);}
[data-theme="dark"] .price-line{border-top-color:rgba(255,255,255,0.1);}
[data-theme="dark"] .price-line-name{color:#e5e5e7;}
[data-theme="dark"] .price-line-name em{color:#ababab;}
[data-theme="dark"] .price-line-cost{color:#f5f5f7;}
[data-theme="dark"] .price-line-sub{color:#ababab;}
[data-theme="dark"] .price-line.is-total{border-top-color:rgba(255,255,255,0.3);}
[data-theme="dark"] .price-line.is-total .price-line-name{color:#f5f5f7;}
[data-theme="dark"] .price-line.is-total .price-line-cost{color:#5bc4f0;text-decoration-color:rgba(255,255,255,0.5);}


/* Pricing card button colors */
.pricing-stack .btn,
.pricing-stack .btn-primary,
.pricing-stack .btn-outline{
  background:var(--blue);
  border:2px solid var(--blue);
  color:#ffffff;
  box-shadow:none;
}
.pricing-stack .btn:hover,
.pricing-stack .btn-primary:hover,
.pricing-stack .btn-outline:hover{
  background:var(--orange);
  border-color:var(--orange);
  color:#0a0a0a;
  transform:translateY(-2px);
  box-shadow:none;
}

/* ---------- Contact action modal ---------- */
#theme-toggle.floating-contact-trigger{
  position:fixed; bottom:24px; right:24px; z-index:900;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:42px; padding:0 16px;
  background:linear-gradient(160deg, rgba(21,95,143,0.45) 0%, rgba(10,50,90,0.48) 55%, rgba(15,70,115,0.44) 100%);
  backdrop-filter:blur(40px) saturate(200%);
  -webkit-backdrop-filter:blur(40px) saturate(200%);
  border:1px solid rgba(255,255,255,0.14);
  border-radius:999px;
  box-shadow:0 8px 32px rgba(0,0,0,0.22), inset 0 1.5px 0 rgba(255,255,255,0.18), inset 0 -1px 0 rgba(0,0,0,0.30);
  color:#ffffff;
  font-size:0.86rem;
  font-weight:700;
  letter-spacing:0.02em;
}
#theme-toggle.floating-contact-trigger:hover,
#theme-toggle.floating-contact-trigger:focus-visible{
  color:var(--orange);
}
.contact-action-modal{
  position:fixed; inset:0; z-index:99999;
  display:flex; align-items:center; justify-content:center;
  padding:20px;
  background:rgba(0,0,0,0.30);
  opacity:0; pointer-events:none;
  transition:opacity .25s var(--ease);
}
/* The modal stays display:flex when closed (overriding [hidden]) so the GHL form can
   preload. But GHL's form_embed.js sets pointer-events:auto on the iframe, so the
   invisible full-screen iframe (z-index 99999) would otherwise swallow taps meant for
   the nav / dropdowns / contact trigger underneath it. Force the whole closed subtree
   to ignore pointer events; .is-visible restores them when the modal is actually open. */
.contact-action-modal:not(.is-visible),
.contact-action-modal:not(.is-visible) *{ pointer-events:none !important; }
.contact-action-modal.is-visible{
  opacity:1; pointer-events:auto;
}
.contact-action-card{
  position:relative;
  width:min(480px, 100%);
  max-height:calc(100vh - 40px);
  overflow:auto;
  padding:26px 24px 24px;
  background:rgba(255,255,255,0.45);
  backdrop-filter:blur(40px) saturate(180%);
  -webkit-backdrop-filter:blur(40px) saturate(180%);
  border:1px solid rgba(21,95,143,0.18);
  border-radius:0;
  box-shadow:none;
}
.contact-action-card h2{
  margin:0 40px 8px 0;
  color:#0a0a0a;
  font-size:1.35rem;
  line-height:1.15;
}
.contact-action-card p{
  margin:0 0 20px;
  color:#333333;
  font-size:0.92rem;
  line-height:1.5;
}
.contact-action-close{
  position:absolute; top:12px; right:12px;
  width:34px; height:34px;
  display:grid; place-items:center;
  background:rgba(255,255,255,0.35);
  border:1px solid rgba(21,95,143,0.18);
  border-radius:0;
  color:#0a0a0a;
  font-size:1.5rem;
  line-height:1;
}
.contact-action-close:hover,
.contact-action-close:focus-visible{
  color:var(--orange);
}
.contact-action-options{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
.contact-action-options .btn{
  width:100%;
  justify-content:center;
}
.contact-action-form{
  margin-top:4px;
  overflow:hidden;              /* clip the pulled-up iframe */
}
.contact-action-form iframe{
  width:100%;
  height:560px;
  border:0;
  display:block;
  margin-top:-48px;             /* crop the GHL form's top whitespace */
}
@media (max-width:600px){
  #theme-toggle.floating-contact-trigger{right:12px; bottom:24px;}
  .contact-action-card{width:calc(100vw - 28px); max-height:calc(100vh - 28px); overflow:auto; padding:22px 16px 18px;}
}