:root{
    --lmi-blue:#35679a;
    --lmi-blue-dark:#183f63;
    --lmi-blue-deep:#0e2b43;

    --lmi-green:#4f8759;
    --lmi-green-dark:#35643f;

    --graphite:#252a2f;
    --steel:#65717b;
    --steel-light:#d8dde1;
    --concrete:#eef1f3;

    --paper:#ffffff;
    --soft:#f4f6f7;
    --line:#cfd6dc;

    --radius:6px;
    --shadow:0 12px 34px rgba(14,43,67,.12);
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    color:var(--graphite);
    background:var(--paper);
    font-family:Arial,Helvetica,sans-serif;
    line-height:1.6;
    font-size:16px;
}

a{
    color:var(--lmi-blue);
    text-decoration:none;
}

a:hover{
    color:var(--lmi-green-dark);
}

img{
    max-width:100%;
    display:block;
}

.wrap{
    width:min(1220px,calc(100% - 42px));
    margin:auto;
}

.skip{
    position:absolute;
    left:-9999px;
}

.skip:focus{
    left:20px;
    top:20px;
    background:#fff;
    padding:10px;
    z-index:999;
}

/* =========================
   TYPOGRAPHY
========================= */

h1,
h2,
h3,
h4,
h5,
h6,
.brand b,
.nav a,
.btn,
.eyebrow,
.trust-item b,
.metric b{
    font-family:"Arial Narrow","Aptos Narrow","Liberation Sans Narrow",Arial,sans-serif;
    font-stretch:condensed;
    font-weight:800;
}

h1,
h2,
h3{
    letter-spacing:-.02em;
}

h2{
    color:var(--lmi-blue-deep);
}

/* =========================
   TOP BAR
========================= */

.topbar{
    background:var(--graphite);
    color:#dce4e9;
    border-bottom:4px solid var(--lmi-green);
    font-size:.88rem;
}

.topbar-inner{
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding:9px 0;
}

.topbar a{
    color:#fff;
    font-weight:700;
}

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

.site-header{
    position:sticky;
    top:0;
    z-index:50;
    background:#fff;
    border-bottom:1px solid var(--steel-light);
    box-shadow:0 4px 18px rgba(0,0,0,.05);
}

.navrow{
    min-height:82px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
}

.brand{
    display:flex;
    align-items:center;
    gap:14px;
    color:var(--graphite);
}

.brand:hover{
    text-decoration:none;
    color:var(--graphite);
}

.brand-mark{
    width:64px;
    height:58px;
    display:grid;
    place-items:center;
    background:var(--lmi-blue);
    color:#fff;
    font-size:1.45rem;
    font-weight:900;
    letter-spacing:-2px;
    border-radius:0;
    border-bottom:7px solid var(--lmi-green);
}

.brand b{
    display:block;
    font-size:1.03rem;
    text-transform:uppercase;
    line-height:1.05;
    color:var(--graphite);
}

.brand small{
    display:block;
    margin-top:4px;
    color:var(--lmi-blue);
    font-size:.74rem;
    text-transform:uppercase;
    letter-spacing:.06em;
}

.nav{
    display:flex;
    align-items:center;
    gap:24px;
}

.nav>a{
    color:var(--graphite);
    font-weight:800;
    text-transform:uppercase;
    font-size:.92rem;
    letter-spacing:.035em;
    position:relative;
}

.nav>a:not(.btn):after{
    content:"";
    position:absolute;
    left:0;
    bottom:-9px;
    width:0;
    height:3px;
    background:var(--lmi-green);
    transition:.2s ease;
}

.nav>a:not(.btn):hover:after{
    width:100%;
}

.menu-btn{
    display:none;
    background:none;
    border:0;
    font-size:1.6rem;
    color:var(--graphite);
}

/* =========================
   BUTTONS
========================= */

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:0;
    border-radius:3px;
    padding:13px 21px;
    background:var(--lmi-green);
    color:#fff!important;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.04em;
    box-shadow:none;
    cursor:pointer;
    transition:.18s ease;
}

.btn:hover{
    text-decoration:none;
    background:var(--lmi-green-dark);
    transform:translateY(-1px);
}

.btn-secondary{
    background:transparent;
    color:#fff!important;
    border:2px solid rgba(255,255,255,.7);
}

