/* ------------------------------------------------------------------
   hvac-premier — A+++ template stylesheet
   PALETTE LAW: zero hardcoded brand colors. Every brand-bearing color is
   var(--wss-*). Defaults live in @layer wss-defaults so the engine's
   unlayered :root override always wins, on every build.
   ------------------------------------------------------------------ */
@layer wss-defaults, base, layout, components, motion, responsive;

@layer wss-defaults {
  :root {
    --wss-accent: #c2703b;
    --wss-accent-ink: #98552b;
    --wss-accent-text: #ffffff;
    --wss-surface: #fdfcfa;
    --wss-surface-alt: #f3efe9;
    --wss-slab: #1c1712;
    --wss-slab-ink: #faf6f1;
    --wss-text: #191410;
    --wss-border: #e2dad0;
    --wss-card-title-size: 1.375rem;
    --wss-card-body-size: 1rem;
    --wss-card-pad: 1.5rem;
    --wss-stack-gap: 1.25rem;
  }
}

@layer base {
  :root {
    --header-h: 76px;
    --measure: 68ch;
    --radius: 14px;
    --radius-lg: 22px;
    --shell: min(1200px, 100% - 2.5rem);
    /* one z-index scale, no ad-hoc numbers anywhere else */
    --z-base: 0; --z-raised: 10; --z-scrim: 20; --z-header: 60; --z-floater: 70; --z-drawer: 80;
    --ink-soft: color-mix(in oklab, var(--wss-text), transparent 28%);
    --hairline: 1px solid color-mix(in oklab, var(--wss-border), transparent 20%);
    --shadow-card:
      0 1px 1px color-mix(in oklab, var(--wss-text), transparent 92%),
      0 4px 10px color-mix(in oklab, var(--wss-text), transparent 90%),
      0 18px 40px color-mix(in oklab, var(--wss-text), transparent 88%);
    --shadow-lift:
      0 2px 4px color-mix(in oklab, var(--wss-text), transparent 88%),
      0 12px 26px color-mix(in oklab, var(--wss-text), transparent 82%),
      0 32px 70px color-mix(in oklab, var(--wss-text), transparent 80%);
    --step--1: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
    --step-0: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
    --step-1: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
    --step-2: clamp(1.5rem, 1.3rem + 1vw, 2rem);
    --step-3: clamp(1.875rem, 1.5rem + 1.8vw, 2.75rem);
    --step-4: clamp(2.25rem, 6vw, 5.5rem);
    color-scheme: light dark;
  }
  *, *::before, *::after { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
  @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
  body {
    margin: 0;
    background: var(--wss-surface);
    color: var(--wss-text);
    font-family: "Roboto", "Inter var", "SF Pro Text", "Segoe UI Variable Text", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    font-size: var(--step-0);
    font-optical-sizing: auto;
    line-height: 1.65;
    letter-spacing: 0.005em;
    overflow-x: hidden;
  }
  h1, h2, h3, .display {
    font-family: "SF Pro Display", "Segoe UI Variable Display", "Helvetica Neue", system-ui, sans-serif;
    font-weight: 760;
    font-variation-settings: "wght" 760;
    line-height: 1.04;
    letter-spacing: -0.03em;
    margin: 0 0 0.4em;
    text-wrap: balance;
  }
  h2 { font-size: var(--step-3); }
  h3 { font-size: var(--wss-card-title-size); letter-spacing: -0.02em; line-height: 1.2; }
  p { margin: 0 0 1em; max-width: var(--measure); }
  img, video, svg { max-width: 100%; display: block; }
  img { height: auto; background: var(--wss-surface-alt); }
  a { color: inherit; }
  /* every anchor target clears the sticky header */
  :target, [id] { scroll-margin-block-start: calc(var(--header-h) + 1rem); }
  ::selection { background: var(--wss-accent); color: var(--wss-accent-text); }
  :focus-visible {
    outline: 3px solid var(--wss-accent);
    outline-offset: 3px;
    border-radius: 6px;
  }
  .visually-hidden {
    position: absolute; width: 1px; height: 1px; margin: -1px;
    clip-path: inset(50%); overflow: hidden; white-space: nowrap;
  }
  .skip {
    position: absolute; left: 1rem; top: -100px; z-index: var(--z-drawer);
    background: var(--wss-accent); color: var(--wss-accent-text);
    padding: 0.85rem 1.25rem; border-radius: var(--radius); font-weight: 650;
  }
  .skip:focus { top: 1rem; }
}

@layer layout {
  .shell { width: var(--shell); margin-inline: auto; }
  section { padding-block: clamp(3.5rem, 7vw, 7rem); position: relative; }
  .slab {
    background: var(--wss-slab);
    color: var(--wss-slab-ink);
    --wss-text: var(--wss-slab-ink);
    --ink-soft: color-mix(in oklab, var(--wss-slab-ink), transparent 26%);
  }
  .alt { background: var(--wss-surface-alt); }
  .grain::after {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background-image: url("grain.svg");
    background-size: 220px 220px; opacity: 0.03; mix-blend-mode: overlay;
    z-index: var(--z-raised);
  }
  .section-head { max-width: 42ch; margin-bottom: clamp(2rem, 4vw, 3.25rem); }
  .grid { display: grid; gap: calc(var(--wss-stack-gap) * 1.15); }
  .stack > * + * { margin-top: var(--wss-stack-gap); }
}

@layer components {
  /* ---------- chips, eyebrows ---------- */
  .eyebrow {
    display: inline-flex; align-items: center; gap: 0.5rem;
    font-size: var(--step--1); font-weight: 620; letter-spacing: 0.01em;
    padding: 0.5rem 0.9rem; border-radius: 999px;
    border: var(--hairline);
    background: color-mix(in oklab, var(--wss-surface-alt), transparent 30%);
    backdrop-filter: blur(10px) saturate(1.2);
    margin-bottom: 1.1rem;
  }
  .eyebrow::before {
    content: ""; width: 8px; height: 8px; border-radius: 50%;
    background: var(--wss-accent);
    box-shadow: 0 0 0 4px color-mix(in oklab, var(--wss-accent), transparent 78%);
  }
  /* ---------- buttons: 48px floor everywhere ---------- */
  .btn {
    position: relative; overflow: hidden;
    display: inline-flex; align-items: center; justify-content: center; gap: 0.6rem;
    min-height: 52px; padding: 0.9rem 1.5rem;
    border-radius: var(--radius); border: 2px solid transparent;
    font: inherit; font-size: var(--step-0); font-weight: 680; letter-spacing: -0.01em;
    text-decoration: none; cursor: pointer;
    transition: transform 180ms ease, box-shadow 220ms ease, background-color 180ms ease;
    will-change: transform;
  }
  .btn-primary {
    background: var(--wss-accent); color: var(--wss-accent-text);
    box-shadow: 0 10px 24px color-mix(in oklab, var(--wss-accent), transparent 70%);
  }
  .btn-primary::after {
    content: ""; position: absolute; inset: 0; transform: translateX(-120%);
    background: linear-gradient(100deg, transparent 20%,
      color-mix(in oklab, var(--wss-accent-text), transparent 78%) 50%, transparent 80%);
  }
  .btn-primary:hover::after { transform: translateX(120%); transition: transform 620ms ease; }
  .btn-primary:hover { transform: translateY(-2px); }
  .btn-ghost {
    background: color-mix(in oklab, var(--wss-surface), transparent 20%);
    color: var(--wss-text); border-color: var(--wss-border);
    backdrop-filter: blur(8px);
  }
  .btn-ghost:hover { transform: translateY(-2px); border-color: var(--wss-accent); }
  .btn-row { display: flex; flex-wrap: wrap; gap: 0.85rem; align-items: center; }

  /* ---------- header ---------- */
  .site-header {
    position: sticky; top: 0; z-index: var(--z-header);
    min-height: var(--header-h);
    background: color-mix(in oklab, var(--wss-surface), transparent 8%);
    backdrop-filter: blur(14px) saturate(1.3);
    border-bottom: var(--hairline);
  }
  .header-inner {
    display: flex; align-items: center; gap: clamp(0.6rem, 2vw, 1.5rem);
    min-height: var(--header-h);
  }
  .brand { display: flex; align-items: center; gap: 0.7rem; min-height: 52px; min-width: min(220px, 100%); text-decoration: none; flex: 1 1 auto; }
  /* logo luminance plate — logo never disappears into a same-luminance header */
  .logo-plate {
    display: grid; place-items: center; flex: 0 0 auto;
    width: 46px; height: 46px; padding: 6px; border-radius: 12px;
    background: var(--wss-surface-alt);
    border: var(--hairline);
  }
  .logo-plate img { width: 100%; height: 100%; object-fit: contain; background: none; }
  .brand-text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; line-height: 1.15; }
  .brand-name {
    font-family: "SF Pro Display", "Segoe UI Variable Display", "Helvetica Neue", system-ui, sans-serif; font-weight: 740; font-size: 1.0625rem; letter-spacing: -0.02em;
    min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .brand-locality { font-size: 1rem; color: var(--ink-soft); white-space: nowrap; }
  .header-chips { display: flex; gap: 0.5rem; flex: 0 1 auto; min-width: 0; overflow: hidden; }
  @media (max-width: 1439px) { .header-chips { display: none; } }
@media (max-width: 1599px) { .header-chips .chip:nth-child(n+2) { display: none; } }
  .chip {
    font-size: 1rem; font-weight: 600; padding: 0.4rem 0.7rem; border-radius: 999px;
    border: var(--hairline); background: var(--wss-surface-alt); white-space: nowrap;
    flex: 0 0 auto; max-width: 30ch; overflow: hidden; text-overflow: ellipsis;
  }
  .nav { display: flex; align-items: center; gap: 0.25rem; flex: 0 0 auto; }
  .nav a {
    display: inline-flex; align-items: center; min-height: 48px; padding: 0 0.85rem;
    border-radius: 10px; text-decoration: none; font-size: var(--step--1); font-weight: 600;
  }
  .nav a:hover { background: var(--wss-surface-alt); color: var(--wss-accent-ink); }
  .header-cta { flex: 0 0 auto; }
  .nav-toggle { display: none; font-size: 1rem; }

  /* ---------- hero ---------- */
  .hero { position: relative; isolation: isolate; padding-block: clamp(3rem, 8vw, 6.5rem); overflow: clip; }
  .hero-media { position: absolute; inset: 0; z-index: var(--z-base); }
  .hero-media img, .hero-media video { width: 100%; height: 100%; object-fit: cover; }
  /* scrim with an opacity floor — AA holds against the lightest poster band */
  .hero-scrim {
    position: absolute; inset: 0; z-index: var(--z-scrim);
    background:
      linear-gradient(100deg,
        color-mix(in oklab, var(--wss-slab), transparent 8%) 0%,
        color-mix(in oklab, var(--wss-slab), transparent 22%) 46%,
        color-mix(in oklab, var(--wss-slab), transparent 46%) 100%),
      radial-gradient(120% 90% at 12% 18%,
        color-mix(in oklab, var(--wss-accent), transparent 84%) 0%, transparent 60%);
  }
  .hero-inner { position: relative; z-index: calc(var(--z-scrim) + 1); }
  .hero-grid {
    display: grid; gap: clamp(2rem, 4vw, 3.5rem);
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    align-items: center;
  }
  .hero h1 {
    font-size: var(--step-4);
    max-width: 20ch;
    text-wrap: balance;
    letter-spacing: -0.04em;
  }
  /* THE .text-gradient LAW: accent line is painted from --wss-accent and
     NEVER uses -webkit-text-fill-color: transparent. Flat accent is the
     rendered color; the sheen is a background wash behind the glyphs. */
  .accent-line {
    color: var(--wss-accent);
    position: relative; display: inline-block;
    padding-inline: 0.06em;
    background-image: linear-gradient(100deg,
      color-mix(in oklab, var(--wss-accent), transparent 82%),
      color-mix(in oklab, var(--wss-accent), transparent 94%));
    background-repeat: no-repeat;
    background-size: 100% 0.42em; background-position: 0 88%;
  }
  .hero.on-slab .accent-line { color: color-mix(in oklab, var(--wss-accent), white 14%); }
  .accent-line::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -0.06em; height: 0.09em;
    background: var(--wss-accent); transform-origin: left center; transform: scaleX(var(--wipe, 1));
    border-radius: 2px;
  }
  .hero-lede { font-size: var(--step-1); max-width: 46ch; color: var(--wss-slab-ink); opacity: 0.94; }
  .hero.on-slab, .hero.on-slab :is(h1, p) { color: var(--wss-slab-ink); }
  .hero-visual {
    border-radius: var(--radius-lg); overflow: hidden; border: var(--hairline);
    box-shadow: var(--shadow-lift); aspect-ratio: 4 / 5;
  }
  .hero-visual img { width: 100%; height: 100%; object-fit: cover; }
  .hero-safe { max-width: 40rem; } /* copy stays out of the center-safe video zone */

  /* ---------- stats ---------- */
  .stat-strip {
    display: grid; gap: var(--wss-stack-gap);
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    margin-top: clamp(2rem, 4vw, 3rem);
  }
  .stat {
    padding: var(--wss-card-pad); border-radius: var(--radius);
    background: color-mix(in oklab, var(--wss-surface), transparent 6%);
    border: var(--hairline); box-shadow: var(--shadow-card); color: var(--wss-text);
  }
  .stat b {
    display: block; font-family: "SF Pro Display", "Segoe UI Variable Display", "Helvetica Neue", system-ui, sans-serif; font-size: var(--step-3);
    letter-spacing: -0.03em; color: var(--wss-accent-ink); line-height: 1;
  }
  .stat span { font-size: var(--wss-card-body-size); color: var(--ink-soft); }

  /* ---------- ticker ---------- */
  .ticker { border-block: var(--hairline); background: var(--wss-surface-alt); padding-block: 0.9rem; overflow: hidden; }
  .ticker-track { display: flex; gap: 2.5rem; width: max-content; animation: marquee 38s linear infinite; }
  .ticker-track span { display: inline-flex; align-items: center; gap: 0.75rem; font-size: var(--step--1); font-weight: 620; white-space: nowrap; }
  .ticker-track span::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--wss-accent); }
  @keyframes marquee { to { transform: translateX(-50%); } }

  /* ---------- bento services ---------- */
  .bento { display: grid; gap: calc(var(--wss-stack-gap) * 1.05); grid-template-columns: repeat(6, 1fr); }
  .card {
    grid-column: span 2;
    position: relative; overflow: hidden;
    padding: var(--wss-card-pad); border-radius: var(--radius-lg);
    background: var(--wss-surface); border: var(--hairline);
    box-shadow: var(--shadow-card);
    transition: transform 220ms ease, box-shadow 260ms ease, border-color 220ms ease;
  }
  .card::before {
    content: ""; position: absolute; inset-inline: 0; top: 0; height: 3px;
    background: linear-gradient(90deg, var(--wss-accent),
      color-mix(in oklab, var(--wss-accent), white 30%));
    transform: scaleX(0); transform-origin: left; transition: transform 320ms ease;
  }
  .card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lift); border-color: color-mix(in oklab, var(--wss-accent), transparent 55%); }
  .card:hover::before { transform: scaleX(1); }
  .card p { font-size: var(--wss-card-body-size); color: var(--ink-soft); margin-bottom: 0; }
  .card-wide { grid-column: span 3; }
  .card-icon {
    width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center;
    background: color-mix(in oklab, var(--wss-accent), transparent 86%);
    color: var(--wss-accent-ink); margin-bottom: 1rem; font-weight: 800;
  }
  .card-link {
    display: inline-flex; align-items: center; min-height: 48px; gap: 0.4rem;
    color: var(--wss-accent-ink); font-weight: 650; text-decoration: none; margin-top: 0.5rem;
  }
  .card-link:hover { text-decoration: underline; text-underline-offset: 4px; }

  /* ---------- gallery ---------- */
  .gallery { display: grid; gap: var(--wss-stack-gap); grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
  .gallery figure { margin: 0; border-radius: var(--radius); overflow: hidden; border: var(--hairline); background: var(--wss-surface-alt); box-shadow: var(--shadow-card); }
  .gallery img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
  .gallery figcaption { padding: 0.85rem var(--wss-card-pad); font-size: var(--wss-card-body-size); color: var(--ink-soft); }

  /* ---------- process ---------- */
  .rail { display: grid; gap: calc(var(--wss-stack-gap) * 1.2); grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); counter-reset: step; }
  .rail li { list-style: none; position: relative; padding-top: 3.25rem; }
  .rail li::before {
    counter-increment: step; content: counter(step, decimal-leading-zero);
    position: absolute; top: -0.35rem; left: 0;
    font-family: "SF Pro Display", "Segoe UI Variable Display", "Helvetica Neue", system-ui, sans-serif; font-size: clamp(2.75rem, 5vw, 4rem); line-height: 1;
    color: color-mix(in oklab, var(--wss-accent), transparent 62%); letter-spacing: -0.05em;
  }

  /* ---------- reviews ---------- */
  .reviews { display: grid; gap: calc(var(--wss-stack-gap) * 1.1); grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
  .review { padding: var(--wss-card-pad); border-radius: var(--radius-lg); background: var(--wss-surface); border: var(--hairline); box-shadow: var(--shadow-card); }
  .review blockquote { margin: 0 0 1rem; font-size: var(--wss-card-body-size); }
  .review-who { display: flex; align-items: center; gap: 0.75rem; }
  .avatar {
    width: 44px; height: 44px; border-radius: 50%; flex: 0 0 auto; display: grid; place-items: center;
    background: color-mix(in oklab, var(--wss-accent), transparent 80%);
    color: var(--wss-accent-ink); font-weight: 760;
  }
  .stars { color: var(--wss-accent-ink); letter-spacing: 0.12em; font-size: 1rem; }

  /* ---------- partners ---------- */
  .partners { display: flex; flex-wrap: wrap; gap: 0.75rem; }
  .partners span {
    padding: 0.7rem 1.1rem; border-radius: 999px; border: var(--hairline);
    background: var(--wss-surface-alt); font-size: var(--step--1); font-weight: 620;
  }

  /* ---------- faq ---------- */
  .faq { display: grid; gap: 0.75rem; max-width: 62rem; }
  .faq details {
    border: var(--hairline); border-radius: var(--radius); background: var(--wss-surface);
    padding: 0.35rem var(--wss-card-pad);
  }
  .faq summary {
    display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    min-height: 56px; cursor: pointer; font-weight: 660; font-size: var(--step-0); list-style: none;
  }
  .faq summary::-webkit-details-marker { display: none; }
  .faq summary::after { content: "+"; color: var(--wss-accent-ink); font-size: 1.5rem; line-height: 1; }
  .faq details[open] summary::after { content: "\2212"; }
  .faq p { font-size: var(--wss-card-body-size); color: var(--ink-soft); }

  /* ---------- final cta ---------- */
  .cta-panel {
    border-radius: var(--radius-lg); padding: clamp(2rem, 5vw, 4rem);
    background:
      radial-gradient(90% 130% at 88% 8%, color-mix(in oklab, var(--wss-accent), transparent 74%) 0%, transparent 62%),
      var(--wss-slab);
    color: var(--wss-slab-ink); border: var(--hairline);
  }
  .cta-panel h2, .cta-panel p { color: var(--wss-slab-ink); }

  /* ---------- footer ---------- */
  .site-footer { background: var(--wss-slab); color: var(--wss-slab-ink); padding-block: clamp(3rem, 6vw, 4.5rem) 2rem; }
  .footer-grid { display: grid; gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
  .site-footer a { color: var(--wss-slab-ink); text-decoration: none; display: inline-flex; align-items: center; min-height: 48px; }
  .site-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }
  .site-footer h3 { font-size: 1.0625rem; letter-spacing: 0.01em; }
  .footer-bottom {
    margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid color-mix(in oklab, var(--wss-slab-ink), transparent 82%);
    display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between;
    font-size: var(--step--1); opacity: 0.85;
  }

  /* ---------- floater: exactly one, one z-index ---------- */
  .floater {
    position: fixed; right: 1rem; bottom: 1rem; z-index: var(--z-floater);
    display: inline-flex; align-items: center; gap: 0.55rem;
    min-height: 52px; padding: 0.85rem 1.35rem; border-radius: 999px;
    background: var(--wss-accent); color: var(--wss-accent-text);
    font-weight: 700; text-decoration: none;
    box-shadow: 0 12px 30px color-mix(in oklab, var(--wss-text), transparent 70%);
  }
}

