/* CyberTech Investigations — extracted page styles */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
    :root{
      --navy:#0C243F;--navy-mid:#0f2d50;--navy-light:#163a63;
      --gold:#DEA405;--gold-light:#f5bb1a;--gold-pale:#fef9e7;
      --white:#fff;--off-white:#f7f9fc;
      --text-muted-light:#5a6a7e;--text-muted-dark:#8a9bb0;
      --card-navy:#0e2847;--border-navy:rgba(222,164,5,.18);--border-light:#e2e8f0;
    }
    html{scroll-behavior:smooth}
    body{font-family:'Open Sans',sans-serif;line-height:1.6;background:var(--navy)}
    a{color:inherit}
    :focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:4px}

    /* ── HEADER ── */
    header{background:#fff;border-bottom:3px solid var(--gold);padding:14px 48px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;box-shadow:0 2px 12px rgba(12,36,63,.1)}
    .logo-wrap{display:flex;align-items:center;text-decoration:none}
    .logo-wrap img{height:68px;width:auto;display:block}
    nav{display:flex;align-items:center;gap:4px}
    nav a{color:var(--gold);text-decoration:none;font-family:'Montserrat',sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:8px 14px;border-radius:4px;transition:color .2s}
    nav a:hover,nav a.active{color:var(--navy)}
    .nav-cta{background:var(--gold);color:var(--navy)!important;padding:10px 22px!important;border-radius:6px;font-weight:800!important;transition:background .2s,transform .2s}
    .nav-login{background:var(--navy);color:#fff!important;padding:9px 18px!important;border-radius:6px!important;font-weight:800!important;font-size:11px!important;transition:background .2s}
    .nav-login:hover{background:#163a63}
    .nav-cta:hover{background:var(--gold-light)!important;transform:translateY(-1px)}
    .menu-btn{display:none;background:none;border:0;font-size:26px;color:var(--navy);cursor:pointer;line-height:1}
    .mobile-nav{display:none;flex-direction:column;background:#fff;border-bottom:3px solid var(--gold);padding:8px 20px 16px}
    .mobile-nav.open{display:flex}
    .mobile-nav a{color:var(--navy);text-decoration:none;font-family:'Montserrat',sans-serif;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:12px 4px;border-bottom:1px solid var(--border-light)}
    .mobile-nav a:last-child{border-bottom:0;background:var(--gold);text-align:center;border-radius:6px;margin-top:10px}

    /* ── BUTTONS ── */
    .btn-gold{display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:var(--navy);padding:15px 32px;border-radius:8px;font-family:'Montserrat',sans-serif;font-weight:800;font-size:13px;text-decoration:none;text-transform:uppercase;letter-spacing:.5px;transition:all .22s}
    .btn-gold:hover{background:var(--gold-light);transform:translateY(-2px);box-shadow:0 6px 20px rgba(222,164,5,.3)}
    .btn-ol-navy{display:inline-flex;align-items:center;gap:8px;background:transparent;color:var(--navy);border:2px solid var(--navy);padding:15px 32px;border-radius:8px;font-family:'Montserrat',sans-serif;font-weight:700;font-size:13px;text-decoration:none;text-transform:uppercase;letter-spacing:.5px;transition:all .22s}
    .btn-ol-navy:hover{background:var(--navy);color:#fff;transform:translateY(-2px)}
    .btn-ol-light{display:inline-flex;align-items:center;gap:8px;background:transparent;color:#fff;border:2px solid rgba(255,255,255,.28);padding:15px 32px;border-radius:8px;font-family:'Montserrat',sans-serif;font-weight:700;font-size:13px;text-decoration:none;text-transform:uppercase;letter-spacing:.5px;transition:all .22s}
    .btn-ol-light:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px)}

    /* ══ SLIDER 1 — HERO ══ */
    .hero{min-height:calc(100vh - 100px);background:var(--navy);display:flex;align-items:center;padding:72px 48px;position:relative;overflow:hidden}
    .hero-accent{position:absolute;top:-120px;right:-120px;width:720px;height:720px;background:radial-gradient(circle,rgba(22,58,99,.85),transparent 65%);pointer-events:none}
    .hero-stripe{position:absolute;inset:0;opacity:.03;background-image:linear-gradient(var(--gold) 1px,transparent 1px),linear-gradient(90deg,var(--gold) 1px,transparent 1px);background-size:56px 56px;pointer-events:none}
    .hero-inner{max-width:1490px;margin:0 auto;width:100%;display:grid;grid-template-columns:1fr 890px;gap:26px;align-items:center;position:relative;z-index:2}
    .hero-right{display:flex;gap:16px;align-items:center}
    .hero-right .stats-panel{flex:1;min-width:0}

    .hero-slides{position:relative;min-height:340px}
    .hero-slide{position:absolute;inset:0;opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .55s ease,transform .55s ease}
    .hero-slide.active{opacity:1;transform:none;pointer-events:auto;position:relative}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(222,164,5,.12);border:1px solid rgba(222,164,5,.3);border-radius:20px;padding:6px 16px;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:20px}
    .hero h1{font-family:'Montserrat',sans-serif;font-weight:900;font-size:clamp(30px,4.4vw,52px);line-height:1.1;color:#fff;margin-bottom:16px}
    .hero h1 .gold{color:var(--gold)}
    .hero-sub{font-size:16px;color:var(--text-muted-dark);line-height:1.75;margin-bottom:30px;max-width:500px}
    .hero-btns{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px}
    .hero-badges{display:flex;gap:10px;flex-wrap:wrap}
    .badge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:6px 14px;font-size:12px;color:var(--text-muted-dark)}

    .hero-dots{display:flex;gap:10px;margin-top:32px;align-items:center}
    .dot{width:34px;height:5px;border-radius:3px;border:0;background:rgba(255,255,255,.22);cursor:pointer;padding:0;transition:background .25s,width .25s}
    .dot.active{background:var(--gold);width:52px}
    .hero-progress{margin-left:12px;font-size:11px;letter-spacing:2px;color:var(--text-muted-dark);font-weight:700;font-family:'Montserrat',sans-serif}

    /* stats panel */
    .stats-panel{background:var(--card-navy);border:1px solid var(--border-navy);border-radius:18px;padding:30px}
    .sp-label{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
    .stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:20px}
    .stat-box{background:rgba(12,36,63,.55);border:1px solid var(--border-navy);border-radius:10px;padding:18px;text-align:center}
    .stat-num{font-family:'Montserrat',sans-serif;font-size:32px;font-weight:900;color:#fff;display:block;line-height:1}
    .stat-num .unit{color:var(--gold)}
    .stat-lbl{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted-dark);margin-top:4px;display:block}
    .panel-divider{border:0;border-top:1px solid var(--border-navy);margin:0 0 18px}
    .panel-svc{display:flex;flex-direction:column;gap:10px}
    .psvc{display:flex;align-items:center;gap:10px;font-size:13px;color:#aebdd1}
    .psvc-icon{width:28px;height:28px;background:rgba(222,164,5,.12);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0}

    /* ── Rotating 9-services strip ── */
    .svc-rotator{position:relative;height:190px;overflow:hidden}
    .svc-page{position:absolute;inset:0;display:flex;flex-direction:column;gap:10px;opacity:0;transform:translateY(6px);transition:opacity .5s ease,transform .5s ease;pointer-events:none}
    .svc-page.active{opacity:1;transform:translateY(0);pointer-events:auto}
    .rotator-dots{display:flex;gap:6px;justify-content:center;margin-top:12px}
    .rdot{width:6px;height:6px;border-radius:50%;background:rgba(222,164,5,.25);transition:background .3s,transform .3s}
    .rdot.active{background:var(--gold);transform:scale(1.3)}

    /* ── Photo rotator box (real service images, next to At a Glance) ── */
    .photo-rotator-box{width:540px;flex-shrink:0;background:var(--card-navy);border:1px solid var(--border-navy);border-radius:18px;padding:20px 16px;display:flex;flex-direction:column;align-items:center;box-sizing:border-box}
    .mobile-photo-rotator{display:none}
    .photo-rotator-box .sp-label{text-align:center;margin-bottom:14px}
    .pr-frame{position:relative;width:100%;aspect-ratio:1.82;border-radius:12px;overflow:hidden;background:#f5a623}
    .pr-slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease}
    .pr-slide.active{opacity:1}
    .pr-slide img{
        width:100%;
        height:200%;
        object-fit:cover;
        object-position:center;
        display:block;
    }
    .pr-counter{margin-top:12px;font-size:12px;color:#aebdd1;letter-spacing:.5px}

    /* ── TRUST STRIP (dark) ── */
    .trust-strip{display:flex;justify-content:center;flex-wrap:wrap;background:#fff;border-bottom:1px solid var(--border-light)}
    .trust-item{display:flex;align-items:center;gap:10px;padding:22px 30px;font-size:13px;color:var(--text-muted-light);font-weight:500;border-right:1px solid var(--border-light)}
    .trust-item:last-child{border-right:0}
    .trust-item span{font-size:18px}

    /* ── SECTION SHELLS ── */
    .sec-dark{padding:72px 48px;background:var(--navy)}
    .sec-light{padding:72px 48px;background:var(--off-white)}
    .inner{max-width:1200px;margin:0 auto}
    .sec-hdr{text-align:center;margin-bottom:44px}
    .sec-label-gold{font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold);margin-bottom:10px;display:block}
    .sec-label-navy{font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:var(--navy);margin-bottom:10px;display:block}
    .h2-white{font-family:'Montserrat',sans-serif;font-size:clamp(22px,3.5vw,34px);font-weight:800;color:#fff}
    .h2-navy{font-family:'Montserrat',sans-serif;font-size:clamp(22px,3.5vw,34px);font-weight:800;color:var(--navy)}
    .sub-dark{font-size:15px;color:var(--text-muted-dark);max-width:520px;margin:12px auto 0}
    .sub-light{font-size:15px;color:var(--text-muted-light);max-width:520px;margin:12px auto 0}
    .gold-rule{width:44px;height:3px;background:var(--gold);border-radius:2px;margin:14px auto 0}

    /* ══ SLIDER 2 — SERVICES CAROUSEL ══ */
    .carousel-wrap{position:relative}
    .carousel{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:4px 2px 18px;-ms-overflow-style:none;scrollbar-width:none}
    .carousel::-webkit-scrollbar{display:none}
    .svc-card{flex:0 0 288px;scroll-snap-align:start;background:var(--card-navy);border:1px solid var(--border-navy);border-radius:13px;padding:26px 22px;text-decoration:none;display:block;transition:transform .22s,border-color .22s,box-shadow .22s}
    .svc-card:hover{transform:translateY(-5px);border-color:rgba(222,164,5,.5);box-shadow:0 12px 32px rgba(0,0,0,.35)}
    .svc-icon{font-size:28px;margin-bottom:12px;display:block}
    .svc-title{font-family:'Montserrat',sans-serif;font-weight:700;font-size:14px;color:#fff;margin-bottom:6px}
    .svc-desc{font-size:12.5px;color:var(--text-muted-dark);line-height:1.6;margin-bottom:14px}
    .svc-more{font-size:12px;font-weight:700;color:var(--gold);letter-spacing:.4px}
    .car-nav{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:8px}
    .car-btn{width:44px;height:44px;border-radius:50%;background:transparent;border:1.5px solid var(--border-navy);color:var(--gold);font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
    .car-btn:hover{border-color:var(--gold);background:rgba(222,164,5,.1);transform:scale(1.06)}
    .car-hint{font-size:11px;color:var(--text-muted-dark);letter-spacing:1.5px;text-transform:uppercase;font-weight:600}

    /* ── PROCESS (light) ── */
    .process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
    .step{text-align:center;padding:28px 16px;background:#fff;border:1px solid var(--border-light);border-radius:14px;box-shadow:0 2px 12px rgba(12,36,63,.05);transition:transform .22s,box-shadow .22s}
    .step:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(12,36,63,.1)}
    .step-num{width:60px;height:60px;border-radius:50%;background:var(--gold-pale);border:2px solid var(--gold);font-family:'Montserrat',sans-serif;font-weight:800;font-size:20px;color:var(--navy);display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
    .step-title{font-family:'Montserrat',sans-serif;font-weight:700;font-size:14px;color:var(--navy);margin-bottom:8px}
    .step-desc{font-size:12.5px;color:var(--text-muted-light);line-height:1.6}

    /* ══ SLIDER 3 — TESTIMONIALS ══ */
    .sec-quotes{padding:72px 48px;background:var(--navy)}
    .quote-stage{max-width:820px;margin:0 auto;position:relative;min-height:250px;overflow:hidden}
    .quote{position:absolute;inset:0;opacity:0;transform:translateX(24px);pointer-events:none;transition:opacity .5s ease,transform .5s ease;text-align:center}
    .quote.active{opacity:1;transform:none;pointer-events:auto;position:relative}
    .q-mark{font-family:Georgia,serif;font-size:64px;line-height:.8;color:var(--gold);opacity:.35;display:block;margin-bottom:10px}
    .q-stars{color:var(--gold);letter-spacing:4px;font-size:16px;margin-bottom:16px}
    .q-text{font-size:clamp(16px,2vw,21px);line-height:1.7;color:#fff;font-weight:500;margin-bottom:24px}
    .q-person{display:flex;align-items:center;justify-content:center;gap:12px}
    .q-avatar{width:44px;height:44px;border-radius:50%;background:var(--gold);color:var(--navy);display:flex;align-items:center;justify-content:center;font-family:'Montserrat',sans-serif;font-weight:800;font-size:14px}
    .q-meta{text-align:left}
    .q-name{font-size:14px;font-weight:700;color:#fff}
    .q-role{font-size:12px;color:var(--text-muted-dark)}
    .q-badge{display:inline-flex;align-items:center;gap:5px;margin-left:8px;background:rgba(222,164,5,.12);border:1px solid rgba(222,164,5,.35);border-radius:12px;padding:2px 9px;font-size:10px;font-weight:700;color:var(--gold);letter-spacing:.4px}
    .quote-nav{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:34px}
    .q-dot{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.22);cursor:pointer;padding:0;transition:background .25s,transform .25s}
    .q-dot.active{background:var(--gold);transform:scale(1.35)}
    .q-arrow{width:40px;height:40px;border-radius:50%;background:transparent;border:1.5px solid var(--border-navy);color:var(--gold);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
    .q-arrow:hover{border-color:var(--gold);background:rgba(222,164,5,.1)}
    .quotes-cta{text-align:center;margin-top:34px}
    .quotes-cta a{font-family:'Montserrat',sans-serif;font-size:12px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--gold);text-decoration:none;border-bottom:2px solid transparent;transition:border-color .2s}
    .quotes-cta a:hover{border-color:var(--gold)}

    /* ── WHY CTI (dark) ── */
    .why-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
    .why-left h2{font-family:'Montserrat',sans-serif;font-weight:800;font-size:clamp(22px,3vw,32px);color:var(--navy);margin-bottom:16px;line-height:1.2}
    .why-left h2 span{color:var(--gold)}
    .why-left>p{font-size:14px;color:var(--text-muted-light);line-height:1.8;margin-bottom:26px}
    .why-list{display:flex;flex-direction:column;gap:14px}
    .why-item{display:flex;gap:14px}
    .why-icon{width:36px;height:36px;border-radius:50%;background:var(--gold-pale);border:1px solid var(--gold);color:var(--navy);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;margin-top:2px}
    .why-item strong{font-size:14px;color:var(--navy);display:block;margin-bottom:3px}
    .why-item p{font-size:12.5px;color:var(--text-muted-light);margin:0}
    .why-right{background:#fff;border:1px solid var(--border-light);border-radius:16px;padding:32px;box-shadow:0 4px 24px rgba(12,36,63,.08)}
    .lic-block{text-align:center;padding:16px 0 22px;border-bottom:1px solid var(--border-light);margin-bottom:22px}
    .lic-icon{font-size:36px;display:block;margin-bottom:8px}
    .lic-title{font-family:'Montserrat',sans-serif;font-weight:800;font-size:15px;color:var(--navy)}
    .lic-num{font-size:13px;color:#8a6a00;font-weight:700;margin-top:4px}
    .cov-list{display:flex;flex-direction:column;gap:9px}
    .cov-item{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-muted-light)}
    .cov-dot{width:7px;height:7px;border-radius:50%;background:var(--gold);flex-shrink:0}

    /* ── CTA (gold pale) ── */
    .cta-band{padding:80px 48px;background:linear-gradient(135deg,var(--navy-light),var(--navy));border-top:3px solid var(--gold);text-align:center;position:relative;overflow:hidden}
    .cta-band::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 60% at 50% 50%,rgba(222,164,5,.12),transparent 70%);pointer-events:none}
    .cta-band h2{font-family:'Montserrat',sans-serif;font-size:clamp(22px,4vw,38px);font-weight:800;color:#fff;margin-bottom:12px;position:relative}
    .cta-band h2 span{color:var(--gold)}
    .cta-band>p{color:var(--text-muted-dark);font-size:15px;max-width:480px;margin:0 auto 28px;position:relative}
    .cta-btns{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;position:relative}

    /* ── FOOTER ── */
    footer{background:#fff;border-top:3px solid var(--gold);padding:44px 48px 24px}
    .ft-inner{max-width:1200px;margin:0 auto}
    .ft-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:36px;margin-bottom:36px}
    .ft-logo{height:56px;width:auto;margin-bottom:14px;display:block}
    .ft-brand p{font-size:12.5px;color:var(--text-muted-light);line-height:1.7;max-width:260px}
    .ft-col h4{font-family:'Montserrat',sans-serif;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:var(--gold);margin-bottom:14px}
    .ft-col a{display:block;font-size:13px;color:var(--text-muted-light);text-decoration:none;margin-bottom:8px;transition:color .2s}
    .ft-col p{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--text-muted-light);margin-bottom:8px}
    .ft-ico{display:inline-flex;align-items:center;justify-content:center;width:18px;flex-shrink:0;font-size:14px}
    .ft-col a:hover{color:var(--navy)}
    .ft-bottom{border-top:1px solid var(--border-light);padding-top:18px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}
    .ft-bottom p{font-size:12px;color:var(--text-muted-light)}
    .dcjs{display:inline-flex;align-items:center;gap:6px;background:var(--gold-pale);border:1px solid rgba(222,164,5,.4);border-radius:20px;padding:5px 14px;font-size:11px;color:#8a6a00;font-weight:700}

    /* ── RESPONSIVE ── */
    @media(max-width:960px){
      .hero-inner,.why-grid{grid-template-columns:1fr}
      .hero-right{display:none}
      .hero-accent,.hero-stripe{display:none}
      .hero-slides{min-height:0}
      .hero-slide{position:absolute}
      .hero-slide.active{position:relative}
      .mobile-photo-rotator{display:block;margin-top:28px}
      .mobile-photo-rotator .photo-rotator-box{width:100%;max-width:420px;margin:0 auto}
      .ft-grid{grid-template-columns:1fr 1fr}
      .process-grid{grid-template-columns:1fr 1fr}
    }
    @media(max-width:760px){
      header{padding:12px 20px}
      nav{display:none}
      .menu-btn{display:block}
      .logo-wrap img{height:52px}
      .hero,.sec-dark,.sec-light,.sec-quotes,.cta-band{padding:48px 20px}
      .trust-item{border-right:0;padding:16px 20px;width:100%;justify-content:center}
      footer{padding:36px 20px 20px}
      .ft-grid{grid-template-columns:1fr}
      .ft-bottom{flex-direction:column;text-align:center}
      .svc-card{flex-basis:82%}
    }
    @media(max-width:480px){.process-grid{grid-template-columns:1fr}}

    @media(prefers-reduced-motion:reduce){
      *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
    }


    /* =========================================================
       CTI HERO LAYOUT UPDATE
       Keeps the existing homepage design, enlarges the 9-image
       service slider, positions it to the left of CTI At a Glance,
       and removes the duplicate small rotating service list.
    ========================================================= */
    @media (min-width: 961px){
      .hero{
        padding-left:32px;
        padding-right:32px;
      }

      .hero-inner{
        max-width:1580px;
        grid-template-columns:minmax(360px,.72fr) minmax(850px,1.55fr);
        gap:30px;
        align-items:center;
      }

      .hero-right{
        display:grid;
        grid-template-columns:minmax(560px,720px) minmax(250px,300px);
        gap:26px;
        align-items:stretch;
      }

      .hero-right > .photo-rotator-box{
        order:1;
      }

      .hero-right > .stats-panel{
        order:2;
      }

      .photo-rotator-box{
        width:100%;
        max-width:none;
        padding:18px;
        justify-content:center;
      }

      .photo-rotator-box .sp-label{
        margin-bottom:12px;
      }

      .pr-frame{
        width:100%;
        aspect-ratio:1.82 / 1;
        min-height:540px;
        border-radius:14px;
        background:#0e2847;
      }

      .pr-slide img{
        width:100%;
        height:100%;
        object-fit:contain;
        object-position:center;
        background:#0e2847;
      }

      .hero-right .stats-panel{
        width:100%;
        min-width:0;
        min-height:440px;
        padding:28px 22px;
        display:flex;
        flex-direction:column;
        justify-content:center;
      }

      .hero-right .stats-grid{
        grid-template-columns:1fr 1fr;
        gap:10px;
        margin-bottom:0;
      }

      .hero-right .stat-box{
        padding:22px 10px;
      }

      .hero-right .stat-num{
        font-size:34px;
      }

      .hero-right .stat-lbl{
        font-size:9px;
      }

      /* The large image slider already represents all nine services. */
      .hero-right .panel-divider,
      .hero-right .svc-rotator,
      .hero-right .rotator-dots{
        display:none;
      }
    }

    @media (min-width:961px) and (max-width:1350px){
      .hero-inner{
        grid-template-columns:minmax(330px,.68fr) minmax(700px,1.45fr);
        gap:22px;
      }

      .hero-right{
        grid-template-columns:minmax(470px,1fr) 240px;
        gap:14px;
      }

      .pr-frame{
        min-height:360px;
      }

      .hero-right .stats-panel{
        min-height:360px;
        padding:22px 16px;
      }
    }

    @media (max-width:960px){
      .mobile-photo-rotator .photo-rotator-box{
        width:100%;
        max-width:620px;
        margin:0 auto;
      }

      .mobile-photo-rotator .pr-frame{
        width:100%;
        aspect-ratio:1.82 / 1;
      }

      .mobile-photo-rotator .pr-slide img{
        object-fit:contain;
        object-position:center;
      }
    }

  
    /* =========================================================
       FINAL HERO MERGE — LARGE SERVICES SLIDER LEFT
       Compact hero copy center, CTI At a Glance right.
       Rounded slider corners and responsive stacking.
    ========================================================= */

    @media (min-width: 961px) {
      .hero {
        min-height: auto;
        padding: 42px 28px 48px;
      }

      .hero-inner {
        max-width: 1760px;
        display: grid;
        grid-template-columns:
          minmax(650px, 1.62fr)
          minmax(330px, .78fr)
          minmax(250px, .56fr);
        grid-template-areas: "services copy glance";
        gap: 24px;
        align-items: stretch;
      }

      /*
       * Let the two children inside .hero-right become direct
       * participants in the main hero grid.
       */
      .hero-right {
        display: contents;
      }

      /* Existing hero text/content becomes the narrow center column. */
      .hero-inner > div:first-child {
        grid-area: copy;
        min-width: 0;
        align-self: center;
        padding: 18px 4px;
      }

      .hero-slides {
        min-height: 330px;
      }

      .hero h1 {
        font-size: clamp(30px, 2.65vw, 46px);
        line-height: 1.06;
      }

      .hero-sub {
        max-width: 420px;
        font-size: 14px;
        line-height: 1.68;
        margin-bottom: 22px;
      }

      .hero-btns {
        gap: 10px;
        margin-bottom: 22px;
      }

      .hero-btns .btn-gold,
      .hero-btns .btn-ol-light {
        padding: 13px 18px;
        font-size: 11px;
      }

      .hero-badges {
        gap: 7px;
      }

      .badge {
        padding: 5px 10px;
        font-size: 10px;
      }

      .hero-dots {
        margin-top: 22px;
      }

      /* Large service image slider on the far left. */
      .hero-right > .photo-rotator-box {
        grid-area: services;
        width: 100%;
        min-width: 0;
        height: 100%;
        min-height: 520px;
        padding: 16px;
        align-self: stretch;
        justify-content: center;
        background: rgba(8, 31, 55, .92);
        border: 1px solid rgba(222, 164, 5, .28);
        border-radius: 26px;
        box-shadow: 0 24px 70px rgba(0, 0, 0, .30);
        overflow: hidden;
      }

      .photo-rotator-box .sp-label {
        margin: 0 0 12px;
      }

      .pr-frame {
        width: 100%;
        height: auto;
        min-height: 0;
        aspect-ratio: 1.82 / 1;
        border-radius: 20px;
        overflow: hidden;
        background: #071b2f;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06);
      }

      .pr-slide {
        border-radius: inherit;
        overflow: hidden;
      }

      .pr-slide img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
        display: block;
        border-radius: inherit;
        transform: none;
        background: #071b2f;
      }

      .pr-counter {
        margin-top: 11px;
      }

      /* CTI At a Glance becomes a narrower, matching-height card. */
      .hero-right > .stats-panel {
        grid-area: glance;
        width: 100%;
        min-width: 0;
        min-height: 520px;
        padding: 24px 18px;
        align-self: stretch;
        display: flex;
        flex-direction: column;
        justify-content: center;
        border-radius: 24px;
        box-shadow: 0 20px 55px rgba(0, 0, 0, .22);
      }

      .hero-right .stats-grid {
        gap: 10px;
        margin-bottom: 16px;
      }

      .hero-right .stat-box {
        padding: 18px 8px;
      }

      .hero-right .stat-num {
        font-size: 30px;
      }

      .hero-right .stat-lbl {
        font-size: 9px;
      }

      .hero-right .svc-rotator {
        height: 166px;
      }

      .hero-right .psvc {
        gap: 7px;
        font-size: 11px;
      }

      .hero-right .psvc-icon {
        width: 24px;
        height: 24px;
        font-size: 11px;
      }
    }

    /* Medium desktop/laptop */
    @media (min-width: 961px) and (max-width: 1450px) {
      .hero {
        padding-left: 22px;
        padding-right: 22px;
      }

      .hero-inner {
        grid-template-columns:
          minmax(540px, 1.46fr)
          minmax(300px, .76fr)
          minmax(225px, .52fr);
        gap: 16px;
      }

      .hero-right > .photo-rotator-box,
      .hero-right > .stats-panel {
        min-height: 440px;
      }

      .hero h1 {
        font-size: clamp(28px, 2.65vw, 40px);
      }

      .hero-sub {
        font-size: 13px;
      }

      .hero-right > .stats-panel {
        padding: 20px 14px;
      }

      .hero-right .stat-num {
        font-size: 27px;
      }
    }

    /* Tablet/mobile: retain a clean stacked order. */
    @media (max-width: 960px) {
      .hero {
        padding: 48px 22px;
      }

      .hero-inner {
        display: grid;
        grid-template-columns: 1fr;
        gap: 26px;
      }

      .hero-right {
        display: flex;
      }

      .mobile-photo-rotator .photo-rotator-box {
        width: 100%;
        max-width: 760px;
        margin: 28px auto 0;
        padding: 14px;
        border-radius: 22px;
        overflow: hidden;
      }

      .mobile-photo-rotator .pr-frame {
        width: 100%;
        aspect-ratio: 1.82 / 1;
        border-radius: 16px;
        overflow: hidden;
      }

      .mobile-photo-rotator .pr-slide {
        border-radius: inherit;
        overflow: hidden;
      }

      .mobile-photo-rotator .pr-slide img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
        border-radius: inherit;
        transform: none;
      }

      .stats-panel {
        border-radius: 20px;
      }
    }

  
    /* =========================================================
       CTI AT A GLANCE — CREDENTIALS, CONTACT & CTA
    ========================================================= */
    .glance-details {
      display: flex;
      flex-direction: column;
      gap: 9px;
    }

    .glance-detail {
      display: flex;
      align-items: flex-start;
      gap: 9px;
      padding: 9px 10px;
      border: 1px solid rgba(222,164,5,.14);
      border-radius: 10px;
      background: rgba(255,255,255,.025);
      transition: border-color .2s ease, background .2s ease, transform .2s ease;
    }

    .glance-detail:hover {
      border-color: rgba(222,164,5,.38);
      background: rgba(222,164,5,.055);
      transform: translateX(2px);
    }

    .glance-detail-icon {
      display: grid;
      place-items: center;
      flex: 0 0 25px;
      width: 25px;
      height: 25px;
      border-radius: 7px;
      color: var(--navy);
      background: var(--gold);
      font-size: 11px;
      font-weight: 900;
      line-height: 1;
    }

    .glance-detail strong {
      display: block;
      color: #fff;
      font-family: 'Montserrat', sans-serif;
      font-size: 10.5px;
      font-weight: 700;
      line-height: 1.28;
    }

    .glance-detail small {
      display: block;
      margin-top: 2px;
      color: var(--text-muted-dark);
      font-size: 8.8px;
      line-height: 1.35;
    }

    .glance-contact {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-top: 14px;
      padding-top: 13px;
      border-top: 1px solid rgba(222,164,5,.20);
    }

    .glance-contact a,
    .glance-contact div {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      color: #b9c7d7;
      font-size: 9.5px;
      line-height: 1.4;
      text-decoration: none;
      overflow-wrap: anywhere;
    }

    .glance-contact a:hover {
      color: var(--gold);
    }

    .glance-contact a > span:first-child,
    .glance-contact div > span:first-child {
      color: var(--gold);
      flex: 0 0 14px;
      text-align: center;
    }

    .glance-book-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      margin-top: 15px;
      padding: 12px 10px;
      border-radius: 9px;
      color: var(--navy);
      background: linear-gradient(135deg, var(--gold-light), var(--gold));
      box-shadow: 0 10px 24px rgba(222,164,5,.22);
      font-family: 'Montserrat', sans-serif;
      font-size: 9px;
      font-weight: 800;
      letter-spacing: .35px;
      line-height: 1.35;
      text-align: center;
      text-decoration: none;
      text-transform: uppercase;
      transition: transform .2s ease, box-shadow .2s ease;
    }

    .glance-book-btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 14px 30px rgba(222,164,5,.32);
    }

    @media (min-width: 961px) {
      .hero-right > .stats-panel {
        justify-content: flex-start;
      }
    }

    @media (max-width: 960px) {
      .glance-details {
        display: grid;
        grid-template-columns: 1fr 1fr;
      }

      .glance-detail strong {
        font-size: 11px;
      }

      .glance-detail small,
      .glance-contact a,
      .glance-contact div {
        font-size: 9.5px;
      }
    }

    @media (max-width: 560px) {
      .glance-details {
        grid-template-columns: 1fr;
      }
    }

  
    /* =========================================================
       FINAL CTI AT A GLANCE POLISH
    ========================================================= */
    .glance-details {
      gap: 13px;
    }

    .glance-detail {
      gap: 12px;
      padding: 12px 13px;
      border-radius: 12px;
    }

    .glance-detail-icon {
      flex-basis: 32px;
      width: 32px;
      height: 32px;
      border-radius: 9px;
      font-size: 15px;
    }

    .glance-detail strong {
      font-size: 13px;
      line-height: 1.3;
    }

    .glance-detail small {
      margin-top: 3px;
      font-size: 10.5px;
      line-height: 1.45;
    }

    .glance-contact {
      gap: 10px;
      margin-top: 16px;
      padding-top: 15px;
    }

    .glance-contact a,
    .glance-contact div {
      gap: 9px;
      font-size: 12px;
      font-weight: 500;
      line-height: 1.45;
    }

    .glance-contact a > span:first-child,
    .glance-contact div > span:first-child {
      flex-basis: 16px;
      font-size: 13px;
    }

    .glance-trusted {
      display: flex;
      flex-wrap: wrap;
      gap: 6px 7px;
      margin-top: 15px;
      padding-top: 14px;
      border-top: 1px solid rgba(222,164,5,.20);
    }

    .glance-trusted-label {
      width: 100%;
      margin-bottom: 2px;
      color: var(--gold);
      font-family: 'Montserrat', sans-serif;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 1.3px;
      text-transform: uppercase;
    }

    .glance-trusted span:not(.glance-trusted-label) {
      padding: 5px 8px;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 999px;
      color: #b9c7d7;
      background: rgba(255,255,255,.035);
      font-size: 9.5px;
      line-height: 1.2;
    }

    .glance-book-btn {
      margin-top: 17px;
      padding: 15px 14px;
      border-radius: 10px;
      font-size: 12px;
      letter-spacing: .45px;
    }

    @media (min-width: 961px) and (max-width: 1450px) {
      .glance-detail {
        padding: 10px 11px;
      }

      .glance-detail strong {
        font-size: 11.5px;
      }

      .glance-detail small {
        font-size: 9.5px;
      }

      .glance-contact a,
      .glance-contact div {
        font-size: 10.5px;
      }

      .glance-book-btn {
        font-size: 10.5px;
        padding: 13px 11px;
      }
    }

    @media (max-width: 960px) {
      .glance-detail strong {
        font-size: 13px;
      }

      .glance-detail small {
        font-size: 10.5px;
      }

      .glance-contact a,
      .glance-contact div {
        font-size: 12px;
      }

      .glance-book-btn {
        font-size: 12px;
      }
    }

  
    /* =========================================================
       COMPACT CTI AT A GLANCE — FINAL TEST VERSION
       Keeps the live-page proportions while adding useful details.
    ========================================================= */

    @media (min-width: 961px) {
      .hero-right > .stats-panel {
        min-height: 520px;
        padding: 24px 18px;
        justify-content: center;
      }
    }

    .glance-details {
      display: flex;
      flex-direction: column;
      gap: 7px;
    }

    .glance-detail {
      display: flex;
      align-items: center;
      gap: 9px;
      padding: 7px 3px;
      border: 0;
      border-radius: 0;
      background: transparent;
      transition: color .2s ease, transform .2s ease;
    }

    .glance-detail:hover {
      border-color: transparent;
      background: transparent;
      transform: translateX(2px);
    }

    .glance-detail-icon {
      display: grid;
      place-items: center;
      flex: 0 0 26px;
      width: 26px;
      height: 26px;
      border-radius: 7px;
      color: var(--navy);
      background: var(--gold);
      font-size: 12px;
      font-weight: 900;
    }

    .glance-detail strong {
      display: block;
      color: #fff;
      font-family: 'Montserrat', sans-serif;
      font-size: 11.5px;
      font-weight: 700;
      line-height: 1.25;
    }

    .glance-detail small {
      display: block;
      margin-top: 1px;
      color: var(--text-muted-dark);
      font-size: 9.25px;
      line-height: 1.35;
    }

    .glance-contact {
      display: flex;
      flex-direction: column;
      gap: 7px;
      margin-top: 11px;
      padding-top: 11px;
      border-top: 1px solid rgba(222,164,5,.20);
    }

    .glance-contact a,
    .glance-contact div {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      color: #b9c7d7;
      font-size: 10.5px;
      font-weight: 500;
      line-height: 1.35;
      text-decoration: none;
      overflow-wrap: anywhere;
    }

    .glance-contact a > span:first-child,
    .glance-contact div > span:first-child {
      flex: 0 0 14px;
      color: var(--gold);
      font-size: 11px;
      text-align: center;
    }

    .glance-book-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      margin-top: 13px;
      padding: 12px 10px;
      border-radius: 9px;
      color: var(--navy);
      background: linear-gradient(135deg, var(--gold-light), var(--gold));
      box-shadow: 0 8px 20px rgba(222,164,5,.20);
      font-family: 'Montserrat', sans-serif;
      font-size: 10.5px;
      font-weight: 800;
      letter-spacing: .35px;
      line-height: 1.3;
      text-align: center;
      text-transform: uppercase;
    }

    .glance-book-btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 12px 26px rgba(222,164,5,.30);
    }

    /* Hide any trusted-by block if older markup remains cached. */
    .glance-trusted {
      display: none !important;
    }

    @media (min-width: 961px) and (max-width: 1450px) {
      .hero-right > .stats-panel {
        min-height: 440px;
        padding: 18px 14px;
      }

      .glance-details {
        gap: 5px;
      }

      .glance-detail {
        gap: 7px;
        padding: 5px 1px;
      }

      .glance-detail-icon {
        flex-basis: 23px;
        width: 23px;
        height: 23px;
        font-size: 10px;
      }

      .glance-detail strong {
        font-size: 10px;
      }

      .glance-detail small {
        font-size: 8.25px;
      }

      .glance-contact {
        margin-top: 8px;
        padding-top: 8px;
      }

      .glance-contact a,
      .glance-contact div {
        font-size: 9px;
      }

      .glance-book-btn {
        margin-top: 10px;
        padding: 10px 8px;
        font-size: 9px;
      }
    }

    @media (max-width: 960px) {
      .glance-details {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 9px 14px;
      }

      .glance-detail strong {
        font-size: 11.5px;
      }

      .glance-detail small {
        font-size: 9.25px;
      }

      .glance-contact a,
      .glance-contact div {
        font-size: 10.5px;
      }
    }

    @media (max-width: 560px) {
      .glance-details {
        grid-template-columns: 1fr;
      }
    }

  
    /* =========================================================
       BOLDER HERO LABELS + CUSTOM CTI AT A GLANCE ICON
    ========================================================= */
    .eyebrow,
    .sp-label,
    .svc-title,
    .psvc {
      font-weight: 800;
    }

    .eyebrow {
      font-family: 'Montserrat', sans-serif;
    }

    .glance-heading {
      display: flex;
      align-items: center;
      gap: 9px;
      font-family: 'Montserrat', sans-serif;
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 2px;
      text-transform: uppercase;
    }

    .glance-heading img {
      width: 28px;
      height: 28px;
      object-fit: contain;
      flex: 0 0 28px;
      filter: drop-shadow(0 2px 5px rgba(0,0,0,.18));
    }

    .glance-heading span {
      color: var(--gold);
      font-weight: 900;
    }

    /* Make rotating hero category labels noticeably bolder. */
    .hero-slide .eyebrow {
      font-size: 11.5px;
      font-weight: 900;
    }

    /* Make service names in the compact CTI panel/list bolder. */
    .psvc {
      color: #c9d5e2;
      font-family: 'Montserrat', sans-serif;
      font-weight: 700;
    }

    @media (max-width: 560px) {
      .glance-heading {
        font-size: 11px;
        letter-spacing: 1.5px;
      }

      .glance-heading img {
        width: 25px;
        height: 25px;
        flex-basis: 25px;
      }
    }

  
    /* =========================================================
       FINAL SITE POLISH — BRAND, NAVIGATION, ICON CONSISTENCY,
       CLICKABLE SLIDER, MOBILE READABILITY, LEGAL LINKS
    ========================================================= */

    /* Brand prominence without increasing header height excessively */
    header {
      padding-top: 11px;
      padding-bottom: 11px;
    }

    .logo-wrap img {
      height: 74px;
    }

    /* Cleaner, stronger navigation */
    nav {
      gap: 6px;
    }

    nav a {
      position: relative;
      font-size: 12.5px;
      font-weight: 700;
      letter-spacing: .75px;
    }

    nav a:not(.nav-cta):not(.nav-login)::after {
      content: "";
      position: absolute;
      left: 14px;
      right: 14px;
      bottom: 2px;
      height: 2px;
      border-radius: 2px;
      background: var(--gold);
      transform: scaleX(0);
      transform-origin: center;
      transition: transform .2s ease;
    }

    nav a:hover::after,
    nav a.active::after {
      transform: scaleX(1);
    }
/* Featured service presentation */
    .photo-rotator-box > .sp-label {
      font-family: 'Montserrat', sans-serif;
      font-weight: 900;
      letter-spacing: 2px;
    }

    .pr-link {
      position: absolute;
      inset: 0;
      display: block;
      border-radius: inherit;
      overflow: hidden;
      cursor: pointer;
    }

    .pr-link:focus-visible {
      outline: 3px solid var(--gold);
      outline-offset: -4px;
    }

    .pr-link img {
      transition: transform .35s ease, filter .35s ease;
    }

    .pr-link:hover img {
      transform: scale(1.018);
      filter: brightness(1.04);
    }

    .pr-caption {
      display: none;
      width: 100%;
      margin-top: 10px;
      padding: 10px 12px 0;
      text-align: left;
    }

    .pr-caption strong {
      display: block;
      color: #fff;
      font-family: 'Montserrat', sans-serif;
      font-size: 15px;
      line-height: 1.25;
    }

    .pr-caption span {
      display: block;
      margin-top: 4px;
      color: var(--text-muted-dark);
      font-size: 12px;
      line-height: 1.45;
    }

    /* Make trust-panel labels and credentials consistently bold */
    .glance-heading,
    .hero-slide .eyebrow,
    .glance-detail strong,
    .psvc,
    .trust-item {
      font-weight: 800;
    }

    /* Replace the visual feel of mixed emoji with consistent gold icon containers */
    .glance-detail-icon,
    .psvc-icon {
      font-family: Arial, sans-serif;
      color: var(--navy);
      background: var(--gold);
      border: 0;
      box-shadow: none;
    }

    /* Consistent active state for buttons */
    .btn-gold,
    .nav-cta,
    .glance-book-btn {
      box-shadow: 0 8px 22px rgba(222,164,5,.22);
    }

    /* Footer legal and service links */
    .legal-links {
      color: var(--text-muted-light);
      font-size: 11px;
      text-align: right;
    }

    .legal-links a {
      color: var(--text-muted-light);
      text-decoration: none;
    }

    .legal-links a:hover {
      color: var(--gold);
    }

    .confidential-notice {
      position: relative;
      max-width: 660px;
      margin: 20px auto 0;
      color: #9fb0c4;
      font-size: 11px;
      line-height: 1.55;
    }

    @media (max-width: 1100px) {
      .logo-wrap img {
        height: 68px;
      }

      nav a {
        font-size: 11.5px;
        padding-left: 10px;
        padding-right: 10px;
      }
    }

    @media (max-width: 960px) {
      .pr-caption {
        display: block;
      }

      .photo-rotator-box {
        padding-bottom: 16px;
      }

      .legal-links {
        text-align: left;
      }
    }

    @media (max-width: 560px) {
      .logo-wrap img {
        height: 56px;
      }

      .pr-caption strong {
        font-size: 14px;
      }

      .pr-caption span {
        font-size: 11px;
      }
    }

    /* =========================================================
       CTI FULL-SITE MOBILE RESPONSIVE OVERRIDES
       iPhone / Android / Safari / Chrome
    ========================================================= */

    html {
      -webkit-text-size-adjust: 100%;
      text-size-adjust: 100%;
      overflow-x: hidden;
    }

    body {
      width: 100%;
      min-width: 0;
      overflow-x: hidden;
    }

    img,
    svg,
    video,
    iframe {
      max-width: 100%;
      height: auto;
    }

    input,
    select,
    textarea,
    button {
      max-width: 100%;
      font-size: 16px; /* prevents iOS form zoom */
    }

    header,
    main,
    section,
    footer,
    .inner,
    .ft-inner,
    .phero-in {
      min-width: 0;
    }

    /* Touch-friendly navigation */
    .menu-btn {
      min-width: 44px;
      min-height: 44px;
      padding: 8px;
      touch-action: manipulation;
    }

    .mobile-nav {
      position: relative;
      z-index: 150;
      width: 100%;
      max-height: calc(100vh - 72px);
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    }

    .mobile-nav a {
      width: 100%;
      min-height: 44px;
      display: flex;
      align-items: center;
      padding: 12px 6px;
    }

    /* Prevent long content from forcing horizontal scrolling */
    p,
    li,
    a,
    strong,
    small,
    .card-desc,
    .cred-detail,
    .tool,
    .ft-col {
      overflow-wrap: anywhere;
      word-break: normal;
    }

    @media (max-width: 960px) {
      header {
        width: 100%;
      }

      nav {
        display: none !important;
      }

      .menu-btn {
        display: block !important;
      }

      .phero,
      .hero,
      .sec-dark,
      .sec-light,
      .sec-quotes,
      .cta-band {
        padding-left: 22px !important;
        padding-right: 22px !important;
      }

      .phero-grid,
      .mission-grid,
      .why-grid,
      .contact-grid,
      .book-grid {
        grid-template-columns: 1fr !important;
      }

      .ft-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      }

      .ft-bottom {
        align-items: flex-start !important;
        text-align: left !important;
      }

      .cta-btns,
      .hero-btns,
      .btn-row {
        flex-wrap: wrap;
      }

      .btn-gold,
      .btn-ol-light,
      .btn-ol-navy,
      .nav-cta,
      .nav-login {
        min-height: 44px;
      }
    }

    @media (max-width: 760px) {
      header {
        position: sticky;
        top: 0;
        padding: 10px 16px !important;
      }

      .logo-wrap {
        min-width: 0;
        max-width: calc(100% - 56px);
      }

      .logo-wrap img {
        width: auto !important;
        max-width: 100%;
        height: 52px !important;
        object-fit: contain;
      }

      .mobile-nav {
        padding: 8px 16px 16px !important;
      }

      .phero,
      .hero,
      .sec-dark,
      .sec-light,
      .sec-quotes,
      .cta-band {
        padding: 42px 16px !important;
      }

      .inner,
      .ft-inner {
        width: 100%;
        max-width: 100%;
      }

      .ft-grid {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
      }

      .ft-bottom {
        flex-direction: column !important;
      }

      .legal-links {
        text-align: left !important;
      }

      .cta-btns,
      .hero-btns,
      .btn-row {
        flex-direction: column;
        align-items: stretch;
      }

      .cta-btns a,
      .hero-btns a,
      .btn-row button,
      .btn-row a,
      .btn-gold,
      .btn-ol-light,
      .btn-ol-navy {
        width: 100%;
        justify-content: center;
        text-align: center;
      }

      .form-row,
      .exp-grid,
      .cards,
      .hours-grid {
        grid-template-columns: 1fr !important;
      }

      .form-card,
      .panel,
      .bcard,
      .ccard,
      .hcard {
        padding: 22px 16px !important;
      }
    }

    @media (max-width: 480px) {
      .phero,
      .hero,
      .sec-dark,
      .sec-light,
      .sec-quotes,
      .cta-band {
        padding-left: 14px !important;
        padding-right: 14px !important;
      }

      .logo-wrap img {
        height: 46px !important;
      }

      .h2-white,
      .h2-navy {
        line-height: 1.15;
      }
    }

    /* =========================================================
       HOMEPAGE MOBILE HERO + FEATURED SLIDER
    ========================================================= */
    @media (max-width: 960px) {
      .hero {
        min-height: auto !important;
        align-items: flex-start !important;
      }

      .hero-inner {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        max-width: 760px !important;
        gap: 24px !important;
      }

      .hero-inner > div:first-child {
        width: 100% !important;
        padding: 0 !important;
        order: 1;
      }

      .hero-right {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        gap: 18px !important;
        order: 2;
      }

      /* Disable the duplicate cloned mobile slider. */
      .mobile-photo-rotator {
        display: none !important;
      }

      .hero-right > .photo-rotator-box {
        order: 1;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 12px !important;
        border-radius: 18px !important;
      }

      .hero-right > .stats-panel {
        order: 2;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 20px 16px !important;
        border-radius: 18px !important;
      }

      .pr-frame {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 1.82 / 1 !important;
        border-radius: 14px !important;
      }

      .pr-slide,
      .pr-link {
        border-radius: inherit !important;
      }

      .pr-slide img,
      .pr-link img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
      }

      .pr-caption {
        display: block !important;
        padding: 10px 2px 2px !important;
      }

      .pr-counter {
        margin-top: 9px !important;
      }

      .hero-slides {
        width: 100%;
        min-height: 0 !important;
      }

      .hero-slide {
        width: 100%;
      }

      .hero h1 {
        font-size: clamp(32px, 9vw, 50px) !important;
        line-height: 1.04 !important;
      }

      .hero-sub {
        max-width: none !important;
        font-size: 15px !important;
      }

      .hero-badges {
        display: grid !important;
        grid-template-columns: 1fr !important;
      }

      .badge {
        width: 100%;
        justify-content: flex-start;
      }

      .hero-dots {
        margin-top: 20px !important;
      }

      .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
      }

      .glance-details {
        grid-template-columns: 1fr !important;
      }

      .trust-strip {
        display: grid !important;
        grid-template-columns: 1fr !important;
      }

      .trust-item {
        width: 100% !important;
        justify-content: flex-start !important;
        border-right: 0 !important;
        border-bottom: 1px solid var(--border-light);
      }

      .process-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      }

      .carousel {
        scroll-padding-left: 0;
      }

      .svc-card {
        flex: 0 0 min(84vw, 330px) !important;
      }
    }

    @media (max-width: 560px) {
      .hero {
        padding-top: 32px !important;
      }

      .photo-rotator-box > .sp-label,
      .glance-heading {
        font-size: 10px !important;
        letter-spacing: 1.4px !important;
      }

      .glance-heading img {
        width: 24px !important;
        height: 24px !important;
        flex-basis: 24px !important;
      }

      .stats-grid {
        grid-template-columns: 1fr 1fr !important;
      }

      .stat-box {
        padding: 14px 8px !important;
      }

      .stat-num {
        font-size: 27px !important;
      }

      .process-grid {
        grid-template-columns: 1fr !important;
      }

      .carousel {
        gap: 14px !important;
      }

      .svc-card {
        flex-basis: 88vw !important;
      }
    }

  
    /* =========================================================
       FIVE-SLIDE HERO — SMOOTH PROGRESS BARS
    ========================================================= */
    .hero-dots {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-top: 28px;
      width: min(100%, 360px);
    }

    .hero-dots .dot {
      position: relative;
      flex: 1 1 0;
      width: auto;
      height: 5px;
      padding: 0;
      overflow: hidden;
      border: 0;
      border-radius: 999px;
      background: rgba(255,255,255,.22);
      cursor: pointer;
      opacity: 1;
      transition: transform .2s ease, background .2s ease;
    }

    .hero-dots .dot:hover {
      background: rgba(255,255,255,.38);
      transform: translateY(-1px);
    }

    .hero-dots .dot.active {
      width: auto;
      background: rgba(255,255,255,.22);
    }

    .hero-dots .dot-fill {
      position: absolute;
      inset: 0;
      display: block;
      border-radius: inherit;
      background: var(--gold);
      transform: scaleX(0);
      transform-origin: left center;
    }

    .hero-dots .dot.active .dot-fill {
      animation: heroProgressFill 5s linear forwards;
    }

    @keyframes heroProgressFill {
      from { transform: scaleX(0); }
      to   { transform: scaleX(1); }
    }

    @media (prefers-reduced-motion: reduce) {
      .hero-dots .dot.active .dot-fill {
        animation: none;
        transform: scaleX(1);
      }
    }

    @media (max-width: 560px) {
      .hero-dots {
        width: 100%;
        gap: 7px;
        margin-top: 20px;
      }

      .hero-dots .dot {
        height: 4px;
      }
    }

    /* =========================================================
       FEATURED SERVICE — MODERN THUMBNAIL SLIDER NAVIGATION
    ========================================================= */
    .pr-modern-nav {
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr) 42px;
      align-items: center;
      gap: 12px;
      width: 100%;
      margin-top: 14px;
    }

    .pr-nav-center {
      min-width: 0;
    }

    .pr-arrow {
      display: grid;
      place-items: center;
      width: 42px;
      height: 42px;
      padding: 0;
      border: 1px solid rgba(255,255,255,.28);
      border-radius: 50%;
      color: #fff;
      background: rgba(3,20,38,.72);
      font-size: 27px;
      line-height: 1;
      cursor: pointer;
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      transition: color .2s ease, background .2s ease,
                  border-color .2s ease, transform .2s ease;
    }

    .pr-arrow:hover,
    .pr-arrow:focus-visible {
      color: var(--navy);
      border-color: var(--gold);
      background: var(--gold);
      transform: translateY(-2px);
    }

    .pr-segments {
      display: grid;
      grid-template-columns: repeat(9, minmax(14px, 1fr));
      gap: 6px;
      width: 100%;
      margin-bottom: 10px;
    }

    .pr-segment {
      position: relative;
      height: 4px;
      padding: 0;
      overflow: hidden;
      border: 0;
      border-radius: 999px;
      background: rgba(255,255,255,.20);
      cursor: pointer;
    }

    .pr-segment-fill {
      position: absolute;
      inset: 0;
      display: block;
      border-radius: inherit;
      background: var(--gold);
      transform: scaleX(0);
      transform-origin: left center;
    }

    .pr-segment.active .pr-segment-fill {
      animation: featuredServiceProgress 5.5s linear forwards;
    }

    @keyframes featuredServiceProgress {
      from { transform: scaleX(0); }
      to   { transform: scaleX(1); }
    }

    .pr-thumbnails {
      display: grid;
      grid-template-columns: repeat(9, minmax(58px, 1fr));
      gap: 7px;
      overflow-x: auto;
      padding: 2px 1px 5px;
      scrollbar-width: thin;
      scrollbar-color: rgba(222,164,5,.55) transparent;
      -webkit-overflow-scrolling: touch;
    }

    .pr-thumb {
      position: relative;
      min-width: 58px;
      padding: 0;
      overflow: hidden;
      border: 1px solid rgba(255,255,255,.14);
      border-radius: 8px;
      background: #071b2f;
      cursor: pointer;
      opacity: .62;
      transform: translateZ(0);
      transition: opacity .22s ease, border-color .22s ease,
                  box-shadow .22s ease, transform .22s ease;
    }

    .pr-thumb img {
      display: block;
      width: 100%;
      aspect-ratio: 1.82 / 1;
      object-fit: cover;
      filter: brightness(.72);
      transition: filter .22s ease, transform .22s ease;
    }

    .pr-thumb span {
      position: absolute;
      inset: auto 3px 3px;
      display: none;
      color: #fff;
      font-size: 8px;
      font-weight: 700;
      line-height: 1.15;
      text-align: center;
      text-shadow: 0 1px 3px #000;
    }

    .pr-thumb:hover,
    .pr-thumb:focus-visible {
      opacity: .9;
      border-color: rgba(222,164,5,.7);
      transform: translateY(-2px);
    }

    .pr-thumb.active {
      opacity: 1;
      border-color: var(--gold);
      box-shadow: 0 0 0 1px var(--gold),
                  0 7px 18px rgba(222,164,5,.22);
      transform: translateY(-2px) scale(1.025);
    }

    .pr-thumb.active img {
      filter: brightness(1);
    }

    .pr-thumb:hover img {
      filter: brightness(.95);
      transform: scale(1.04);
    }

    @media (prefers-reduced-motion: reduce) {
      .pr-segment.active .pr-segment-fill {
        animation: none;
        transform: scaleX(1);
      }
    }

    @media (max-width: 960px) {
      .pr-modern-nav {
        grid-template-columns: 38px minmax(0, 1fr) 38px;
        gap: 8px;
      }

      .pr-arrow {
        width: 38px;
        height: 38px;
        font-size: 24px;
      }

      .pr-thumbnails {
        display: flex;
        gap: 7px;
        scroll-snap-type: x proximity;
      }

      .pr-thumb {
        flex: 0 0 76px;
        scroll-snap-align: center;
      }

      .pr-thumb span {
        display: none;
      }
    }

    @media (max-width: 560px) {
      .pr-modern-nav {
        grid-template-columns: 35px minmax(0, 1fr) 35px;
        gap: 6px;
        margin-top: 10px;
      }

      .pr-arrow {
        width: 35px;
        height: 35px;
        font-size: 22px;
      }

      .pr-segments {
        gap: 4px;
        margin-bottom: 8px;
      }

      .pr-segment {
        height: 3px;
      }

      .pr-thumb {
        flex-basis: 66px;
        border-radius: 7px;
      }
    }