.btn-secondary:hover{
    background:#fff;
    color:var(--lmi-blue-deep)!important;
}

.btn-small{
    padding:10px 16px!important;
}

/* =========================
   CIRCUIT / TECH BACKGROUND
========================= */

.hero,
.page-hero{
    position:relative;
    overflow:hidden;
    isolation:isolate;
}

.hero:before,
.page-hero:before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;

    background:
        linear-gradient(120deg,rgba(14,43,67,.97),rgba(24,63,99,.97)),
        #183f63;
}

.hero:after,
.page-hero:after{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    opacity:.18;

    background-image:
        linear-gradient(90deg,transparent 47%,rgba(135,190,225,.9) 48%,rgba(135,190,225,.9) 50%,transparent 51%),
        linear-gradient(0deg,transparent 47%,rgba(135,190,225,.55) 48%,rgba(135,190,225,.55) 50%,transparent 51%),
        radial-gradient(circle at 25px 25px,rgba(143,208,255,.95) 0 3px,transparent 4px),
        radial-gradient(circle at 75px 75px,rgba(143,208,255,.85) 0 3px,transparent 4px);

    background-size:
        100px 100px,
        100px 100px,
        100px 100px,
        100px 100px;

    transform:rotate(-12deg) scale(1.15);
}

/* =========================
   HERO
========================= */

.hero{
    color:#fff;
}

.hero-grid{
    min-height:620px;
    display:grid;
    grid-template-columns:1.05fr .95fr;
    align-items:center;
    gap:55px;
    padding:78px 0;
}

.eyebrow{
    display:inline-flex;
    padding:7px 12px;
    border-radius:2px;
    background:var(--lmi-green);
    border:0;
    color:#fff;
    font-size:.75rem;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.hero h1{
    font-size:clamp(3rem,6vw,5.8rem);
    line-height:.91;
    margin:22px 0 24px;
    color:#fff;
    text-transform:uppercase;
    max-width:800px;
}

.hero h1 span{
    color:#8fc0df;
}

.hero p{
    max-width:710px;
    font-size:1.13rem;
    color:#e0e8ed;
    line-height:1.7;
}

.hero-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:30px;
}

/* =========================
   CURRENT TRUCK GRAPHIC
========================= */

.hero-art{
    position:relative;
    min-height:430px;
}

.scale-illustration{
    position:absolute;
    inset:30px 0 0 0;
}