@layer motion {
  .reveal { opacity: 1; transform: none; }
  .js .reveal { opacity: 1; transform: none; }
  /* FIRST-IMPRESSION LAW (2026-09-04 robustness lane): the hidden state
     is progressive enhancement. It exists ONLY while the root gate
     (html.js-reveal-armed) is present — set by the reveal script
     immediately before observation. A page whose JS never ran, or died
     before arming, keeps every section visible: content is never hidden
     as its pre-JS state. */
  html.js-reveal-armed .reveal:not(.in) { opacity: 0; transform: translateY(18px); }
  .js .reveal.in { opacity: 1; transform: none; transition: opacity 620ms ease, transform 620ms cubic-bezier(.22,.61,.36,1); }
  .js .hero-word { display: inline-block; opacity: 0; transform: translateY(0.5em); animation: rise 700ms cubic-bezier(.22,.61,.36,1) forwards; animation-delay: var(--d, 0ms); }
  @keyframes rise { to { opacity: 1; transform: none; } }
  .js .accent-line::after { --wipe: 0; animation: wipe 800ms cubic-bezier(.22,.61,.36,1) 520ms forwards; }
  @keyframes wipe { to { --wipe: 1; } }
  @property --wipe { syntax: "<number>"; inherits: true; initial-value: 1; }
  @media (prefers-reduced-motion: reduce) {
    .js .reveal, .js .hero-word { opacity: 1 !important; transform: none !important; animation: none !important; transition: none !important; }
    .ticker-track { animation: none; }
    .js .accent-line::after { animation: none; --wipe: 1; }
    .btn, .card { transition: none !important; }
  }
}

