  :root{
    --navy:#213A47; /* sampled from the real logo's mountain/ring blue, deepened for text contrast */
    --blue:#3F6479; /* logo blue, as-sampled */
    --blue-light:#7B9CAE; /* logo mountain highlight */
    --rust:#A05E4D; /* logo star/fence terracotta */
    --rust-dark:#7C4736;
    --cream:#FBF6EC; /* logo cream badge background */
    --cream-dim:#F0E6D4;
    --ink:#241F1A;
    --ink-soft:#4B443C;
    --white:#FFFFFF;
    --card-bg:#FFFFFF;
    --card-border:rgba(33,58,71,0.08);
    --shadow:0 24px 48px -12px rgba(33,58,71,0.16);
    --ease:cubic-bezier(0.16,1,0.3,1);
  }
  *,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
  body{font-family:'Inter',sans-serif;background:var(--cream);color:var(--ink);overflow-x:clip;line-height:1.6;}
  img{display:block;max-width:100%;}
  a{color:inherit;text-decoration:none;}
  ul{list-style:none;}
  h1,h2,h3,h4{font-family:'Oswald',sans-serif;line-height:1.12;color:var(--navy);}
  .eyebrow{font-family:'Inter',sans-serif;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);display:inline-flex;align-items:center;gap:8px;padding:8px 16px 8px 12px;border:1.5px solid var(--card-border,rgba(15,23,42,.1));border-radius:999px;background:var(--white);}
  .eyebrow::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--rust);flex-shrink:0;}
  .quote-info .eyebrow,footer .eyebrow{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:#fff;}
  .accent{font-family:'Rye',cursive;font-weight:400;}
  .wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
  section{position:relative;}
  button{font-family:inherit;cursor:pointer;}

  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{animation-duration:0.01ms!important;transition-duration:0.01ms!important;scroll-behavior:auto!important;}
  }

  /* ═══ BUTTONS ═══ */
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:16px 30px;border-radius:999px;font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:uppercase;transition:all .3s var(--ease);border:2px solid transparent;cursor:pointer;min-height:52px;position:relative;overflow:hidden;z-index:1;}
  .btn.btn-arrow{padding-right:56px;}
  .btn-arrow-circle{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px rgba(0,0,0,.25);transition:transform .3s var(--ease);z-index:2;}
  .btn-arrow:hover .btn-arrow-circle{transform:translateY(-50%) rotate(45deg);}
  .btn-arrow-circle svg{width:16px;height:16px;color:#fff;}
  .btn-navy.btn-arrow .btn-arrow-circle{background:var(--rust);}
  .btn::before{content:'';position:absolute;inset:0;background:rgba(255,255,255,0.15);transform:translateY(100%);transition:transform .4s var(--ease);z-index:-1;}
  .btn:hover::before{transform:translateY(0);}
  .btn-rust{background:var(--rust);color:var(--white);box-shadow:0 8px 20px rgba(184,91,67,0.25);}
  .btn-rust:hover{background:var(--rust-dark);transform:translateY(-3px);box-shadow:0 12px 28px rgba(184,91,67,.4);}
  .btn-outline{background:transparent;color:var(--white);border-color:rgba(255,255,255,.3);backdrop-filter:blur(4px);}
  .btn-outline:hover{background:rgba(255,255,255,.1);border-color:#fff;transform:translateY(-3px);}
  .btn-navy{background:var(--navy);color:var(--white);box-shadow:0 8px 20px rgba(27,42,52,0.25);}
  .btn-green{background:#3B5D42;color:var(--white);box-shadow:0 8px 20px rgba(59,93,66,0.3);}
  .btn-green:hover{background:#2F4B36;transform:translateY(-3px);box-shadow:0 12px 28px rgba(59,93,66,.4);}
  .btn-navy:hover{background:var(--blue);transform:translateY(-3px);box-shadow:0 12px 28px rgba(27,42,52,.4);}
  .btn-block{width:100%;}

  /* ═══ REVEAL (Legacy - will be replaced by GSAP but kept for fallback) ═══ */
  .rv{opacity:0;}
  .rv.in{opacity:1;}

  /* ═══ LOADER ═══ */
  #loader{position:fixed;inset:0;z-index:1000;background:var(--navy);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;transition:opacity .5s ease,visibility .5s ease;}
  #loader.out{opacity:0;visibility:hidden;pointer-events:none;}
  .ld-badge{width:84px;height:84px;border-radius:50%;background:var(--cream);padding:12px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 20px 50px rgba(0,0,0,.35);opacity:0;transform:scale(.5) rotate(-8deg);transition:opacity .6s cubic-bezier(.34,1.56,.64,1),transform .7s cubic-bezier(.34,1.56,.64,1);}
  .ld-badge img{width:100%;height:100%;border-radius:50%;}
  #loader.show .ld-badge{opacity:1;transform:scale(1) rotate(0);}
  .ld-name{font-family:'Oswald',sans-serif;font-size:15px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#fff;opacity:0;transform:translateY(8px);transition:opacity .5s ease .15s,transform .5s ease .15s;}
  #loader.show .ld-name{opacity:1;transform:translateY(0);}
  .ld-sub{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--blue-light);opacity:0;margin-top:-10px;transition:opacity .4s ease .3s;}
  #loader.show .ld-sub{opacity:1;}
  .ld-bar-wrap{width:150px;height:3px;background:rgba(255,255,255,.14);border-radius:3px;overflow:hidden;margin-top:6px;}
  #ld-bar{width:0%;height:100%;background:var(--rust);border-radius:3px;transition:width .4s ease;}

  /* ═══ NAV (floating pill) ═══ */
  .nav{position:fixed;top:0;left:0;right:0;z-index:200;padding:24px 24px 14px;transition:padding .3s ease;}
  .nav::before{content:'';position:absolute;top:0;left:0;right:0;height:120px;background:linear-gradient(180deg,rgba(10,16,20,.65) 0%,rgba(10,16,20,0) 100%);z-index:-1;pointer-events:none;transition:opacity .3s ease;}
  .nav.solid::before{opacity:0;}
  .nav.solid{padding:16px 24px 10px;}
  .nav-inner{max-width:1180px;margin:0 auto;padding:10px 12px 10px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(255,255,255,.98);border-radius:999px;box-shadow:0 10px 40px -8px rgba(2,6,23,.18);transition:box-shadow .3s ease;}
  .nav.solid .nav-inner{box-shadow:0 14px 44px -6px rgba(2,6,23,.24);}
  .nav-brand{display:flex;align-items:center;gap:10px;}
  .nav-brand img{height:38px;width:38px;border-radius:50%;}
  .nav-brand-text{font-family:'Oswald',sans-serif;font-size:15px;font-weight:600;letter-spacing:.04em;color:var(--navy);text-transform:uppercase;white-space:nowrap;}
  .nav-links{display:flex;align-items:center;gap:22px;flex-wrap:nowrap;}
  .nav-link{font-size:13px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);transition:color .2s;padding:6px 2px;white-space:nowrap;flex-shrink:0;}
  .nav-link:hover{color:var(--rust);}
  .nav-cta-group{display:flex;align-items:center;gap:14px;}
  .nav-call{display:flex;align-items:center;gap:7px;font-weight:700;font-size:14px;color:var(--navy);}
  .nav-call svg{flex-shrink:0;}
  .nav-quote-btn{padding:11px 22px;font-size:12px;min-height:auto;}
  .nav-burger{display:none;width:40px;height:40px;align-items:center;justify-content:center;background:none;border:none;flex-direction:column;gap:5px;flex-shrink:0;}
  .nav-burger span{display:block;width:20px;height:2px;background:var(--navy);}

  /* ═══ NAV DROPDOWN (Services) ═══ */
  .nav-dropdown{position:relative;}
  .nav-dd-trigger{display:flex;align-items:center;gap:5px;background:none;border:none;cursor:pointer;font-family:inherit;}
  .nav-dd-trigger svg{transition:transform .25s var(--ease);}
  .nav-dropdown:hover .nav-dd-trigger svg{transform:rotate(180deg);}
  .nav-dd-menu{position:absolute;top:100%;left:50%;transform:translate(-50%,8px);margin-top:14px;background:#fff;border-radius:16px;box-shadow:0 20px 50px -10px rgba(33,58,71,.25);padding:8px;min-width:210px;display:flex;flex-direction:column;gap:2px;opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s ease,visibility .2s;}
  .nav-dropdown:hover .nav-dd-menu{opacity:1;visibility:visible;transform:translate(-50%,0);}
  .nav-dd-item{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;color:var(--ink);font-size:14px;font-weight:600;white-space:nowrap;transition:background .15s;}
  .nav-dd-item svg{color:var(--rust);flex-shrink:0;}
  .nav-dd-item:hover{background:var(--cream-dim);}

  @media (max-width:900px){.nav-dd-menu{display:none;}}

  .mobile-menu-backdrop{position:fixed;inset:0;z-index:198;background:rgba(18,26,31,.55);opacity:0;visibility:hidden;transition:opacity .35s var(--ease);}
  .mobile-menu-backdrop.open{opacity:1;visibility:visible;}
  .mobile-menu{position:fixed;top:0;left:0;bottom:0;width:300px;max-width:82vw;z-index:199;background:#181818;display:flex;flex-direction:column;align-items:stretch;gap:2px;padding:104px 26px 32px;overflow-y:auto;transform:translateX(-100%);transition:transform .4s var(--ease);box-shadow:24px 0 60px rgba(0,0,0,.35);border-radius:0 20px 0 0;}
  .mm-call{display:flex;align-items:center;gap:10px;}
  .mm-call svg{flex-shrink:0;color:var(--rust);}
  .mobile-menu.open{transform:translateX(0);}
  .mobile-menu a,.mm-toggle{font-family:'Oswald',sans-serif;font-size:17px;color:#fff;text-transform:uppercase;letter-spacing:.03em;padding:13px 0;}
  .mm-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:none;cursor:pointer;}
  .mm-chevron{transition:transform .3s var(--ease);flex-shrink:0;color:rgba(255,255,255,.6);}
  .mm-toggle.open .mm-chevron{transform:rotate(180deg);}
  .mm-submenu{display:flex;flex-direction:column;max-height:0;overflow:hidden;transition:max-height .35s var(--ease);}
  .mm-submenu.open{max-height:320px;}
  .mobile-menu a.mm-sub{font-size:14.5px;color:rgba(255,255,255,.72);padding:9px 0 9px 14px;}
  .mobile-menu .btn{margin-top:16px;justify-content:center;}

  @media (max-width:900px){
    .nav{padding:14px 16px;}
    .nav-inner{padding:8px 8px 8px 16px;}
    .nav-links,.nav-call-text{display:none;}
    .nav-burger{display:flex;}
    .nav-cta-group{gap:8px;}
    .nav-quote-btn{padding:9px 16px;font-size:11px;}
  }
  /* Call + Free Quote crowd the burger on narrow phones. Both are already
     one tap away inside the opened mobile menu, so on small screens the
     top bar keeps just the burger. */
  @media (max-width:640px){
    .nav-call,.nav-quote-btn{display:none;}
  }

  /* ═══ HERO ═══ */
  #hero{min-height:calc(100svh - 24px);display:flex;align-items:flex-end;position:relative;overflow:hidden;margin:12px;border-radius:28px;}
  @media (max-width:640px){
    #hero{margin:8px;border-radius:20px;min-height:calc(80svh - 16px);}
    .hero-inner{transform:translateY(-75px);}
  }
  #hero .hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden;}
  #hero .hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 40%;will-change:transform;transform:scale(1.12);}
  #hero .hero-bg video{width:100%;height:100%;object-fit:cover;object-position:center 75%;filter:blur(2.5px);transform:scale(1.03);}
  #hero .hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,32,39,.55) 0%,rgba(20,32,39,.35) 35%,rgba(18,28,34,.85) 100%);}
  .hero-inner{position:relative;z-index:2;width:100%;padding-top:196px;padding-bottom:64px;}
  .hero-eyebrow{color:rgba(255,255,255,.85);font-size:13px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;margin-bottom:18px;}
  .hero-h1{font-size:clamp(40px,7vw,78px);color:#fff;text-transform:uppercase;letter-spacing:-.01em;max-width:820px;}
  .hero-h1 em{font-style:normal;color:var(--rust);}
  .hero-sub{max-width:560px;color:rgba(255,255,255,.88);font-size:18px;margin:22px 0 34px;}
  .hero-ctas{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:44px;}
  .hero-trust{display:flex;flex-wrap:wrap;gap:14px 30px;}
  .hero-trust-item{display:flex;align-items:center;gap:9px;color:#fff;font-size:13px;font-weight:600;letter-spacing:.02em;}
  .hero-trust-item svg{color:var(--rust);flex-shrink:0;}

  /* ═══ HERO FLOATING RATING BADGE ═══ */
  .hero-float-badge{position:absolute;right:28px;bottom:28px;z-index:3;display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-radius:16px;padding:12px 18px 12px 14px;box-shadow:0 20px 50px rgba(2,6,23,.35);}
  .hero-float-badge .hfb-icon{width:38px;height:38px;flex-shrink:0;}
  .hero-float-badge .hfb-num{font-family:'Oswald',sans-serif;font-size:22px;color:var(--navy);line-height:1;}
  .hero-float-badge .hfb-stars{display:flex;gap:2px;color:var(--rust);margin:4px 0 0;}
  .hero-float-badge .hfb-stars svg{width:11px;height:11px;}
  /* "Google Rating" label dropped — the G icon already says Google, and
     cutting the label shrinks the badge's footprint over the hero photo. */
  .hero-float-badge .hfb-label{display:none;}
  @media (max-width:640px){
    .hero-float-badge{right:16px;bottom:90px;padding:9px 14px 9px 11px;gap:9px;border-radius:12px;}
    .hero-float-badge.about-badge{bottom:60px;}
    .hero-float-badge .hfb-icon{width:26px;height:26px;}
    .hero-float-badge .hfb-num{font-size:16px;}
    .hero-float-badge .hfb-stars{margin:2px 0 0;}
    .hero-float-badge .hfb-stars svg{width:8px;height:8px;}
    .hero-float-badge--hide-mobile{display:none;}
  }

  /* ═══ QUICK QUOTE BAR (overlaps hero bottom) ═══ */
  .quick-quote{position:relative;z-index:5;padding:0 24px;}
  .quick-quote-inner{max-width:1180px;margin:24px auto 0;background:#fff;border-radius:20px;box-shadow:0 30px 70px -18px rgba(2,6,23,.35);padding:26px 30px;display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;}
  .qq-field{flex:1 1 150px;min-width:130px;}
  .qq-field label{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);margin-bottom:7px;}
  .qq-field input,.qq-field select{width:100%;padding:12px 14px;border:1.5px solid #E1D8C6;border-radius:10px;font-family:inherit;font-size:14px;color:var(--ink);background:#FEFCF8;min-height:46px;}
  .qq-field input:focus,.qq-field select:focus{outline:none;border-color:var(--rust);}
  .qq-submit{flex-shrink:0;white-space:nowrap;}
  @media (max-width:900px){.quick-quote-inner{margin-top:16px;flex-direction:column;align-items:stretch;padding:22px;}.qq-field{flex:1 1 auto;}}

  /* ═══ MARQUEE ═══ */
  .marquee-strip{overflow:hidden;white-space:nowrap;padding:16px 0;background:var(--navy);border-top:3px solid var(--rust);border-bottom:3px solid var(--rust);}
  .marquee-inner{display:inline-flex;animation:mq 26s linear infinite;}
  .mq-item{font-family:'Oswald',sans-serif;font-size:15px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#fff;padding:0 22px;}
  .mq-dot{color:var(--rust);padding:0 4px;}
  @keyframes mq{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

  /* ═══ SECTION HEADERS ═══ */
  .sec-head{max-width:680px;margin:0 auto 64px;text-align:center;}
  .sec-head .eyebrow{margin-bottom:20px;}
  .sec-head h2{font-size:clamp(36px,5vw,54px);text-transform:uppercase;letter-spacing:-.02em;line-height:1.05;}
  .sec-head p{margin-top:20px;color:var(--ink-soft);font-size:18px;line-height:1.7;}

  /* ═══ SERVICES ═══ */
  #services{padding:120px 0 110px;}
  .svc-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;}
  .svc-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:18px;padding:26px 24px;text-align:left;transition:all .35s var(--ease);position:relative;overflow:hidden;}
  .svc-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--rust);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease);}
  .svc-card:hover::before{transform:scaleX(1);}
  .svc-card::after{content:'';position:absolute;inset:0;border-radius:18px;box-shadow:var(--shadow);opacity:0;transition:opacity .35s var(--ease);z-index:-1;}
  .svc-card:hover{transform:translateY(-8px) scale(1.02);border-color:transparent;}
  .svc-card:hover::after{opacity:1;}
  .svc-icon{width:46px;height:46px;border-radius:12px;background:var(--cream-dim);display:flex;align-items:center;justify-content:center;color:var(--rust);margin-bottom:16px;transition:all .35s var(--ease);}
  .svc-card:hover .svc-icon{transform:scale(1.12) rotate(-6deg);background:var(--rust);color:#fff;}
  .svc-card h3{font-size:18px;text-transform:uppercase;margin-bottom:9px;letter-spacing:-.01em;}
  .svc-card p{font-size:14px;color:var(--ink-soft);line-height:1.55;}
  .svc-link{display:inline-flex;align-items:center;gap:8px;margin-top:20px;font-size:14px;font-weight:800;color:var(--navy);letter-spacing:.04em;text-transform:uppercase;transition:color .3s;}
  .svc-card:hover .svc-link{color:var(--rust);}
  .svc-link svg{transition:transform .3s var(--ease);}
  .svc-card:hover .svc-link svg{transform:translateX(6px);}

  @media (max-width:1080px){.svc-grid{grid-template-columns:repeat(3,1fr);}}
  @media (max-width:640px){.svc-grid{grid-template-columns:1fr;}}

  /* 3-card variant (fence-repairs) — needs its own fixed 3-col desktop
     layout instead of the 5-col default, but must still collapse to a
     single column on mobile like every other card grid. */
  .svc-grid.repair-grid-3{grid-template-columns:repeat(3,1fr);}
  @media (max-width:640px){.svc-grid.repair-grid-3{grid-template-columns:1fr;}}

  /* ═══ WOOD STYLES ═══ */
  #wood{padding:90px 0;background:var(--cream-dim);}
  .style-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
  .style-card{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/3;box-shadow:0 10px 30px rgba(33,58,71,.12);cursor:pointer;}
  .style-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease);}
  .style-card:hover img{transform:scale(1.08);}
  .style-card-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(33,58,71,0) 40%,rgba(20,28,33,.92) 100%);}
  .style-card-body{position:absolute;left:0;right:0;bottom:0;padding:22px;color:#fff;}
  .style-card-body .tag{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--blue-light);font-weight:700;}
  .style-card-body h3{color:#fff;font-size:20px;margin:6px 0 8px;text-transform:uppercase;}
  .style-card-body p{font-size:13px;color:rgba(255,255,255,.82);line-height:1.5;}

  @media (max-width:1080px){.style-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:520px){.style-grid{grid-template-columns:1fr;}.style-card{aspect-ratio:16/11;}}

  /* ═══ WHY STEEL ═══ */
  #why{padding:100px 0;}
  .why-inner{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;}
  .why-copy .eyebrow{margin-bottom:14px;}
  .why-copy h2{font-size:clamp(28px,4vw,42px);text-transform:uppercase;margin-bottom:20px;}
  .why-copy p{color:var(--ink-soft);font-size:16px;margin-bottom:16px;}
  .why-list{margin-top:26px;display:flex;flex-direction:column;gap:16px;}
  .why-list li{display:flex;gap:14px;align-items:flex-start;font-size:15px;color:var(--ink);}
  .why-list svg{color:var(--rust);flex-shrink:0;margin-top:3px;}
  .why-visual{background:var(--navy);border-radius:16px;padding:44px;color:#fff;}
  .why-visual-row{display:flex;justify-content:space-between;align-items:center;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.14);}
  .why-visual-row:last-child{border-bottom:none;}
  .why-visual-label{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);}
  .why-visual-val{font-family:'Oswald',sans-serif;font-size:17px;color:#fff;text-align:right;max-width:220px;}
  .why-visual-val.rust{color:var(--rust);font-weight:600;}

  @media (max-width:900px){.why-inner{grid-template-columns:1fr;gap:36px;}}

  /* ═══ PROCESS ═══ */
  #process{padding:100px 0;}
  .step-row{display:flex;align-items:flex-start;justify-content:center;flex-wrap:wrap;gap:0 6px;max-width:1080px;margin:0 auto;}
  .step-item{display:flex;flex-direction:column;align-items:center;text-align:center;width:190px;padding:0 10px;}
  .step-icon-wrap{position:relative;margin-bottom:22px;}
  .step-icon{width:80px;height:80px;border-radius:50%;background:var(--cream-dim);display:flex;align-items:center;justify-content:center;color:var(--rust);transition:transform .3s var(--ease);}
  .step-icon svg{width:32px;height:32px;}
  .step-item:hover .step-icon{transform:scale(1.08);}
  .step-badge{position:absolute;top:-4px;left:-4px;width:26px;height:26px;border-radius:50%;background:var(--rust);color:#fff;font-family:'Oswald',sans-serif;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;}
  .step-item h3{font-size:17px;text-transform:uppercase;margin-bottom:8px;color:var(--ink);}
  .step-item p{font-size:14px;color:var(--ink-soft);line-height:1.55;}
  .step-arrow{flex-shrink:0;align-self:center;margin-top:34px;color:var(--rust);opacity:.55;}
  @media (max-width:900px){.step-arrow{display:none;}.step-row{row-gap:36px;}}

  /* ═══ MEDIA TOGGLE ═══ */
  .media-head{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:8px;}
  .media-head h2{font-size:clamp(26px,3.6vw,36px);text-transform:uppercase;}
  .media-toggle{display:flex;gap:10px;background:var(--cream-dim);border-radius:999px;padding:5px;}
  .media-toggle-btn{display:flex;align-items:center;gap:8px;padding:10px 20px;border-radius:999px;font-size:13px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-soft);background:transparent;border:none;cursor:pointer;transition:background .2s,color .2s;}
  .media-toggle-btn:not(.active):hover{color:var(--ink);background:rgba(33,58,71,.06);}
  .media-toggle-btn.active{background:var(--rust);color:#fff;}
  .media-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:80px 20px;color:var(--ink-soft);text-align:center;}
  .media-empty svg{opacity:.4;}
  .media-empty p{font-size:16px;}
  .video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:26px;}
  .video-card{border-radius:14px;overflow:hidden;box-shadow:var(--shadow);background:#000;transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
  .video-card:hover{transform:translateY(-4px);box-shadow:0 20px 45px rgba(2,6,23,.28);}
  .video-card video{width:100%;aspect-ratio:9/16;display:block;background:#000;}

  /* ═══ GALLERY ═══ */
  #gallery{padding:100px 0;}
  .gal-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:170px;gap:14px;grid-auto-flow:row dense;}
  .gal-item{border-radius:10px;overflow:hidden;cursor:pointer;position:relative;}
  .gal-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease);}
  .gal-item:hover img{transform:scale(1.09);}
  .gal-item.tall{grid-row:span 2;}
  .gal-item .gal-zoom{position:absolute;inset:0;background:rgba(33,58,71,0);display:flex;align-items:center;justify-content:center;color:#fff;opacity:0;transition:opacity .25s,background .25s;}
  .gal-item:hover .gal-zoom{opacity:1;background:rgba(33,58,71,.28);}

  .gal-grid.cols-3{grid-template-columns:repeat(3,1fr);}
  @media (max-width:900px){
    .gal-grid{grid-template-columns:repeat(2,1fr);}
    .gal-grid.cols-3{grid-template-columns:repeat(2,1fr);}
  }
  @media (max-width:640px){
    .gal-grid{grid-template-columns:1fr;grid-auto-rows:unset;gap:14px;}
    .gal-grid.cols-3{grid-template-columns:1fr;}
    .gal-item{aspect-ratio:16/10;height:auto;}
    .gal-item.tall{grid-row:auto;aspect-ratio:4/3;}
  }

  /* clears the fixed nav when a #hash lands on a projects section */
  #wood,#vinyl,#aluminum,#chain-link,#repairs{scroll-margin-top:104px;}
  @media (max-width:900px){#wood,#vinyl,#aluminum,#chain-link,#repairs{scroll-margin-top:84px;}}

  /* ═══ "SEE PROJECTS" TILE ═══ */
  .proj-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
    background:var(--navy);color:#fff;padding:18px 16px;text-align:center;cursor:pointer;
    transition:background .35s var(--ease);}
  .proj-tile:hover{background:#1A2F3A;}
  .proj-stack{position:relative;width:132px;height:78px;flex-shrink:0;}
  .proj-stack img{position:absolute;top:0;left:34px;width:64px;height:74px;object-fit:cover;border-radius:6px;
    border:2px solid rgba(255,255,255,.92);box-shadow:0 6px 16px rgba(0,0,0,.38);
    transition:transform .5s var(--ease);transform-origin:bottom center;}
  .proj-stack img:nth-child(1){transform:translateX(-26px) rotate(-11deg);z-index:1;}
  .proj-stack img:nth-child(2){transform:translateX(26px) rotate(11deg);z-index:2;}
  .proj-stack img:nth-child(3){transform:translateY(3px);z-index:3;}
  .proj-tile:hover .proj-stack img:nth-child(1){transform:translateX(-38px) translateY(-3px) rotate(-19deg);}
  .proj-tile:hover .proj-stack img:nth-child(2){transform:translateX(38px) translateY(-3px) rotate(19deg);}
  .proj-tile:hover .proj-stack img:nth-child(3){transform:translateY(-6px) scale(1.05);}
  .proj-tile-label{font-family:'Oswald',sans-serif;font-size:15px;line-height:1.25;text-transform:uppercase;
    letter-spacing:.03em;color:#fff;}
  .proj-tile-cta{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;
    letter-spacing:.16em;text-transform:uppercase;color:var(--blue-light);}
  .proj-tile-cta svg{transition:transform .35s var(--ease);}
  .proj-tile:hover .proj-tile-cta svg{transform:translateX(5px);}
  @media (prefers-reduced-motion:reduce){
    .proj-stack img,.proj-tile-cta svg{transition:none;}
    .proj-tile:hover .proj-stack img:nth-child(1),
    .proj-tile:hover .proj-stack img:nth-child(2),
    .proj-tile:hover .proj-stack img:nth-child(3){transform:none;}
    .proj-stack img:nth-child(1){transform:translateX(-26px) rotate(-11deg);}
    .proj-stack img:nth-child(2){transform:translateX(26px) rotate(11deg);}
    .proj-stack img:nth-child(3){transform:translateY(3px);}
  }
  @media (max-width:640px){.proj-tile{aspect-ratio:auto;padding:26px 16px;}}

  .lightbox{position:fixed;inset:0;z-index:500;background:rgba(18,26,31,.94);display:none;align-items:center;justify-content:center;padding:40px;}
  .lightbox.open{display:flex;}
  .lightbox-media{max-width:min(900px,90vw);display:flex;flex-direction:column;box-shadow:0 30px 80px rgba(0,0,0,.5);border-radius:8px;overflow:hidden;}
  .lightbox-media img{display:block;width:100%;max-height:74vh;object-fit:contain;background:#000;}
  .lightbox-caption{background:var(--navy);color:#fff;padding:16px 22px;font-family:'Oswald',sans-serif;font-size:16px;letter-spacing:.02em;text-align:center;}
  .lightbox-caption:empty{display:none;}
  .lightbox-close,.lightbox-prev,.lightbox-next{position:absolute;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);color:#fff;width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .2s;}
  .lightbox-close:hover,.lightbox-prev:hover,.lightbox-next:hover{background:rgba(255,255,255,.22);}
  .lightbox-close{top:24px;right:24px;}
  .lightbox-prev{left:24px;top:50%;transform:translateY(-50%);}
  .lightbox-next{right:24px;top:50%;transform:translateY(-50%);}
  @media (max-width:640px){.lightbox-prev,.lightbox-next{width:40px;height:40px;}}

  /* ═══ SERVICE AREA / MAP ═══ */
  #area{padding:100px 0;background:var(--cream-dim);}
  .area-inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:stretch;}
  .area-list{display:flex;flex-direction:column;gap:16px;margin-top:26px;}
  .area-list li{display:flex;gap:12px;align-items:center;font-size:16px;font-weight:600;color:var(--navy);}
  .area-list svg{color:var(--rust);flex-shrink:0;}
  #map{width:100%;height:100%;min-height:360px;border-radius:16px;overflow:hidden;box-shadow:var(--shadow);}
  .map-live-dot{position:relative;display:block;width:12px;height:12px;border-radius:50%;background:#2E9E4F;border:2px solid #fff;box-shadow:0 2px 6px rgba(33,58,71,.4);}
  .map-live-ping{position:absolute;inset:-4px;border-radius:50%;background:#2E9E4F;opacity:.5;animation:mapLivePing 1.8s ease-out infinite;}
  @keyframes mapLivePing{0%{transform:scale(.6);opacity:.6;}100%{transform:scale(2.1);opacity:0;}}
  .leaflet-pane, .leaflet-control{filter:saturate(.35) brightness(1.02);}

  @media (max-width:900px){.area-inner{grid-template-columns:1fr;}#map{min-height:300px;}}

  /* ═══ REVIEWS ═══ */
  #reviews{padding:90px 0;text-align:center;}
  .stars{display:flex;justify-content:center;gap:6px;color:var(--rust);margin-bottom:18px;}
  .rating-num{font-family:'Oswald',sans-serif;font-size:52px;color:var(--navy);}
  .rating-sub{color:var(--ink-soft);font-size:15px;margin-bottom:40px;}
  .review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;text-align:left;margin-bottom:34px;}
  .review-card{background:#fff;border:1px solid rgba(33,58,71,.08);border-radius:12px;padding:26px;}
  .review-card svg{color:var(--rust);margin-bottom:14px;}
  .review-card p{font-size:14.5px;color:var(--ink-soft);}
  @media (max-width:900px){.review-grid{grid-template-columns:1fr;}}

  /* ═══ QUOTE FORM ═══ */
  #quote{padding:120px 0;}
  .quote-box{background:var(--navy);border-radius:24px;overflow:hidden;display:grid;grid-template-columns:.9fr 1.1fr;box-shadow:0 40px 80px rgba(17,24,39,.2);}
  .quote-info{padding:64px 54px;color:#fff;position:relative;}
  .quote-info::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at top left, rgba(255,255,255,0.06), transparent 60%);pointer-events:none;}
  .quote-info h2{color:#fff;font-size:clamp(30px,4vw,42px);text-transform:uppercase;margin:16px 0 20px;}
  .quote-info p{color:rgba(255,255,255,.75);font-size:16px;margin-bottom:32px;line-height:1.7;}
  .quote-contact{display:flex;flex-direction:column;gap:22px;}
  .qc-item{display:flex;align-items:center;gap:16px;}
  .qc-icon{display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:var(--rust);flex-shrink:0;}
  .qc-text{display:flex;flex-direction:column;gap:3px;}
  .qc-label{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.5);}
  .qc-text a{font-weight:600;font-size:15px;color:#fff;}
  .quote-form{background:#fff;padding:56px 46px;}
  .form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
  .field{margin-bottom:16px;}
  .field label{display:block;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:7px;}
  .field input,.field select,.field textarea{width:100%;padding:13px 14px;border:1.5px solid #E1D8C6;border-radius:8px;font-family:inherit;font-size:15px;color:var(--ink);background:#FEFCF8;transition:border-color .2s;min-height:48px;}
  .field textarea{min-height:100px;resize:vertical;}
  .field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--rust);}
  .hp{position:absolute;left:-9999px;}
  .form-note{font-size:12px;color:var(--ink-soft);margin-top:14px;text-align:center;}

  @media (max-width:900px){.quote-box{grid-template-columns:1fr;}.form-row{grid-template-columns:1fr;}.quote-info,.quote-form{padding:40px 26px;}}

  /* ═══ FOOTER ═══ */
  /* ═══ CTA BANNER (pre-footer) ═══ */
  #cta-banner{background:var(--navy);padding:64px 0;}
  .cta-banner-inner{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;}
  .cta-banner-inner h2{color:#fff;font-size:clamp(28px,4vw,44px);text-transform:uppercase;line-height:1.1;}
  .cta-banner-inner h2 em{font-style:normal;color:var(--rust);}
  .cta-banner-inner p{color:rgba(255,255,255,.7);font-size:16px;margin-top:12px;max-width:420px;}
  .cta-banner-inner .btn{flex-shrink:0;}

  footer{background:var(--navy);color:rgba(255,255,255,.8);padding:70px 0 28px;overflow:hidden;position:relative;border-top:1px solid rgba(255,255,255,.08);}
  .foot-ghost{font-family:'Oswald',sans-serif;font-weight:700;font-size:clamp(60px,14vw,220px);line-height:1;color:rgba(255,255,255,.05);text-transform:uppercase;text-align:center;white-space:nowrap;margin:40px 0 -20px;letter-spacing:-.02em;user-select:none;pointer-events:none;}
  .foot-top{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:48px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.12);}
  .foot-brand{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
  .foot-brand img{height:44px;width:44px;border-radius:50%;}
  .foot-brand span{font-family:'Oswald',sans-serif;color:#fff;font-size:16px;letter-spacing:.03em;text-transform:uppercase;}
  .foot-col h4{color:#fff;font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px;}
  .foot-col ul{display:flex;flex-direction:column;gap:11px;}
  .foot-col a:hover{color:#fff;}
  .foot-col p{font-size:14px;color:rgba(255,255,255,.7);}
  .foot-social{display:flex;gap:12px;margin-top:20px;}
  .foot-social a{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);color:rgba(255,255,255,.8);transition:background .2s,color .2s;}
  .foot-social a:hover{background:var(--rust);color:#fff;}
  .foot-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:26px;font-size:13px;color:rgba(255,255,255,.5);}
  .foot-legal{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:28px;font-size:12.5px;color:rgba(255,255,255,.45);}
  .foot-legal a{color:rgba(255,255,255,.6);}
  .foot-legal a:hover{color:#fff;}

  @media (max-width:800px){
    .foot-top{grid-template-columns:1fr 1fr;gap:32px 24px;}
    .foot-top .foot-col:first-child{grid-column:1 / -1;}
    .foot-bottom{justify-content:center;text-align:center;}
  }

  /* ═══ PAGE HERO (sub-pages) ═══ */
  .page-hero{position:relative;min-height:64vh;display:flex;align-items:flex-end;overflow:hidden;margin:12px;border-radius:28px;}
  @media (max-width:640px){.page-hero{margin:8px;border-radius:20px;}}
  /* About's hero paragraph wraps to 2-3 lines on mobile and its bottom
     edge crowds/overlaps the floating Google rating badge. Nudge it up. */
  @media (max-width:640px){.about-hero-inner{transform:translateY(-75px);}}
  .page-hero .hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden;}
  .page-hero .hero-bg img{width:100%;height:100%;object-fit:cover;will-change:transform;transform:scale(1.12);}
  .page-hero .hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,32,39,.5) 0%,rgba(18,28,34,.9) 100%);}
  .page-hero-inner{position:relative;z-index:2;width:100%;padding-top:186px;padding-bottom:56px;}
  .page-hero-inner.hero-center{text-align:center;display:flex;flex-direction:column;align-items:center;}
  .page-hero-inner.hero-center h1{margin-top:-44px;margin-bottom:38px;}
  .page-hero-inner.hero-center .hero-ctas{justify-content:center;}
  .breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;letter-spacing:.03em;color:rgba(255,255,255,.68);margin-bottom:18px;text-transform:uppercase;}
  .breadcrumb a{color:rgba(255,255,255,.68);transition:color .2s;}
  .breadcrumb a:hover{color:#fff;}
  .page-hero-inner h1{font-size:clamp(34px,5.4vw,58px);color:#fff;text-transform:uppercase;max-width:760px;}
  .page-hero-inner p{max-width:600px;color:rgba(255,255,255,.86);font-size:17px;margin-top:18px;}

  /* ═══ INTRO / PROSE ═══ */
  .prose{padding:88px 0 20px;}
  .prose-inner{max-width:760px;margin:0 auto;text-align:center;}
  .prose-inner p{color:var(--ink-soft);font-size:17px;margin-top:16px;}
  .prose-inner.legal{text-align:left;max-width:820px;padding-bottom:60px;}
  .prose-inner.legal p{text-align:left;}
  .prose-inner.legal .legal-meta{color:var(--navy);font-weight:600;font-size:15px;margin-top:0;}
  .prose-inner.legal h2{margin-top:36px;font-size:19px;color:var(--navy);text-transform:uppercase;letter-spacing:.02em;}
  .prose-inner.legal a{color:var(--rust);text-decoration:underline;}

  /* ═══ COMPARE LIST ═══ */
  .compare{padding:20px 0 100px;}
  .compare-inner{max-width:780px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:18px;}
  .compare-card{background:#fff;border:1px solid rgba(33,58,71,.08);border-radius:14px;padding:24px;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s;}
  .compare-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent;}
  .compare-card li{transition:transform .2s var(--ease);}
  .compare-card li:hover{transform:translateX(4px);}
  .compare-card h3{font-size:16px;text-transform:uppercase;margin-bottom:14px;color:var(--rust);}
  .compare-card ul{display:flex;flex-direction:column;gap:10px;}
  .compare-card li{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;color:var(--ink-soft);}
  .compare-card svg{color:var(--rust);flex-shrink:0;margin-top:2px;}
  @media (max-width:720px){.compare-inner{grid-template-columns:1fr;}}

  /* ═══ FAQ ACCORDION ═══ */
  #faq{padding:20px 0 100px;}
  .faq-list{max-width:800px;margin:0 auto;}
  .faq-item{border-bottom:1px solid rgba(33,58,71,.12);transition:background .25s ease;}
  .faq-item:hover{background:var(--cream-dim);}
  .faq-item:hover .faq-q{color:var(--rust);}
  .faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 4px;background:none;border:none;text-align:left;font-family:'Oswald',sans-serif;font-size:17px;color:var(--navy);text-transform:uppercase;transition:color .2s;}
  .faq-q svg{flex-shrink:0;color:var(--rust);transition:transform .3s var(--ease);}
  .faq-item.open .faq-q svg{transform:rotate(45deg);}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .35s var(--ease);}
  .faq-a p{padding:0 4px 22px;color:var(--ink-soft);font-size:15px;max-width:680px;}

  /* ═══ VALUES / ABOUT GRID ═══ */
  .values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
  @media (max-width:1080px){.values-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:900px){.values-grid{grid-template-columns:1fr;}}

  /* ═══ CROSS-SELL STRIP ═══ */
  #crosssell{padding:0 0 100px;}
  .cross-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
  .cross-card{display:block;background:#fff;border:1px solid rgba(33,58,71,.08);border-radius:12px;padding:24px 20px;transition:transform .25s var(--ease),box-shadow .25s var(--ease);}
  .cross-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
  .cross-card .svc-icon{width:44px;height:44px;margin-bottom:14px;}
  .cross-card h4{font-size:15px;text-transform:uppercase;color:var(--navy);}
  @media (max-width:900px){.cross-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:520px){.cross-grid{grid-template-columns:1fr;}}

  /* ═══ PLAIN PAGE HERO (no photo — picket pattern) ═══ */
  .page-hero.plain{background:var(--navy);}
  .page-hero.plain .hero-bg{
    position:absolute;inset:0;z-index:0;
    background-image:repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 10px, transparent 10px 26px);
  }
  .page-hero.plain .hero-scrim{background:linear-gradient(180deg,rgba(33,58,71,0) 0%,rgba(20,28,33,.55) 100%);}

  /* ═══ NAV ACTIVE STATE ═══ */
  .nav-link.active{color:var(--rust)!important;}

  /* ═══ WHO WE ARE (home teaser) ═══ */
  #who{padding:40px 0;background:var(--cream-dim);overflow:hidden;}
  .who-inner{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
  .who-photo{position:relative;border-radius:16px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:1/1;}
  .who-photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease);}
  .who-photo:hover img{transform:scale(1.05);}
  .who-badge{position:absolute;bottom:18px;left:18px;background:rgba(33,58,71,.88);backdrop-filter:blur(6px);color:#fff;padding:10px 16px;border-radius:8px;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;}
  .who-copy h2{font-size:clamp(28px,4vw,42px);text-transform:uppercase;margin:8px 0 10px;}
  .who-copy p{color:var(--ink-soft);font-size:16px;margin-bottom:16px;}
  .who-copy .btn{margin-top:16px!important;}
  /* #who is pinned (position:sticky) on Home — its whole box has to fit in
     one screen or the bottom of it (the photo, last trust item, button)
     is permanently below the fold for the entire pin. Mobile keeps the
     photo in its natural DOM order (first, right under the heading)
     instead of pushing it to the end, and trims padding/spacing so the
     full card fits within a typical mobile viewport while pinned. */
  @media (max-width:900px){.who-inner{grid-template-columns:1fr;gap:16px;}.who-photo{aspect-ratio:16/9;}}

  .trust-list{display:flex;flex-direction:column;}
  .trust-item{display:flex;gap:16px;padding:12px 0;border-bottom:1px solid rgba(33,58,71,.1);transition:background .25s;}
  .trust-item:hover{background:rgba(160,94,77,.05);}
  .trust-item:first-child{padding-top:0;}
  .trust-item:last-child{border-bottom:none;padding-bottom:0;}
  .trust-icon{flex-shrink:0;width:44px;height:44px;border-radius:50%;background:#3B5D42;color:#fff;display:flex;align-items:center;justify-content:center;}
  .trust-icon svg{width:20px;height:20px;}
  .trust-item h3{font-size:17px;text-transform:uppercase;margin-bottom:4px;}
  .trust-item p{color:var(--ink-soft);font-size:14px;line-height:1.45;}
  @media (max-width:640px){
    #who{padding:24px 0 16px;}
    .who-copy h2{margin:6px 0 10px;}
    .trust-item{padding:6px 0;gap:12px;}
    .trust-icon{width:34px;height:34px;}
    .trust-icon svg{width:15px;height:15px;}
    .trust-item h3{font-size:14px;margin-bottom:2px;}
    .trust-item p{font-size:12px;line-height:1.3;}
    .who-copy .btn{margin-top:10px!important;}
  }

  /* ═══ BENTO GALLERY (home) ═══ */
  .bento-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,190px);gap:14px;}
  .bento-item{border-radius:12px;overflow:hidden;cursor:pointer;position:relative;transition:transform .35s var(--ease),box-shadow .35s var(--ease);}
  .bento-item:hover{transform:translateY(-6px);box-shadow:0 20px 40px -12px rgba(33,58,71,.3);}
  .bento-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease);}
  .bento-item:hover img{transform:scale(1.08);}
  .bento-item.b-large{grid-column:span 2;grid-row:span 2;}
  .bento-item.b-wide{grid-column:span 2;}
  .bento-item .gal-zoom{position:absolute;inset:0;background:rgba(33,58,71,0);display:flex;align-items:center;justify-content:center;color:#fff;opacity:0;transition:opacity .25s,background .25s;}
  .bento-item:hover .gal-zoom{opacity:1;background:rgba(33,58,71,.28);}
  @media (max-width:900px){.bento-grid{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,160px);}.bento-item.b-large{grid-column:span 2;grid-row:span 1;}}
  @media (max-width:560px){.bento-grid{grid-template-columns:1fr;grid-template-rows:none;}.bento-item{aspect-ratio:4/3;}.bento-item.b-large,.bento-item.b-wide{grid-column:span 1;}}

  /* ═══ VETERANS / FIRST RESPONDERS BANNER ═══ */
  #veterans{padding:0 12px;}
  .vet-banner{position:relative;border-radius:24px;overflow:hidden;min-height:340px;display:flex;align-items:center;justify-content:center;text-align:center;}
  .vet-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;}
  .vet-banner::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.35) 45%,rgba(0,0,0,.82) 100%);}
  .vet-banner-inner{position:relative;z-index:1;padding:56px 24px;max-width:760px;}
  .vet-banner-inner svg{margin-bottom:18px;}
  .vet-banner-inner h2{color:#fff;font-size:clamp(26px,4vw,38px);text-transform:uppercase;line-height:1.25;margin-bottom:26px;}
  @media (max-width:640px){.vet-banner{min-height:280px;border-radius:18px;}.vet-banner-inner{padding:36px 20px;}}

  /* ═══ REVIEWS v2 (animated) ═══ */
  .stars-anim{display:flex;justify-content:center;gap:8px;margin-bottom:16px;}
  .stars-anim svg{color:var(--rust);opacity:0;transform:scale(.4) rotate(-25deg);transition:opacity .4s var(--ease),transform .5s cubic-bezier(.34,1.56,.64,1);}
  .stars-anim.in svg{opacity:1;transform:scale(1) rotate(0);}
  .stars-anim.in svg:nth-child(1){transition-delay:0ms;}
  .stars-anim.in svg:nth-child(2){transition-delay:80ms;}
  .stars-anim.in svg:nth-child(3){transition-delay:160ms;}
  .stars-anim.in svg:nth-child(4){transition-delay:240ms;}
  .stars-anim.in svg:nth-child(5){transition-delay:320ms;}
  .rating-num-anim{font-family:'Oswald',sans-serif;font-size:64px;color:var(--navy);line-height:1;}
  .review-card-v2{background:#fff;border:1px solid rgba(33,58,71,.08);border-radius:14px;padding:28px;opacity:0;transform:translateY(30px) scale(.96);transition:opacity .6s var(--ease),transform .6s var(--ease);}
  .review-card-v2.in{opacity:1;transform:translateY(0) scale(1);}

  /* ═══ REVIEW PHOTO CARDS (focal reveal) ═══ */
  #reviews .wrap{max-width:1320px;}
  .reviews-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:48px;text-align:left;}
  .reviews-head h2{font-size:clamp(28px,4vw,42px);text-transform:uppercase;margin-top:14px;max-width:520px;}
  .reviews-head-right{max-width:360px;flex-shrink:0;}
  .reviews-head-right p{color:var(--ink-soft);font-size:15px;margin-bottom:18px;}
  @media (max-width:900px){.reviews-head{flex-direction:column;align-items:flex-start;}}
  .review-photo-grid{display:flex;gap:26px;margin:8px 0 44px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:12px;scrollbar-width:thin;}
  .review-photo-grid::-webkit-scrollbar{height:8px;}
  .review-photo-grid::-webkit-scrollbar-thumb{background:rgba(33,58,71,.2);border-radius:99px;}
  .review-photo-grid .review-photo-card{flex:0 0 340px;scroll-snap-align:start;}
  @media (max-width:640px){.review-photo-grid .review-photo-card{flex:0 0 260px;}.rpc-body{padding:12px 16px 18px;}.rpc-body p{font-size:14px;}}
  .review-nav{display:flex;justify-content:center;gap:14px;margin:4px 0 36px;}
  .review-arrow{width:46px;height:46px;border-radius:50%;background:var(--rust);color:#fff;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,transform .2s;}
  .review-arrow:hover{background:var(--rust-dark);transform:translateY(-2px);}
  .review-photo-card{background:var(--card-bg,#fff);border-radius:18px;overflow:hidden;box-shadow:0 20px 50px -14px rgba(15,23,42,.18);text-align:left;opacity:0;transform:translateY(24px);transition:opacity .6s var(--ease),transform .6s var(--ease);}
  .review-photo-card.in{opacity:1;transform:translateY(0);}
  .rpc-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--cream-dim);}
  .rpc-clip{position:absolute;inset:0;clip-path:inset(0 0 100% 0);transition:clip-path 1.1s cubic-bezier(0.16,1,0.3,1) .15s;}
  .review-photo-card.in .rpc-clip{clip-path:inset(0 0 0% 0);}
  .rpc-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease);}
  .review-photo-card:hover .rpc-media img{transform:scale(1.07);}
  .rpc-platform{position:relative;margin:-20px 0 0 16px;width:40px;height:40px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(2,6,23,.18);padding:8px;z-index:2;}
  .rpc-platform svg{width:100%;height:100%;}
  .rpc-rating{position:absolute;top:14px;right:14px;background:rgba(2,6,23,.82);backdrop-filter:blur(6px);color:#fff;font-size:12px;font-weight:700;padding:6px 11px;border-radius:999px;display:flex;align-items:center;gap:5px;z-index:2;}
  .rpc-rating svg{width:12px;height:12px;color:#FBBC05;flex-shrink:0;}
  .rpc-body{padding:12px 22px 18px;}
  .rpc-name-top{font-family:'Oswald',sans-serif;font-size:16px;font-weight:600;color:var(--navy);text-transform:uppercase;letter-spacing:.02em;margin-bottom:6px;}
  .rpc-body p{font-size:14.5px;color:var(--ink-soft);line-height:1.55;margin-bottom:10px;}
  .rpc-foot{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.03em;}
  .rpc-foot svg{color:#34A853;flex-shrink:0;width:13px;height:13px;}

  /* ═══ SECTION STACK (Apple-style scroll pin) ═══
     Cards must share one direct parent (see .stack-group in index.html) —
     a sticky element's release point is bound by its containing block, and
     with no shared wrapper that block was <body>, so the pinned card never
     released until the bottom of the entire page (the original scroll-trap
     bug). With a wrapper sized to just these cards, sticky elements release
     the instant that wrapper's content is exhausted, i.e. right on cue.
     Only non-.stack-end cards get position:sticky — each pins at the top and
     the next card (higher z-index) scrolls up over it, covering it, which
     reads as one card landing on top of the other. The LAST card in the
     chain (.stack-end) stays un-sticky so it just slides over the pinned
     card(s) and hands scroll off normally to whatever follows the group. */
  .stack-card{position:relative;border-radius:32px 32px 0 0;box-shadow:0 -16px 44px rgba(20,28,33,.22);background:var(--cream);margin-top:-32px;}
  .stack-card:not(.stack-end){position:sticky;top:20px;}
  /* The pinned card is often shorter than the viewport, so with the
     normal -32px overlap the next card starts sliding over it almost
     immediately — before there's been any real time to see it. A
     positive gap here delays that slide until the viewport has had a
     proper beat on the pinned card first. Desktop viewports run taller
     on average than mobile, hence the smaller base value here. */
  .stack-card.stack-end{margin-top:90px;}
  @media (max-width:640px){
    .stack-card.stack-end{margin-top:280px;}
  }
  .stack-card.z1{z-index:4;background:var(--cream-dim);}
  .stack-card.z2{z-index:5;}
  .stack-card.z3{z-index:6;}
  .stack-card.z4{z-index:7;}
  @media (max-width:768px){.stack-card{border-radius:22px 22px 0 0;box-shadow:0 -12px 36px rgba(20,28,33,.28);margin-top:-22px;}}