.bridge{
    position:absolute;
    left:2%;
    right:2%;
    bottom:105px;
    height:58px;
    background:linear-gradient(#8b949b,#39434b);
    border-radius:2px;
    box-shadow:0 18px 30px rgba(0,0,0,.35);
}

.bridge:before,
.bridge:after{
    content:"";
    position:absolute;
    bottom:-70px;
    width:70px;
    height:70px;
    background:#222b31;
}

.bridge:before{
    left:12%;
}

.bridge:after{
    right:12%;
}

.truck{
    position:absolute;
    left:13%;
    bottom:160px;
    width:68%;
    height:150px;
}

.cab{
    position:absolute;
    right:0;
    bottom:0;
    width:27%;
    height:82px;
    background:#f4f5f6;
    border-radius:4px;
}

.cab:before{
    content:"";
    position:absolute;
    left:10px;
    top:10px;
    width:62%;
    height:28px;
    background:#79b5d8;
    clip-path:polygon(0 0,75% 0,100% 100%,0 100%);
}

.trailer{
    position:absolute;
    left:0;
    bottom:16px;
    width:72%;
    height:75px;
    border-radius:2px;
    background:linear-gradient(180deg,#dbe3e9,#77838d);
}

.wheel{
    position:absolute;
    bottom:-15px;
    width:38px;
    height:38px;
    background:#090d10;
    border:7px solid #29333a;
    border-radius:50%;
}

.w1{left:10%;}
.w2{left:52%;}
.w3{right:4%;}

/* =========================
   PROOF CARDS
========================= */

.metric-cards{
    position:absolute;
    right:-8px;
    top:0;
    display:grid;
    gap:12px;
}

.metric{
    background:#fff;
    color:var(--graphite);
    padding:17px 18px;
    min-width:190px;
    border-left:6px solid var(--lmi-green);
    box-shadow:var(--shadow);
}

.metric b{
    display:block;
    color:var(--lmi-blue-dark);
    font-size:1.8rem;
    line-height:1;
}

.metric small{
    display:block;
    margin-top:5px;
    color:var(--steel);
    line-height:1.35;
}

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

.trust{
    background:var(--graphite);
    border-bottom:0;
}

.trust-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
}

.trust-item{
    padding:29px 28px;
    border-right:1px solid #454c52;
}

.trust-item:last-child{
    border-right:0;
}

.trust-item b{
    display:block;
    color:#fff;
    font-size:1.5rem;
    text-transform:uppercase;
}

.trust-item span{
    display:block;
    color:#aebbc4;
    font-size:.9rem;
    margin-top:3px;
}

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

.section{
    padding:82px 0;
}

.section.soft{
    background:
        linear-gradient(rgba(244,246,247,.95),rgba(244,246,247,.95)),
        repeating-linear-gradient(
            90deg,
            transparent 0,
            transparent 58px,
            rgba(53,103,154,.08) 59px,
            transparent 60px
        );
}

.section-head{
    display:flex;
    justify-content:space-between;
    gap:30px;
    align-items:end;
    margin-bottom:36px;
}

.section-head h2{
    font-size:clamp(2.2rem,4vw,3.5rem);
    line-height:1;
    margin:0;
    text-transform:uppercase;
    color:var(--lmi-blue-deep);
}

.section-head p{
    max-width:700px;
    color:var(--steel);
    margin:10px 0 0;
}

.section-head>a{
    font-weight:800;
}

/* =========================
   CARDS
========================= */

.cards{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.card{
    position:relative;
    background:#fff;
    border:1px solid var(--line);
    border-top:5px solid var(--lmi-blue);
    border-radius:0;
    padding:26px;
    box-shadow:none;
    transition:.2s ease;
}

.card:after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:0;
    height:5px;
    background:var(--lmi-green);
    transition:.25s ease;
}

.card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow);
    text-decoration:none;
}

.card:hover:after{
    width:100%;
}

.card-icon{
    width:52px;
    height:52px;
    border-radius:0;
    background:var(--lmi-blue);
    display:grid;
    place-items:center;
    color:#fff;
    font-weight:900;
    font-size:1.2rem;
}

.card h3{
    margin:18px 0 8px;
    font-size:1.35rem;
    color:var(--lmi-blue-deep);
    text-transform:uppercase;
}

.card p{
    color:var(--steel);
}

.card span{
    font-weight:800;
}

.card .keyword{
    display:inline-block;
    margin:4px 5px 0 0;
    padding:5px 8px;
    border-radius:2px;
    background:#eef2f4;
    color:#51606c;
    font-size:.75rem;
}

/* =========================
   SPLIT / PANEL
========================= */

.split{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:56px;
    align-items:center;
}

.panel{
    background:var(--lmi-blue-deep);
    color:#fff;
    border-radius:0;
    border-left:8px solid var(--lmi-green);
    padding:40px;
    box-shadow:var(--shadow);
}

.panel h2,
.panel h3{
    color:#fff;
    text-transform:uppercase;
}

.panel p{
    color:#dce7ee;
}

.checklist{
    list-style:none;
    padding:0;
    margin:22px 0;
}

.checklist li{
    padding:8px 0 8px 30px;
    position:relative;
    border-bottom:1px solid rgba(0,0,0,.06);
}

.checklist li:before{
    content:'✓';
    position:absolute;
    left:0;
    color:var(--lmi-green);
    font-weight:900;
}

.stats{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px;
}

.stat{
    border:1px solid #456075;
    border-radius:0;
    padding:22px;
}

.stat b{
    display:block;
    font-size:1.7rem;
    color:#fff;
    text-transform:uppercase;
}

.stat span{
    color:#c5d3dc;
}

/* =========================
   ARTICLE CARDS
========================= */

.article-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.article-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:0;
    overflow:hidden;
}

.article-thumb{
    height:170px;
    background:
        linear-gradient(120deg,rgba(24,63,99,.95),rgba(53,103,154,.92));
    display:flex;
    align-items:end;
    padding:18px;
    color:#fff;
    font-size:.78rem;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
    border-bottom:5px solid var(--lmi-green);
}