@layer responsive {
  @media (max-width: 1023px) {
    .nav {
      position: fixed; inset: var(--header-h) 0 auto 0; z-index: var(--z-drawer);
      flex-direction: column; align-items: stretch; gap: 0;
      background: var(--wss-surface); border-bottom: var(--hairline);
      padding: 0.5rem 1.25rem 1.25rem; display: none;
    }
    .nav a { min-height: 52px; font-size: var(--step-0); }
    .nav-open .nav { display: flex; }
    .nav-toggle {
      font-size: 1rem;
      display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
      min-height: 48px; min-width: 48px; padding: 0 0.9rem; border-radius: 12px;
      border: var(--hairline); background: var(--wss-surface-alt); color: var(--wss-text);
      font: inherit; font-size: var(--step--1); font-weight: 640; cursor: pointer;
    }
    .header-chips { display: none; }
    .hero-grid { grid-template-columns: 1fr; }
    .hero-visual { aspect-ratio: 16 / 10; }
    .card, .card-wide { grid-column: span 3; }
  }
  @media (max-width: 700px) {
    .card, .card-wide { grid-column: 1 / -1; }
    .bento { grid-template-columns: 1fr; }
  }
  @media (max-width: 479px) {
    .brand-locality { display: none; }
    .header-cta { display: none; }   /* no collision with the hamburger */
    .btn-row .btn-primary, .btn-row .btn-ghost { width: 100%; }
    .floater { left: 1rem; right: 1rem; justify-content: center; }
    .hero h1 { letter-spacing: -0.03em; }
  }
  @media (min-width: 1024px) { .nav-toggle { display: none; } }
  @media print { .site-header, .floater, .ticker { display: none; } }
}


