:root{
    --black:#0a0a0c; --ink:#101013; --panel:#16161a; --panel2:#1c1c22;
    --red:#E2161E; --red-bright:#FF2A33; --red-deep:#9e0f15;
    --chrome-1:#f4f4f6; --chrome-2:#c7c7cf; --chrome-3:#8c8c96; --chrome-4:#54545c;
    --white:#f5f5f7; --muted:#9a9aa4; --line:rgba(255,255,255,.10);
    --safe-b:env(safe-area-inset-bottom,0px);
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{background:var(--black);color:var(--white);font-family:'Inter',sans-serif;line-height:1.6;overflow-x:hidden;-webkit-tap-highlight-color:transparent}
  ::selection{background:var(--red);color:#fff}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;height:auto;display:block}
  .wrap{max-width:1200px;margin:0 auto;padding:0 22px}

  h1,h2,h3,.display{font-family:'Saira Condensed',sans-serif;font-weight:800;text-transform:uppercase;line-height:.92;letter-spacing:.5px}
  .eyebrow{font-family:'Saira Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:4px;font-size:.8rem;color:var(--red-bright)}

  /* chrome text */
  .chrome{background:linear-gradient(180deg,#ffffff 0%,#e6e6ea 38%,#9fa0a8 52%,#f2f2f5 70%,#bdbdc6 100%);
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
    filter:drop-shadow(0 1px 0 rgba(0,0,0,.5))}
  .red{color:var(--red-bright)}

  /* buttons with shine sweep */
  .btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
    font-family:'Saira Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:2px;
    font-size:1rem;padding:1rem 1.9rem;border-radius:6px;cursor:pointer;border:none;overflow:hidden;
    transition:transform .18s ease, box-shadow .18s ease;isolation:isolate}
  .btn::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
    transform:skewX(-22deg);transition:left .6s ease;z-index:2}
  .btn:hover::after{left:130%}
  .btn-red{background:linear-gradient(180deg,var(--red-bright),var(--red-deep));color:#fff;
    box-shadow:0 8px 26px rgba(226,22,30,.45), inset 0 1px 0 rgba(255,255,255,.25)}
  .btn-red:hover{transform:translateY(-2px);box-shadow:0 14px 36px rgba(255,42,51,.6), inset 0 1px 0 rgba(255,255,255,.3)}
  .btn-chrome{background:linear-gradient(180deg,#f6f6f8,#b9b9c2 52%,#86868f);color:#0a0a0c;
    box-shadow:0 8px 24px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.7)}
  .btn-chrome:hover{transform:translateY(-2px)}
  .btn-ghost{background:rgba(255,255,255,.04);color:var(--white);border:1px solid var(--line)}
  .btn-ghost:hover{border-color:var(--red);color:var(--red-bright)}

  /* ---------- NAV ---------- */
  header{position:sticky;top:0;z-index:100;background:rgba(10,10,12,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  nav{display:flex;align-items:center;justify-content:space-between;height:72px}
  .brand{display:flex;align-items:center;gap:12px}
  .brand img{height:46px;width:auto}
  .brand b{font-family:'Saira Condensed';font-weight:800;font-size:1.15rem;letter-spacing:1px;text-transform:uppercase;line-height:1;display:block}
  .brand small{display:block;font-family:'Saira Condensed';font-weight:600;font-size:.62rem;letter-spacing:3px;color:var(--red-bright);text-transform:uppercase}
  .nav-links{display:flex;gap:28px;align-items:center}
  .nav-links a{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:1.5px;font-size:.92rem;color:var(--white);opacity:.8;transition:.15s}
  .nav-links a:not(.nav-cta):hover{opacity:1;color:var(--red-bright)}
  .nav-cta{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--red-bright),var(--red-deep));color:#fff!important;padding:.6rem 1.2rem;border-radius:5px;opacity:1!important;letter-spacing:1.5px;box-shadow:0 4px 16px rgba(226,22,30,.4)}
  .nav-toggle{display:none;background:none;border:none;color:var(--white);cursor:pointer;padding:8px}
  .nav-toggle svg{width:28px;height:28px}
  .mobile-menu{display:none;position:fixed;top:72px;left:0;right:0;bottom:0;height:calc(100vh - 72px);z-index:99;background:rgba(10,10,12,.98);backdrop-filter:blur(10px);flex-direction:column;padding:30px 22px;gap:4px;overflow-y:auto;-webkit-overflow-scrolling:touch}
  .mobile-menu.open{display:flex}
  .mobile-menu a{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:2px;font-size:1.3rem;padding:16px 4px;border-bottom:1px solid var(--line);color:var(--white)}
  .mobile-menu a:hover{color:var(--red-bright)}
  .mobile-menu .btn{margin-top:18px}
  @media(max-width:920px){.nav-links{display:none}.nav-toggle{display:block}.brand small{display:none}}

  /* ---------- HERO ---------- */
  .hero{position:relative;text-align:center;padding:60px 0 76px;overflow:hidden}
  .hero::before{content:"";position:absolute;inset:0;
    background:radial-gradient(ellipse 60% 50% at 50% 30%,rgba(226,22,30,.22),transparent 68%);pointer-events:none}
  .hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent)}
  .hero-logo{position:relative;width:min(340px,72vw);height:auto;margin:0 auto 26px;filter:drop-shadow(0 10px 30px rgba(226,22,30,.4)) drop-shadow(0 20px 50px rgba(0,0,0,.7));animation:floaty 5s ease-in-out infinite}
  @keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
  .hero h1{position:relative;font-size:clamp(2.6rem,7vw,5.2rem);margin-bottom:4px}
  .hero h1 .l2{display:block}
  .hero h1 .h1-sub{display:block;font-size:clamp(1.1rem,2.6vw,2rem);font-weight:700;color:var(--red-bright);letter-spacing:.03em;margin-top:.2em}
  .hero .tag{position:relative;font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:3px;color:var(--white);font-size:clamp(1rem,2.4vw,1.4rem);margin-top:12px}
  .hero .tag .red{color:var(--red-bright)}
  .hero .lede{position:relative;font-size:1.1rem;color:#cfcfd6;max-width:580px;margin:18px auto 30px}
  .hero-cta{position:relative;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
  .hero-phone{position:relative;margin-top:24px;display:inline-flex;align-items:center;gap:10px;font-family:'Saira Condensed';font-weight:800;font-size:1.8rem;color:var(--white);letter-spacing:1px}
  .hero-phone svg{width:22px;height:22px;color:var(--red-bright)}
  .hero-loc{position:relative;margin-top:12px;font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:2px;font-size:.82rem;color:var(--muted)}

  /* ---------- TRUST BAR ---------- */
  .trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(180deg,var(--ink),var(--black))}
  .trust .wrap{display:flex;flex-wrap:wrap;justify-content:space-around;gap:16px;padding:22px}
  .trust-item{display:flex;align-items:center;gap:13px;text-align:left}
  .trust-item .ti-ic{width:42px;height:42px;border-radius:50%;border:1.5px solid var(--red);display:flex;align-items:center;justify-content:center;color:var(--red-bright);flex-shrink:0;box-shadow:0 0 16px rgba(226,22,30,.3) inset}
  .trust-item .ti-ic svg{width:22px;height:22px}
  .trust-num{font-family:'Saira Condensed';font-weight:800;font-size:1.4rem;line-height:1}
  .trust-lbl{font-family:'Saira Condensed';font-weight:600;text-transform:uppercase;letter-spacing:1px;font-size:.72rem;color:#cfcfd6;line-height:1.2}
  .stars-sm{color:var(--red-bright);letter-spacing:2px;font-size:.95rem}
  @media(max-width:760px){
    .trust .wrap{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:18px 16px}
    .trust-item{flex-direction:column;text-align:center;gap:9px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px 12px}
  }

  /* ---------- SECTIONS ---------- */
  .sec{padding:84px 0}
  .sec-head{margin-bottom:42px}
  .sec-head.center{text-align:center}
  .sec-head h2{font-size:clamp(2.1rem,5vw,3.6rem)}
  .sec-head .eyebrow{display:block;margin-bottom:10px}
  .sec-head p{color:var(--muted);margin-top:12px;max-width:600px}
  .sec-head.center p{margin-left:auto;margin-right:auto}

  /* ---------- SERVICES CAROUSEL ---------- */
  .services{background:linear-gradient(180deg,var(--black),var(--ink))}
  .carousel{position:relative}
  .track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 20px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .track::-webkit-scrollbar{display:none}
  .scard{scroll-snap-align:center;flex:0 0 310px;position:relative;border-radius:14px;padding:32px 28px;overflow:hidden;
    background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);transition:.25s}
  .scard::before{content:"";position:absolute;inset:0;border-radius:14px;padding:1px;
    background:linear-gradient(180deg,rgba(255,42,51,.6),transparent 60%);
    -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
    opacity:0;transition:opacity .25s}
  .scard.active::before,.scard:hover::before{opacity:1}
  .scard.active,.scard:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(0,0,0,.55)}
  .scard .si{width:50px;height:50px;border-radius:11px;display:flex;align-items:center;justify-content:center;margin-bottom:18px;
    background:linear-gradient(180deg,#222228,#141418);border:1px solid var(--line);color:var(--red-bright)}
  .scard .si svg{width:26px;height:26px}
  .scard h3{font-size:1.45rem;margin-bottom:8px;letter-spacing:.5px}
  .scard p{color:var(--muted);font-size:.93rem}
  .car-ctrl{display:flex;align-items:center;justify-content:space-between;margin-top:16px;gap:16px}
  .dots{display:flex;gap:8px;flex-wrap:wrap}
  .dot{width:9px;height:9px;border-radius:50%;background:var(--line);border:none;cursor:pointer;padding:0;transition:.2s}
  .dot.on{background:var(--red-bright);width:26px;border-radius:5px;box-shadow:0 0 10px rgba(255,42,51,.6)}
  .arrows{display:flex;gap:10px}
  .arrows button{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--panel);color:var(--white);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s}
  .arrows button:hover{border-color:var(--red);color:var(--red-bright)}
  .arrows svg{width:20px;height:20px}
  @media(max-width:560px){.scard{flex-basis:84vw}}

  /* ---------- TINT OPTIONS (VLT) ---------- */
  .tint{background:var(--ink);border-top:1px solid var(--line)}
  .tint-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
  .swatch{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line);aspect-ratio:3/4;display:flex;flex-direction:column;justify-content:flex-end;cursor:default;transition:.2s}
  .swatch:hover{transform:translateY(-4px);border-color:rgba(255,42,51,.5);box-shadow:0 14px 30px rgba(0,0,0,.5)}
  .swatch .glass{position:absolute;inset:0;z-index:0}
  .swatch .lbl{position:relative;z-index:1;padding:14px 14px 16px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.85))}
  .swatch .pct{font-family:'Saira Condensed';font-weight:800;font-size:1.5rem;line-height:1}
  .swatch .name{font-family:'Saira Condensed';font-weight:600;text-transform:uppercase;letter-spacing:1.5px;font-size:.68rem;color:#cfcfd6;margin-top:2px}
  .tint-note{text-align:center;color:var(--muted);font-size:.9rem;margin-top:22px}
  @media(max-width:680px){.tint-grid{grid-template-columns:repeat(5,1fr);gap:8px}.swatch .pct{font-size:1.05rem}.swatch .name{font-size:.55rem;letter-spacing:.5px}}

  /* ---------- GALLERY ---------- */
  .gallery{background:linear-gradient(180deg,var(--ink),var(--black))}
  .g-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:200px;gap:14px}
  .g-item{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--panel)}
  .g-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
  .g-item::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.6));opacity:.5;transition:.3s}
  .g-item:hover img{transform:scale(1.08)}
  .g-item:hover::after{opacity:.85}
  .g-item .cap{position:absolute;left:14px;bottom:12px;z-index:2;font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:1.5px;font-size:.8rem;opacity:0;transform:translateY(6px);transition:.3s}
  .g-item:hover .cap{opacity:1;transform:none}
  .g-tall{grid-row:span 2}
  .g-wide{grid-column:span 2}
  @media(max-width:880px){.g-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:150px}.g-wide{grid-column:span 2}.g-tall{grid-row:span 2}}

  /* ---------- REVIEWS ---------- */
  .reviews{background:var(--ink);border-top:1px solid var(--line)}
  .rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  .rev{position:relative;border-radius:14px;padding:30px 28px;background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line)}
  .rev .stars{color:var(--red-bright);font-size:1.05rem;letter-spacing:3px;margin-bottom:14px}
  .rev .quote{font-size:.95rem;color:#d6d6dc;line-height:1.65}
  .rev .who{margin-top:18px;font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:1.5px;font-size:.86rem;color:var(--white)}
  .rev .who span{display:block;font-family:'Inter';text-transform:none;letter-spacing:0;font-weight:400;font-size:.74rem;color:var(--muted);margin-top:2px}
  @media(max-width:880px){.rev-grid{grid-template-columns:1fr}}

  /* ---------- SERVICE AREA ---------- */
  .area{background:linear-gradient(180deg,var(--black),var(--ink));border-top:1px solid var(--line)}
  .area-grid{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center}
  .area-map{border-radius:14px;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3;background:var(--panel)}
  .area-map iframe{width:100%;height:100%;border:0;filter:invert(1) hue-rotate(175deg) brightness(.78) contrast(1.15) saturate(.85) sepia(.25)}
  .city-list{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:22px}
  .city{display:flex;align-items:center;gap:10px;font-family:'Saira Condensed';font-weight:600;letter-spacing:.5px;color:#d6d6dc;font-size:1rem}
  .city svg{width:16px;height:16px;color:var(--red-bright);flex-shrink:0}
  .area .addr{margin-top:22px;font-size:.95rem;color:var(--muted)}
  .area .addr a{color:var(--red-bright)}
  @media(max-width:880px){.area-grid{grid-template-columns:1fr;gap:28px}}

  /* ---------- FAQ ---------- */
  .faq{background:var(--ink)}
  .faq-list{max-width:840px;margin:0 auto;display:grid;gap:12px}
  .faq-item{border-radius:10px;overflow:hidden;border:1px solid var(--line);background:linear-gradient(180deg,var(--panel2),var(--panel))}
  .faq-item button{width:100%;text-align:left;background:none;border:none;color:var(--white);font-family:'Saira Condensed';font-weight:700;font-size:1.1rem;letter-spacing:.5px;padding:20px 22px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;text-transform:uppercase}
  .faq-item .pm{width:24px;height:24px;flex-shrink:0;color:var(--red-bright);transition:transform .25s}
  .faq-item.open .pm{transform:rotate(45deg)}
  .faq-item .ans{max-height:0;overflow:hidden;transition:max-height .3s ease}
  .faq-item .ans p{padding:0 22px 20px;color:#bdbdc6;font-size:.95rem}
  .faq-item.open .ans{max-height:320px}

  /* ---------- QUOTE FORM ---------- */
  .form-card{max-width:680px;margin:0 auto;border-radius:18px;padding:36px;position:relative;
    background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);
    box-shadow:0 30px 70px rgba(0,0,0,.5)}
  .steps-bar{display:flex;align-items:center;gap:8px;margin-bottom:26px}
  .step-pip{flex:1;height:5px;border-radius:3px;background:var(--line);transition:.3s}
  .step-pip.done{background:linear-gradient(90deg,var(--red-bright),var(--red-deep));box-shadow:0 0 10px rgba(255,42,51,.5)}
  .step-label{text-align:center;font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:2.5px;font-size:.76rem;color:var(--red-bright);margin-bottom:22px}
  .step{display:none;animation:fade .35s ease}
  .step.active{display:block}
  @keyframes fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  .step h3{font-size:1.6rem;margin-bottom:6px;text-align:center;letter-spacing:.5px}
  .step .sub{text-align:center;color:var(--muted);font-size:.92rem;margin-bottom:24px}
  .opt-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .opt{position:relative;display:flex;align-items:center;gap:13px;background:var(--black);border:1px solid var(--line);border-radius:10px;padding:16px;cursor:pointer;transition:.15s;text-align:left;color:var(--white);font-family:'Inter';font-size:.95rem;font-weight:500;overflow:hidden}
  .opt:hover{border-color:rgba(255,42,51,.5)}
  .opt.sel{border-color:var(--red);background:rgba(226,22,30,.12);box-shadow:0 0 0 2px rgba(226,22,30,.3)}
  .opt .oic{width:36px;height:36px;border-radius:8px;background:var(--panel);display:flex;align-items:center;justify-content:center;color:var(--red-bright);flex-shrink:0}
  .opt .oic svg{width:20px;height:20px}
  .opt.sel .oic{background:linear-gradient(180deg,var(--red-bright),var(--red-deep));color:#fff}
  .field{margin-bottom:15px}
  .field label{display:block;font-family:'Saira Condensed';font-weight:600;text-transform:uppercase;letter-spacing:1.5px;font-size:.74rem;color:var(--red-bright);margin-bottom:7px}
  .field input,.field textarea{width:100%;background:var(--black);border:1px solid var(--line);border-radius:8px;padding:13px 14px;color:var(--white);font-family:'Inter';font-size:1rem;transition:.15s}
  .field input:focus,.field textarea:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(226,22,30,.2)}
  .field textarea{resize:vertical;min-height:90px}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}
  .step-nav{display:flex;gap:12px;margin-top:24px}
  .step-nav .btn{flex:1}
  .btn-back{background:transparent;border:1px solid var(--line);color:var(--white)}
  .btn-back:hover{border-color:var(--red);color:var(--red-bright);transform:none;box-shadow:none}
  .btn-back::after{display:none}
  .summary{background:var(--black);border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin-bottom:18px;font-size:.9rem}
  .summary div{display:flex;justify-content:space-between;gap:14px;padding:5px 0;color:#d6d6dc}
  .summary div span:first-child{color:var(--muted);font-family:'Saira Condensed';font-weight:600;text-transform:uppercase;letter-spacing:1.5px;font-size:.74rem}
  .form-note{text-align:center;font-size:.8rem;color:var(--muted);margin-top:14px}
  .form-success{display:none;text-align:center;padding:30px 10px}
  .form-success.show{display:block}
  .form-success .chk{width:66px;height:66px;border-radius:50%;background:linear-gradient(180deg,var(--red-bright),var(--red-deep));display:flex;align-items:center;justify-content:center;margin:0 auto 18px;box-shadow:0 0 30px rgba(255,42,51,.5)}
  .form-success .chk svg{width:36px;height:36px;color:#fff}
  .form-success h3{font-size:1.8rem}
  .form-success p{color:#d6d6dc;margin-top:10px;max-width:420px;margin-inline:auto}
  @media(max-width:560px){.opt-grid{grid-template-columns:1fr}.field-row{grid-template-columns:1fr}.form-card{padding:26px 20px}}

  /* ---------- FINAL CTA ---------- */
  .cta{position:relative;text-align:center;padding:90px 0;background:var(--black);overflow:hidden}
  .cta::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 50% 50%,rgba(226,22,30,.18),transparent 70%)}
  .cta .wrap{position:relative}
  .cta h2{font-size:clamp(2.3rem,5.5vw,4rem)}
  .cta p{color:#d6d6dc;font-size:1.1rem;margin:14px auto 28px;max-width:560px}
  .cta-phone{font-family:'Saira Condensed';font-weight:800;font-size:clamp(2.4rem,7vw,4rem);letter-spacing:1px;display:inline-block}
  .cta-sub{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--muted);font-size:.84rem;margin-top:8px}

  /* ---------- FOOTER ---------- */
  footer{background:var(--ink);border-top:1px solid var(--line);padding:54px 0 calc(34px + var(--safe-b))}
  .foot{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.1fr;gap:34px}
  .fmark img{height:54px;margin-bottom:14px}
  .foot-brand p{color:var(--muted);font-size:.92rem;max-width:330px}
  .foot-social{display:flex;gap:10px;margin-top:16px}
  .foot-social a{width:42px;height:42px;border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--white);transition:.15s}
  .foot-social a:hover{border-color:var(--red);color:var(--red-bright);box-shadow:0 0 18px rgba(226,22,30,.3)}
  .foot-social svg{width:20px;height:20px}
  .foot-col h4{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:2px;font-size:.82rem;color:var(--red-bright);margin-bottom:14px}
  .foot-col.links a{display:block;color:#cfcfd6;font-size:.92rem;margin-bottom:9px}
  .foot-col.links a:hover{color:var(--red-bright)}
  .nap a,.nap span{display:flex;align-items:flex-start;gap:10px;color:#cfcfd6;font-size:.92rem;margin-bottom:12px}
  .nap svg{width:17px;height:17px;color:var(--red-bright);flex-shrink:0;margin-top:3px}
  .nap a:hover{color:var(--red-bright)}
  .legal{border-top:1px solid var(--line);margin-top:40px;padding-top:22px;color:#6a6a72;font-size:.78rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
  @media(max-width:1080px){.foot{grid-template-columns:1fr 1fr 1fr;gap:32px}}
  @media(max-width:880px){.foot{grid-template-columns:1fr;gap:32px}}

  /* ---------- STICKY ACTION BAR ---------- */
  .actionbar{position:fixed;bottom:0;left:0;right:0;z-index:95;display:none;grid-template-columns:1fr 1fr 1fr;gap:1px;background:var(--line);padding-bottom:var(--safe-b);box-shadow:0 -6px 22px rgba(0,0,0,.5)}
  .actionbar a{background:var(--ink);color:var(--white);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:11px 4px;font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:1.5px;font-size:.74rem}
  .actionbar a svg{width:21px;height:21px;color:var(--red-bright)}
  .actionbar a.primary{background:linear-gradient(180deg,var(--red-bright),var(--red-deep));color:#fff}
  .actionbar a.primary svg{color:#fff}
  @media(max-width:920px){.actionbar{display:grid}body{padding-bottom:66px}}

  /* offer ribbon */
  .ribbon{position:relative;margin:0 auto;max-width:560px;border-radius:14px;overflow:hidden;border:1px solid rgba(255,42,51,.4);
    background:linear-gradient(135deg,rgba(226,22,30,.18),rgba(10,10,12,.6));padding:22px 26px;text-align:center}
  .ribbon::after{content:"";position:absolute;top:0;left:-150%;width:50%;height:100%;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.25),transparent);transform:skewX(-22deg);animation:ribsweep 4.5s ease-in-out infinite}
  @keyframes ribsweep{0%,60%{left:-150%}80%,100%{left:160%}}
  .ribbon .big{font-family:'Saira Condensed';font-weight:800;font-size:2rem;letter-spacing:1px}
  .ribbon .sm{font-family:'Saira Condensed';font-weight:600;text-transform:uppercase;letter-spacing:2px;font-size:.78rem;color:#cfcfd6;margin-top:2px}
  .ribbon .fine{font-size:.74rem;color:var(--muted);margin-top:6px}

  .reveal{opacity:0;transform:translateY(12px);transition:opacity .25s ease, transform .25s ease}
  .reveal.revealed{opacity:1;transform:none}
  @media(prefers-reduced-motion:reduce){
    .reveal{opacity:1;transform:none;transition:none}
    .hero-logo{animation:none}.ribbon::after{animation:none}.btn::after{display:none}
    *{scroll-behavior:auto!important}.step{animation:none}
  }
  :focus-visible{outline:3px solid var(--red-bright);outline-offset:2px}

  /* ===== Multi-page nav: Locations dropdown ===== */
  .nav-drop{position:relative}
  .nav-drop-btn{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:1.5px;font-size:.92rem;color:var(--white);opacity:.8;background:none;border:0;cursor:pointer;display:flex;align-items:center;gap:5px;transition:.15s;padding:0}
  .nav-drop-btn svg{width:15px;height:15px;transition:transform .2s}
  .nav-drop-btn:hover,.nav-drop-btn.active{opacity:1;color:var(--red-bright)}
  .nav-drop:hover .nav-drop-btn svg,.nav-drop-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
  .nav-drop-menu{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(-6px);min-width:230px;background:rgba(16,16,19,.98);backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:8px;padding:8px;display:flex;flex-direction:column;gap:2px;opacity:0;visibility:hidden;transition:.16s;box-shadow:0 18px 40px rgba(0,0,0,.5);z-index:60}
  .nav-drop:hover .nav-drop-menu,.nav-drop-menu.open{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
  .nav-drop-menu a{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:.85rem;color:var(--white);opacity:.82;padding:10px 12px;border-radius:5px;white-space:nowrap;transition:.13s}
  .nav-drop-menu a:hover,.nav-drop-menu a.active{opacity:1;color:var(--red-bright);background:rgba(255,42,51,.08)}
  /* a small bridge so the menu doesn't close in the gap on hover */
  .nav-drop::after{content:"";position:absolute;top:100%;left:0;right:0;height:16px}

  /* location chips that are now links */
  a.city{transition:.14s;cursor:pointer}
  a.city:hover{color:var(--red-bright)}
  a.city:hover svg{color:var(--red-bright)}

  /* mobile menu grouping for Locations */
  .mm-group-label{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:2px;font-size:1.3rem;color:var(--white);padding:16px 4px;border-bottom:1px solid var(--line);user-select:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between}
  .mm-arrow{font-size:.9rem;color:var(--red-bright);transition:transform .2s}
  .mm-group-label.open .mm-arrow{transform:rotate(90deg)}
  .mm-sub-group{flex-direction:column;gap:0}
  .mobile-menu a.mm-sub{font-size:1.08rem;padding:12px 4px 12px 18px;opacity:.88}

  /* ===== Inner pages (service / location / laws / contact) ===== */
  .page-hero{position:relative;padding:80px 0 50px;text-align:center;border-bottom:1px solid var(--line);background:radial-gradient(120% 100% at 50% 0,rgba(226,22,30,.10),transparent 60%)}
  .page-hero .eyebrow{display:block;margin-bottom:14px}
  .page-hero h1{font-size:clamp(2.3rem,6vw,4rem);margin-bottom:8px}
  .page-hero .sub{color:#d6d6dc;font-size:1.1rem;max-width:680px;margin:14px auto 0}
  .crumbs{font-family:'Saira Condensed';font-weight:600;text-transform:uppercase;letter-spacing:1.5px;font-size:.78rem;color:var(--muted);margin-bottom:24px}
  .crumbs a{color:var(--muted)}.crumbs a:hover{color:var(--red-bright)}
  .crumbs span{color:var(--red-bright)}

  .prose{max-width:760px;margin:0 auto}
  .prose p{color:#cfcfd6;margin-bottom:18px;font-size:1.05rem}
  .prose a{color:var(--red-bright);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
  .prose a:hover{color:#fff;text-decoration-color:var(--red-bright)}
  .prose h2{font-size:1.9rem;margin:38px 0 16px}
  .prose h3{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:1.25rem;margin:26px 0 10px;color:var(--white)}
  .prose ul{list-style:none;margin:0 0 20px}
  .prose ul li{position:relative;padding-left:30px;margin-bottom:12px;color:#cfcfd6}
  .prose ul li::before{content:"";position:absolute;left:6px;top:9px;width:8px;height:8px;background:var(--red-bright);border-radius:2px;transform:rotate(45deg)}

  .feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:30px 0 56px}
  @media(max-width:760px){.feature-grid{grid-template-columns:1fr}}
  .feature{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:0;overflow:hidden}
  .feature-img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;background:var(--panel2)}
  .feature-body{padding:22px 24px 26px}
  .feature h3{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:1.2rem;margin-bottom:8px}
  .feature p{color:var(--muted);font-size:.97rem}

  .inline-cta{text-align:center;margin:40px 0}
  .related{border-top:1px solid var(--line);padding:40px 0 10px;margin-bottom:30px}
  .related h2{text-align:center;font-size:1.6rem;margin-bottom:24px}
  .related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
  .related-card{display:block;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:18px 20px;transition:.15s}
  .related-card:hover{border-color:var(--red-bright);background:var(--panel2)}
  .related-card b{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--white);display:block}
  .related-card span{color:var(--muted);font-size:.9rem}

  /* ===== Tint Laws page ===== */
  .faq-item.open .ans{max-height:600px}
  .law-table{width:100%;border-collapse:collapse;margin:24px 0;font-size:.98rem}
  .law-table th,.law-table td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--line)}
  .law-table thead th{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--red-bright);font-size:.85rem;background:var(--panel)}
  .law-table tbody tr:hover{background:rgba(255,255,255,.02)}
  .law-table td:first-child{font-weight:600;color:var(--white)}
  .law-note{background:var(--panel);border-left:3px solid var(--red-bright);border-radius:0 8px 8px 0;padding:16px 20px;margin:24px 0;color:#cfcfd6;font-size:.95rem}
  .law-reviewed{text-align:center;color:var(--muted);font-size:.85rem;font-family:'Saira Condensed';letter-spacing:1px;text-transform:uppercase;margin:30px 0 0}
  .law-disclaimer{max-width:760px;margin:18px auto 0;color:var(--chrome-4);font-size:.82rem;text-align:center;line-height:1.6}

  /* ===== Contact page ===== */
  .contact-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:36px;align-items:start;margin-top:10px}
  @media(max-width:860px){.contact-grid{grid-template-columns:1fr;gap:26px}}
  .contact-info{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:30px}
  .contact-info h2{font-size:1.5rem;margin-bottom:6px}
  .contact-info .lead{color:#cfcfd6;margin-bottom:22px}
  .ci-row{display:flex;align-items:flex-start;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
  .ci-row:last-of-type{border-bottom:none}
  .ci-row svg{width:22px;height:22px;color:var(--red-bright);flex-shrink:0;margin-top:2px}
  .ci-row .ci-lbl{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:.78rem;color:var(--muted);display:block;margin-bottom:2px}
  .ci-row a,.ci-row span{color:var(--white);font-size:1.05rem}
  .ci-row a:hover{color:var(--red-bright)}
  .contact-map{margin-top:22px;border-radius:12px;overflow:hidden;border:1px solid var(--line);height:220px}
  .contact-map iframe{width:100%;height:100%;border:0;filter:invert(1) hue-rotate(175deg) brightness(.78) contrast(1.15) saturate(.85) sepia(.25)}
  .contact-cta-row{display:flex;gap:12px;margin-top:22px;flex-wrap:wrap}
  .contact-cta-row .btn{flex:1;min-width:140px;text-align:center}

  /* honeypot: hidden from humans, bots fill it and get silently dropped */
  .hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

  /* picture wrappers shouldn't disrupt logo flex layout */
  .brand picture{display:flex;align-items:center}

  /* gallery picture wrappers must fill the grid cell like the img did */
  .g-item picture{display:block;width:100%;height:100%}


/* ============================================================
   BLOG STYLES
   ============================================================ */

/* Filter bar */
.blog-filter-bar { background:var(--ink); border-bottom:1px solid var(--line); padding:16px 0; }
.blog-filter-bar .wrap { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.filter-pill { padding:7px 18px; border-radius:999px; border:1px solid rgba(255,255,255,.18); color:var(--muted); font-size:.78rem; font-weight:700; font-family:'Saira Condensed',sans-serif; text-transform:uppercase; letter-spacing:.08em; text-decoration:none; transition:all .2s; background:rgba(255,255,255,.04); }
.filter-pill:hover { border-color:var(--red-bright); color:var(--red-bright); background:rgba(226,22,30,.08); }
.filter-pill.active { background:var(--red); border-color:var(--red); color:#fff; box-shadow:0 4px 14px rgba(226,22,30,.4); }

/* Blog index grid */
.blog-index { padding-top:48px; }
.blog-cat-header { margin-bottom:32px; }
.blog-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px; }

/* Blog card */
.blog-card { display:flex; flex-direction:column; gap:10px; background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:24px; text-decoration:none; transition:border-color .2s,transform .2s; }
.blog-card:hover { border-color:var(--red); transform:translateY(-2px); }
.bc-meta { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.bc-cat { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; padding:3px 10px; border-radius:999px; }
.bc-cat--automotive  { background:rgba(220,38,38,.15); color:#f87171; }
.bc-cat--residential { background:rgba(34,197,94,.12); color:#4ade80; }
.bc-cat--commercial  { background:rgba(59,130,246,.12); color:#60a5fa; }
.bc-cat--fleet       { background:rgba(234,179,8,.12);  color:#facc15; }
.bc-cat--laws        { background:rgba(168,85,247,.12); color:#c084fc; }
.bc-date { font-size:.78rem; color:var(--muted); }
.bc-title { font-size:1.05rem; font-weight:700; color:var(--fg); line-height:1.35; margin:0; }
.bc-desc { font-size:.88rem; color:var(--muted); line-height:1.6; flex:1; margin:0; }
.bc-read { font-size:.82rem; font-weight:600; color:var(--red); margin-top:4px; }

/* Blog post layout */
.blog-layout { display:grid; grid-template-columns:1fr 300px; gap:48px; align-items:start; }

/* Mobile: single column, sidebar below article */
@media(max-width:860px){
  .blog-layout { grid-template-columns:1fr; }
  .blog-sidebar { order:2; position:static; }
  article.prose { order:1; }
}

/* Blog sidebar — sticky on desktop only */
.blog-sidebar { display:flex; flex-direction:column; gap:20px; }
@media(min-width:861px){ .blog-sidebar { position:sticky; top:80px; } }
.sidebar-card { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:22px; }
.sidebar-card h3 { font-size:.95rem; font-weight:700; color:var(--fg); margin:0 0 12px; text-transform:uppercase; letter-spacing:.04em; }
.sidebar-card p { font-size:.85rem; color:var(--muted); margin:0 0 10px; line-height:1.5; }
.sidebar-links { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.sidebar-links a { font-size:.88rem; color:var(--red); text-decoration:none; line-height:1.4; }
.sidebar-links a:hover { text-decoration:underline; }
.sidebar-nap p { margin:4px 0; }
.sidebar-nap a { color:var(--red); text-decoration:none; }

/* Homepage blog grid — single row on desktop, 2-col on mobile */
.blog-grid-home { grid-template-columns: repeat(6, 1fr); }
@media(max-width:900px){ .blog-grid-home { grid-template-columns: repeat(2, 1fr); } }

/* Inline CTA buttons inside .prose must keep button styling, not .prose a link styling */
.prose .inline-cta a{text-decoration:none}
.prose .inline-cta .btn-red{color:#fff}
.prose .inline-cta .btn-chrome{color:#0a0a0c}
.prose .inline-cta a:hover{text-decoration:none}

/* Learn-more link inside service carousel cards */
.scard-link{display:inline-block;margin-top:14px;font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:.85rem;color:var(--red-bright);text-decoration:none}
.scard-link:hover{color:#fff}

/* Jump-link bar (vinyl wraps page section nav) */
.jump-bar{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.jump-bar a{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:.85rem;color:var(--white);opacity:.85;padding:9px 16px;border:1px solid var(--line);border-radius:999px;transition:.15s;text-decoration:none}
.jump-bar a:hover{opacity:1;color:var(--red-bright);border-color:var(--red-bright);background:rgba(255,42,51,.06)}

/* ===== Services hub cards (svc-grid) ===== */
/* Forced 4-across on desktop so 8 cards make a clean 4x2, not a ragged 5+3. */
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.svc-card{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:20px 22px;transition:.15s}
.svc-card:hover{border-color:var(--red-bright);background:var(--panel2);transform:translateY(-3px);box-shadow:0 14px 32px rgba(0,0,0,.45)}
.svc-card b{font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--white);display:block;margin-bottom:8px}
.svc-card span{color:var(--muted);font-size:.9rem;flex-grow:1}
.svc-more{display:block;margin-top:14px;font-family:'Saira Condensed';font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:.82rem;font-style:normal;color:var(--red-bright)}
.svc-card:hover .svc-more{color:#fff}
@media(max-width:900px){ .svc-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:560px){ .svc-grid{grid-template-columns:1fr} }