.article-body{
    padding:23px;
}

.article-body h3{
    margin:0 0 8px;
    color:var(--lmi-blue-deep);
    text-transform:uppercase;
}

.article-body p{
    color:var(--steel);
}

.article-meta{
    font-size:.82rem;
    color:var(--steel);
}

/* =========================
   INTERNAL PAGE HERO
========================= */

.page-hero{
    color:#fff;
    padding:82px 0;
}

.page-hero h1{
    font-size:clamp(2.7rem,5vw,5rem);
    line-height:.93;
    margin:13px 0;
    text-transform:uppercase;
    color:#fff;
}

.page-hero p{
    font-size:1.08rem;
    max-width:800px;
    color:#dce8ef;
}

.breadcrumb{
    font-size:.82rem;
    color:#b8cad6;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.breadcrumb a{
    color:#fff;
}

/* =========================
   CONTENT
========================= */

.content{
    padding:65px 0;
}

.content-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) 330px;
    gap:48px;
}

.prose{
    font-size:1.03rem;
}

.prose h2{
    margin-top:46px;
    color:var(--lmi-blue-deep);
    font-size:2.15rem;
    text-transform:uppercase;
    border-left:6px solid var(--lmi-green);
    padding-left:15px;
}

.prose h3{
    margin-top:29px;
    color:var(--lmi-blue-dark);
    text-transform:uppercase;
}

.prose li{
    margin:8px 0;
}

.prose strong{
    color:var(--graphite);
}

/* =========================
   SIDEBAR
========================= */

.sidebar{
    position:sticky;
    top:125px;
    align-self:start;
}

.sidebox{
    border:1px solid var(--line);
    border-top:5px solid var(--lmi-blue);
    border-radius:0;
    padding:22px;
    margin-bottom:18px;
    background:#fff;
}

.sidebox h3{
    margin-top:0;
    color:var(--lmi-blue-deep);
    text-transform:uppercase;
}

.sidebox a{
    display:block;
    padding:6px 0;
}

.tags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.tag{
    padding:6px 10px;
    border-radius:2px;
    background:#edf1f3;
    color:#485866;
    font-size:.8rem;
}

/* =========================
   CTA
========================= */

.cta-band{
    background:var(--graphite);
    color:#fff;
    border-radius:0;
    border-left:8px solid var(--lmi-green);
    padding:38px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
}

.cta-band h2{
    margin:0;
    color:#fff;
    text-transform:uppercase;
}

.cta-band p{
    margin:5px 0 0;
    color:#dbe3e8;
}

/* =========================
   FORMS
========================= */

.form{
    display:grid;
    gap:15px;
}

.field{
    display:grid;
    gap:6px;
}

.field label{
    font-weight:800;
    text-transform:uppercase;
    font-size:.85rem;
}

.field input,
.field textarea,
.field select{
    width:100%;
    padding:14px 14px;
    border:1px solid #bcc6ce;
    border-radius:2px;
    font:inherit;
    background:#fff;
}

.field input:focus,
.field textarea:focus,
.field select:focus{
    outline:2px solid rgba(53,103,154,.2);
    border-color:var(--lmi-blue);
}

.field textarea{
    min-height:150px;
    resize:vertical;
}

.form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px;
}

.notice{
    padding:14px 16px;
    background:#edf5ef;
    border:1px solid #bdd5c1;
    border-radius:2px;
}

.warn{
    background:#fff6e8;
    border-color:#e1ca9f;
}

/* =========================
   FOOTER
========================= */

.site-footer{
    position:relative;
    background:var(--graphite);
    color:#dbe5eb;
    padding:64px 0 95px;
    margin-top:60px;
    border-top:8px solid var(--lmi-blue);
}

.site-footer:before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:8px;
    background:
        linear-gradient(
            90deg,
            var(--lmi-blue) 0 65%,
            var(--lmi-green) 65% 100%
        );
}

.footer-grid{
    display:grid;
    grid-template-columns:1.35fr .8fr .8fr 1.2fr;
    gap:48px;
}

.site-footer h3{
    color:#fff;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.site-footer a{
    display:block;
    color:#dce8ee;
    margin:7px 0;
}

.site-footer a:hover{
    color:#fff;
}