/* ==================================================================
   PROMPT A — conversion surfaces. Palette law holds: every brand-bearing
   value is var(--wss-*); nothing here hardcodes a brand color.
   ================================================================== */
@layer components {
  /* --- trust strip ------------------------------------------------ */
  .trust-strip { padding: 1.5rem 0; background: var(--wss-surface-alt); border-block: var(--hairline); }
  .badge-rail { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1rem 1.5rem; list-style: none; margin: 0; padding: 0; }
  .badge { display: flex; gap: .65rem; align-items: flex-start; font-size: .95rem; line-height: 1.35; color: var(--ink-soft); }
  .badge strong { color: var(--wss-text); font-size: 1rem; }
  .badge-mark { display: grid; place-items: center; flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%;
    background: color-mix(in oklab, var(--wss-accent), transparent 86%); color: var(--wss-accent-ink); font-size: .95rem; }

  /* --- before / after slider -------------------------------------- */
  .ba { margin: 0; }
  .ba-stage { position: relative; overflow: hidden; border-radius: var(--radius-lg); border: var(--hairline);
    box-shadow: var(--shadow-card); background: var(--wss-surface-alt); touch-action: pan-y; user-select: none; }
  .ba-img { display: block; width: 100%; height: auto; }
  .ba-clip { position: absolute; inset: 0; width: var(--ba-pos, 50%); overflow: hidden; }
  .ba-clip .ba-img { width: calc(100% * 100 / var(--ba-num, 50)); max-width: none; }
  .ba-tag { position: absolute; top: 1rem; z-index: var(--z-raised); padding: .35rem .7rem; border-radius: 999px;
    font-size: 1rem; letter-spacing: .04em; text-transform: uppercase; background: color-mix(in oklab, var(--wss-slab), transparent 15%); color: var(--wss-slab-ink); }
  .ba-tag-l { left: 1rem; } .ba-tag-r { right: 1rem; background: var(--wss-accent); color: var(--wss-accent-text); }
  .ba-handle { position: absolute; top: 0; bottom: 0; left: var(--ba-pos, 50%); width: 3px; margin-left: -1.5px;
    background: var(--wss-accent-text); box-shadow: 0 0 0 1px color-mix(in oklab, var(--wss-slab), transparent 60%); z-index: var(--z-raised); }
  .ba-grip { position: absolute; top: 50%; left: 50%; translate: -50% -50%; display: grid; place-items: center;
    width: 46px; height: 46px; border-radius: 50%; background: var(--wss-accent); color: var(--wss-accent-text); font-size: 1.1rem; }
  .ba-control { display: block; margin-top: 1rem; }
  .ba-range { -webkit-appearance: none; appearance: none; width: 100%; height: 48px; background: transparent; cursor: ew-resize; }
  .ba-range::-webkit-slider-runnable-track { height: 8px; border-radius: 999px; background: color-mix(in oklab, var(--wss-accent), transparent 78%); }
  .ba-range::-moz-range-track { height: 8px; border-radius: 999px; background: color-mix(in oklab, var(--wss-accent), transparent 78%); }
  .ba-range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 30px; height: 30px; margin-top: -11px; border-radius: 50%;
    background: var(--wss-accent); border: 3px solid var(--wss-surface); box-shadow: var(--shadow-card); }
  .ba-range::-moz-range-thumb { width: 30px; height: 30px; border-radius: 50%; background: var(--wss-accent); border: 3px solid var(--wss-surface); }
  .ba-range:focus-visible { outline: 3px solid var(--wss-accent-ink); outline-offset: 4px; }
  .ba-caption { margin-top: .85rem; font-size: .95rem; color: var(--ink-soft); max-width: var(--measure); }
  .no-js .ba-clip { position: static; width: auto; }
  .no-js .ba-clip .ba-img { width: 100%; }
  .no-js .ba-stage { display: grid; gap: .5rem; }
  .no-js .ba-handle, .no-js .ba-control { display: none; }

  /* --- offer band -------------------------------------------------- */
  .offer-grid { display: grid; gap: 2rem; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: start; }
  .chip-row { display: flex; flex-wrap: wrap; gap: .55rem; list-style: none; margin: 1.25rem 0 0; padding: 0; }
  .chip { padding: .45rem .85rem; border-radius: 999px; font-size: .95rem; color: inherit;
    background: color-mix(in oklab, currentColor, transparent 92%); border: 1px solid color-mix(in oklab, currentColor, transparent 65%); }
  .capacity { padding: var(--wss-card-pad); border-radius: var(--radius-lg); background: color-mix(in oklab, var(--wss-slab-ink), transparent 88%); border: 1px solid color-mix(in oklab, var(--wss-slab-ink), transparent 78%); }
  .capacity-line { font-size: 1.1rem; margin: .35rem 0 .5rem; }
  .capacity .btn-ghost { background: transparent; color: var(--wss-slab-ink); border: 1px solid color-mix(in oklab, var(--wss-slab-ink), transparent 55%); }
  .capacity .btn-ghost:hover { background: var(--wss-accent); color: var(--wss-accent-text); border-color: var(--wss-accent); }
  .capacity-note { font-size: .95rem; opacity: .82; }

  /* --- service x city ---------------------------------------------- */
  .areas-grid { display: grid; gap: .85rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
  .area-cell { display: grid; gap: .2rem; padding: 1rem 1.15rem; min-height: 68px; align-content: center; border-radius: var(--radius);
    border: var(--hairline); background: var(--wss-surface); color: inherit; text-decoration: none; transition: border-color .18s ease, transform .18s ease; }
  .area-cell span { font-size: .92rem; color: var(--ink-soft); }
  .area-cell:hover { border-color: var(--wss-accent); transform: translateY(-2px); }

  /* --- rating chips ------------------------------------------------ */
  .rating-chips { display: flex; flex-wrap: wrap; gap: .6rem; list-style: none; margin: 0 0 1.5rem; padding: 0; }
  .rating-chip { display: flex; align-items: center; gap: .45rem; min-height: 44px; padding: .5rem .9rem; border-radius: 999px;
    border: var(--hairline); background: var(--wss-surface-alt); font-size: .95rem; }
  .rating-chip a { min-height: 44px; display: flex; align-items: center; color: var(--wss-accent-ink); }
  .rating-num { font-weight: 700; font-size: 1.05rem; color: var(--wss-accent-ink); }
  .rating-stars { color: var(--wss-accent); letter-spacing: .06em; }

  /* --- gallery thumbs become lightbox triggers ---------------------- */
  .shot { display: block; position: relative; border-radius: var(--radius); overflow: hidden; color: inherit; text-decoration: none; }
  .shot img { display: block; width: 100%; height: auto; }
  .shot::after { content: "\002B"; position: absolute; right: .6rem; bottom: .6rem; display: grid; place-items: center;
    width: 34px; height: 34px; border-radius: 50%; background: var(--wss-accent); color: var(--wss-accent-text);
    font-size: 1rem; opacity: 0; transform: translateY(6px); transition: opacity .18s ease, transform .18s ease; }
  .shot:hover::after, .shot:focus-visible::after { opacity: 1; transform: none; }
  .shot:focus-visible { outline: 3px solid var(--wss-accent); outline-offset: 3px; }

  /* --- lightbox ----------------------------------------------------- */
  .lightbox[hidden] { display: none; }
  .lightbox { position: fixed; inset: 0; z-index: var(--z-drawer); display: grid; place-items: center; padding: clamp(.75rem, 3vw, 2rem); }
  .lb-scrim { position: absolute; inset: 0; background: color-mix(in oklab, var(--wss-slab), transparent 8%); }
  .lb-frame { position: relative; width: min(1100px, 100%); max-height: 92dvh; display: grid; }
  .lb-figure { margin: 0; display: grid; gap: .75rem; justify-items: center; }
  .lb-img { max-width: 100%; max-height: 74dvh; width: auto; height: auto; border-radius: var(--radius); background: var(--wss-surface-alt); }
  .lb-caption { color: var(--wss-slab-ink); font-size: 1rem; text-align: center; max-width: 62ch; }
  .lb-count { opacity: .7; margin-left: .4rem; }
  .lb-btn { position: absolute; z-index: var(--z-raised); display: grid; place-items: center; width: 48px; height: 48px;
    border-radius: 50%; border: 1px solid color-mix(in oklab, var(--wss-slab-ink), transparent 70%);
    background: color-mix(in oklab, var(--wss-slab), transparent 25%); color: var(--wss-slab-ink); font-size: 1.4rem; cursor: pointer; }
  .lb-btn:hover, .lb-btn:focus-visible { background: var(--wss-accent); color: var(--wss-accent-text); }
  .lb-close { top: -4px; right: 0; }
  .lb-prev { left: 0; top: 50%; translate: 0 -50%; }
  .lb-next { right: 0; top: 50%; translate: 0 -50%; }
  html.lb-open, html.lb-open body { overflow: hidden; }
}

