:root{
    --black:#000000;
    --charcoal:#1A1A1A;
    --charcoal-2:#2A2A2A;
    --mid:#444444;
    --white:#FFFFFF;
    --maroon:#7B2027;
    --maroon-hover:#5C1619;
    --steel:#3D6B7A;
    --rule:#2E2E2E;
    --body-dark:#D4D4D4;
    --body-light:#333333;
    --gold:#E0A93A;
    --shadow:0 12px 32px rgba(0,0,0,0.12);
    --display:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --header-h:108px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth;scroll-padding-top:120px}
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
  body{
    font-family:var(--body);
    color:var(--body-light);
    background:var(--black);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{max-width:100%;display:block}
  a{color:inherit;text-decoration:none}
  h1,h2,h3{font-family:var(--display);letter-spacing:-0.02em;line-height:1.1}

  /* ---------- Accessibility ---------- */
  a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
  textarea:focus-visible,.card:focus-visible,[tabindex]:focus-visible{
    outline:2px solid var(--maroon);
    outline-offset:3px;
  }
  .scrolled a:focus-visible,header a:focus-visible{outline-color:#fff}
  .skip-link{
    position:absolute;left:-999px;top:0;z-index:2000;background:var(--maroon);
    color:#fff;padding:12px 20px;font-family:var(--display);font-weight:600;border-radius:0 0 4px 0;
  }
  .skip-link:focus{left:0}

  .container{width:100%;max-width:1240px;margin:0 auto;padding:0 28px}
  .overline{
    font-family:var(--display);font-weight:600;text-transform:uppercase;
    letter-spacing:0.2em;font-size:13px;color:var(--maroon);display:inline-block;
  }
  /* Hero eyebrow reads over a dark image, so it's white; the forced break
     (Commercial on line 2) only kicks in on mobile. */
  .hero .overline{color:#fff}
  .hero-br{display:none}
  .section-head{max-width:760px;margin:0 auto 56px;text-align:center}
  .section-head h2{font-size:clamp(28px,4vw,40px);font-weight:600;margin:14px 0 18px}
  #why-h{font-size:clamp(26px,3.1vw,33px)}
  .section-head p{font-size:clamp(16px,1.6vw,18px)}

  /* ---------- Buttons ---------- */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:10px;
    font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:1px;
    font-size:15px;padding:16px 30px;border-radius:4px;cursor:pointer;border:2px solid transparent;
    transition:background .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease;
    min-height:48px;
  }
  .btn-primary{background:var(--maroon);color:#fff;border-color:var(--maroon)}
  .btn-primary:hover{background:var(--maroon-hover);border-color:var(--maroon-hover);transform:translateY(-2px);box-shadow:0 10px 24px rgba(123,32,39,.35)}
  .btn-ghost{background:transparent;color:#fff;border:2px solid rgba(255,255,255,0.6)}
  .btn-ghost:hover{border-color:#fff;transform:translateY(-2px)}
  .btn-ghost-dark{background:transparent;color:var(--charcoal);border:2px solid rgba(0,0,0,0.25)}
  .btn-ghost-dark:hover{border-color:var(--charcoal)}

  /* ---------- Header ---------- */
  header{
    position:fixed;top:0;left:0;width:100%;z-index:1000;
    background:linear-gradient(to bottom,rgba(0,0,0,0.75),rgba(0,0,0,0));
    transition:background .3s ease,border-color .3s ease,backdrop-filter .3s ease;
    border-bottom:1px solid transparent;
  }
  header.scrolled{
    background:rgba(0,0,0,0.92);
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
    border-bottom:1px solid var(--rule);
  }
  .nav-row{display:flex;align-items:center;justify-content:space-between;height:72px}
  .logo img{height:38px;width:auto}
  .nav-links{display:flex;align-items:center;gap:34px;list-style:none}
  .nav-links a{
    color:#fff;font-weight:500;font-size:14px;letter-spacing:0.05em;
    transition:color .2s ease;position:relative;padding:6px 0;
  }
  .nav-links a:hover{color:var(--maroon)}
  .nav-right{display:flex;align-items:center;gap:22px}
  .nav-phone{
    display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:600;
    font-size:15px;letter-spacing:.02em;min-height:44px;
  }
  .nav-phone:hover{color:var(--maroon)}
  .nav-phone svg{width:16px;height:16px;fill:var(--maroon)}
  .nav-quote{
    background:var(--maroon);color:#fff;font-family:var(--display);font-weight:600;
    text-transform:uppercase;letter-spacing:.6px;font-size:13px;padding:12px 20px;border-radius:4px;
    transition:background .2s ease;min-height:44px;display:inline-flex;align-items:center;
  }
  .nav-quote:hover{background:var(--maroon-hover)}

  /* trust bar */
  .trust-bar{
    border-top:1px solid rgba(255,255,255,0.10);
    border-bottom:1px solid rgba(255,255,255,0.06);
  }
  header.scrolled .trust-bar{border-top-color:var(--rule)}
  .trust-bar .container{
    display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;
    height:36px;font-family:var(--display);font-weight:600;text-transform:uppercase;
    letter-spacing:0.12em;font-size:11px;color:#cfcfcf;
  }
  .trust-bar .dot{color:var(--maroon);font-weight:700}

  /* hamburger */
  .hamburger{display:none;background:none;border:none;cursor:pointer;width:44px;height:44px;
    flex-direction:column;justify-content:center;align-items:center;gap:5px}
  .hamburger span{display:block;width:26px;height:2px;background:#fff;transition:.3s}

  /* mobile drawer */
  .drawer{
    position:fixed;top:0;right:0;height:100%;width:min(86vw,360px);background:#0a0a0a;
    z-index:1100;transform:translateX(100%);visibility:hidden;transition:transform .35s ease,visibility 0s linear .35s;
    display:flex;flex-direction:column;padding:26px;box-shadow:-20px 0 60px rgba(0,0,0,.6);
  }
  .drawer.open{transform:translateX(0);visibility:visible;transition:transform .35s ease,visibility 0s linear 0s}
  .drawer-overlay{
    position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:1090;opacity:0;visibility:hidden;
    transition:opacity .3s ease,visibility .3s ease;
  }
  .drawer-overlay.open{opacity:1;visibility:visible}
  .drawer-close{align-self:flex-end;background:none;border:none;color:#fff;font-size:30px;cursor:pointer;width:44px;height:44px;line-height:1}
  .drawer-phone{
    display:inline-flex;align-items:center;gap:10px;color:#fff;font-family:var(--display);
    font-weight:700;font-size:22px;margin:14px 0 26px;min-height:44px;
  }
  .drawer-phone svg{width:20px;height:20px;fill:var(--maroon)}
  .drawer nav{display:flex;flex-direction:column;gap:4px}
  .drawer nav a{
    color:#fff;font-family:var(--display);font-weight:600;font-size:18px;padding:14px 0;
    border-bottom:1px solid #1c1c1c;letter-spacing:.04em;
  }
  .drawer nav a:hover{color:var(--maroon)}
  .drawer .btn{margin-top:auto;width:100%}

  /* ---------- Hero ---------- */
  .hero{
    position:relative;min-height:100svh;display:flex;align-items:center;
    padding:var(--header-h) 0 80px;overflow:hidden;background:#000;
  }
  .hero-bg{
    position:absolute;inset:0;background:url('./images/led-wall.jpg') center right/cover no-repeat;
    z-index:0;transform-origin:66% 50%;will-change:transform;
    animation:hero-kenburns 26s ease-in-out infinite alternate;
  }
  @keyframes hero-kenburns{from{transform:scale(1.03)}to{transform:scale(1.15) translate3d(-1.5%,-1%,0)}}
  .hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
    background:radial-gradient(60% 55% at 22% 34%,rgba(123,32,39,0.16),transparent 68%);
    animation:hero-sheen 13s ease-in-out infinite alternate;}
  @keyframes hero-sheen{from{opacity:.45;transform:translateX(-4%)}to{opacity:1;transform:translateX(4%)}}
  @media(prefers-reduced-motion:reduce){.hero-bg{animation:none}.hero::after{animation:none}}
  .hero-overlay{
    position:absolute;inset:0;z-index:1;
    background:
      linear-gradient(90deg,rgba(0,0,0,0.82) 0%,rgba(0,0,0,0.55) 42%,rgba(0,0,0,0.20) 75%,rgba(0,0,0,0.10) 100%),
      radial-gradient(120% 80% at 30% 120%,rgba(123,32,39,0.22) 0%,rgba(0,0,0,0) 55%);
  }
  .hero .container{position:relative;z-index:2}
  .hero-content{max-width:640px}
  .hero h1{
    font-size:clamp(38px,5.6vw,70px);font-weight:800;color:#fff;margin:12px 0 20px;line-height:1.08;
  }
  .hero-sub{font-size:clamp(16px,1.7vw,18px);color:var(--body-dark);max-width:640px;margin-bottom:32px}
  .hero-cta{display:flex;gap:16px;flex-wrap:wrap}
  .scroll-indicator{
    position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:2;
    color:rgba(255,255,255,0.45);transition:opacity .4s ease;
  }
  .scroll-indicator svg{width:26px;height:26px;animation:bob 1.8s ease-in-out infinite}
  @keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
  @media (prefers-reduced-motion:reduce){.scroll-indicator svg{animation:none}}

  /* ---------- Services ---------- */
  .services{background:#fff;padding:clamp(64px,9vw,96px) 0}
  .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
  .card{
    background:#fff;border:1px solid #E5E5E5;border-top:4px solid var(--maroon);
    border-radius:4px;overflow:hidden;display:flex;flex-direction:column;
    transition:transform .3s ease,box-shadow .3s ease;
  }
  .card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
  .card-img{aspect-ratio:16/10;overflow:hidden;background:#111}
  .card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
  .card:hover .card-img img{transform:scale(1.05)}
  .card-body{padding:26px 26px 28px;display:flex;flex-direction:column;flex:1}
  .card-icon{
    width:46px;height:46px;border-radius:8px;background:rgba(123,32,39,0.08);
    display:flex;align-items:center;justify-content:center;margin-bottom:16px;
  }
  .card-icon svg{width:24px;height:24px;stroke:var(--maroon);fill:none;stroke-width:1.8;transition:stroke .25s ease}
  .card:hover .card-icon svg{stroke:var(--steel)}
  .card h3{font-size:20px;font-weight:700;color:var(--charcoal);margin-bottom:12px;letter-spacing:-0.01em}
  .card p{font-size:15px;color:#555;line-height:1.65;flex:1}
  .learn{
    margin-top:18px;font-family:var(--display);font-weight:600;font-size:13px;text-transform:uppercase;
    letter-spacing:.06em;color:var(--maroon);display:inline-flex;align-items:center;gap:7px;
    transition:gap .2s ease;min-height:44px;
  }
  .card:hover .learn{gap:12px}

  /* ---------- Additional AV ---------- */
  .additional{background:var(--charcoal);padding:clamp(64px,9vw,96px) 0}
  .additional .section-head h2{color:#fff}
  .additional .section-head p{color:rgba(255,255,255,0.7)}
  .acard{
    background:var(--charcoal-2);border:1px solid #3A3A3A;border-left:4px solid var(--maroon);
    border-radius:4px;overflow:hidden;display:flex;flex-direction:column;
    transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
  }
  .acard:hover{transform:translateY(-6px);box-shadow:0 16px 40px rgba(0,0,0,.45)}
  .acard .card-img{aspect-ratio:16/9}
  .acard .card-body{padding:26px}
  .acard h3{color:#fff;font-size:20px;font-weight:700;margin-bottom:12px}
  .acard p{color:var(--body-dark);font-size:15px}

  /* ---------- Featured Projects ---------- */
  .projects{background:#fff;padding:clamp(64px,9vw,96px) 0}
  .proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  .proj{
    position:relative;border-radius:6px;overflow:hidden;cursor:pointer;background:#111;
    border:none;padding:0;text-align:left;width:100%;color:#fff;font-family:var(--body);
    transition:transform .3s ease,box-shadow .3s ease;display:block;
  }
  .proj:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(0,0,0,.22)}
  .proj img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
  .proj:hover img{transform:scale(1.06)}
  .proj-feature{grid-column:span 2;grid-row:span 2}
  .proj-tall{grid-column:span 1;grid-row:span 2}
  .proj-img-wrap{position:absolute;inset:0}
  .proj-feature .proj-img-wrap,.proj-tall .proj-img-wrap{position:absolute;inset:0}
  .proj-feature{min-height:440px}
  .proj-tall{min-height:440px}
  .proj-row2{grid-column:span 1;min-height:300px}
  .proj-overlay{
    position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;
    padding:26px;background:linear-gradient(to top,rgba(0,0,0,0.88) 0%,rgba(0,0,0,0.35) 45%,rgba(0,0,0,0) 75%);
  }
  .proj-label{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.12em;font-size:11px;color:#e0a08a;margin-bottom:8px}
  .proj-overlay h3{font-size:clamp(18px,2vw,24px);font-weight:700;color:#fff;margin-bottom:8px}
  .proj-desc{font-size:14px;color:rgba(255,255,255,0.82);max-width:520px;display:none}
  .proj-feature .proj-desc{display:block}
  .proj-view{
    margin-top:14px;font-family:var(--display);font-weight:600;font-size:12px;text-transform:uppercase;
    letter-spacing:.08em;color:#fff;display:inline-flex;align-items:center;gap:7px;
  }
  .proj-view svg{width:14px;height:14px;fill:none;stroke:var(--maroon);stroke-width:2}
  .proj-badge{
    position:absolute;top:16px;left:16px;z-index:3;background:rgba(123,32,39,0.92);color:#fff;
    font-family:var(--display);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.08em;
    padding:6px 12px;border-radius:3px;
  }

  /* ---------- Lightbox ---------- */
  .lightbox{
    position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,0.94);
    display:flex;align-items:center;justify-content:center;flex-direction:column;
    opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;padding:24px;
  }
  .lightbox.open{opacity:1;visibility:visible}
  .lb-stage{max-width:1100px;width:100%;display:flex;flex-direction:column;align-items:center}
  .lb-img{max-width:100%;max-height:74vh;border-radius:6px;object-fit:contain;box-shadow:0 20px 60px rgba(0,0,0,.6)}
  .lb-caption{margin-top:18px;text-align:center;max-width:760px}
  .lb-caption .lb-label{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.12em;font-size:11px;color:#e0a08a;display:block;margin-bottom:6px}
  .lb-caption .lb-title{font-family:var(--display);font-weight:700;font-size:20px;color:#fff;display:block;margin-bottom:6px}
  .lb-caption .lb-text{font-size:14px;color:rgba(255,255,255,0.75)}
  .lb-btn{
    position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,0.08);
    border:1px solid rgba(255,255,255,0.25);color:#fff;width:54px;height:54px;border-radius:50%;
    cursor:pointer;font-size:24px;display:flex;align-items:center;justify-content:center;transition:background .2s ease;
  }
  .lb-btn:hover{background:var(--maroon)}
  .lb-prev{left:24px}.lb-next{right:24px}
  .lb-close{position:absolute;top:20px;right:24px;background:none;border:none;color:#fff;font-size:38px;cursor:pointer;width:48px;height:48px;line-height:1}
  .lb-counter{position:absolute;top:30px;left:28px;font-family:var(--display);font-weight:600;font-size:13px;letter-spacing:.1em;color:rgba(255,255,255,0.6)}

  /* ---------- Why Choose Us ---------- */
  .why{background:var(--charcoal);padding:clamp(64px,9vw,96px) 0;position:relative}
  .why .section-head h2{color:#fff}
  .why .section-head p{color:rgba(255,255,255,0.7)}
  .why-img-wrap{max-width:1100px;margin:0 auto 18px;border-radius:8px;overflow:hidden;position:relative}
  .why-img-wrap img{width:100%;height:auto;display:block;filter:brightness(0.92)}
  .why-img-wrap::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,0.25),rgba(0,0,0,0) 30%);pointer-events:none}
  .why-caption{text-align:center;color:var(--maroon);font-size:13px;font-style:italic;margin-bottom:56px}
  .pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;max-width:1100px;margin:0 auto}
  .pillar-icon{width:50px;height:50px;margin-bottom:16px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:rgba(123,32,39,0.14)}
  .pillar-icon svg{width:26px;height:26px;stroke:var(--maroon);fill:none;stroke-width:1.8}
  .pillar h3{color:#fff;font-size:17px;font-weight:700;margin-bottom:10px}
  .pillar p{color:var(--body-dark);font-size:14px;line-height:1.6}
  /* ---- Core Values ---- */
  .values{background:var(--charcoal);padding:clamp(64px,9vw,96px) 0}
  .values .section-head{max-width:1040px}
  .values .section-head h2{color:#fff}
  .values .section-head p{color:rgba(255,255,255,0.72)}
  /* ---- Why Choose Us (points) ---- */
  .whychoose{background:#F6F5F3;padding:clamp(64px,9vw,96px) 0}
  .whychoose .section-head{max-width:960px}
  .wc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;max-width:1180px;margin:0 auto}
  .wc-card{background:#fff;border:1px solid #E5E5E5;border-top:4px solid var(--maroon);border-radius:6px;padding:30px 26px;transition:transform .3s ease,box-shadow .3s ease}
  .wc-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
  .wc-icon{width:50px;height:50px;margin-bottom:16px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:rgba(123,32,39,0.10)}
  .wc-icon svg{width:26px;height:26px;stroke:var(--maroon);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .wc-card h3{color:var(--charcoal);font-size:17px;font-weight:700;margin-bottom:10px;letter-spacing:-0.01em}
  .wc-card p{color:#555;font-size:14px;line-height:1.65}
  .hallmark{text-align:center;margin-top:60px}
  .hallmark-rule{width:80px;height:1px;background:var(--maroon);margin:0 auto 26px}
  .hallmark span{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:0.3em;color:#aaaaaa;font-size:13px}
  /* Why — 2-column: left title/image/text, right numbered timeline */
  .why-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;max-width:1180px;margin:0 auto}
  .why-accent{display:block;width:54px;height:3px;background:var(--maroon);border-radius:2px;margin-bottom:22px}
  .why-left .overline{display:block;margin-bottom:14px}
  .why-left h2{color:#fff;font-size:clamp(32px,3.9vw,46px);line-height:1.14;margin-bottom:22px}
  .why-left h2 span{color:var(--maroon);display:block}
  .why-lead{color:#fff;font-size:17px;line-height:1.6;padding-left:18px;border-left:3px solid var(--maroon);margin-bottom:24px}
  .why-left .why-img-wrap{max-width:none;margin:0 0 10px}
  .why-left .why-caption{text-align:left;margin:0 0 20px;font-size:12.5px}
  .why-body{color:var(--body-dark);font-size:15px;line-height:1.7}
  .why-steps{display:flex;flex-direction:column;padding-top:6px}
  .why-step{display:flex;gap:22px;align-items:flex-start;position:relative;padding-bottom:30px}
  .why-step:last-child{padding-bottom:0}
  .why-step:not(:last-child)::after{content:"";position:absolute;left:27px;top:56px;bottom:0;width:2px;background:var(--maroon);opacity:.28}
  .why-step-num{flex:none;width:56px;height:56px;border-radius:50%;border:2px solid var(--maroon);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-size:19px;font-weight:700;color:var(--maroon);background:var(--charcoal);position:relative;z-index:1;transition:background .25s,color .25s}
  .why-step:first-child .why-step-num{background:var(--maroon);color:#fff;box-shadow:0 0 0 6px rgba(123,32,39,.18)}
  .why-steps:hover .why-step:first-child .why-step-num{background:var(--charcoal);color:var(--maroon);box-shadow:none}
  .why-steps:hover .why-step:hover .why-step-num{background:var(--maroon);color:#fff;box-shadow:0 0 0 6px rgba(123,32,39,.18)}
  .why-step-body{padding-top:5px}
  .why-step-body h3{color:#fff;font-size:17px;font-weight:700;margin-bottom:6px}
  .why-step-body p{color:var(--body-dark);font-size:14px;line-height:1.6}
  @media(max-width:860px){.why-grid{grid-template-columns:1fr;gap:44px}}

  /* ---------- Testimonials ---------- */
  .testimonials{background:#fff;padding:clamp(64px,9vw,96px) 0;border-top:4px solid var(--maroon)}
  .g-badge{
    display:inline-flex;align-items:center;gap:8px;background:rgba(123,32,39,0.07);
    color:var(--maroon);font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.04em;
    padding:8px 16px;border-radius:40px;margin-bottom:18px;
  }
  .t-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
  .tcard{
    border:1px solid #E5E5E5;border-radius:6px;padding:30px 28px;background:#fff;
    transition:transform .3s ease,box-shadow .3s ease;display:flex;flex-direction:column;
  }
  .tcard:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
  .stars{display:flex;gap:3px;margin-bottom:16px}
  .stars svg{width:20px;height:20px;fill:var(--gold)}
  .tquote-mark{font-family:Georgia,serif;font-size:54px;line-height:0.3;color:var(--maroon);height:26px;display:block}
  .tquote{font-style:italic;color:#444;font-size:16px;line-height:1.7;margin:6px 0 20px;flex:1}
  .tauthor{font-family:var(--display);font-weight:600;font-size:14px;color:var(--maroon)}
  .t-foot{text-align:center;margin-top:44px}
  .t-foot a{font-family:var(--display);font-weight:600;font-size:14px;color:var(--maroon);text-transform:uppercase;letter-spacing:.06em;display:inline-flex;align-items:center;gap:8px}
  .t-foot a:hover{color:var(--maroon-hover)}

  /* ---------- Final CTA ---------- */
  .final-cta{
    background:#000;padding:clamp(72px,10vw,110px) 0;text-align:center;position:relative;overflow:hidden;
  }
  .final-cta::before{
    content:"";position:absolute;inset:0;
    background:radial-gradient(60% 70% at 50% 50%,rgba(123,32,39,0.10) 0%,rgba(0,0,0,0) 70%);
  }
  .final-cta .container{position:relative;z-index:1}
  .final-cta h2{font-size:clamp(32px,5vw,52px);font-weight:800;color:#fff;margin:14px auto 22px;max-width:720px}
  .final-cta p{color:rgba(255,255,255,0.62);font-size:17px;max-width:640px;margin:0 auto 36px}
  .final-cta .hero-cta{justify-content:center}
  .final-cta .final-note{color:var(--mid);font-size:13px;margin-top:54px}

  /* ---------- Contact / Quote Form ---------- */
  .contact{background:var(--charcoal);padding:clamp(64px,9vw,96px) 0}
  .contact .section-head h2{color:#fff}
  .contact .section-head p{color:rgba(255,255,255,0.7)}
  .form-wrap{max-width:780px;margin:0 auto}
  .form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;min-width:0}
  .field{display:flex;flex-direction:column;min-width:0}
  .field.full{grid-column:1 / -1}
  .field label{font-family:var(--display);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#cfcfcf;margin-bottom:8px}
  .field label .req{color:var(--maroon)}
  .field input,.field select,.field textarea{
    background:#111;border:1px solid #333;border-radius:4px;color:#fff;font-family:var(--body);
    font-size:15px;padding:14px 16px;min-height:48px;transition:border-color .2s ease;
    width:100%;min-width:0;box-sizing:border-box;
  }
  .field input::placeholder,.field textarea::placeholder{color:#666}
  .field input:focus,.field select:focus,.field textarea:focus{border-color:var(--maroon);outline:none}
  .field textarea{resize:vertical;min-height:120px}
  .field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%237B2027' d='M6 8L0 0h12z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}
  .form-submit{margin-top:26px;text-align:center}
  .form-submit .btn{width:100%;max-width:340px}
  .form-note{text-align:center;color:#999;font-size:14px;margin-top:18px}
  .form-note a{color:var(--maroon);font-weight:600}
  .thankyou{
    display:none;text-align:center;background:#111;border:1px solid #333;border-top:4px solid var(--maroon);
    border-radius:6px;padding:54px 30px;
  }
  .thankyou.show{display:block}
  .thankyou .check{width:64px;height:64px;border-radius:50%;background:rgba(123,32,39,0.15);display:flex;align-items:center;justify-content:center;margin:0 auto 22px}
  .thankyou .check svg{width:32px;height:32px;stroke:var(--maroon);fill:none;stroke-width:2.5}
  .thankyou h3{color:#fff;font-size:26px;margin-bottom:12px}
  .thankyou p{color:var(--body-dark);font-size:16px;max-width:460px;margin:0 auto}
  .thankyou p a{color:var(--maroon);font-weight:600}

  /* ---------- Footer ---------- */
  footer{background:var(--charcoal);border-top:1px solid var(--rule);padding:64px 0 0}
  .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:48px}
  .foot-logo img{height:auto;width:88px;max-width:100%;margin-bottom:18px}
  .foot-brand p{color:#9a9a9a;font-size:14px;max-width:300px;margin-bottom:20px}
  .socials{display:flex;gap:14px}
  .socials a{width:44px;height:44px;border:1px solid #3a3a3a;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:border-color .2s ease,background .2s ease}
  .socials a:hover{border-color:var(--maroon);background:var(--maroon)}
  .socials svg{width:17px;height:17px;fill:#888}
  .socials a:hover svg{fill:#fff}
  .foot-col h3{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:13px;color:#fff;margin-bottom:18px}
  .foot-col ul{list-style:none;display:flex;flex-direction:column;gap:11px}
  .foot-col ul li a{color:#9a9a9a;font-size:14px;transition:color .2s ease}
  .foot-col ul li a:hover{color:var(--maroon)}
  .foot-contact a.fc-phone{color:#fff;font-family:var(--display);font-weight:700;font-size:20px;display:inline-block;margin-bottom:12px}
  .foot-contact .fc-line{color:#9a9a9a;font-size:14px;margin-bottom:8px;display:block}
  .foot-contact .fc-address{font-style:normal;margin:4px 0 12px}
  .foot-contact .fc-address .fc-name{color:#c9c9c9;font-size:14px;font-weight:600;display:block;margin-bottom:6px}
  .foot-contact .fc-address .fc-line{margin-bottom:4px}
  .foot-bottom{border-top:1px solid var(--rule);padding:22px 0 30px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:7px}
  .foot-bottom span{color:#9a9a9a;font-size:12px}
  .foot-bottom a{color:#c9c9c9;text-decoration:underline;text-underline-offset:2px}
  .foot-bottom a:hover{color:#fff}
  .foot-acc summary{display:none}

  /* ---------- Floating mobile call ---------- */
  .float-call{
    position:fixed;bottom:22px;right:22px;width:60px;height:60px;border-radius:50%;
    background:var(--maroon);z-index:900;display:none;align-items:center;justify-content:center;
    box-shadow:0 8px 24px rgba(123,32,39,.5);transition:background .2s ease,transform .2s ease;
    animation:pulse 2.4s ease-in-out infinite;
  }
  .float-call:hover{background:var(--maroon-hover);transform:scale(1.06)}
  .float-call svg{width:26px;height:26px;fill:#fff}
  @keyframes pulse{0%,100%{box-shadow:0 8px 24px rgba(123,32,39,.5)}50%{box-shadow:0 8px 30px rgba(123,32,39,.85)}}
  @media (prefers-reduced-motion:reduce){.float-call{animation:none}}

  /* ---------- Scroll animations ---------- */
  .reveal{opacity:0;transform:translateY(26px);transition:opacity .6s ease-out,transform .6s ease-out}
  .reveal.in{opacity:1;transform:none}
  @media (prefers-reduced-motion:reduce){
    .reveal{opacity:1 !important;transform:none !important;transition:none}
    .card:hover,.acard:hover,.proj:hover,.tcard:hover{transform:none}
    .card:hover .card-img img,.proj:hover img{transform:none}
  }

  /* ---------- Responsive ---------- */
  @media (max-width:1024px){
    .grid-3{grid-template-columns:repeat(2,1fr)}
    .pillars{grid-template-columns:repeat(2,1fr);gap:36px 30px}
    .wc-grid{grid-template-columns:repeat(2,1fr)}
    .t-grid{grid-template-columns:repeat(2,1fr)}
  }
  @media (max-width:860px){
    :root{--header-h:118px}
    /* clear the fixed mobile action bar so content/footer isn't hidden behind it */
    body{padding-bottom:64px}
    .nav-links,.nav-phone,.nav-quote{display:none}
    .nav-right .hamburger{display:flex}
    .hamburger{display:flex}
    .proj-grid{grid-template-columns:1fr}
    .proj-feature,.proj-tall,.proj-row2{grid-column:span 1;grid-row:auto;min-height:300px}
    .proj-desc{display:none !important}
    .proj-feature .proj-desc{display:block !important}
    .foot-grid{grid-template-columns:1fr 1fr}
    .foot-brand{grid-column:1 / -1}
  }
  @media (max-width:680px){
    :root{--header-h:128px}
    /* top-align hero content so the eyebrow clears the wrapped trust bar, and add
       bottom room so the CTAs sit above the fixed action bar */
    .hero{align-items:flex-start;padding-top:calc(var(--header-h) + 30px);padding-bottom:104px}
    .container{padding:0 20px}
    .grid-3,.t-grid{grid-template-columns:1fr}
    .pillars{grid-template-columns:1fr;gap:34px}
    .wc-grid{grid-template-columns:1fr}
    .form-grid{grid-template-columns:minmax(0,1fr)}
    .hero-cta .btn,.final-cta .hero-cta .btn{width:100%}
    .trust-bar .container{font-size:11px;letter-spacing:.06em;height:auto;padding:7px 20px;gap:6px}
    .foot-grid{grid-template-columns:1fr}
    .foot-bottom{flex-direction:column}
    .lb-btn{width:46px;height:46px}
    .lb-prev{left:10px}.lb-next{right:10px}
    .float-call{display:flex}
    .section-head{margin-bottom:40px}
  }

  /* ---- Homepage copy line-fit on desktop (client edits 2026-06-29) ---- */
  @media (min-width:1000px){
    #services-h{font-size:clamp(28px,3.2vw,36px)}
    .services .section-head{max-width:1180px}
    .services .section-head p{max-width:1180px;font-size:16.5px}
    .additional .section-head{max-width:1180px}
    .additional .section-head p{max-width:1180px}
    .projects .section-head{max-width:1180px}
    .projects .section-head p{max-width:1180px}
    .why .section-head{max-width:1180px}
    .why .section-head p{max-width:1180px;font-size:16px}
    .final-cta h2{max-width:1100px;font-size:clamp(32px,4.4vw,46px)}
    .final-cta p{max-width:1000px}
    .contact .section-head{max-width:1180px}
    .contact .section-head p{max-width:1180px;font-size:16.5px}
  }

  /* ---- Brand / Partners strip ---- */
  .brands{background:#0c0c0c;padding:34px 0;border-bottom:1px solid var(--rule)}
  .brands-label{text-align:center;font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:0.18em;font-size:12px;color:#7d7d7d;margin-bottom:22px}
  .brand-row{list-style:none;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px 44px}
  .brand-row li{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:0.08em;font-size:clamp(15px,1.7vw,19px);color:#8f8f8f;transition:color .25s ease}
  .brand-row li:hover{color:#fff}

  /* ---- Industries We Serve ---- */
  .industries{background:#fff;padding:clamp(64px,9vw,96px) 0}
  .ind-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
  .ind-card{
    display:flex;align-items:flex-start;gap:16px;background:#fff;border:1px solid #E5E5E5;
    border-radius:6px;padding:24px 22px;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
  }
  .ind-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--maroon)}
  .ind-ic{flex:none;width:46px;height:46px;border-radius:8px;background:rgba(123,32,39,0.08);display:flex;align-items:center;justify-content:center}
  .ind-ic svg{width:24px;height:24px;stroke:var(--maroon);fill:none;stroke-width:1.8}
  .ind-card h3{font-size:17px;font-weight:700;color:var(--charcoal);margin-bottom:6px}
  .ind-card p{font-size:14px;color:#666;line-height:1.55}
  /* Numbered-step timeline (Industries) */
  .ind-steps{display:flex;align-items:flex-start;max-width:1120px;margin:0 auto}
  .ind-step{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;padding:0 10px}
  .ind-step:not(:last-child)::after{content:"";position:absolute;top:38px;left:50%;width:100%;height:2px;background:var(--maroon);opacity:.22;z-index:0}
  .ind-num{width:76px;height:76px;border-radius:50%;border:2px solid var(--maroon);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-size:23px;font-weight:700;color:var(--maroon);background:#fff;position:relative;z-index:1;transition:transform .25s,background .25s,color .25s,box-shadow .25s}
  .ind-step:hover .ind-num{background:var(--maroon);color:#fff;transform:scale(1.06);box-shadow:0 0 0 8px rgba(123,32,39,.08)}
  .ind-step h3{font-size:16px;font-weight:700;color:var(--charcoal);margin:16px 0 7px}
  .ind-step p{font-size:13.5px;color:#666;line-height:1.55;max-width:186px}
  .ind-pop{position:absolute;left:50%;top:0;transform:translate(-50%,calc(-100% - 18px)) scale(.94);width:236px;height:150px;border-radius:10px;overflow:hidden;border:1px solid var(--maroon);box-shadow:0 18px 44px rgba(0,0,0,.24);background:#fff;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;z-index:6}
  .ind-pop img{width:100%;height:100%;object-fit:cover;display:block}
  .ind-pop::after{content:"";position:absolute;left:50%;bottom:-8px;transform:translateX(-50%);width:0;height:0;border:8px solid transparent;border-top-color:var(--maroon)}
  .ind-step:hover{z-index:6}
  .ind-step:hover .ind-pop{opacity:1;transform:translate(-50%,calc(-100% - 12px)) scale(1)}
  @media(max-width:760px){
    .ind-steps{flex-direction:column;align-items:center;gap:26px;max-width:340px}
    .ind-step:not(:last-child)::after{display:none}
    .ind-step p{max-width:280px}
    .ind-pop{display:none}
  }

  /* ---- How We Work / Process ---- */
  .process{background:var(--charcoal);padding:clamp(64px,9vw,96px) 0}
  .process .section-head h2{color:#fff}
  .process .section-head p{color:rgba(255,255,255,0.7)}
  .proc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;counter-reset:step;position:relative}
  .proc-step{position:relative;padding-top:8px}
  .proc-num{
    font-family:var(--display);font-weight:800;font-size:34px;color:var(--maroon);
    width:64px;height:64px;border-radius:12px;background:rgba(123,32,39,0.12);border:1px solid rgba(123,32,39,0.3);
    display:flex;align-items:center;justify-content:center;margin-bottom:18px;
    transition:transform .25s,background .25s,color .25s,box-shadow .25s;cursor:default;
  }
  .proc-step:hover .proc-num{background:var(--maroon);color:#fff;transform:scale(1.05);box-shadow:0 0 0 8px rgba(123,32,39,0.18)}
  .proc-step h3{color:#fff;font-size:18px;font-weight:700;margin-bottom:10px}
  .proc-step p{color:var(--body-dark);font-size:14px;line-height:1.6}
  .proc-step::after{
    content:"";position:absolute;top:32px;left:74px;right:-12px;height:1px;
    background:linear-gradient(to right,rgba(123,32,39,0.5),rgba(123,32,39,0));
  }
  .proc-step:last-child::after{display:none}
  /* Hover-to-reveal image popup on each step number */
  .proc-pop{position:absolute;left:0;top:0;transform:translateY(calc(-100% - 16px)) scale(.95);transform-origin:bottom left;width:230px;height:146px;border-radius:10px;overflow:hidden;border:1px solid var(--maroon);box-shadow:0 18px 46px rgba(0,0,0,0.5);background:#fff;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;z-index:8}
  .proc-pop img{width:100%;height:100%;object-fit:cover;display:block}
  .proc-pop::after{content:"";position:absolute;left:32px;bottom:-8px;transform:translateX(-50%);width:0;height:0;border:8px solid transparent;border-top-color:var(--maroon)}
  .proc-step:hover{z-index:8}
  .proc-step:hover .proc-pop{opacity:1;transform:translateY(calc(-100% - 10px)) scale(1)}
  @media(max-width:760px){.proc-pop{display:none}}

  /* ---- Stats band ---- */
  .stats{background:#000;padding:clamp(48px,6vw,68px) 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
  .stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center}
  .stat{padding:6px 10px;position:relative}
  .stat + .stat::before{content:"";position:absolute;left:0;top:14%;height:72%;width:1px;background:var(--rule)}
  .stat-num{font-family:var(--display);font-weight:800;font-size:clamp(32px,4.4vw,48px);color:#fff;line-height:1}
  .stat-num span{color:#fff}
  .stat-label{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:0.1em;font-size:12px;color:#9a9a9a;margin-top:12px}

  /* ---- About / Team ---- */
  .about{background:#fff;padding:clamp(64px,9vw,96px) 0}
  .about-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,64px);align-items:center;max-width:1140px;margin:0 auto}
  .about-copy{order:1}
  .about-img{order:2;border-radius:8px;overflow:hidden;position:relative;box-shadow:var(--shadow)}
  .about-img img{width:100%;height:100%;object-fit:cover;display:block}
  /* Wide team group shot: full uncropped photo; narrower text column gives it more room */
  .about-img--team{align-self:center}
  .about-img--team img{height:auto;object-fit:contain}
  .about-copy .overline{margin-bottom:14px}
  .about-copy h2{font-size:clamp(26px,3.4vw,38px);font-weight:600;color:var(--charcoal);margin-bottom:20px;line-height:1.15}
  .about-copy p{font-size:16px;color:#555;line-height:1.7;margin-bottom:16px}
  .about-copy .btn{margin-top:8px}

  /* ---- FAQ ---- */
  .faq{background:var(--charcoal);padding:clamp(64px,9vw,96px) 0}
  .faq .section-head h2{color:#fff}
  .faq .section-head p{color:rgba(255,255,255,0.7)}
  .faq-list{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;align-items:start}
  @media(max-width:900px){.faq-list{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:600px){.faq-list{grid-template-columns:1fr;max-width:560px}}
  .faq-item{background:var(--charcoal-2);border:1px solid #3a3a3a;border-radius:6px;overflow:hidden}
  .faq-item summary{
    list-style:none;cursor:pointer;padding:20px 20px;display:flex;align-items:center;justify-content:space-between;gap:10px;
    font-family:var(--display);font-weight:600;font-size:15px;color:#fff;transition:color .2s ease;white-space:nowrap;
  }
  .faq-item summary::-webkit-details-marker{display:none}
  .faq-item summary:hover{color:var(--maroon)}
  .faq-item summary .pm{flex:none;width:22px;height:22px;position:relative}
  .faq-item summary .pm::before,.faq-item summary .pm::after{content:"";position:absolute;background:var(--maroon);transition:transform .25s ease}
  .faq-item summary .pm::before{top:10px;left:0;width:22px;height:2px}
  .faq-item summary .pm::after{top:0;left:10px;width:2px;height:22px}
  .faq-item[open] summary .pm::after{transform:scaleY(0)}
  .faq-item .faq-a{padding:0 22px 20px;color:var(--body-dark);font-size:15px;line-height:1.7}

  /* ---- Service Area ---- */
  .area{background:#fff;padding:clamp(64px,9vw,96px) 0}
  .area-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(28px,4vw,52px);align-items:center;max-width:1140px;margin:0 auto}
  .area-copy h2{font-size:clamp(26px,3.4vw,38px);font-weight:600;color:var(--charcoal);margin:14px 0 16px}
  .area-copy p{font-size:16px;color:#555;line-height:1.7;margin-bottom:20px}
  .area-cities{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px 18px}
  .area-cities li{font-size:14px;color:#444;display:flex;align-items:center;gap:8px}
  .area-cities li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--maroon);flex:none}
  .area-cities li h3{margin:0;font:inherit;color:inherit}
  .area-map{border-radius:8px;overflow:hidden;box-shadow:var(--shadow);border:1px solid #E5E5E5}
  .area-map iframe{display:block;width:100%;height:360px;border:0;filter:grayscale(0.25)}

  @media (max-width:1024px){
    .ind-grid,.proc-grid{grid-template-columns:repeat(2,1fr)}
    .stat-row{grid-template-columns:repeat(2,1fr);gap:30px 20px}
    .stat:nth-child(3)::before{display:none}
    .proc-step::after{display:none}
    .about-grid,.area-grid{grid-template-columns:1fr}
    .about-img{order:-1}
  }
  @media (max-width:680px){
    .ind-grid,.proc-grid{grid-template-columns:1fr}
    .stat-row{grid-template-columns:1fr 1fr}
    .area-cities{grid-template-columns:1fr}
    .area-map iframe{height:280px}
  }

  /* ---- Contact form on white (client edit 2026-06-30) ---- */
  .contact{background:#fff}
  .contact .section-head h2{color:var(--charcoal)}
  .contact .section-head p{color:#555}
  .contact .field label{color:var(--charcoal)}
  .contact .field input,.contact .field select,.contact .field textarea{background:#fff;border:1px solid #d6d6d6;color:var(--charcoal)}
  .contact .field input::placeholder,.contact .field textarea::placeholder{color:#9a9a9a}
  .contact .field input:focus,.contact .field select:focus,.contact .field textarea:focus{border-color:var(--maroon)}
  .contact .form-note{color:#777}
  .contact .form-note a{color:var(--maroon)}
  .contact .thankyou{background:#f7f7f7;border:1px solid #e3e3e3;border-top:4px solid var(--maroon)}
  .contact .thankyou h3{color:var(--charcoal)}
  .contact .thankyou p{color:#555}

  /* ---- Services mega-menu (client edit 2026-06-30) ---- */
  .nav-mega-trigger{display:inline-flex;align-items:center;gap:6px}
  .nav-caret{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.2;transition:transform .25s ease}
  .nav-mega:hover .nav-caret,.nav-mega:focus-within .nav-caret{transform:rotate(180deg)}
  .mega{
    position:absolute;top:100%;left:0;width:100%;
    background:rgba(10,10,10,0.98);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
    border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
    box-shadow:0 28px 56px rgba(0,0,0,0.55);
    opacity:0;visibility:hidden;transform:translateY(-10px);
    transition:opacity .25s ease,transform .25s ease,visibility .25s ease;
    z-index:999;
  }
  .nav-mega:hover .mega,.nav-mega:focus-within .mega{opacity:1;visibility:visible;transform:none}
  .mega-inner{max-width:1240px;margin:0 auto;padding:34px 28px 30px;display:grid;grid-template-columns:1fr 290px;gap:44px}
  .mega-head{display:block;font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:0.14em;font-size:12px;color:var(--maroon);margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--rule)}
  .mega-groups{display:grid;grid-template-columns:repeat(3,1fr);gap:24px 30px}
  .mega-group h4{font-family:var(--display);font-weight:600;font-size:13px;color:#fff;margin-bottom:10px;letter-spacing:.01em}
  .mega-group h4 a{color:#fff;font:inherit;transition:color .18s ease}
  .mega-group h4 a::after{content:"\2197";font-size:11px;margin-left:4px;color:var(--maroon);opacity:0;transition:opacity .18s ease}
  .mega-group h4 a:hover{color:var(--maroon)}
  .mega-group h4 a:hover::after{opacity:1}
  .mega-group ul,.mega-residential ul{list-style:none;display:flex;flex-direction:column;gap:7px}
  .mega-group a,.mega-residential a{color:#b4b4b4;font-size:13.5px;line-height:1.35;transition:color .18s ease}
  .mega-group a:hover,.mega-residential a:hover{color:#fff}
  .mega-residential{border-left:1px solid var(--rule);padding-left:40px}
  .mega-foot{border-top:1px solid var(--rule);background:rgba(0,0,0,0.35)}
  .mega-foot-inner{max-width:1240px;margin:0 auto;padding:15px 28px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px}
  .mega-foot-label{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:11px;color:var(--maroon)}
  .mega-foot a{color:#cfcfcf;font-size:13px;font-weight:500;transition:color .18s ease}
  .mega-foot a:hover{color:#fff}

  /* ---- Mobile drawer: Services accordion ---- */
  .drawer{overflow-y:auto}
  .drawer-acc{border-bottom:1px solid #1c1c1c}
  .drawer-acc summary{list-style:none;cursor:pointer;color:#fff;font-family:var(--display);font-weight:600;font-size:18px;padding:14px 0;display:flex;justify-content:space-between;align-items:center;letter-spacing:.04em}
  .drawer-acc summary::-webkit-details-marker{display:none}
  .drawer-acc summary::after{content:"+";color:var(--maroon);font-size:24px;line-height:1;font-weight:400}
  .drawer-acc[open] summary::after{content:"\2212"}
  .drawer-sub{display:flex;flex-direction:column;padding:2px 0 14px 10px}
  .drawer-sub-head{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:11px;color:var(--maroon);margin:14px 0 2px}
  .drawer-sub a{color:#c4c4c4;font-size:14px;padding:9px 0;border-bottom:1px solid #161616}
  .drawer-sub a:hover{color:var(--maroon)}

/* ---- Linked mega/drawer section headers ---- */
a.mega-head{cursor:pointer}
a.mega-head:hover{text-decoration:underline}
.drawer-sub-head-link{display:block;text-decoration:none}
.drawer-sub-head-link:hover{text-decoration:underline}

/* ---- Service-category landing pages (hub + page intro) ---- */
.page-hero{position:relative;min-height:62vh;display:flex;align-items:center;padding:calc(var(--header-h) + 40px) 0 64px;overflow:hidden;background:#000}
.page-hero .hero-bg{position:absolute;inset:0;background-size:cover;background-position:center right;z-index:0}
.page-hero .hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(0,0,0,0.86) 0%,rgba(0,0,0,0.6) 45%,rgba(0,0,0,0.25) 78%,rgba(0,0,0,0.12) 100%),radial-gradient(120% 80% at 25% 120%,rgba(123,32,39,0.24) 0%,rgba(0,0,0,0) 55%)}
.page-hero .container{position:relative;z-index:2}
.page-hero-content{max-width:720px}
.breadcrumb{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:11.5px;color:#9a9a9a;margin-bottom:18px}
.breadcrumb a{color:#9a9a9a}.breadcrumb a:hover{color:var(--maroon)}
/* Active crumb sits on dark hero images sitewide; keep it light so it reads. */
.breadcrumb span{color:#fff}
/* Service-detail heroes use the grey link color over a dark photo; lighten. */
.page-hero .breadcrumb a{color:#e9c9cb}
.page-hero .breadcrumb a:hover{color:#fff}
.page-hero h1{font-size:clamp(34px,5vw,60px);font-weight:800;color:#fff;line-height:1.06;margin:0 0 18px}
.page-hero .page-sub{font-size:clamp(16px,1.7vw,18px);color:var(--body-dark);max-width:600px;margin-bottom:30px}
.page-hero-com .page-hero-content{max-width:840px}
.page-hero-com .page-sub{max-width:700px}
.page-hero-com h1{max-width:720px}
.page-hero-contact .page-hero-content{max-width:820px}
.page-hero-contact .page-sub{max-width:620px}
.page-hero-address{font-style:normal;margin-top:26px;color:var(--body-dark);font-size:15px;line-height:1.6}
.page-hero-address .pha-name{display:block;color:#fff;font-family:var(--display);font-weight:600;font-size:16px;margin-bottom:4px}
.page-hero .hero-cta{display:flex;gap:16px;flex-wrap:wrap}

.page-intro{background:#fff;padding:clamp(56px,8vw,84px) 0}
.page-intro .pi-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(32px,5vw,60px);max-width:1140px;margin:0 auto;align-items:center}
.page-intro h2{font-size:clamp(26px,3.4vw,38px);font-weight:600;color:var(--charcoal);line-height:1.15;margin-bottom:18px}
.page-intro p{font-size:16px;color:#555;line-height:1.75;margin-bottom:14px}
.pi-points{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:14px 20px;margin-top:6px}
.pi-points li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:#444;line-height:1.5}
.pi-points li::before{content:"";flex:none;width:20px;height:20px;border-radius:50%;background:rgba(123,32,39,0.1);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237B2027' stroke-width='3'%3E%3Cpath d='M4 12l5 5L20 6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;margin-top:1px}

.svchub{background:var(--charcoal);padding:clamp(64px,9vw,96px) 0}
.svchub .section-head h2{color:#fff}
.svchub .section-head p{color:rgba(255,255,255,0.7)}
.svc-group{margin-bottom:40px;scroll-margin-top:130px}
.svc-group:last-child{margin-bottom:0}
.svc-group-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.svc-group-head h3{font-family:var(--display);font-weight:700;font-size:clamp(17px,2vw,21px);color:#fff;white-space:nowrap}
.svc-group-head::after{content:"";flex:1;height:1px;background:var(--rule)}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.svc-card{display:block;background:var(--charcoal-2);border:1px solid #3a3a3a;border-left:3px solid var(--maroon);border-radius:6px;padding:18px 20px;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.svc-card:hover{transform:translateY(-4px);border-color:var(--maroon);box-shadow:0 14px 32px rgba(0,0,0,.4)}
.svc-card h3{font-family:var(--display);font-weight:600;font-size:15.5px;color:#fff;margin-bottom:6px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.svc-card h3 .arr{color:var(--maroon);transition:transform .25s ease}
.svc-card:hover h4 .arr{transform:translateX(4px)}
.svc-card p{font-size:13px;color:var(--body-dark);line-height:1.5;margin:0}
@media (max-width:1024px){.svc-grid{grid-template-columns:repeat(2,1fr)}.page-intro .pi-grid{grid-template-columns:1fr}}
@media (max-width:680px){.svc-grid{grid-template-columns:1fr}.pi-points{grid-template-columns:1fr}}

/* ---- Image service cards + one-row-per-group (client edit 2026-06-30) ---- */
.svc-grid{grid-template-columns:repeat(3,1fr)}
.svc-card{padding:0;overflow:hidden;display:flex;flex-direction:column}
.svc-card-img{aspect-ratio:16/10;overflow:hidden;background:#111}
.svc-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.svc-card:hover .svc-card-img img{transform:scale(1.06)}
.svc-card-body{padding:15px 17px 17px;display:flex;flex-direction:column;flex:1}
.svc-card-body h3{margin-bottom:7px;font-size:14.5px;line-height:1.25;min-height:2.5em;align-items:flex-start}
.svc-card-body p{font-size:12.5px;color:var(--body-dark);flex:1}
@media (max-width:1024px){.svc-grid{grid-template-columns:repeat(2,1fr) !important}}
@media (max-width:680px){.svc-grid{grid-template-columns:1fr !important}}

/* ---- Honest reviews block (no fabricated quotes) ---- */
.t-reviews{max-width:680px;margin:0 auto;text-align:center;background:#fff;border:1px solid #E5E5E5;border-top:4px solid var(--maroon);border-radius:8px;padding:48px 32px;box-shadow:var(--shadow)}
.stars--lg{justify-content:center}
.stars--lg svg{width:30px;height:30px;fill:var(--gold)}
.t-reviews-score{font-family:var(--display);font-weight:800;font-size:56px;color:var(--charcoal);line-height:1;margin:14px 0 6px}
.t-reviews-score span{font-size:24px;color:#999}
.t-reviews-sub{color:#555;font-size:16px;line-height:1.6;max-width:540px;margin:0 auto 24px}
.t-reviews-cta{display:inline-flex}
/* Auto-scroll review carousel (2 opposite rows) */
.t-carousel{display:flex;flex-direction:column;gap:20px;overflow:hidden;padding:6px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.t-row{display:flex;width:max-content}
.t-row-a{animation:t-scroll-a 62s linear infinite}
.t-row-b{animation:t-scroll-b 74s linear infinite}
.t-carousel:hover .t-row{animation-play-state:paused}
@keyframes t-scroll-a{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes t-scroll-b{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.t-card{flex:0 0 auto;width:360px;margin-right:20px;background:#fff;border:1px solid #E5E5E5;border-radius:12px;padding:24px 26px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:14px;text-align:left}
.t-stars{color:var(--gold);font-size:17px;letter-spacing:3px;line-height:1}
.t-text{color:var(--body-light);font-size:14.5px;line-height:1.6;flex:1}
.t-author{display:flex;align-items:center;gap:12px}
.t-avatar{flex:none;width:42px;height:42px;border-radius:50%;background:var(--maroon);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-family:var(--display);font-size:16px}
.t-name{font-weight:700;color:var(--charcoal);font-size:15px}
.t-carousel-cta{display:flex;flex-direction:column;align-items:center;margin-top:38px}
@media(prefers-reduced-motion:reduce){.t-row{animation:none;flex-wrap:wrap;justify-content:center;width:auto}}
@media(max-width:600px){.t-card{width:290px}}
/* Equipment brand wall (auto-scroll) */
.brandwall{background:#fff;padding:46px 0;border-top:1px solid #ededed;border-bottom:1px solid #ededed}
.bw-label{text-align:center;font-family:var(--display);font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#8a8a8a;margin-bottom:30px}
.bw-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.bw-track{display:flex;align-items:center;width:max-content;animation:bw-scroll 40s linear infinite}
.bw-marquee:hover .bw-track{animation-play-state:paused}
@keyframes bw-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.bw-logo{flex:0 0 auto;width:170px;margin-right:24px;display:flex;align-items:center;justify-content:center;height:56px}
.bw-logo img{max-width:132px;max-height:44px;object-fit:contain;filter:grayscale(1);opacity:.55;transition:filter .3s,opacity .3s}
.bw-logo:hover img{filter:grayscale(0);opacity:1}
@media(prefers-reduced-motion:reduce){.bw-track{animation:none;flex-wrap:wrap;justify-content:center;width:auto}}
/* AI Scope-My-Project widget */
.scope-btn{position:fixed;bottom:22px;right:22px;z-index:300;background:var(--maroon);color:#fff;border:none;border-radius:30px;padding:13px 22px;font-family:var(--display);font-weight:700;font-size:14px;cursor:pointer;box-shadow:0 8px 26px rgba(123,32,39,.42);display:flex;align-items:center;gap:9px;transition:transform .2s,box-shadow .2s}
.scope-btn:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(123,32,39,.52)}
.scope-btn.hidden{display:none}
.scope-btn svg{width:18px;height:18px}
.scope-panel{position:fixed;bottom:22px;right:22px;z-index:301;width:372px;max-width:calc(100vw - 32px);height:520px;max-height:calc(100vh - 44px);background:#fff;border-radius:16px;box-shadow:0 24px 64px rgba(0,0,0,.32);display:flex;flex-direction:column;overflow:hidden;opacity:0;transform:translateY(20px) scale(.98);pointer-events:none;visibility:hidden;transition:opacity .25s,transform .25s,visibility 0s linear .25s;border:1px solid #e5e5e5}
.scope-panel.open{opacity:1;transform:none;pointer-events:auto;visibility:visible;transition:opacity .25s,transform .25s,visibility 0s linear 0s}
.scope-head{background:var(--charcoal);color:#fff;padding:15px 18px;display:flex;align-items:center;justify-content:space-between;flex:none}
.scope-head strong{font-family:var(--display);font-size:16px;display:block;line-height:1.2}
.scope-head span{font-size:11.5px;color:rgba(255,255,255,.6)}
.scope-head button{background:none;border:none;color:#fff;font-size:26px;cursor:pointer;line-height:1;opacity:.8;padding:0 4px}
.scope-msgs{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:11px;background:#faf9f8}
.scope-msg{max-width:84%;padding:11px 15px;border-radius:14px;font-size:14px;line-height:1.5;white-space:pre-wrap;word-wrap:break-word}
.scope-user{align-self:flex-end;background:var(--maroon);color:#fff;border-bottom-right-radius:4px}
.scope-assistant{align-self:flex-start;background:#fff;color:var(--charcoal);border:1px solid #ececec;border-bottom-left-radius:4px}
.scope-typing{color:#aaa;letter-spacing:3px}
.scope-input{display:flex;gap:8px;padding:12px;border-top:1px solid #eee;background:#fff;flex:none}
.scope-input input{flex:1;border:1px solid #ddd;border-radius:22px;padding:11px 16px;font-size:14px;outline:none;font-family:var(--body)}
.scope-input input:focus{border-color:var(--maroon)}
.scope-input button{flex:none;width:42px;height:42px;border-radius:50%;background:var(--maroon);color:#fff;border:none;font-size:18px;cursor:pointer}
@media(max-width:480px){.scope-panel{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;bottom:0;right:0;border-radius:0}.scope-btn{bottom:16px;right:16px}}

/* ---- Recent Work / proof gallery ---- */
.worksec{background:#fff;padding:clamp(56px,8vw,90px) 0}
.workgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1180px;margin:0 auto}
.work-tile{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:4/3;background:#111;display:block}
.work-tile img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.work-tile:hover img{transform:scale(1.06)}
.work-tile figcaption{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:20px;background:linear-gradient(to top,rgba(0,0,0,0.85) 0%,rgba(0,0,0,0.3) 45%,rgba(0,0,0,0) 75%)}
.work-tile .wt-label{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:10.5px;color:#e0a08a;margin-bottom:5px}
.work-tile .wt-title{font-family:var(--display);font-weight:700;font-size:16px;color:#fff;line-height:1.2}
@media (max-width:1024px){.workgrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:680px){.workgrid{grid-template-columns:1fr}}

/* ---- Residential page tweaks (2026-06-30) ---- */
.page-hero-res .page-hero-content{max-width:960px}
.page-hero-res h1{font-size:clamp(32px,4.4vw,54px)}
.pi-brand{background:var(--charcoal);border-radius:14px;padding:40px 34px;display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.pi-brand img{width:220px;height:auto;max-width:78%}
.section-head.sh-oneline{max-width:1120px}
.workgrid.workgrid-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1024px){.workgrid.workgrid-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:680px){.workgrid.workgrid-4{grid-template-columns:1fr}}
.faq.faq-light{background:#fff}
.faq.faq-light .section-head h2{color:var(--charcoal)}
.faq.faq-light .section-head p{color:#555}
.faq.faq-light .faq-item{background:#fff;border:1px solid #e4e4e4;box-shadow:0 1px 3px rgba(0,0,0,0.05)}
.faq.faq-light .faq-item summary{color:var(--charcoal)}
.faq.faq-light .faq-item summary:hover{color:var(--maroon)}
.faq.faq-light .faq-item .faq-a{color:#555}

/* ---- Mobile: center everything (2026-07-01) ---- */
@media (max-width:860px){
  /* homepage hero */
  .hero-content{text-align:center;margin-left:auto;margin-right:auto}
  .hero-sub{margin-left:auto;margin-right:auto}
  .hero-cta{justify-content:center}
  /* subpage hero */
  .page-hero-content{text-align:center;margin-left:auto;margin-right:auto}
  .page-hero .page-sub{margin-left:auto;margin-right:auto}
  .page-hero .hero-cta{justify-content:center}
  /* intro */
  .page-intro .pi-grid > div{text-align:center}
  .pi-points li{justify-content:center}
  /* service + info cards */
  .svc-card-body{text-align:center}
  .ind-card{flex-direction:column;align-items:center;text-align:center}
  /* homepage cards (services / additional / about / why pillars) */
  .card-body{text-align:center;align-items:center}
  .card-icon{margin-left:auto;margin-right:auto}
  .about-copy{text-align:center}
  .about-copy .btn{margin-left:auto;margin-right:auto}
  .pillar{text-align:center}
  .pillar-icon{margin-left:auto;margin-right:auto}
  /* proof gallery tiles */
  .work-tile figcaption{align-items:center;text-align:center}
  /* process */
  .proc-step{text-align:center}
  .proc-num{margin-left:auto;margin-right:auto}
  .proc-step::after{display:none}
  /* stats */
  .stat{text-align:center}
  /* why (image + copy) */
  .why-copy,.why .why-copy,.area-copy{text-align:center}
  .why-copy .hero-cta,.why-copy .btn-row{justify-content:center}
  /* faq — center title + answer, keep toggle at right */
  .faq-item .faq-a{text-align:center}
  .faq-item summary{justify-content:center;position:relative;padding-left:46px;padding-right:46px}
  .faq-item summary .pm{position:absolute;right:18px;top:50%;transform:translateY(-50%)}
  /* footer */
  .foot-col{text-align:center}
  .foot-brand p{margin-left:auto;margin-right:auto}
  .foot-logo img{margin-left:auto;margin-right:auto}
  .socials{justify-content:center}
  .foot-bottom{justify-content:center;text-align:center}
  /* keep form inputs left-aligned for readability */
  .contact input,.contact textarea,.contact select{text-align:left}
}

/* SMS consent checkbox */
.form-consent{margin-top:2px}
.consent-check{display:flex;align-items:flex-start;gap:10px;font-size:12.5px;line-height:1.55;color:#5a6472;cursor:pointer;font-weight:400;text-transform:none;letter-spacing:0}
.consent-check input{margin-top:3px;width:16px;height:16px;flex-shrink:0;cursor:pointer;accent-color:#0b5cab}
.consent-check a{color:inherit;text-decoration:underline}

/* Legal / policy pages */
.legal-hero{background:linear-gradient(160deg,#1F1F1F 0%,#000 100%);padding:150px 0 58px;border-bottom:3px solid var(--maroon)}
.legal-hero .container{max-width:1120px}
.legal-hero .overline{color:var(--gold);letter-spacing:2.5px;font-size:12px;font-weight:700;text-transform:uppercase}
.legal-hero h1{font-family:var(--display);color:#fff;font-size:clamp(32px,5vw,52px);margin:12px 0 12px;line-height:1.08;font-weight:800}
.legal-hero .legal-eff{color:#9a9a9a;font-size:13.5px;letter-spacing:.3px}
.legal-hero .legal-lede{color:#D4D4D4;font-size:16px;line-height:1.7;max-width:660px;margin-top:18px}
.legal-body{background:#fff;padding:60px 0 96px}
.legal-body .container{max-width:1120px}
.legal-grid{display:grid;grid-template-columns:250px 1fr;gap:64px;align-items:start}
.legal-toc{position:sticky;top:130px;font-size:13.5px}
.legal-toc .toc-head{text-transform:uppercase;letter-spacing:1.5px;font-size:11px;font-weight:700;color:var(--maroon);margin-bottom:14px}
.legal-toc a{display:block;color:#5a5a5a;text-decoration:none;padding:8px 0 8px 16px;border-left:2px solid #e6e6e6;line-height:1.4;transition:color .2s,border-color .2s}
.legal-toc a:hover{color:var(--maroon);border-left-color:var(--maroon)}
.legal-content{max-width:730px}
.legal-content>h2:first-child{margin-top:0}
.legal-content h2{font-family:var(--display);font-size:23px;font-weight:800;color:#1A1A1A;margin:40px 0 14px;scroll-margin-top:130px;display:flex;align-items:center;gap:12px}
.legal-content h2::before{content:"";width:22px;height:3px;background:var(--maroon);flex:none;border-radius:2px}
.legal-content p{color:#3a3a3a;line-height:1.78;margin-bottom:15px;font-size:15.5px}
.legal-content ul{margin:2px 0 20px;padding:0;list-style:none}
.legal-content li{color:#3a3a3a;line-height:1.65;margin-bottom:10px;font-size:15.5px;padding-left:26px;position:relative}
.legal-content li::before{content:"";position:absolute;left:6px;top:9px;width:6px;height:6px;border-radius:50%;background:var(--maroon)}
.legal-content a{color:var(--maroon);text-decoration:underline}
.legal-content strong{color:#1A1A1A}
.legal-callout{background:linear-gradient(180deg,#faf4f2,#f7eeeb);border:1px solid #ecd9d4;border-left:4px solid var(--maroon);border-radius:0 10px 10px 0;padding:20px 24px;margin:24px 0;color:#1A1A1A;font-size:15.5px;line-height:1.7;box-shadow:0 6px 18px rgba(123,32,39,.06)}
.legal-callout .callout-tag{display:block;font-family:var(--display);font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:var(--maroon);font-weight:800;margin-bottom:9px}
@media(max-width:860px){
  .legal-hero{padding:120px 0 44px}
  .legal-grid{grid-template-columns:1fr;gap:0}
  .legal-toc{display:none}
  .legal-content{max-width:none}
}

/* ===== Services overview page ===== */
.srv-hero{background:linear-gradient(160deg,#1F1F1F 0%,#000 100%);padding:150px 0 58px;border-bottom:3px solid var(--maroon)}
.srv-hero .overline{color:var(--gold);letter-spacing:2.5px;font-size:12px;font-weight:700;text-transform:uppercase}
.srv-hero h1{font-family:var(--display);color:#fff;font-size:clamp(32px,5vw,52px);margin:12px 0 14px;line-height:1.08;font-weight:800;max-width:840px}
.srv-hero .srv-lede{color:#D4D4D4;font-size:16.5px;line-height:1.7;max-width:700px}
.srv-jump{display:flex;gap:14px;margin-top:28px;flex-wrap:wrap}
.srv-jump a{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border:1px solid #444;border-radius:6px;color:#fff;text-decoration:none;font-weight:600;font-size:14px;transition:border-color .2s,background .2s}
.srv-jump a:hover{border-color:var(--maroon);background:rgba(123,32,39,.18)}
.srv-section{padding:66px 0}
.srv-section.alt{background:#0d0d0d}
.srv-band{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:38px}
.srv-band .overline{color:var(--gold);letter-spacing:2px;font-size:12px;font-weight:700;text-transform:uppercase}
.srv-band h2{font-family:var(--display);color:#fff;font-size:clamp(26px,3.5vw,38px);font-weight:800;margin-top:6px;line-height:1.1}
.srv-band .srv-sub{color:var(--body-dark);font-size:15px;max-width:620px;margin-top:10px;line-height:1.6}
.srv-more{color:var(--maroon);font-weight:700;text-decoration:none;white-space:nowrap;font-size:14px;flex:none}
.srv-more:hover{text-decoration:underline}
.srv-cat{font-family:var(--display);font-weight:700;font-size:15px;color:#fff;text-transform:uppercase;letter-spacing:1.2px;margin:38px 0 16px;padding-bottom:11px;border-bottom:1px solid var(--rule);display:flex;align-items:center;gap:12px}
.srv-cat::before{content:"";width:20px;height:3px;background:var(--maroon);border-radius:2px;flex:none}
.srv-cat:first-child{margin-top:0}
.srv-grid{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:14px;align-items:start}
.srv-card{display:block;background:var(--charcoal-2);border:1px solid #3a3a3a;border-left:3px solid var(--maroon);border-radius:6px;padding:18px 20px;text-decoration:none;transition:transform .2s,border-left-color .2s,background .2s}
.srv-card:hover{transform:translateY(-3px);background:#333;border-left-color:var(--gold)}
.srv-card h4{font-family:var(--display);font-weight:600;font-size:15.5px;color:#fff;margin-bottom:7px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.srv-card h4 .arr{color:var(--maroon);transition:transform .25s ease;font-size:16px;flex:none;margin-top:1px}
.srv-card:hover h4 .arr{transform:translateX(4px);color:var(--gold)}
.srv-card p{font-size:13px;color:var(--body-dark);line-height:1.55;margin:0}
.srv-cta{background:linear-gradient(135deg,var(--maroon) 0%,var(--maroon-hover) 100%);padding:60px 24px;text-align:center}
.srv-cta h2{font-family:var(--display);color:#fff;font-size:clamp(24px,3vw,34px);font-weight:800;margin-bottom:12px}
.srv-cta p{color:rgba(255,255,255,.88);font-size:16px;margin-bottom:26px;max-width:none;margin-left:auto;margin-right:auto;line-height:1.6}
.srv-cta .srv-cta-btn{display:inline-block;background:#fff;color:var(--maroon);padding:15px 34px;border-radius:6px;font-weight:700;text-decoration:none;font-size:15px;transition:transform .16s}
.srv-cta .srv-cta-btn:hover{transform:translateY(-2px)}
@media(max-width:1140px){.srv-grid{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.srv-grid{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.srv-grid{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:1fr}}
@media(max-width:600px){.srv-hero{padding:120px 0 46px}.srv-section{padding:48px 0}}
.srv-page-hero .srv-hero-sub2{font-size:14.5px;color:#9a9a9a;margin-top:-14px;margin-bottom:30px;max-width:600px}
/* Services light (white) sections */
.srv-section.light{background:#ffffff}
.srv-section.light .srv-band .overline{color:var(--maroon)}
.srv-section.light .srv-band h2{color:#141414}
.srv-section.light .srv-band .srv-sub{color:#4a4a4a}
.srv-section.light .srv-more{color:var(--maroon)}
.srv-section.light .srv-cat{color:#141414;border-bottom-color:#e6e6e6}
/* Services section header with supporting photo */
.srv-band.has-photo{display:grid;grid-template-columns:1fr 430px;gap:50px;align-items:center}
.srv-band-text .srv-more{display:inline-block;margin-top:18px}
.srv-band-photo{border-radius:10px;overflow:hidden;box-shadow:0 16px 40px rgba(0,0,0,.28)}
.srv-band-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center;display:block}
@media(max-width:860px){.srv-band.has-photo{grid-template-columns:1fr;gap:22px}.srv-band-photo{max-width:560px}}
/* Service cards with image */
.srv-card{padding:0;overflow:hidden;display:flex;flex-direction:column}
.srv-card-img{aspect-ratio:16/10;overflow:hidden;background:#111;flex:none}
.srv-card-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease}
.srv-card:hover .srv-card-img img{transform:scale(1.06)}
.srv-card-body{padding:15px 18px 18px;display:flex;flex-direction:column;flex:1}
.srv-card-body h4{margin-bottom:7px}
.srv-card:hover{transform:translateY(-3px)}
/* narrower uniform cards: tighten card content */
.srv-card-img{aspect-ratio:16/11}
.srv-card-body{padding:12px 13px 14px}
.srv-card-body h4{font-size:13.5px;margin-bottom:5px;line-height:1.25}
.srv-card-body p{font-size:11.5px;line-height:1.45}
/* card content standard: 2-line headings, 4-line descriptions -> uniform card height */
.srv-card-body{min-height:0}
.srv-card-body h4{align-items:flex-start;min-height:2.5em;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.srv-card-body h4 .srv-card-title{flex:1;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.srv-card-body p{min-height:5.8em;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
/* Residential = brand red section */
.srv-section.red{background:var(--maroon)}
.srv-section.red .srv-more{color:#fff}
.srv-section.red .srv-cat{border-bottom-color:rgba(255,255,255,.24)}
.srv-section.red .srv-card{border-left-color:var(--gold)}
/* Every Project = black section */
.srv-section.black{background:#000}
/* swap band photo to the left */
.srv-band.has-photo.reverse{grid-template-columns:430px 1fr}
.srv-band.has-photo.reverse .srv-band-photo{order:1}
.srv-band.has-photo.reverse .srv-band-text{order:2}
@media(max-width:860px){.srv-band.has-photo.reverse{grid-template-columns:1fr}.srv-band.has-photo.reverse .srv-band-photo{order:2}.srv-band.has-photo.reverse .srv-band-text{order:1}}
/* Commercial: heading full-width above photo, photo-left + text-right below */
.srv-band-head{display:block;margin-bottom:22px}
.srv-band-split{display:grid;grid-template-columns:430px 1fr;gap:50px;align-items:start;margin-bottom:42px}
.srv-band-split .srv-band-text{align-self:center}
.srv-band-split .srv-sub{margin-bottom:14px;max-width:none}
.srv-band-split .srv-sub:last-of-type{margin-bottom:18px}
.srv-band-split .srv-more{display:inline-block}
@media(max-width:860px){.srv-band-split{grid-template-columns:1fr;gap:22px}}
.srv-band.has-photo{align-items:center}
.srv-band.has-photo .srv-band-text .srv-sub{margin-bottom:13px;max-width:none}
.srv-band.has-photo .srv-band-text .srv-more{display:inline-block;margin-top:6px}
/* ===== Category page (red-dominant) ===== */
.cat-hero .hero-overlay{background:linear-gradient(90deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.74) 46%,rgba(0,0,0,.55) 100%)}
.cat-hero .breadcrumb{color:#e0bcbe}
.cat-hero .breadcrumb a{color:#f0d6d7}
.cat-hero .page-sub{color:#f3dede;max-width:720px}
.cat-band{position:relative;overflow:hidden;background:#ffffff;padding:74px 0 66px}
.cat-band::before{content:"";position:absolute;inset:0;background:url(images/conference-room.jpg) center/cover no-repeat;opacity:.05;pointer-events:none;z-index:0}
.cat-band .container{position:relative;z-index:1;max-width:1240px}
.cat-band .overline{color:var(--maroon);letter-spacing:2px;font-size:12px;font-weight:700;text-transform:uppercase}
.cat-lead{font-family:var(--display);color:#141414;font-size:clamp(20px,2.7vw,37px);font-weight:800;line-height:1.15;max-width:none;margin-top:12px;white-space:nowrap}
.cat-lead-sub{color:#4a4a4a;font-size:16px;line-height:1.7;max-width:none;margin-top:14px;white-space:nowrap}
.cat-services{position:relative;overflow:hidden;background:var(--maroon);padding:40px 0 90px}
.cat-services::before{content:"";position:absolute;inset:0;background:url(images/truss-install.jpg) center/cover no-repeat;opacity:.12;mix-blend-mode:soft-light;pointer-events:none;z-index:0}
.cat-services .container{position:relative;z-index:1;max-width:1240px}
.cat-row{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:stretch;padding:26px 0;border-top:none}
.cat-row-img{border-radius:12px;overflow:hidden;box-shadow:0 22px 48px rgba(0,0,0,.32)}
.cat-row-img img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;transition:transform .5s ease}
.cat-row:hover .cat-row-img img{transform:scale(1.04)}
.cat-row:nth-of-type(even) .cat-row-img{order:2}
.cat-row-text{background:#fff;border-radius:12px;padding:clamp(28px,3.2vw,46px);box-shadow:0 18px 42px rgba(0,0,0,.26);display:flex;flex-direction:column;justify-content:center}
.cat-row-num{font-family:var(--display);font-size:13px;letter-spacing:3px;color:var(--maroon);font-weight:700;margin-bottom:6px}
.cat-row h3{font-family:var(--display);color:#141414;font-size:clamp(22px,2.5vw,30px);font-weight:800;line-height:1.15;margin:0 0 12px}
.cat-row p{color:#4a4a4a;font-size:15.5px;line-height:1.7;margin:0 0 18px}
.cat-more{display:inline-block;align-self:flex-start;color:var(--maroon);font-weight:700;font-size:14.5px;text-decoration:none;border-bottom:2px solid var(--gold);padding-bottom:3px;transition:color .2s}
.cat-more:hover{color:#000}
.cat-cta{position:relative;overflow:hidden;background:#ffffff;padding:70px 24px;text-align:center}
.cat-cta::before{content:"";position:absolute;inset:0;background:url(images/led-frame.jpg) center/cover no-repeat;opacity:.05;pointer-events:none;z-index:0}
.cat-cta .container{position:relative;z-index:1}
.cat-cta h2{font-family:var(--display);color:#141414;font-size:clamp(26px,3vw,36px);font-weight:800;margin-bottom:12px}
.cat-cta p{color:#4a4a4a;font-size:16px;max-width:none;margin:0 auto 26px;line-height:1.65;white-space:nowrap}
.cat-cta .btn-white{display:inline-block;background:var(--maroon);color:#fff;padding:15px 34px;border-radius:6px;font-weight:700;text-decoration:none;font-size:15px;transition:transform .16s,background .2s}
.cat-cta .btn-white:hover{transform:translateY(-2px);background:var(--maroon-hover)}
@media(max-width:820px){.cat-row{grid-template-columns:1fr;gap:20px;padding:30px 0}.cat-row:nth-of-type(even) .cat-row-img{order:0}}
@media(max-width:1080px){.cat-lead,.cat-lead-sub,.cat-cta p{white-space:normal}}

/* Service detail pages: balance headings (no orphan lines) + pretty paragraphs (no 1-2 word widows) */
.page-hero:not(.cat-hero) h1,
.page-intro h2,
.svchub .section-head h2,
.worksec .section-head h2,
.faq .section-head h2,
.final-cta h2,
.svc-card h3{text-wrap:balance}
.page-hero:not(.cat-hero) .page-sub,
.page-intro p,
.svchub .section-head p,
.worksec .section-head p,
.faq .section-head p,
.svc-card-body p,
.faq-a,
.final-cta p{text-wrap:pretty}


/* Alternating-row use-case layout (Audio detail pages): light section-head on the maroon row band */
.cat-services .section-head{max-width:820px;margin:0 auto 44px;text-align:center}
.cat-services .section-head .overline{color:var(--gold)}
.cat-services .section-head h2{color:#fff}
.cat-services .section-head p{color:rgba(255,255,255,0.82)}

/* Balance/pretty for the alternating-row use-case cards (Audio detail pages + category rows) */
.cat-row h3{text-wrap:balance}
.cat-row-text p{text-wrap:pretty}

/* ============================================================
   Page-specific hook sections (differentiation: Option A + C)
   .guide  — decision/spec card strip (dark or light variant)
   .covsec — two-column coverage checklist (security pages)
   .svchub-light — light-background variant of the use-case hub
   ============================================================ */
.guide{padding:clamp(56px,8vw,90px) 0}
.guide.guide-dark{background:var(--charcoal)}
.guide.guide-dark .section-head h2{color:#fff}
.guide.guide-dark .section-head p{color:rgba(255,255,255,0.7)}
.guide.guide-light{background:#fff}
.guide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:1180px;margin:0 auto}
.guide .section-head,.covsec .section-head{max-width:1180px}
.guide .section-head h2,.covsec .section-head h2{text-wrap:balance}
.guide-card{display:flex;flex-direction:column;gap:9px;border-radius:8px;padding:22px 20px 20px}
.guide-card .g-scen{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.guide-card .g-val{min-height:2.2em}
.guide.guide-dark .guide-card{background:var(--charcoal-2);border:1px solid #3a3a3a;border-top:3px solid var(--gold)}
.guide.guide-light .guide-card{background:#fff;border:1px solid #e7e7e7;border-top:3px solid var(--maroon);box-shadow:var(--shadow)}
.guide-card .g-scen{font-family:var(--display);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.09em}
.guide.guide-dark .guide-card .g-scen{color:#e0a08a}
.guide.guide-light .guide-card .g-scen{color:var(--maroon)}
.guide-card .g-val{font-family:var(--display);font-weight:700;font-size:clamp(21px,2.5vw,28px);line-height:1.08}
.guide.guide-dark .guide-card .g-val{color:#fff}
.guide.guide-light .guide-card .g-val{color:var(--charcoal)}
.guide-card .g-note{font-size:13px;line-height:1.55;margin:0}
.guide.guide-dark .guide-card .g-note{color:var(--body-dark)}
.guide.guide-light .guide-card .g-note{color:#555}
@media(max-width:900px){.guide-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.guide-grid{grid-template-columns:1fr}}

.covsec{padding:clamp(56px,8vw,90px) 0;background:#f4f5f6}
.cov-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3.5vw,40px);max-width:1060px;margin:0 auto}
.cov-col{background:#fff;border:1px solid #e7e7e7;border-radius:10px;padding:26px 28px;box-shadow:var(--shadow)}
.cov-col.cov-yes{border-top:3px solid var(--steel)}
.cov-col.cov-no{border-top:3px solid var(--maroon)}
.cov-col h3{font-family:var(--display);font-weight:700;font-size:18px;color:var(--charcoal);margin-bottom:6px}
.cov-col .cov-sub{font-size:13.5px;color:#666;margin-bottom:16px;line-height:1.5}
.cov-list{list-style:none;display:flex;flex-direction:column;gap:12px}
.cov-list li{display:flex;gap:11px;font-size:14.5px;color:#3d3d3d;line-height:1.5}
.cov-list li::before{content:"";flex:none;width:20px;height:20px;border-radius:50%;background-repeat:no-repeat;background-position:center;margin-top:1px}
.cov-yes .cov-list li::before{background-color:rgba(61,107,122,0.12);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%233D6B7A' stroke-width='3'%3E%3Cpath d='M4 12l5 5L20 6'/%3E%3C/svg%3E")}
.cov-no .cov-list li::before{background-color:rgba(123,32,39,0.1);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%237B2027' stroke-width='3'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E")}
@media(max-width:760px){.cov-grid{grid-template-columns:1fr}}

.svchub.svchub-light{background:#fff}
.svchub.svchub-light .section-head h2{color:var(--charcoal)}
.svchub.svchub-light .section-head p{color:#666}
.svchub.svchub-light .svc-card{background:#fff;border:1px solid #e7e7e7;border-left:3px solid var(--maroon);box-shadow:var(--shadow)}
.svchub.svchub-light .svc-card-body h3{color:var(--charcoal)}
.svchub.svchub-light .svc-card-body p{color:#555}

/* ============================================================
   Blended background imagery on content bands (depth/character)
   Same technique as the category pages: a low-opacity cover image
   behind each band — soft-light on the dark bands, faint on light.
   Container is lifted above it so text/cards stay fully crisp.
   ============================================================ */
.stats,.page-intro,.svchub,.process,.worksec,.faq,.contact,.guide,.covsec{position:relative;overflow:hidden}
.stats .container,.page-intro .container,.svchub .container,.process .container,.worksec .container,.faq .container,.contact .container,.guide .container,.covsec .container{position:relative;z-index:1}
.stats::before,.page-intro::before,.svchub::before,.process::before,.worksec::before,.faq::before,.contact::before,.guide::before,.covsec::before{content:"";position:absolute;inset:0;background-position:center;background-size:cover;background-repeat:no-repeat;pointer-events:none;z-index:0}
/* dark bands — soft-light blend keeps them dark, adds texture */
.stats::before{background-image:url(images/truss-install.jpg);opacity:.14;mix-blend-mode:soft-light}
.svchub::before{background-image:url(images/led-wall.jpg);opacity:.10;mix-blend-mode:soft-light}
.process::before{background-image:url(images/mixing-console.jpg);opacity:.09;mix-blend-mode:soft-light}
.faq:not(.faq-light)::before{background-image:url(images/security.jpg);opacity:.08;mix-blend-mode:soft-light}
.contact::before{background-image:url(images/team-rigging.jpg);opacity:.08;mix-blend-mode:soft-light}
.guide.guide-dark::before{background-image:url(images/worship-venue.jpg);opacity:.10;mix-blend-mode:soft-light}
/* light bands — faint, normal blend */
.page-intro::before{background-image:url(images/conference-room.jpg);opacity:.05}
.worksec::before{background-image:url(images/home-rack.jpg);opacity:.05}
.faq.faq-light::before{background-image:url(images/security.jpg);opacity:.05}
.guide.guide-light::before{background-image:url(images/conference-room.jpg);opacity:.05}
.covsec::before{background-image:url(images/security.jpg);opacity:.045}

/* Blended imagery — home + services bands (same technique, all pages) */
.about,.services,.additional,.industries,.projects,.values,.whychoose,.why,.testimonials,.area,.srv-section,.srv-cta{position:relative;overflow:hidden}
.about .container,.services .container,.additional .container,.industries .container,.projects .container,.values .container,.whychoose .container,.why .container,.testimonials .container,.area .container,.srv-section .container,.srv-cta .container{position:relative;z-index:1}
.about::before,.services::before,.additional::before,.industries::before,.projects::before,.values::before,.whychoose::before,.why::before,.testimonials::before,.area::before,.srv-section::before,.srv-cta::before{content:"";position:absolute;inset:0;background-position:center;background-size:cover;background-repeat:no-repeat;pointer-events:none;z-index:0}
/* light bands — faint */
.about::before{background-image:url(images/conference-room.jpg);opacity:.05}
.services::before{background-image:url(images/mixing-console.jpg);opacity:.05}
.industries::before{background-image:url(images/rack.jpg);opacity:.05}
.projects::before{background-image:url(images/led-wall.jpg);opacity:.05}
.whychoose::before{background-image:url(images/team-rigging.jpg);opacity:.05}
.testimonials::before{background-image:url(images/worship-sanctuary.jpg);opacity:.045}
.area::before{background-image:url(images/vans.jpg);opacity:.05}
.srv-section.light::before{background-image:url(images/conference-room.jpg);opacity:.05}
/* dark bands — soft-light */
.additional::before{background-image:url(images/led-wall.jpg);opacity:.10;mix-blend-mode:soft-light}
.values::before{background-image:url(images/truss-install.jpg);opacity:.10;mix-blend-mode:soft-light}
.why::before{background-image:url(images/event-stage.jpg);opacity:.10;mix-blend-mode:soft-light}
.srv-section.black::before{background-image:url(images/led-frame.jpg);opacity:.12;mix-blend-mode:soft-light}
/* maroon bands — soft-light */
.srv-section.red::before{background-image:url(images/truss-install.jpg);opacity:.12;mix-blend-mode:soft-light}
.srv-cta::before{background-image:url(images/led-frame.jpg);opacity:.12;mix-blend-mode:soft-light}

/* ============================================================
   UX enhancements (5): progress bar, back-to-top, sticky mobile
   action bar, hero drift, FAQ reveal, inline form validation.
   Behavior lives in /enhance.js; styling here.
   ============================================================ */
.ux-progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--maroon),var(--gold));z-index:1200;pointer-events:none}
.ux-top{position:fixed;bottom:22px;left:22px;width:44px;height:44px;border-radius:50%;background:rgba(26,26,26,.72);color:#fff;border:1px solid rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .3s,transform .3s;z-index:290;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.ux-top.show{opacity:1;transform:none;pointer-events:auto}
.ux-top svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:2}
.ux-bar{position:fixed;left:0;right:0;bottom:0;display:none;z-index:250;background:rgba(18,18,20,.96);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid rgba(255,255,255,.12);padding:9px 12px;gap:10px}
.ux-bar a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-radius:10px;font-family:var(--display);font-weight:700;font-size:14px;text-decoration:none}
.ux-bar .call{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.28)}
.ux-bar .quote{background:var(--maroon);color:#fff}
.ux-bar svg{width:16px;height:16px;fill:currentColor}
@media(max-width:860px){
  .ux-bar{display:flex}
  body{padding-bottom:66px}
  /* Declutter the mobile bottom: the Call | Text | Quote bar is the single
     action bar. The floating phone (redundant with the bar's Call) and the
     Get More Info pill are hidden on mobile so they don't stack over it. */
  .scope-btn{display:none !important}
  .float-call{display:none !important}
  .ux-top{bottom:80px;left:16px;width:40px;height:40px}
  /* Force the eyebrow to break after "Empire's" and keep line 2 on one row. */
  .hero-br{display:inline}
  .hero .overline{letter-spacing:.13em;font-size:12px}
}

/* ============================================================
   MOBILE TEXT POLISH — keep labels, CTAs, and card titles to a
   single line, and reformat the service-area cities as chips so
   they don't read as a long plain list. Applied sitewide.
   ============================================================ */
@media(max-width:680px){
  /* CTA buttons: tighter tracking + size so labels stay on one line
     (e.g. "Read all reviews on Google" no longer wraps). */
  .btn{letter-spacing:.3px;font-size:14px;padding:15px 22px}

  /* Sub-service card titles on one line. */
  .acard .card-body{padding:22px 20px}
  .acard h3{font-size:16px;line-height:1.25;margin-bottom:10px;text-wrap:balance}

  /* Service-area cities: wrapping pill chips instead of a stacked list. */
  .area-cities{grid-template-columns:none;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
  .area-cities li{
    background:#fff;border:1px solid rgba(123,32,39,.22);color:var(--maroon);
    font-family:var(--display);font-weight:600;font-size:13px;line-height:1;
    padding:9px 15px;border-radius:999px;box-shadow:0 1px 3px rgba(0,0,0,.06);
  }
  .area-cities li::before{display:none}

  /* Tag / badge pills never wrap to a second line. */
  .proj-badge,.g-badge{white-space:nowrap}
}

/* ============================================================
   MOBILE UX REVIEW FIXES — sitewide interior-page polish.
   ============================================================ */
@media(max-width:680px){
  /* 2. Breadcrumbs: keep to one line (scroll if long) instead of wrapping. */
  .breadcrumb{white-space:nowrap;overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none}
  .breadcrumb::-webkit-scrollbar{display:none}

  /* 3. Center the blog / guide / legal hero header blocks to match the
     centered heroes on the rest of the site. Body copy stays left-aligned. */
  .blog-hero .container,.legal-hero .container{text-align:center}
  .blog-hero .page-sub,.legal-hero .legal-lede{margin-left:auto;margin-right:auto}

  /* 4. Trust bar: on mobile keep only the license credential so the strip is a
     single clean line. Years + Inland Empire location appear elsewhere (hero,
     stats, footer), so nothing important is lost. */
  .trust-bar .container{padding:6px 16px}
  .trust-bar .container span:nth-of-type(n+2){display:none}

  /* 5. Hero sub-copy: tighter leading + margin so long intros scan better. */
  .hero-sub,.page-hero .page-sub{line-height:1.5;margin-bottom:24px}
}
@keyframes uxFaqReveal{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.faq-item[open] .faq-a{animation:uxFaqReveal .28s ease}
.field.ux-valid input,.field.ux-valid textarea,.field.ux-valid select{border-color:#3a9d5d;box-shadow:0 0 0 1px rgba(58,157,93,.25)}
.field.ux-invalid input,.field.ux-invalid textarea,.field.ux-invalid select{border-color:#d14b4b;box-shadow:0 0 0 1px rgba(209,75,75,.22)}
.ux-err{display:none;color:#d14b4b;font-size:12.5px;margin-top:5px}
.field.ux-invalid .ux-err{display:block}
@media (prefers-reduced-motion: reduce){
  .faq-item[open] .faq-a{animation:none}
  .ux-top{transition:none}
}

/* ============================================================
   "Fun" features: process signal-flow, confetti/toast/copy,
   before-after wipe, pixel-pitch calculator. JS in /enhance.js.
   ============================================================ */
/* 1. Signal flow across the process steps */
.ux-signal{position:absolute;left:8%;right:8%;top:-4px;height:2px;background:rgba(255,255,255,.12);z-index:0;border-radius:2px}
.ux-signal .fill{position:absolute;left:0;top:0;height:100%;width:0;border-radius:2px;background:linear-gradient(90deg,var(--maroon),var(--gold))}
.ux-signal.go .fill{width:100%;transition:width 1.9s ease}
.ux-signal .dot{position:absolute;top:50%;left:0;width:11px;height:11px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px 3px rgba(224,169,58,.7);transform:translate(-50%,-50%);opacity:0}
.ux-signal.go .dot{opacity:1;animation:uxTravel 1.9s ease forwards}
@keyframes uxTravel{from{left:0}to{left:100%}}
@media(max-width:840px){.ux-signal{display:none}}

/* 2. Confetti canvas + toast + copy chip */
.ux-confetti{position:fixed;inset:0;pointer-events:none;z-index:2000}
.ux-toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%) translateY(12px);background:rgba(24,24,26,.96);color:#fff;padding:10px 18px;border-radius:999px;font-size:14px;font-weight:600;z-index:2001;opacity:0;transition:opacity .25s,transform .25s;pointer-events:none;border:1px solid rgba(255,255,255,.16)}
.ux-toast.show{opacity:1;transform:translateX(-50%)}
.ux-copy{display:inline-flex;align-items:center;gap:5px;margin-left:8px;padding:2px 9px;border-radius:999px;border:1px solid rgba(150,150,150,.4);background:transparent;color:inherit;font:inherit;font-size:11.5px;cursor:pointer;opacity:.75;vertical-align:middle}
.ux-copy:hover{opacity:1;border-color:var(--maroon)}

/* 3. Before / After wipe */
.ba-sec{padding:clamp(56px,8vw,96px) 0}
.ba{--p:50%;position:relative;max-width:1000px;margin:0 auto;border-radius:14px;overflow:hidden;aspect-ratio:16/9;user-select:none;touch-action:pan-y;box-shadow:0 24px 60px rgba(0,0,0,.35);cursor:ew-resize}
.ba .lyr{position:absolute;inset:0}
.ba .lyr img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.ba .before img{filter:grayscale(.9) brightness(.38) contrast(.95)}
.ba .after{clip-path:inset(0 calc(100% - var(--p)) 0 0)}
.ba .tag{position:absolute;bottom:14px;font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.5);padding:5px 12px;border-radius:999px;z-index:3}
.ba .tag.b{right:14px}.ba .tag.a{left:14px}
.ba .handle{position:absolute;top:0;bottom:0;left:var(--p);width:2px;background:#fff;transform:translateX(-1px);z-index:4}
.ba .handle::before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:42px;height:42px;border-radius:50%;background:#fff;box-shadow:0 3px 12px rgba(0,0,0,.45)}
.ba .handle::after{content:"\2039\00a0\203a";position:absolute;top:50%;left:50%;transform:translate(-50%,-52%);color:var(--maroon);font-weight:800;font-size:18px;letter-spacing:2px}

/* 4. Pixel-pitch calculator */
.pp{max-width:940px;margin:0 auto;background:#111114;border:1px solid #2a2a30;border-top:2px solid var(--gold);border-radius:16px;padding:clamp(24px,4vw,42px)}
.pp-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,44px);align-items:center}
@media(max-width:700px){.pp-row{grid-template-columns:1fr;gap:26px}}
.pp label{display:block;font-family:var(--display);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#9a958c;margin-bottom:10px}
.pp .dist{font-family:var(--display);font-weight:800;font-size:clamp(28px,4vw,40px);color:#fff}
.pp input[type=range]{width:100%;margin-top:16px;accent-color:var(--maroon);height:6px}
.pp .out .lbl{font-family:var(--display);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#9a958c;margin-bottom:6px}
.pp .out .big{font-family:var(--display);font-weight:800;font-size:clamp(30px,5vw,50px);color:var(--gold);line-height:1;text-shadow:0 0 22px rgba(224,169,58,.3)}
.pp .out .scen{font-size:14px;color:#b9b4ab;margin-top:10px}
.pp .grid{display:flex;flex-wrap:wrap;gap:5px;margin-top:18px;max-width:200px}
.pp .grid i{display:block;background:var(--steel);border-radius:2px;box-shadow:0 0 6px rgba(61,107,122,.5)}


/* ---------- Blog ---------- */
.blog-hero{position:relative;background:#5a171c;background-size:cover;background-position:center;color:#fff;padding:calc(var(--header-h) + 52px) 0 64px;min-height:46vh;display:flex;align-items:center;overflow:hidden}
.blog-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(123,32,39,.93),rgba(16,6,8,.82))}
.blog-hero.has-img::before{background:linear-gradient(115deg,rgba(52,12,15,.95) 0%,rgba(90,23,28,.82) 55%,rgba(12,5,7,.92) 100%)}
.blog-hero > .container{position:relative;z-index:1}
.blog-hero .breadcrumb,.blog-hero .breadcrumb a{color:#f2cdd0}
.blog-hero .breadcrumb a:hover{color:#fff}
.blog-hero h1{margin:.2em 0 .35em;font-size:clamp(2.2rem,4.8vw,3.4rem);line-height:1.1;color:#fff;max-width:20ch}
.blog-hero .page-sub{color:rgba(255,255,255,.86);max-width:62ch}
.blog-meta{font-size:.9rem;color:rgba(255,255,255,.72);letter-spacing:.02em;margin:0}

.blog-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:52px;align-items:start;padding:52px 0 8px}
.blog-article{color:var(--body-dark);font-size:1.075rem;line-height:1.85;min-width:0}
.blog-article > p:first-of-type::first-letter{float:left;font-family:var(--display);font-weight:800;font-size:4.4rem;line-height:.72;margin:.02em .14em 0 0;color:var(--maroon)}
.blog-article > p:first-of-type{font-size:1.2rem;line-height:1.7;color:#ededed;margin-bottom:1.4em}
.blog-article h2{font-size:1.5rem;margin:2.1em 0 .6em;line-height:1.25;color:#fff;padding-left:16px;border-left:3px solid var(--maroon)}
.blog-article h2:first-child{margin-top:0}
.blog-article h3{font-size:1.22rem;margin:1.7em 0 .5em;color:#f3efe8}
.blog-article p{margin:0 0 1.25em;color:var(--body-dark)}
.blog-article ul,.blog-article ol{margin:0 0 1.4em 1.3em;padding:0}
.blog-article li{margin:.5em 0;padding-left:.25em}
.blog-article li::marker{color:var(--maroon)}
.blog-article strong{color:#fff;font-weight:700}
.blog-article a{color:var(--gold);text-decoration:underline;text-underline-offset:2px}
.blog-article a:hover{color:#f0c469}

.blog-cta{margin:44px 0 0;padding:34px 30px;background:linear-gradient(135deg,#7B2027,#5a171c);border-radius:16px;text-align:center;color:#fff}
.blog-cta h2{margin:0 0 .4em;font-size:1.35rem;color:#fff;border:0;padding:0}
.blog-cta p{margin:0 0 1.3em;color:rgba(255,255,255,.88);line-height:1.6}

.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;padding:48px 0 72px}
.blog-card{display:flex;flex-direction:column;background:#141414;border:1px solid #2a2a2a;border-radius:14px;overflow:hidden;transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease;text-decoration:none;color:inherit}
.blog-card:hover{border-color:var(--maroon);transform:translateY(-3px);box-shadow:0 14px 34px -16px rgba(0,0,0,.6)}
.blog-card .bc-body{padding:24px;display:flex;flex-direction:column;gap:10px;flex:1}
.blog-card .bc-date{font-size:.74rem;color:var(--gold);font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.blog-card h2{font-size:1.16rem;margin:0;line-height:1.32;color:#fff}
.blog-card p{margin:0;color:var(--body-dark);font-size:.93rem;line-height:1.6;flex:1}
.blog-card .bc-more{color:#e8b04a;font-weight:700;font-size:.9rem;margin-top:2px}
@media (max-width:600px){.blog-article{padding:38px 0 8px;font-size:1.02rem}.blog-article > p:first-of-type{font-size:1.1rem}}

/* blog: card image + related */
.blog-card .bc-img{aspect-ratio:16/10;overflow:hidden;background:#0d0d0d}
.blog-card .bc-img img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.blog-card:hover .bc-img img{transform:scale(1.05)}
.blog-related{border-top:1px solid var(--rule);margin-top:24px}
.blog-related .blog-grid{padding:40px 0 64px}
.blog-related-h{color:#fff;font-size:1.4rem;margin:44px 0 4px;padding-left:16px;border-left:3px solid var(--maroon)}

/* blog: two-column sidebar */
.blog-sidebar{display:flex;flex-direction:column;gap:22px;position:sticky;top:calc(var(--header-h) + 16px)}
.side-card{background:#141414;border:1px solid #2a2a2a;border-radius:14px;padding:22px}
.side-h{color:#fff;font-size:1.05rem;margin:0 0 16px;padding-left:12px;border-left:3px solid var(--maroon)}
.side-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:15px}
.side-list a{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--body-dark)}
.side-num{color:rgba(224,169,58,.5);font-family:var(--display);font-weight:800;font-size:1.35rem;width:16px;flex:none;line-height:1}
.side-thumb{width:52px;height:52px;flex:none;border-radius:8px;overflow:hidden;background:#0d0d0d}
.side-thumb img{width:100%;height:100%;object-fit:cover}
.side-t{font-size:.9rem;font-weight:600;color:#ededed;line-height:1.35}
.side-list a:hover .side-t{color:var(--gold)}
.side-links{list-style:none;margin:0;padding:0}
.side-links a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 2px;text-decoration:none;color:#ededed;font-weight:600;font-size:.92rem;border-bottom:1px solid #232323}
.side-links li:last-child a{border-bottom:0}
.side-links a:hover{color:var(--gold)}
.side-chev{width:15px;height:15px;color:var(--maroon);flex:none}
.side-cta{background:linear-gradient(135deg,#7B2027,#5a171c);border-radius:14px;padding:24px;text-align:center}
.side-cta h2{color:#fff;font-size:1.15rem;margin:0 0 .4em;border:0;padding:0}
.side-cta p{color:rgba(255,255,255,.85);font-size:.9rem;margin:0 0 1em;line-height:1.55}
@media (max-width:900px){.blog-layout{grid-template-columns:1fr;gap:0}.blog-sidebar{position:static;margin-top:44px}}

.pha-hours{display:block;margin-top:6px;font-size:.9em;opacity:.85}
.fc-hours{margin-top:4px}

/* Mobile tap-target sizing (>=44px) for text links */
@media(max-width:680px){
  .foot-col ul{gap:4px}
  .foot-col ul li a{min-height:44px;display:inline-flex;align-items:center}
  .foot-contact a.fc-phone{min-height:44px;display:inline-flex;align-items:center;margin-bottom:6px}
  .foot-bottom{gap:2px}
  .foot-bottom a{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
  .breadcrumb a{min-height:40px;display:inline-flex;align-items:center}
  .work-tile .wt-label{font-size:11px}
}

/* ===== Meet the Team page ===== */
.team-sec{padding:clamp(56px,8vw,90px) 0;background:#fff}
.team-sec .section-head{max-width:820px;margin:0 auto 48px;text-align:center}
.team-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:28px;max-width:1180px;margin:0 auto}
.team-card{flex:0 1 340px;max-width:360px;display:flex;flex-direction:column;background:#fff;border:1px solid #e7e7e7;border-top:3px solid var(--maroon);border-radius:10px;overflow:hidden;box-shadow:var(--shadow)}
.team-photo{aspect-ratio:1/1;overflow:hidden;background:#f0f0f0}
.team-photo img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block}
.team-card-body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:8px}
.team-name{font-family:var(--display);font-weight:800;font-size:19px;color:var(--charcoal);line-height:1.15;margin:0}
.team-role{font-family:var(--display);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.09em;color:var(--maroon);margin:0}
.team-bio{font-size:14.5px;line-height:1.62;color:var(--body-light);margin:2px 0 0}
@media(max-width:600px){.team-card{flex:1 1 100%;max-width:420px}}

/* ===== About: full-width, single-line section intros ===== */
/* Team section heading + supporting line span the full page width */
.team-sec .section-head{max-width:none}
/* Our Story intro sits full-width above the two-column body */
.about-story .story-head{max-width:none;margin-bottom:44px}
.about-story .story-head .why-accent{margin-bottom:18px}
.about-story .story-head .overline{display:block;margin-bottom:12px}
.about-story .story-head h2{color:#fff;font-size:clamp(30px,3.3vw,44px);line-height:1.08;margin:0 0 18px}
.about-story .story-head h2 span{color:var(--maroon)}
.about-story .story-head .why-lead{color:#fff;max-width:none;margin:0}
/* Balance the two columns: crop the portrait shot to landscape so the image
   column matches the height of the 4 credential steps (homepage .why parity) */
.about-story .why-grid{align-items:center}
.about-story .why-left .why-img-wrap img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center 32%;border-radius:14px}
/* On wide desktop, force the intro headings + their supporting line onto a single
   full-width line. Fonts trimmed just enough that nowrap never overflows the
   container at the 1280px breakpoint. Below 1280 everything wraps normally. */
@media(min-width:1280px){
  .team-sec .section-head h2,
  .team-sec .section-head p,
  .about-story .story-head h2,
  .about-story .story-head .why-lead{white-space:nowrap}
  .team-sec .section-head p{font-size:17px}
  .about-story .story-head .why-lead{font-size:16px}
}

/* ===== About closing CTA band ===== */
.about-cta{background:var(--maroon);padding:84px 0}
.about-cta-inner{max-width:1040px;margin:0 auto;text-align:center}
.about-cta-inner h2{white-space:nowrap}
@media(max-width:640px){.about-cta-inner h2{white-space:normal}}
.about-cta-inner h2{color:#fff;font-family:var(--display);font-size:clamp(28px,4vw,44px);line-height:1.08;margin:0 0 16px}
.about-cta-inner p{color:rgba(255,255,255,.86);font-size:clamp(16px,1.6vw,18px);line-height:1.6;margin:0 auto 28px;max-width:820px}
.about-cta-inner .hero-cta{justify-content:center}
/* Primary button on the maroon band: invert to white so it doesn't read as maroon-on-maroon */
.about-cta-inner .btn-primary{background:#fff;color:var(--maroon);border-color:#fff}
.about-cta-inner .btn-primary:hover{background:rgba(255,255,255,.88);color:var(--maroon);border-color:#fff}
.about-cta-inner .btn-ghost{border-color:rgba(255,255,255,.55);color:#fff}
.about-cta-inner .btn-ghost:hover{background:#fff;color:var(--maroon);border-color:#fff}
/* About "Core Values" intro: full-width so it reads as 2 lines, not 3 */
.about-values .section-head{max-width:none}
.about-values .section-head p{max-width:none;font-size:16px}

/* ===== Meet the Team scroll-reveal hero ===== */
.team-reveal{position:relative;height:220vh;background:var(--charcoal)}
.team-reveal-sticky{position:sticky;top:0;height:100vh;overflow:hidden}
.team-reveal-bg{position:absolute;inset:0;background-size:cover;background-position:center 32%;transform:scale(1.25);transform-origin:center;will-change:transform}
.team-reveal-overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(10,10,10,0.55) 0%, rgba(10,10,10,0.35) 45%, rgba(10,10,10,0.8) 100%);opacity:.72;will-change:opacity}
.team-reveal-inner{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;height:100%}
.team-reveal-content{max-width:780px;will-change:opacity,transform}
.team-reveal-content .breadcrumb{color:rgba(255,255,255,0.6)}
.team-reveal-content .breadcrumb a{color:rgba(255,255,255,0.92);text-decoration:underline;text-underline-offset:2px}
.team-reveal-content h1{color:#fff;font-size:clamp(40px,6vw,72px);line-height:1.02;margin:10px 0 0}
.team-reveal-content .page-sub{color:rgba(255,255,255,0.85);margin-top:18px}
.team-reveal-content .hero-cta{margin-top:26px}
.team-reveal-hint{position:absolute;left:0;right:0;bottom:30px;text-align:center;color:rgba(255,255,255,0.7);font-family:var(--display);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.team-reveal-hint span{display:block;margin-top:6px;font-size:16px;animation:teamHint 1.7s ease-in-out infinite}
@keyframes teamHint{0%,100%{transform:translateY(0);opacity:.7}50%{transform:translateY(7px);opacity:1}}

/* Mobile: no pinned reveal, show the whole crew clearly, heading below */
@media(max-width:768px){
  .team-reveal{height:auto}
  .team-reveal-sticky{position:relative;height:auto;overflow:visible}
  .team-reveal-bg{position:relative;inset:auto;width:100%;aspect-ratio:16/10;transform:none!important}
  .team-reveal-overlay{display:none}
  .team-reveal-inner{position:relative;inset:auto;height:auto;padding:40px 0 8px;background:var(--charcoal)}
  .team-reveal-content h1{font-size:clamp(32px,9vw,44px)}
  .team-reveal-hint{display:none}
}

/* Reduced motion: static, clear hero */
@media(prefers-reduced-motion:reduce){
  .team-reveal{height:auto}
  .team-reveal-sticky{position:relative;height:auto;min-height:78vh}
  .team-reveal-bg{transform:none!important}
  .team-reveal-overlay{opacity:.5!important}
  .team-reveal-hint{display:none}
}