.site-footer p{
    color:#a9bac4;
}

.footer-bottom{
    border-top:1px solid #485158;
    margin-top:42px;
    padding-top:20px;
    display:flex;
    justify-content:space-between;
    color:#93a6b3;
    font-size:.86rem;
}

.footer-bottom a{
    display:inline;
}

.footer-brand{
    color:#fff;
}

.site-footer .brand-mark{
    border-bottom-color:var(--lmi-green);
}

.temp-contact-email{
    color:#f1b44c!important;
    font-weight:800;
}

/* =========================
   MOBILE CTA
========================= */

.mobile-cta{
    display:none;
}

/* =========================
   ADMIN
========================= */

.admin-shell{
    max-width:1100px;
    margin:40px auto;
    padding:0 20px;
}

.admin-nav{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-bottom:25px;
}

.admin-table{
    width:100%;
    border-collapse:collapse;
}

.admin-table th,
.admin-table td{
    padding:12px;
    border-bottom:1px solid var(--line);
    text-align:left;
}

.seo-note{
    padding:20px;
    background:#eef4f8;
    border-left:5px solid var(--lmi-blue);
    border-radius:0;
}

.keyword-cloud{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.keyword-cloud a{
    padding:7px 10px;
    background:#f0f3f5;
    border-radius:2px;
    font-size:.83rem;
    color:#4f6070;
}

.searchbox{
    display:flex;
    gap:8px;
    margin:20px 0;
}

.searchbox input{
    flex:1;
    padding:13px 15px;
    border:1px solid var(--line);
    border-radius:2px;
}

.results-count{
    color:var(--steel);
    font-size:.9rem;
}

/* =========================
   RESPONSIVE
========================= */

@media(max-width:900px){

    .topbar-inner>span:first-child{
        display:none;
    }

    .hero-grid,
    .split,
    .content-grid{
        grid-template-columns:1fr;
    }

    .hero-grid{
        padding:58px 0;
        min-height:auto;
    }

    .hero-art{
        min-height:360px;
    }

    .cards,
    .article-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .trust-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .trust-item:nth-child(2){
        border-right:0;
    }

    .nav{
        display:none;
        position:absolute;
        left:0;
        right:0;
        top:112px;
        background:#fff;
        padding:22px;
        box-shadow:var(--shadow);
        flex-direction:column;
        align-items:stretch;
        border-top:5px solid var(--lmi-blue);
    }

    .menu-open .nav{
        display:flex;
    }

    .menu-btn{
        display:block;
    }

    .footer-grid{
        grid-template-columns:1fr 1fr;
    }

    .sidebar{
        position:static;
    }
}

@media(max-width:620px){

    .wrap{
        width:min(100% - 26px,1220px);
    }

    .topbar-inner{
        justify-content:center;
    }

    .brand small{
        display:none;
    }

    .brand b{
        font-size:.84rem;
    }

    .brand-mark{
        width:54px;
        height:50px;
        font-size:1.25rem;
    }

    .hero h1{
        font-size:2.75rem;
    }

    .hero-art{
        min-height:285px;
    }

    .metric-cards{
        display:none;
    }

    .truck{
        width:82%;
        left:6%;
    }

    .cards,
    .article-grid,
    .form-grid{
        grid-template-columns:1fr;
    }

    .trust-grid{
        grid-template-columns:1fr;
    }

    .trust-item{
        border-right:0;
        border-bottom:1px solid #454c52;
    }

    .section{
        padding:58px 0;
    }

    .section-head{
        display:block;
    }

    .footer-grid{
        grid-template-columns:1fr;
    }

    .footer-bottom{
        display:block;
    }

    .mobile-cta{
        display:grid;
        grid-template-columns:repeat(3,1fr);
        position:fixed;
        bottom:0;
        left:0;
        right:0;
        z-index:100;
        background:#fff;
        border-top:4px solid var(--lmi-green);
    }

    .mobile-cta a{
        text-align:center;
        padding:13px;
        font-weight:900;
        text-transform:uppercase;
        border-right:1px solid var(--line);
    }

    .site-footer{
        padding-bottom:125px;
    }

    .cta-band{
        display:block;
    }

    .cta-band .btn{
        margin-top:18px;
    }
}