@layer responsive {
  @media (max-width: 900px) {
    .offer-grid { grid-template-columns: 1fr; }
  }
  @media (max-width: 620px) {
    .lb-close { top: 0; right: 0; }
    .lb-prev { left: 0; } .lb-next { right: 0; }
    .lb-img { max-height: 62dvh; }
    .ba-tag { font-size: .95rem; }
  }
  @media (prefers-reduced-motion: reduce) {
    .area-cell, .shot::after { transition: none; }
  }
}

/* wss-logo-identity: the deterministic fallback is a wordmark, never an avatar. */img[src*="brand-logo"]{width:auto!important;height:auto!important;max-width:min(13rem,45vw)!important;max-height:3.25rem!important;object-fit:contain!important;border-radius:0.375rem!important;border-color:transparent!important}

/* WSS mirror theme — light by default, built from the client's own colours. */
:root,[data-wss-theme="light"]{--wss-surface:#FCFDFD;--wss-surface-alt:#EFF3F6;--wss-text:#1B2A32;--wss-muted:#5E727D;--wss-border:#DDE5E9;--wss-slab:#F1F6F8;--wss-slab-ink:#1C2D36;--wss-slab-muted:#5A707C;--wss-accent:#0881C1;--wss-accent-hsl:201 92% 39%;--wss-accent-hover:#065E8E;--wss-accent-ink:#0B0B0C;--wss-accent-text:#0878B5;--wss-accent-on-slab:#0772AB;--wss-accent-soft:#066598;--accent-soft:#066598;--background:#FCFDFD;--foreground:#1B2A32;--card:#EFF3F6;--card-foreground:#1B2A32;--popover:#EFF3F6;--popover-foreground:#1B2A32;--muted-foreground:#5E727D;--border:#DDE5E9;--input:#DDE5E9;--primary:#1B2A32;--accent:#0881C1;--accent-foreground:#0B0B0C;--ring:#0881C1;--primary-foreground:#1C2D36;--sidebar-background:#FCFDFD;--sidebar-foreground:#1B2A32;--sidebar-primary:#0881C1;--sidebar-primary-foreground:#0B0B0C;--sidebar-accent:#F1F6F8;--sidebar-accent-foreground:#1C2D36;--sidebar-border:#DDE5E9;--sidebar-ring:#0881C1;color-scheme:light}
[data-wss-theme="dark"],:root.dark{--wss-surface:#101619;--wss-surface-alt:#182125;--wss-text:#F4F5F6;--wss-muted:#AEBBC2;--wss-border:#2E3B42;--wss-slab:#182125;--wss-slab-ink:#F4F5F6;--wss-slab-muted:#ACBBC3;--wss-accent:#0881C1;--wss-accent-hsl:201 92% 39%;--wss-accent-hover:#066598;--wss-accent-ink:#0B0B0C;--wss-accent-text:#0885C9;--wss-accent-on-slab:#0992DC;--wss-accent-soft:#0A9FF0;--accent-soft:#0A9FF0;--background:#101619;--foreground:#F4F5F6;--card:#182125;--card-foreground:#F4F5F6;--popover:#182125;--popover-foreground:#F4F5F6;--muted-foreground:#AEBBC2;--border:#2E3B42;--input:#2E3B42;--primary:#F4F5F6;--accent:#0881C1;--accent-foreground:#0B0B0C;--ring:#0881C1;--primary-foreground:#F4F5F6;--sidebar-background:#101619;--sidebar-foreground:#F4F5F6;--sidebar-primary:#0881C1;--sidebar-primary-foreground:#0B0B0C;--sidebar-accent:#182125;--sidebar-accent-foreground:#F4F5F6;--sidebar-border:#2E3B42;--sidebar-ring:#0881C1;color-scheme:dark}
html,body{background-color:var(--wss-surface);color:var(--wss-text)}
:root{--wss-hero-scrim:#182125;--gradient-hero:linear-gradient(115deg,color-mix(in srgb,var(--wss-hero-scrim) 92%,transparent) 0%,color-mix(in srgb,var(--wss-hero-scrim) 78%,transparent) 45%,color-mix(in srgb,var(--wss-accent) 22%,transparent) 100%);--gradient-primary:linear-gradient(135deg,var(--wss-slab) 0%,color-mix(in srgb,var(--wss-slab) 84%,var(--wss-accent)) 100%);--gradient-accent:linear-gradient(135deg,var(--wss-accent) 0%,var(--wss-accent-hover) 100%);--gradient-subtle:linear-gradient(180deg,var(--wss-surface) 0%,var(--wss-slab) 100%)}
:root{--gradient-mesh:radial-gradient(at 18% 18%,color-mix(in srgb,var(--wss-accent) 14%,transparent) 0px,transparent 45%),radial-gradient(at 82% 12%,color-mix(in srgb,var(--wss-accent-hover) 10%,transparent) 0px,transparent 50%),radial-gradient(at 65% 88%,color-mix(in srgb,var(--wss-accent) 10%,transparent) 0px,transparent 45%)}
.text-accent{color:var(--wss-accent-soft)!important}
.text-gradient-warm{background-image:linear-gradient(135deg,var(--wss-slab-ink),color-mix(in srgb,var(--wss-accent-soft) 60%,var(--wss-slab-ink)),var(--wss-accent-soft))!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important}
.wss-theme-toggle{position:fixed;top:14px;right:14px;z-index:2147483000;display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;border:1px solid var(--wss-border);background:var(--wss-surface-alt);color:var(--wss-text);font:600 12px/1 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.10)}
.wss-theme-toggle:hover{border-color:var(--wss-accent)}
.wss-theme-toggle svg{width:14px;height:14px;display:block}
@media print{.wss-theme-toggle{display:none}}
@media (max-width:640px){nav a,nav button,footer a,footer button{min-height:44px;display:inline-flex;align-items:center}}

/* wss-button-ink: label chosen by contrast against EACH mode's own fill, scoped per mode (attr + .dark class twin) so neither mode wears the other's ink. */:root:not([data-wss-theme="dark"]):not(.dark) .bg-primary,:root:not([data-wss-theme="dark"]):not(.dark) .bg-primary *,:root:not([data-wss-theme="dark"]):not(.dark) [class*="bg-primary"]:not([class*="bg-primary/"]){color:hsl(0 0% 98%)!important}[data-wss-theme="dark"] .bg-primary,[data-wss-theme="dark"] .bg-primary *,[data-wss-theme="dark"] [class*="bg-primary"]:not([class*="bg-primary/"]),:root.dark .bg-primary,:root.dark .bg-primary *,:root.dark [class*="bg-primary"]:not([class*="bg-primary/"]){color:hsl(240 6% 10%)!important}:root:not([data-wss-theme="dark"]):not(.dark) .bg-accent,:root:not([data-wss-theme="dark"]):not(.dark) .bg-accent *,:root:not([data-wss-theme="dark"]):not(.dark) .bg-gradient-accent,:root:not([data-wss-theme="dark"]):not(.dark) .bg-gradient-accent *{color:hsl(0 0% 98%)!important}[data-wss-theme="dark"] .bg-accent,[data-wss-theme="dark"] .bg-accent *,[data-wss-theme="dark"] .bg-gradient-accent,[data-wss-theme="dark"] .bg-gradient-accent *,:root.dark .bg-accent,:root.dark .bg-accent *,:root.dark .bg-gradient-accent,:root.dark .bg-gradient-accent *{color:hsl(0 0% 98%)!important}
/* === wss component variants (component-variants@v1) === */
/* wss hero variant: full-bleed with overlay text */
html[data-wss-variant="full-bleed-overlay"] :is(section.hero){min-height:min(92vh,52rem)!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;padding:clamp(3rem,8vh,5rem) max(1.25rem,env(safe-area-inset-right))!important}
html[data-wss-variant="full-bleed-overlay"] :is(section.hero) h1{max-width:22ch;margin-inline:auto!important;font-size:clamp(2.6rem,6.5vw,4.5rem)}
@media (max-width:768px){html[data-wss-variant="full-bleed-overlay"] :is(section.hero){min-height:max(56vh,24rem)!important;padding-block:clamp(2.5rem,10vw,4rem)!important}}
/* wss cta treatment: slab block */
html[data-wss-cta="slab-block"] :is(a[class*="cta" i],button[class*="cta" i],[data-cta],a[class*="btn" i],button[class*="btn" i],a[class*="button" i],button[class*="button" i],a.btn,a.button){border-radius:.45rem!important;padding:.9em 1.5em!important;background:var(--wss-slab,inherit)!important;color:var(--wss-slab-ink,inherit)!important;border-color:transparent!important;border-top:4px solid var(--wss-accent,transparent)!important}
section[data-wss-section="services"]{display:flex!important;flex-direction:column!important;gap:1rem}
section[data-wss-section="services"]>*{border-left:3px solid var(--wss-accent,transparent);padding-left:1.25rem}
section[data-wss-section="about"]{border-top:4px solid var(--wss-accent,transparent);padding-top:1.5rem}
section[data-wss-section="about"] :is(strong,b){font-size:1.35em;line-height:1.1;display:inline-block}
section[data-wss-section="gallery"]{display:flex!important;gap:.75rem;overflow-x:auto;scroll-snap-type:x mandatory}
section[data-wss-section="gallery"]>*{flex:0 0 auto;scroll-snap-align:start;max-width:min(28rem,80vw)}
section[data-wss-section="testimonials"]>*{border:1px solid var(--wss-border,transparent);border-radius:.9rem;padding:1.25rem;margin-bottom:1rem;background:var(--wss-surface-alt,transparent)}
section[data-wss-section="contact"]{background:var(--wss-slab,transparent);color:var(--wss-slab-ink,inherit);text-align:center;padding-block:clamp(2.5rem,6vw,4rem)}
@media (min-width:800px){section[data-wss-section="footer"]{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(12rem,100%),1fr));gap:2rem}}
/* wss typography scale: condensed-tall — Condensed / tall */
html[data-wss-type-scale="condensed-tall"]{--wss-h1-size:clamp(2.75rem, 7vw, 4.75rem);--wss-h2-size:clamp(1.9rem, 4vw, 2.9rem);--wss-h3-size:clamp(1.35rem, 2.6vw, 1.85rem)}
html[data-wss-type-scale="condensed-tall"] h1{font-size:var(--wss-h1-size)!important;letter-spacing:-0.025em!important;line-height:0.98!important}
html[data-wss-type-scale="condensed-tall"] h2{font-size:var(--wss-h2-size)!important;letter-spacing:calc(-0.025em / 2)!important;line-height:calc(0.98 + 0.08)!important}
html[data-wss-type-scale="condensed-tall"] h3{font-size:var(--wss-h3-size)!important;line-height:calc(0.98 + 0.14)!important}

