/* =========================================================
   SWIFTROUTE — PREMIUM MOBILE HOME
   Mobile-only visual polish for the existing homepage.
   Add AFTER home.css.
   ========================================================= */

@media (max-width: 767px) {

    :root{
        --m-navy:#06263a;
        --m-navy-2:#0b354b;
        --m-gold:#d3a34f;
        --m-ink:#102737;
        --m-muted:#6f7b83;
        --m-bg:#f7f5f0;
        --m-card:#ffffff;
        --m-line:#e6dfd4;
        --m-shadow:0 16px 38px rgba(7,31,48,.08);
        --m-radius:18px;
    }

    html,
    body{
        max-width:100%;
        overflow-x:hidden!important;
    }

    body{
        background:var(--m-bg)!important;
    }

    .site-container{
        width:calc(100% - 32px)!important;
        max-width:none!important;
        margin-inline:auto!important;
    }

    /* =====================================================
       HEADER
       ===================================================== */

    .new-header,
    .site-header,
    header.main-header{
        min-height:76px!important;
        position:sticky!important;
        top:0!important;
        z-index:9999!important;
        background:rgba(255,255,255,.96)!important;
        box-shadow:0 8px 25px rgba(10,35,50,.07)!important;
        backdrop-filter:blur(12px);
    }

    .new-header .header-inner,
    .site-header .site-container,
    header.main-header .site-container{
        min-height:76px!important;
        padding-top:0!important;
        padding-bottom:0!important;
    }

    .new-header .brand img,
    .site-header .brand img,
    header.main-header .brand img{
        width:auto!important;
        max-width:172px!important;
        max-height:44px!important;
    }

    .theme-toggle{
        width:48px!important;
        height:48px!important;
        min-width:48px!important;
        border-radius:50%!important;
    }

    .mobile-menu-toggle,
    .menu-toggle,
    .nav-toggle{
        width:46px!important;
        height:46px!important;
        display:grid!important;
        place-items:center!important;
    }

    /* =====================================================
       HERO — reduce oversized typography and clipping
       ===================================================== */

    .sr-hero{
        min-height:auto!important;
        padding:0!important;
        border-bottom:0!important;
    }

    .sr-hero-media img{
        object-position:61% center!important;
    }

    .sr-hero-overlay{
        background:
            linear-gradient(180deg,rgba(3,24,39,.35) 0%,rgba(3,25,40,.62) 54%,rgba(3,25,40,.82) 100%)!important;
    }

    .sr-hero-inner{
        min-height:auto!important;
        display:block!important;
        padding:68px 0 36px!important;
    }

    .sr-hero-copy{
        width:100%!important;
        max-width:none!important;
    }

    .sr-kicker{
        font-size:11px!important;
        line-height:1.45!important;
        letter-spacing:.18em!important;
    }

    .sr-hero h1{
        width:100%!important;
        max-width:100%!important;
        margin:18px 0 18px!important;
        font-size:48px!important;
        line-height:.98!important;
        letter-spacing:-.035em!important;
        overflow:visible!important;
    }

    .sr-hero h1 em{
        display:block!important;
        width:100%!important;
        margin-top:7px!important;
        color:var(--m-gold)!important;
        font-size:.93em!important;
        line-height:1!important;
        white-space:normal!important;
    }

    .sr-hero-lead{
        max-width:100%!important;
        margin:0!important;
        font-size:17px!important;
        line-height:1.58!important;
    }

    .sr-hero-actions{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:12px!important;
        margin-top:30px!important;
    }

    .sr-hero-actions .sr-btn{
        min-height:58px!important;
        width:100%!important;
        justify-content:center!important;
        padding:0 18px!important;
        font-size:11px!important;
        letter-spacing:.12em!important;
    }

    .sr-hero-badges{
        display:none!important;
    }

    /* Tracking card becomes a compact premium card */
    .sr-track-card{
        width:100%!important;
        max-width:none!important;
        margin:54px 0 0!important;
        padding:28px!important;
        border-radius:18px!important;
        border:1px solid rgba(213,163,79,.45)!important;
        background:rgba(255,253,249,.98)!important;
        box-shadow:0 22px 44px rgba(0,0,0,.17)!important;
    }

    .sr-track-card-top{
        margin-bottom:12px!important;
    }

    .sr-track-card h2{
        margin:0 0 10px!important;
        font-size:38px!important;
        line-height:1!important;
        letter-spacing:-.025em!important;
    }

    .sr-track-card>p{
        margin-bottom:20px!important;
        font-size:14px!important;
        line-height:1.55!important;
    }

    .sr-track-tabs{
        display:none!important;
    }

    .sr-track-form label{
        margin-bottom:8px!important;
        font-size:9px!important;
    }

    .sr-track-input{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:10px!important;
        border:0!important;
        background:transparent!important;
    }

    .sr-track-input input{
        min-height:54px!important;
        width:100%!important;
        padding:0 16px!important;
        border:1px solid #d8d0c5!important;
        border-radius:10px!important;
        background:#fff!important;
        font-size:15px!important;
    }

    .sr-track-input button{
        min-height:52px!important;
        width:100%!important;
        border-radius:10px!important;
        font-size:10px!important;
    }

    .sr-track-links{
        margin-top:18px!important;
        padding-top:16px!important;
        border-top:1px solid #e5ddd2!important;
    }

    /* Remove long dead-space after card */
    .sr-hero{
        padding-bottom:0!important;
    }

    /* =====================================================
       TRUST STRIP
       ===================================================== */

    .sr-trust-strip{
        padding:14px 0!important;
    }

    .sr-trust-grid{
        display:grid!important;
        grid-template-columns:1fr 1fr!important;
        gap:10px!important;
    }

    .sr-trust-grid>div{
        min-height:74px!important;
        padding:13px!important;
        border-radius:12px!important;
    }

    .sr-trust-grid strong{
        font-size:9px!important;
    }

    .sr-trust-grid small{
        font-size:9px!important;
        line-height:1.25!important;
    }

    /* =====================================================
       GENERIC SECTIONS
       ===================================================== */

    .sr-section{
        padding:66px 0!important;
    }

    .sr-section-head{
        display:block!important;
        margin-bottom:28px!important;
    }

    .sr-section-head>div{
        width:100%!important;
        max-width:none!important;
    }

    .sr-section-head h2{
        max-width:100%!important;
        margin:12px 0 14px!important;
        font-size:42px!important;
        line-height:1.02!important;
        letter-spacing:-.03em!important;
    }

    .sr-section-head>p{
        max-width:100%!important;
        margin:0!important;
        font-size:16px!important;
        line-height:1.62!important;
    }

    /* =====================================================
       SERVICES — compact cards instead of giant blocks
       ===================================================== */

    .sr-services{
        background:#faf9f6!important;
    }

    .sr-service-grid{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:16px!important;
    }

    .sr-service-card,
    .cms-service{
        min-height:0!important;
        height:auto!important;
        display:block!important;
        overflow:hidden!important;
        border:1px solid var(--m-line)!important;
        border-radius:16px!important;
        background:#fff!important;
        box-shadow:0 8px 26px rgba(15,38,52,.05)!important;
    }

    .sr-service-card img,
    .cms-service-image,
    .cms-service-image img{
        width:100%!important;
        height:220px!important;
        min-height:0!important;
        max-height:220px!important;
        object-fit:cover!important;
        display:block!important;
        margin:0!important;
        border-radius:0!important;
    }

    .sr-service-shade{
        display:none!important;
    }

    .sr-service-copy,
    .sr-service-icon-card,
    .cms-service-copy{
        position:static!important;
        min-height:0!important;
        height:auto!important;
        padding:24px 22px 26px!important;
        transform:none!important;
        background:#fff!important;
        color:var(--m-ink)!important;
    }

    .sr-service-copy>span,
    .sr-service-icon-card>span,
    .cms-service-number{
        display:block!important;
        margin-bottom:12px!important;
        color:#c79647!important;
        font-size:13px!important;
        font-style:italic!important;
    }

    .sr-service-copy h3,
    .sr-service-icon-card h3,
    .cms-service-copy h3{
        margin:0 0 12px!important;
        color:var(--m-ink)!important;
        font-size:34px!important;
        line-height:1.04!important;
        letter-spacing:-.025em!important;
    }

    .sr-service-copy p,
    .sr-service-icon-card p,
    .cms-service-copy p{
        margin:0 0 18px!important;
        color:#748088!important;
        font-size:15px!important;
        line-height:1.55!important;
    }

    .sr-service-copy strong,
    .sr-service-icon-card strong,
    .cms-service-copy a{
        color:#992f37!important;
        font-size:11px!important;
        letter-spacing:.08em!important;
    }

    .sr-big-icon{
        display:none!important;
    }

    /* If first card is featured, keep same compact mobile treatment */
    .sr-service-card-featured{
        grid-column:auto!important;
        grid-row:auto!important;
    }

    .sr-service-card-featured img{
        height:220px!important;
    }

    /* =====================================================
       TRACKING PROCESS — convert huge cards to compact flow
       ===================================================== */

    .sr-process{
        padding:66px 0!important;
        background:linear-gradient(180deg,#06263a,#082e43)!important;
    }

    .sr-section-head-light h2{
        font-size:42px!important;
    }

    .sr-process-grid{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:12px!important;
        margin-top:28px!important;
    }

    .sr-process-grid article{
        min-height:0!important;
        height:auto!important;
        padding:22px!important;
        display:grid!important;
        grid-template-columns:56px 1fr!important;
        column-gap:16px!important;
        row-gap:5px!important;
        align-items:start!important;
        border:1px solid rgba(255,255,255,.12)!important;
        border-radius:14px!important;
        background:rgba(255,255,255,.035)!important;
    }

    .sr-process-number{
        grid-row:1/3!important;
        width:52px!important;
        height:52px!important;
        display:grid!important;
        place-items:center!important;
        margin:0!important;
        border-radius:50%!important;
        font-size:11px!important;
    }

    .sr-process-grid h3{
        margin:2px 0 3px!important;
        font-size:25px!important;
        line-height:1.05!important;
    }

    .sr-process-grid p{
        margin:0!important;
        font-size:14px!important;
        line-height:1.45!important;
    }

    /* =====================================================
       WHY SECTION — image first, compact features beneath
       ===================================================== */

    .sr-why{
        padding:64px 0!important;
        background:#f5f7f9!important;
    }

    .sr-why-layout{
        display:flex!important;
        flex-direction:column!important;
        gap:28px!important;
    }

    .sr-why-copy{
        order:1!important;
    }

    .sr-why-media{
        order:2!important;
        width:100%!important;
        min-height:0!important;
        border-radius:18px!important;
        overflow:hidden!important;
        box-shadow:var(--m-shadow)!important;
    }

    .sr-why-media img{
        width:100%!important;
        height:350px!important;
        min-height:0!important;
        object-fit:cover!important;
        border-radius:18px!important;
    }

    .sr-why-float{
        left:18px!important;
        right:18px!important;
        bottom:18px!important;
        width:auto!important;
        border-radius:12px!important;
    }

    .sr-why-copy h2{
        margin:12px 0 16px!important;
        font-size:42px!important;
        line-height:1.03!important;
        letter-spacing:-.035em!important;
    }

    .sr-why-intro{
        font-size:16px!important;
        line-height:1.55!important;
    }

    .sr-benefit-grid{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:10px!important;
        margin-top:24px!important;
    }

    .sr-benefit-grid article{
        min-height:0!important;
        padding:16px 16px 16px 66px!important;
        position:relative!important;
        border-radius:12px!important;
        background:#fff!important;
        border:1px solid #e6ebef!important;
    }

    .sr-benefit-grid article>span{
        position:absolute!important;
        left:16px!important;
        top:17px!important;
        width:36px!important;
        height:36px!important;
        display:grid!important;
        place-items:center!important;
        border-radius:10px!important;
        background:#eef3ff!important;
        color:#3868ed!important;
        font-size:9px!important;
    }

    .sr-benefit-grid h3{
        margin:0 0 4px!important;
        font-size:17px!important;
        font-family:Arial,Helvetica,sans-serif!important;
    }

    .sr-benefit-grid p{
        margin:0!important;
        font-size:13px!important;
        line-height:1.45!important;
    }

    /* =====================================================
       STATS
       ===================================================== */

    .sr-stats{
        padding:20px 0!important;
    }

    .sr-stat-grid{
        display:grid!important;
        grid-template-columns:1fr 1fr!important;
        gap:1px!important;
    }

    .sr-stat-grid>div{
        min-height:105px!important;
        padding:18px 10px!important;
    }

    .sr-stat-grid strong{
        font-size:32px!important;
    }

    .sr-stat-grid span{
        font-size:9px!important;
    }

    /* =====================================================
       DASHBOARD PREVIEW
       ===================================================== */

    .sr-dashboard-layout{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:28px!important;
    }

    .sr-dashboard-copy h2{
        font-size:40px!important;
        line-height:1.03!important;
    }

    .sr-dashboard-card{
        border-radius:16px!important;
        overflow:hidden!important;
    }

    /* =====================================================
       FAQ / CTA / FOOTER rhythm
       ===================================================== */

    .sr-faq,
    .sr-dashboard-preview{
        padding-top:60px!important;
        padding-bottom:60px!important;
    }

    /* Ensure large desktop visual decorations don't create overflow */
    .sr-hero::before,
    .sr-hero::after,
    .sr-services::before,
    .sr-process::before,
    .sr-why::before{
        max-width:100vw!important;
        overflow:hidden!important;
    }
}

/* Extra narrow phones */
@media (max-width: 390px){

    .site-container{
        width:calc(100% - 24px)!important;
    }

    .sr-hero-inner{
        padding-top:52px!important;
    }

    .sr-hero h1{
        font-size:43px!important;
    }

    .sr-track-card{
        padding:22px!important;
    }

    .sr-track-card h2{
        font-size:34px!important;
    }

    .sr-section-head h2,
    .sr-section-head-light h2,
    .sr-why-copy h2{
        font-size:37px!important;
    }

    .sr-service-card img,
    .cms-service-image,
    .cms-service-image img{
        height:195px!important;
        max-height:195px!important;
    }

    .sr-service-copy h3,
    .sr-service-icon-card h3,
    .cms-service-copy h3{
        font-size:31px!important;
    }
}