/* --- client hero wash (wss photo bank) ------------------------------
   Their own photograph behind every page hero, under a scrim in their
   accent at 0.8704 alpha. That alpha is not a taste call: it is the smallest
   opacity for which the WORST possible photograph still leaves the hero
   text at 4.61:1, against a 4.5:1 requirement.
   Remove this block to revert; no donor rule was edited. */
:is(section.hero) {
  background-image: linear-gradient(rgba(11, 35, 56, 0.8704), rgba(11, 35, 56, 0.8704)), url("/assets/hero-wash.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
@media (prefers-reduced-motion: no-preference) {
  :is(section.hero) { background-attachment: scroll; }
}
@media (max-width: 640px) {
  :is(section.hero) {
    background-image: linear-gradient(to bottom, rgba(11, 35, 56, 0.8704) 0%, rgba(11, 35, 56, 0.8704) 38%, rgba(11, 35, 56, 0.2611) 100%), url("/assets/hero-wash.png");
  }
}

/* --- wss hero ink (the pair to the dark cinematic scrim) --------------
   Solid headline + one-step-dimmer sub-line/reviews line, both PROVEN
   against the scrim's worst case. -webkit-text-fill-color because a
   gradient-text donor sets it transparent and ignores color; opacity:1
   because a 60%-tinted reviews line is transparent text over a scrim. */
:is(section.hero) h1, :is(section.hero) h1 * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
}
:is(section.hero) h1 + p, :is(section.hero) h1 + p * {
  color: #e8edf2 !important;
  -webkit-text-fill-color: #e8edf2 !important;
  opacity: 1 !important;
}

/* --- wss HVAC outline hero-call: proven ink on dark wash -------- */
:is(section.hero) [data-cta="hero-call"] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: color-mix(in srgb, #ffffff 40%, transparent) !important;
}


/* --- wss mobile fold (owner spec 2026-08-12): name/logo, ONE line,
   rating stars, call button — the rest scrolls. Desktop untouched. */
@media (max-width: 640px) {
  :is(section.hero) :is(p, ul, dl, aside) { display: none !important; }
  :is(section.hero) div:has(> dl) { display: none !important; }
  :is(section.hero) > div { padding-top: 16px !important; padding-bottom: 28px !important; gap: 12px !important; }
  :is(section.hero) > div > div:not(:has(h1)) { display: none !important; }
  :is(section.hero) h1 br, :is(section.hero) h1 br ~ * { display: none !important; }
  :is(section.hero) h1 { font-size: clamp(26px, 8vw, 34px) !important; line-height: 1.15 !important; margin-top: 12px !important; }
  [data-cta="dock-call"], [data-cta="dock-quote"] { box-sizing: border-box !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; overflow: hidden !important; padding-left: 8px !important; padding-right: 8px !important; gap: 6px !important; }
  [data-cta="dock-call"] > span, [data-cta="dock-quote"] > span { min-width: 0 !important; max-width: 100% !important; }
  [data-cta="dock-call"] > span:last-child, [data-cta="dock-quote"] > span:first-child { flex: 1 1 auto !important; overflow: hidden !important; }
  [data-cta="dock-call"] > span:last-child > span:first-child, [data-cta="dock-quote"] > span:first-child > span:first-child { max-width: 100% !important; overflow: hidden !important; letter-spacing: .11em !important; white-space: nowrap !important; }
  [data-cta="dock-call"] > span:last-child > span:last-child, [data-cta="dock-quote"] > span:first-child > span:last-child { display: block !important; max-width: 100% !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; font-size: clamp(12px, 3.35vw, 15px) !important; }
  [data-cta="dock-quote"] > svg { flex: 0 0 auto !important; width: 14px !important; height: 14px !important; }
  :is(section.hero) { overflow-x: clip !important; }
  html, body { box-sizing: border-box !important; max-width: 100% !important; overflow-x: clip !important; }
  .mask-fade-edges { min-width: 0 !important; max-width: 100% !important; overflow: hidden !important; }
  .animate-marquee { animation: none !important; transform: none !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; gap: 0 !important; }
  .animate-marquee > * { display: none !important; }
  .animate-marquee > :first-child { display: flex !important; min-width: 0 !important; max-width: 100% !important; overflow: hidden !important; }
  .animate-marquee > :first-child > * { min-width: 0 !important; }
  .animate-marquee > :first-child > :nth-child(2) { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
  :is(section.hero) [data-cta="hero-quote"] { display: none !important; }
}


/* wss: hide donor giant faint section-number watermark */
.text-\[120px\]{display:none!important}


/* wss: keep the theme toggle off the mobile header (owner) */
@media (max-width:640px){.wss-theme-toggle{top:auto!important;bottom:calc(86px + env(safe-area-inset-bottom))!important;right:auto!important;left:12px!important;}}