/* ============================================
   AUX LOGISTICS — LOGINET-INSPIRED PROFESSIONAL STYLESHEET
   Palette: Red #c8102e · Navy #1a3464 · Charcoal #1f2736
   ============================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --navy:#1a3464;
  --charcoal:#1f2736;
  --charcoal2:#283347;
  --red:#c8102e;
  --red2:#a00d24;
  --white:#ffffff;
  --bg:#f0f8fa;
  --light:#f0f8fa;         /* Loginet light section bg */
  --light2:#e4f0f5;
  --grey:#5a6e87;
  --grey-light:#8fa3be;
  --border:#dde8f4;
  --green:#16a34a;
  --gold:#f59e0b;
  --red-light:rgba(200,16,46,.08);
  --red-mid:rgba(200,16,46,.18);
  --shadow-xs:0 1px 2px rgba(26,52,100,.04),0 3px 10px rgba(26,52,100,.06);
  --shadow-sm:0 2px 6px rgba(26,52,100,.05),0 10px 28px rgba(26,52,100,.10);
  --shadow:0 4px 14px rgba(26,52,100,.07),0 16px 48px rgba(26,52,100,.14);
  --shadow-lg:0 8px 20px rgba(26,52,100,.08),0 28px 70px rgba(26,52,100,.20);
  --radius:12px;
  --radius-lg:18px;
  --transition:.25s ease;
  --ease-card:cubic-bezier(.16,1,.3,1);
  --mono:'JetBrains Mono',ui-monospace,monospace;
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-family:'DM Sans',sans-serif;color:var(--charcoal);background:#fff;overflow-x:clip;-webkit-font-smoothing:antialiased}
.mobile-br{display:none}

/* ══════════════════════════════════════════════════════
   DISPATCH MANIFEST SYSTEM
   A monospace utility layer for anything that reads as data
   or reference (eyebrows, codes, stats, meta, timestamps) —
   the site's own "waybill" vocabulary, used consistently
   rather than decoratively.
   ══════════════════════════════════════════════════════ */
.tag,.mono,.stat-label{font-family:var(--mono)}

/* ── UTILS ── */
.container{max-width:1220px;margin:0 auto;padding:0 24px}
.tag{font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--red);display:inline-flex;align-items:center;gap:8px;margin-bottom:12px}
/* .tag::before{content:'';width:28px;height:2px;background:var(--red);border-radius:2px;flex-shrink:0} */

/* Route-line divider — a hairline with a small waypoint node at the start,
   replacing a plain border for stacked "manifest row" lists */
.route-row,.sme-card,.cc,.do-card,.sd-opt-card{position:relative}
.route-row::before,.sme-card::before,.cc::before,.do-card::before,.sd-opt-card::before{content:'';position:absolute;top:-1px;left:0;width:5px;height:5px;background:var(--red);border-radius:1px;transform:translateY(-2px) rotate(45deg)}
.route-row:first-child::before,.sme-card:first-child::before,.cc:first-child::before,.do-card:first-child::before,.sd-opt-card:first-child::before{display:none}
.h1{font-family:'Rethink Sans',sans-serif;font-size:clamp(32px,6vw,72px);font-weight:600;line-height:1.06;color:#fff;letter-spacing:-.5px}
.h1 span{color:var(--red)}
.h2{font-family:'Rethink Sans',sans-serif;font-size:clamp(22px,2.8vw,38px);font-weight:600;line-height:1.1;color:var(--charcoal);letter-spacing:-.4px;margin-bottom:10px}
.h2 span{color:var(--red)}
.h2.on-dark,.h2.light{color:#fff}
.h3{font-family:'Rethink Sans',sans-serif;font-size:clamp(19px,3vw,32px);font-weight:600;line-height:1.15;color:var(--charcoal)}
.sub{font-size:15px;color:var(--grey);line-height:1.75;margin-top:10px;max-width:580px}
.sub.on-dark{color: black;}
.sub.center{margin:14px auto 0}
.tag.light{color:rgba(255,255,255,.7)}
.tag.light::before{background:rgba(255,255,255,.7)}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:9px;padding:13px 28px;border-radius:6px;font-size:14px;font-weight:700;cursor:pointer;text-decoration:none;transition:all var(--transition);border:2px solid transparent;letter-spacing:.3px;font-family:'DM Sans',sans-serif;white-space:nowrap}
.btn-red{background:var(--red);color:#fff !important;border-color:var(--red)}
.btn-red:hover{background:var(--red2);border-color:var(--red2);transform:translateY(-2px);box-shadow:0 8px 24px rgba(200,16,46,.35)}
.btn-white{background:#fff;color:var(--charcoal);border-color:#fff}
.btn-white:hover{background:var(--light);transform:translateY(-2px)}
.btn-navy{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-navy:hover{background:var(--charcoal);transform:translateY(-2px)}
.btn-outline-w{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn-outline-w:hover{background:rgba(255,255,255,.12);border-color:#fff}
.btn-outline-r{background:transparent;color:var(--red);border-color:var(--red)}
.btn-outline-r:hover{background:var(--red);color:#fff}
.btn-lg{padding:15px 34px;font-size:15.5px}
.btn-sm{padding:9px 20px;font-size:13px}
.btn-block{width:100%;justify-content:center}

/* ── ANIMATE ── */
.fade-in{opacity:1;transform:translateY(10px);transition:opacity .6s ease,transform .6s ease}
.fade-in.vis{opacity:1;transform:translateY(0)}

/* ── TOP BAR ── */
.topbar{background:var(--charcoal);padding:6px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.topbar .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px}
.tb-left,.tb-right{display:flex;align-items:center;gap:14px;font-size:12.5px;color:rgba(255,255,255,.65)}
.tb-left a,.tb-right a{color:rgba(255,255,255,.65);text-decoration:none;transition:color .2s;font-weight:500}
.tb-left a:hover,.tb-right a:hover{color:#fff}
.topbar i{color:var(--red);margin-right:4px;font-size:11px}
.tb-live{background:var(--red);color:#fff;font-size:10.5px;font-weight:700;padding:4px 8px;border-radius:4px;display:inline-flex;align-items:center;gap:4px;letter-spacing:.4px}
.tb-live-dot{width:6px;height:6px;background:#fff;border-radius:50%;animation:blink 1.5s infinite}
.tb-quote-btn{display:inline-flex;align-items:center;gap:5px;background:var(--navy);color:#fff;font-size:11px;font-weight:700;padding:4px 10px;border-radius:100px;text-decoration:none;letter-spacing:.3px;transition:all .2s}
.tb-quote-btn:hover{background:var(--red);color:#fff}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}

/* ── NAV ── */
nav.main-nav{background:#fff;position:sticky;top:0;z-index:1000;box-shadow:0 2px 20px rgba(26,52,100,.10)}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;max-width:1220px;margin:0 auto;padding:0 50px;height:64px}
.nav-logo{display:flex;align-items:center;text-decoration:none}
.nav-logo img{height:40px!important;width:auto}
.nav-links{display:flex;align-items:center;list-style:none;gap:clamp(6px,calc(4vw - 29px),22px)!important;flex:1!important;justify-content:center!important;flex-wrap:nowrap}
.nav-links>li{flex-shrink:0}
.nav-links>li>a{color:var(--charcoal);text-decoration:none;font-size:clamp(12px,calc(0.5vw + 8px),14px);font-weight:600;padding:4px clamp(4px,calc(1.5vw - 9px),10px)!important;border-radius:6px;transition:all .2s;display:flex;align-items:center;gap:5px;white-space:nowrap}
.nav-links>li>a:hover,.nav-links>li>a.active{color:var(--red);background:var(--red-light)}
.has-drop{position:relative}
.drop{display:none;position:absolute;top:calc(100% + 0px);left:0;background:#fff;border-radius:10px;box-shadow:var(--shadow);min-width:268px;padding:8px;z-index:300;border:1px solid var(--border);border-top:3px solid var(--red)}
.has-drop:hover .drop{display:block}
.drop a{display:flex;align-items:center;gap:10px;color:var(--charcoal);padding:10px 14px;border-radius:7px;font-size:13.5px;font-weight:600;text-decoration:none;transition:all .2s}
.drop a:hover{background:var(--light);color:var(--red)}
.drop a i{width:18px;color:var(--red);font-size:12px;text-align:center;flex-shrink:0}
.drop-divider{height:1px;background:var(--border);margin:5px 0}
.drop-cat-label{display:flex;align-items:center;gap:7px;padding:8px 14px 4px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:#8aa4be;border-top:1px solid var(--border);margin-top:4px}
.drop-cat-label:first-child{border-top:none;margin-top:0}
.drop-cat-label i{font-size:10px}
.drop-cat-label.specialist{color:var(--navy)}
.drop-cat-label.specialist i{color:var(--navy)}
.drop a.spec-link:hover{background:var(--light);color:var(--navy)}
.drop a.spec-link i{color:var(--navy)}
.nav-quote{margin-left:10px}
.nav-quote-stack{margin-left:10px}
.nav-quote-stack .nav-quote{margin-left:0;padding:6px 16px!important;min-height:auto!important}
/* Operations Live badge sits inline next to the logo, not stacked under the quote button */
.nav-live-badge{flex-shrink:0}
.nav-live-badge .tb-live{white-space:nowrap}
.hamburger{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:4px}
.hamburger span{display:block;width:24px;height:2px;background:var(--charcoal);border-radius:2px;transition:.3s}
.mob-nav{display:none;background:#fff;border-top:2px solid var(--red)}
.mob-nav.open{display:block}
.mob-nav a{display:block;color:var(--charcoal);text-decoration:none;padding:14px 24px;border-bottom:1px solid var(--light);font-size:14px;font-weight:600;transition:all .2s}
.mob-nav a:hover{color:var(--red);background:var(--red-light);padding-left:32px}

/* ══════════════════════════════════════════════════════
   PAGE HERO — PROFESSIONAL LIGHT DESIGN
   Clean, modern, and high-conversion layout.
   ══════════════════════════════════════════════════════ */
/* ── PAGE HERO ── */
.page-hero{background:#fff;padding:28px 0;position:relative;overflow:hidden;min-height:260px;display:flex;align-items:center;border-bottom:1px solid #e2e8f0}
.page-hero-dots{display:none}

/* STYLE A: Slanted (For pages with forms) */
.page-hero-slanted .page-hero-bg{position:absolute;top:0;right:0;width:54%;height:100%;background-size:cover;background-position:center;z-index:1;clip-path:polygon(18% 0, 100% 0, 100% 100%, 0% 100%)}
.page-hero-slanted .page-hero-bg::before{content:'';position:absolute;inset:0;background:linear-gradient(to right, #fff 0%, transparent 45%)}
.page-hero-slanted .page-hero-bg::after{content:'';position:absolute;top:0;left:0;width:4px;height:100%;background:var(--red);opacity:0.8;transform:translateX(-2px)}

/* STYLE B: The Enterprise Pane (High-End Corporate Design) */
.page-hero-shaped .page-hero-photo-wrap{position:absolute;top:50%;right:6%;transform:translateY(-50%);width:42%;height:78%;z-index:2}
.page-hero-shaped .page-hero-photo{width:100%;height:100%;background-size:cover;background-position:center;border-radius:0 80px 0 80px;box-shadow:0 30px 60px rgba(0,0,0,0.18);position:relative;overflow:hidden;border-left:6px solid var(--red)}
.page-hero-shaped .page-hero-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom right, rgba(200,16,46,0.1), transparent)}
.page-hero-shaped .page-hero-outline{position:absolute;inset:-15px;border:2px solid #e2e8f0;border-radius:0 95px 0 95px;z-index:-1;transform:translate(10px, 10px)}
.page-hero-shaped .page-hero-bg-accent{position:absolute;top:0;right:0;width:35%;height:100%;background:rgba(26,52,100,0.03);z-index:1;clip-path:polygon(30% 0, 100% 0, 100% 100%, 0% 100%)}

@media(max-width:900px){
  .page-hero-slanted .page-hero-bg{width:100%;opacity:0.15;clip-path:none}
  .page-hero-shaped .page-hero-photo-wrap{display:none}
  .page-hero{text-align:center;padding:24px 0;min-height:auto}
  .page-hero .breadcrumb,.page-hero-eyebrow{margin-left:auto;margin-right:auto}
  .page-hero-btns{justify-content:center}
}
@media(max-width:640px){
  .page-hero .sub,.page-hero .sub.on-dark{font-size:14.5px;margin-bottom:20px}
  .page-hero-eyebrow{font-size:11px;padding:8px 14px;margin-bottom:16px}
  .sub{font-size:14px}
  .sfc-icon i{font-size:26px!important}
  .why-item-icon i{font-size:28px!important}
}
.page-hero-dots{display:none}
.page-hero .container{position:relative;z-index:10;width:100%}
/* Content layout */
.page-hero-content{max-width:620px}
.page-hero .h1{color:var(--navy)!important;letter-spacing:-1px;text-shadow:none;margin-bottom:16px}
.page-hero .h1 span{color:var(--red)!important}
.page-hero .sub,.page-hero .sub.on-dark{color:var(--grey)!important;font-size:16px;line-height:1.6;margin-bottom:28px}
/* Breadcrumb — clean light design */
.breadcrumb{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--grey-light);margin-bottom:24px;background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:8px 16px;width:max-content;box-shadow:0 2px 4px rgba(0,0,0,.02)}
.breadcrumb a{color:var(--navy);text-decoration:none;transition:color .2s;font-weight:600}
.breadcrumb a:hover{color:var(--red)}
.breadcrumb i{font-size:10px;color:#cbd5e1}
/* Eyebrow badge — professional pill */
.page-hero-eyebrow{display:inline-flex;align-items:center;gap:12px;background:var(--red-light);border:1px solid var(--red-mid);color:var(--red);padding:10px 18px;border-radius:999px;font-size:12px;font-weight:800;margin-bottom:24px;letter-spacing:1px;text-transform:uppercase}
.page-hero-btns{display:flex;flex-wrap:wrap;gap:16px}
.page-hero .btn-outline-w{color:var(--navy);border-color:var(--navy);background:#fff}
.page-hero .btn-outline-w:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
/* Responsive */
@media(max-width:1024px){
  .page-hero-photo{width:40%}
}
@media(max-width:768px){
  .page-hero{text-align:center}
  .page-hero-photo{display:none}
  .page-hero::before{width:100%;clip-path:none}
  .page-hero-content{max-width:100%}
  .breadcrumb,.page-hero-eyebrow{margin-left:auto;margin-right:auto}
  .page-hero-btns{justify-content:center}
}


/* ── MARQUEE ── */
.marquee{background:linear-gradient(90deg,var(--red) 0%,var(--red2) 100%);padding:14px 0;overflow:hidden}
.mtrack{display:flex;gap:44px;white-space:nowrap;animation:marquee 30s linear infinite}
.mtrack:hover{animation-play-state:paused}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mitem{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#fff;flex-shrink:0}
.mdot{width:4px;height:4px;background:rgba(255,255,255,.35);border-radius:50%;flex-shrink:0;display:inline-block}

/* ── ACCRED BAR ── */
.accred-bar{background:#0b2436;padding:18px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.accred-bar .container{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px}
.accred-label{font-size:10.5px;font-weight:700;color:rgba(255,255,255,.45);letter-spacing:2px;text-transform:uppercase;white-space:nowrap}
.accred-list{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.abadge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:5px;padding:7px 14px;font-size:12.5px;font-weight:700;color:#fff;transition:all .2s}
.abadge:hover{background:rgba(200,16,46,.2);border-color:rgba(200,16,46,.4)}
.abadge i{color:var(--red);font-size:12px}

/* ── SECTION SPACING ── */
.section{padding:10px 0}
.section.bg-light{background:var(--light)}
.section.bg-white{background:#fff}
.section.bg-navy,.section.bg-dark{background:var(--light)}
.section.bg-charcoal{background:var(--charcoal)}
.section-head{margin-bottom:24px}
.section-head.center{text-align:center}
.section-head.center .sub{margin:14px auto 0}
.section-head-row{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:20px;margin-bottom:5px}

/* ── SERVICE CARDS (Loginet style) ── */
.svc-grid{display:grid;margin-top: 10px;grid-template-columns:repeat(4,1fr);gap:28px}
.svc-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
.svc-card{background:#fff;border-radius:var(--radius-lg);padding:38px 30px 30px;border:1px solid var(--border);transition:all var(--transition);position:relative;overflow:hidden;text-decoration:none;display:flex;flex-direction:column;color:inherit;box-shadow:var(--shadow-xs)}
.svc-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--red),var(--red2));transform:scaleX(0);transform-origin:left;transition:transform .35s}
.svc-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:rgba(200,16,46,.2)}
.svc-card:hover::after{transform:scaleX(1)}
.svc-card.dark{background:var(--light);border-color:var(--border)}
.svc-card.dark::after{transform:scaleX(1)}
@media(min-width:901px){
  .svc-grid>.svc-card:not(:last-child){border-right:1px solid var(--border)!important}
}
.svc-icon{width:60px;height:60px;border-radius:var(--radius);background:var(--red-light);display:flex;align-items:center;justify-content:center;margin-bottom:22px;border:1.5px solid rgba(200,16,46,.12);transition:all var(--transition)}
.svc-card:hover .svc-icon{background:var(--red);border-color:var(--red)}
.svc-card:hover .svc-icon i{color:#fff}
.svc-icon.red-bg,.svc-icon.light-bg{background:var(--red-light)}
.svc-icon i{font-size:24px;color:var(--red);transition:color var(--transition)}
.svc-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.svc-head .svc-icon{margin-bottom:0;flex-shrink:0}
.svc-head .svc-title{margin-bottom:0}
.svc-title{font-size:18px;font-weight:800;color:var(--charcoal);margin-bottom:10px;letter-spacing:-.1px}
.svc-text{font-size:14px;color:var(--grey);line-height:1.75;margin-bottom:16px}
.svc-list{list-style:none;display:flex;flex-direction:column;gap:7px}
.svc-list li{font-size:13px;color:var(--grey);display:flex;align-items:center;gap:7px}
.svc-list li i{color:var(--red);font-size:10px;flex-shrink:0}
.svc-more{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;color:var(--red);margin-top:auto;padding-top:18px;transition:gap .2s}
.svc-card:hover .svc-more{gap:12px}

/* ── STEPS ── */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;position:relative}
.steps::before{content:'';position:absolute;top:37px;left:12%;right:12%;height:2px;background:linear-gradient(90deg,var(--red),rgba(200,16,46,.25),var(--red));z-index:0}
.step{text-align:center;padding:0 14px;position:relative;z-index:1}
.step-num{width:74px;height:74px;border-radius:50%;background:var(--red);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;box-shadow:0 8px 28px rgba(200,16,46,.3);position:relative;font-family:'Rethink Sans',sans-serif;font-size:28px;font-weight:600;color:#fff}
.step-num i{font-size:26px;color:#fff}
.step-ring{position:absolute;inset:-5px;border-radius:50%;border:2px dashed rgba(200,16,46,.25)}
.step-title{font-size:15px;font-weight:800;color:var(--charcoal);margin-bottom:8px}
.step-text{font-size:13px;color:var(--grey);line-height:1.65}

/* ── STATS ── */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow);border:1px solid var(--border);overflow:hidden}
.stat-box{text-align:center;padding:40px 20px;border-right:1px solid var(--border);transition:all var(--transition);position:relative}
.stat-box::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--red);transform:scaleX(0);transition:transform .35s}
.stat-box:hover{background:var(--red-light)}
.stat-box:hover::before{transform:scaleX(1)}
.stat-box:last-child{border-right:none}
.stat-icon{font-size:22px;color:var(--red);margin-bottom:12px;opacity:.7}
.stat-num{font-family:'Rethink Sans',sans-serif;font-size:54px;font-weight:600;color:var(--charcoal);line-height:1}
.stat-suf{font-size:30px}
.stat-label{font-size:13px;color:var(--grey);margin-top:6px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}

/* ── TESTIMONIALS ── */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.testi{background:#fff;border-radius:var(--radius-lg);padding:32px;box-shadow:var(--shadow-sm);border:1px solid var(--border);transition:all var(--transition);position:relative}
.testi::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--red),var(--red2));transform:scaleX(0);transition:transform .35s;border-radius:3px 3px 0 0}
.testi:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.testi:hover::before{transform:scaleX(1)}
.testi-stars{color:var(--gold);font-size:14px;letter-spacing:2px;margin-bottom:12px}
.testi-q{font-size:38px;color:rgba(200,16,46,.12);font-family:Georgia,serif;line-height:1;margin-bottom:2px}
.testi-text{font-size:14.5px;color:var(--grey);line-height:1.82;margin-bottom:20px}
.testi-author{display:flex;align-items:center;gap:12px;padding-top:16px;border-top:1px solid var(--light2)}
.testi-av{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--red),var(--red2));display:flex;align-items:center;justify-content:center;font-family:'Rethink Sans',sans-serif;font-size:17px;font-weight:600;color:#fff;flex-shrink:0}
.testi-name{font-size:14px;font-weight:700;color:var(--charcoal)}
.testi-role{font-size:12px;color:var(--grey);margin-top:2px}

/* ── CTA BAND ── */
.cta-band{background:var(--charcoal);padding:18px 0;position:relative;overflow:hidden}
.cta-band::before{content:'';position:absolute;right:-80px;top:-80px;width:400px;height:400px;border-radius:50%;background:rgba(200,16,46,.06)}
.cta-band::after{content:'';position:absolute;left:0;bottom:0;right:0;height:4px;background:linear-gradient(90deg,var(--red),var(--red2),transparent 300%)}
.cta-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:28px;position:relative;z-index:1}
.cta-h{font-family:'Rethink Sans',sans-serif;font-size:clamp(28px,4vw,50px);font-weight:600;color:#fff;line-height:1.06;letter-spacing:-.3px}
.cta-p{font-size:16px;color:rgba(255,255,255,.65);margin-top:8px}
.cta-btns{display:flex;gap:12px;flex-wrap:wrap}
.cta-btns .btn{padding:10px 24px}

/* Footer CTA buttons (phone / Get a Quote) — keep them side by side at every
   width instead of the narrow-screen rules elsewhere stacking .cta-btns vertically. */
.footer-top .cta-btns{flex-direction:row !important;flex-wrap:wrap;width:auto !important}
.footer-top .cta-btns .btn{width:auto !important}
@media(max-width:400px){
  .footer-top .cta-btns .btn{padding:10px 14px;font-size:12.5px}
}

/* ── CONTACT CARDS ── */
.cc-grid{display:flex;flex-direction:column;gap:12px}
.cc{background:#fff;border-radius:var(--radius);padding:18px;display:flex;gap:14px;align-items:flex-start;box-shadow:var(--shadow-xs);border:1px solid var(--border);transition:all .3s}
.cc:hover{transform:translateX(5px);border-color:var(--red);box-shadow:var(--shadow-sm)}
.cc-icon{width:44px;height:44px;min-width:44px;background:var(--red-light);border-radius:8px;display:flex;align-items:center;justify-content:center;border:1.5px solid rgba(200,16,46,.15)}
.cc-icon i{font-size:17px;color:var(--red)}
.cc-label{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--grey-light);margin-bottom:2px}
.cc-val{font-size:14px;font-weight:700;color:var(--charcoal)}
.cc-val a{color:var(--charcoal);text-decoration:none}
.cc-val a:hover{color:var(--red)}

/* ── FORM ── */
.form-wrap{background:#fff;border-radius:var(--radius-lg);padding:40px;box-shadow:var(--shadow);border:1px solid var(--border);position:relative}
.form-wrap::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--red),var(--red2));border-radius:var(--radius-lg) var(--radius-lg) 0 0}
.form-title{font-family:'Rethink Sans',sans-serif;font-size:28px;font-weight:600;color:var(--charcoal);margin-bottom:5px;letter-spacing:-.3px}
.form-sub{font-size:14px;color:var(--grey);margin-bottom:24px;line-height:1.65}
.fg{margin-bottom:16px}
.fg label{display:block;font-size:12px;font-weight:800;color:var(--navy);margin-bottom:8px;text-transform:uppercase;letter-spacing:1px}
.req{color:var(--red)}
.fg input,.fg select,.fg textarea{width:100%;padding:14px 18px;border:1.5px solid #e2e8f0;border-radius:10px;font-family:'DM Sans',sans-serif;font-size:14.5px;color:var(--charcoal);background:#fcfdfe;transition:border-color .2s;outline:none}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--red);box-shadow:0 0 0 4px var(--red-light);background:#fff}
.fg input::placeholder,.fg textarea::placeholder{color:#a0aec0}
.fg textarea{resize:vertical;min-height:120px;line-height:1.6}
.fg select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%231a3464'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-size:16px}
.frow{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.form-btn{width:100%;padding:16px;background:linear-gradient(135deg, var(--red) 0%, var(--red2) 100%);color:#fff;border:none;border-radius:12px;font-family:'DM Sans',sans-serif;font-size:16px;font-weight:800;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:10px;letter-spacing:1px;text-transform:uppercase;box-shadow:0 10px 25px rgba(200,16,46,0.3)}
.form-btn:hover{transform:translateY(-3px);box-shadow:0 15px 35px rgba(200,16,46,0.4)}

/* ── URGENCY BAR ── */
.urgency-bar{background:var(--charcoal)}
.urgency-inner{display:flex;align-items:stretch}
.urg-item{flex:1;display:flex;align-items:center;gap:14px;padding:20px 24px;border-right:1px solid rgba(255,255,255,.08);text-decoration:none;transition:all .22s}
.urg-item:last-child{border-right:none}
.urg-item:hover{background:rgba(200,16,46,.15)}
.urg-item i{font-size:22px;color:var(--red);flex-shrink:0}
.urg-label{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:rgba(255,255,255,.5)}
.urg-val{font-size:14.5px;font-weight:700;color:#fff;margin-top:2px}

/* ── INFO BOXES ── */
.info-box{background:var(--light);border-radius:var(--radius);padding:24px;border:1px solid var(--border)}
.info-box.accent{background:rgba(200,16,46,.05);border-color:rgba(200,16,46,.15)}
.check-list{list-style:none;display:flex;flex-direction:column;gap:10px}
.check-list li{display:flex;align-items:flex-start;gap:10px;font-size:14px;color:var(--grey);line-height:1.55}
.check-list li i{color:var(--red);font-size:13px;margin-top:2px;flex-shrink:0}
.check-list.white li{color:rgba(255,255,255,.70)}
.check-list.white li i{color:rgba(255,255,255,.65)}

/* ── FEATURE GRID ── */
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.feat,.feat-card{background:#fff;border-radius:var(--radius-lg);padding:28px;border:1px solid var(--border);transition:all var(--transition);box-shadow:var(--shadow-xs)}
.feat:hover,.feat-card:hover{transform:translateY(-6px);border-color:rgba(200,16,46,.2);box-shadow:var(--shadow-lg)}
.feat-icon{width:52px;height:52px;border-radius:var(--radius);background:var(--red-light);display:flex;align-items:center;justify-content:center;margin-bottom:18px;border:1.5px solid rgba(200,16,46,.12);transition:all var(--transition)}
.feat:hover .feat-icon,.feat-card:hover .feat-icon{background:var(--red);border-color:var(--red)}
.feat:hover .feat-icon i,.feat-card:hover .feat-icon i{color:#fff}
.feat-icon i{font-size:22px;color:var(--red);transition:color var(--transition)}
.feat:hover .feat-icon,.feat-card:hover .feat-icon{background:var(--red);border-color:var(--red)}
.feat:hover .feat-icon i,.feat-card:hover .feat-icon i{color:#fff}
.feat-head{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.feat-head .feat-icon{margin-bottom:0;flex-shrink:0}
.feat-head .feat-title{margin-bottom:0}
.feat-title{font-size:16px;font-weight:800;color:var(--charcoal);margin-bottom:8px}
.feat-text{font-size:13.5px;color:var(--grey);line-height:1.68}

/* ── FOOTER ── */
footer{background:#f7fbff;border-top:1px solid var(--border)}
.footer-top{padding:20px 0 12px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px !important}
.footer-brand p{font-size:13.5px;color:#5f7187;line-height:1.82;margin:14px 0 8px}
.fci-brand{margin-top:6px;margin-bottom:0}
.footer-brand-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.footer-brand-van{height:46px;width:auto;max-width:90px;opacity:.92}
.fsocials{display:flex;gap:8px}
.fsoc{width:38px;height:38px;background:rgba(23,53,95,.05);border-radius:6px;display:flex;align-items:center;justify-content:center;color:#5f7187;font-size:14px;text-decoration:none;transition:all .2s;border:1px solid var(--border)}
.fsoc:hover{background:var(--red);color:#fff;border-color:var(--red)}
.fh{font-size:20.5px;font-weight:800;text-transform:uppercase;letter-spacing:2px;color:#1f2937;margin-bottom:18px;position:relative;padding-bottom:12px}
.fh::after{content:'';position:absolute;bottom:0;left:0;width:60px;height:2px;background:var(--red);border-radius:2px}
.flist{list-style:none;display:flex;flex-direction:column;gap:9px}
.flist a{color:#5f7187;text-decoration:none;font-size:13.5px;transition:all .2s;display:flex;align-items:center;gap:8px}
.flist a:hover{color:var(--red);padding-left:4px}
.flist a i{font-size:9px;opacity:.6;flex-shrink:0}
.fci{display:flex;gap:12px;align-items:flex-start;margin-bottom:13px}
.fci i{color:var(--red);font-size:13px;margin-top:3px;flex-shrink:0}
.fci span,.fci a{font-size:13.5px;color:#5f7187;line-height:1.5;text-decoration:none}
.fci a:hover{color:var(--red)}
.fcerts{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.fcert{background:rgba(200,16,46,.08);color:var(--red);font-size:10.5px;font-weight:700;padding:3px 10px;border-radius:4px;border:1px solid rgba(200,16,46,.25)}
.footer-bottom{padding:14px 0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;font-size:12.5px;color:#8091a6}
.footer-bottom a{color:#5f7187;text-decoration:none;transition:color .2s}
.footer-bottom a:hover{color:var(--red)}
.footer-bottom-links{display:flex;gap:16px}

/* ── BACK TO TOP ── */
.back-to-top{position:fixed;bottom:28px;right:28px;width:48px;height:48px;background:var(--red);color:#fff;border:none;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:990;opacity:0;transform:translateY(14px);transition:opacity .3s,transform .3s,background .2s,box-shadow .2s;pointer-events:none;box-shadow:0 4px 18px rgba(200,16,46,.4);font-size:16px}
.back-to-top.btt-vis{opacity:1;transform:translateY(0);pointer-events:auto}
.back-to-top:hover{background:var(--red2);box-shadow:0 8px 28px rgba(200,16,46,.5);transform:translateY(-4px)}

/* ── PROFESSIONAL EXTRAS ── */
.img-card{border-radius:var(--radius-lg);overflow:hidden;position:relative;box-shadow:var(--shadow)}
.img-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.img-card:hover img{transform:scale(1.04)}
.section-divider{height:2px;background:linear-gradient(90deg,transparent,var(--red-mid) 30%,var(--red-mid) 70%,transparent)}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .steps::before{display:none}
  .steps{grid-template-columns:repeat(2,1fr);gap:32px}
  .urgency-inner{flex-wrap:wrap}
  .urg-item{flex:calc(50% - 1px);border-bottom:1px solid rgba(255,255,255,.06)}
  .frow{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .nav-logo img{height:48px}
  .nav-wrap{height:76px}
  .section{padding:32px 0}
  .section-head{margin-bottom:22px}
  .section-head-row{flex-direction:column;align-items:flex-start}
  .frow{grid-template-columns:1fr}
  .form-wrap{padding:28px 22px}
  .fg input,.fg select,.fg textarea{font-size:16px}
  .testi-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .qrow{grid-template-columns:1fr !important}
  .qrow2{grid-template-columns:1fr !important}
  .cta-inner{flex-direction:column;text-align:center}
  .cta-btns{justify-content:center}
  .sme-wrap{grid-template-columns:1fr !important;gap:36px !important}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .stat-num{font-size:44px}
  .sd-services-row{grid-template-columns:repeat(2,1fr) !important}
}
@media(max-width:540px){
  .nav-logo img{height:48px}
  .nav-wrap{height:66px}
  .section{padding:24px 0}
  .container{padding:0 16px}
  .section-head{margin-bottom:18px}
  .svc-grid,.svc-grid-2{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr;gap:22px}
  .steps::before{display:none}
  .feature-grid{grid-template-columns:1fr}
  .urg-item{flex:100%;padding:13px 16px}
  .accred-label{display:none}
  .accred-bar .container{justify-content:center}
  .cta-band{padding:16px 0}
  .cta-btns{flex-direction:column;align-items:stretch}
  .cta-btns .btn{justify-content:center}
  .form-wrap{padding:22px 16px;border-radius:var(--radius)}
  .footer-grid{grid-template-columns:1fr}
  .footer-top{padding:16px 0 10px}
  .stats-grid{grid-template-columns:1fr 1fr}
  .stat-num{font-size:38px}
  .stat-box{padding:26px 14px}
  .back-to-top{bottom:18px;right:18px;width:42px;height:42px;font-size:14px;border-radius:5px}
}
@media(max-width:480px){
  .page-hero-btns{flex-direction:column;align-items:stretch}
  .page-hero-btns .btn{justify-content:center}
  .breadcrumb{font-size:11px;flex-wrap:wrap}
  .btn-lg{padding:13px 22px;font-size:14px}
  .topbar .container{flex-direction:column;gap:4px;text-align:center}
  .tb-live{align-self:center}
  .stats-grid{grid-template-columns:1fr 1fr}
}
/* Fleet showcase responsive */
@media(max-width:768px){.fleet-wrap{grid-template-columns:1fr!important;gap:32px!important}}
@media(max-width:900px){.fleet-grid{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:580px){.fleet-grid{grid-template-columns:1fr!important}}

/* ============================================
   LIGHT PROFESSIONAL REFRESH
   ============================================ */
:root{
  --navy:#17355f;
  --charcoal:#1f2937;
  --charcoal2:#334155;
  --red:#c8102e;
  --red2:#9f1230;
  --bg:#f7fbff;
  --light:#f7fbff;
  --light2:#edf5fb;
  --grey:#607086;
  --grey-light:#91a0b4;
  --border:#dfeaf5;
  --red-light:rgba(200,16,46,.07);
  --red-mid:rgba(200,16,46,.14);
  --shadow-xs:0 2px 10px rgba(15,35,60,.045);
  --shadow-sm:0 8px 24px rgba(15,35,60,.075);
  --shadow:0 18px 48px rgba(15,35,60,.10);
  --shadow-lg:0 26px 70px rgba(15,35,60,.14);
}

body{
  color:#233044;
  background:#fff;
}

.topbar{
  background:#f7fbff;
  border-bottom:1px solid var(--border);
}
.tb-left,.tb-right,
.tb-left a,.tb-right a{
  color:#53657c;
}
.tb-left a:hover,.tb-right a:hover{
  color:var(--red);
}
.tb-live{
  background:#eef7f2;
  color:#0f8b4c;
  border:1px solid rgba(22,163,74,.18);
}
.tb-live-dot{
  background:#16a34a;
}

nav.main-nav{
  box-shadow:0 8px 30px rgba(15,35,60,.07);
  border-bottom:1px solid rgba(223,234,245,.80);
}
.nav-wrap{
  height:64px;
}
.nav-links>li>a{
  color:#253247;
}
.nav-links>li>a:hover,.nav-links>li>a.active{
  background:#fff3f5;
}
.drop{
  box-shadow:0 22px 48px rgba(15,35,60,.14);
}

.btn{
  border-radius:8px;
  box-shadow:none;
}
.btn-red{
  box-shadow:0 10px 22px rgba(200,16,46,.18);
}
.btn-red:hover{
  box-shadow:0 14px 30px rgba(200,16,46,.26);
}
.btn-outline-r{
  background:#fff;
}
.btn-outline-r:hover{
  box-shadow:0 12px 28px rgba(200,16,46,.18);
}
.btn-navy:hover,.btn-white:hover{
  box-shadow:0 12px 28px rgba(15,35,60,.12);
}

.tag{
  color:var(--red);
  letter-spacing:2.2px;
}
.h2{
  color:#1f2937;
}
.sub{
  color:#64748b;
}

.section.bg-light,
.section.bg-navy,
.section.bg-dark{
  background:linear-gradient(180deg,#f8fbff 0%,#eef6fb 100%);
}
.svc-card,.feat,.feat-card,.testi,.form-wrap,.stats-grid,.cc,.sme-card{
  border-color:#e3edf7;
  box-shadow:0 10px 28px rgba(15,35,60,.06);
}
.svc-card.dark{
  background:transparent;
}
.svc-card:hover,.feat:hover,.feat-card:hover,.testi:hover{
  box-shadow:0 22px 54px rgba(15,35,60,.12);
}
.svc-icon,.feat-icon,.wp-ic,.sme-ic,.cc-icon{
  background:#fff0f2;
  border-color:rgba(200,16,46,.13);
}

.urgency-bar{
  background:#fff;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.urg-item{
  border-right:1px solid var(--border);
}
.urg-item:hover{
  background:#fff7f8;
}
.urg-label{
  color:#91a0b4;
}
.urg-val{
  color:#253247;
}
.marquee{
  background:linear-gradient(90deg,#fff0f2 0%,#f8fbff 50%,#fff0f2 100%);
  border-bottom:1px solid var(--border);
}
.mitem{
  color:#334155;
}
.mdot{
  background:rgba(200,16,46,.35);
}

.stats-grid{
  box-shadow:0 18px 48px rgba(15,35,60,.08);
}
.stat-box:hover{
  background:#fff7f8;
}

.cta-band{
  background:linear-gradient(135deg,#17355f 0%,#26394d 100%);
}
.cta-band::before{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
}

/* ============================================
   FULL SITE PROFESSIONAL REDESIGN PASS
   Consistent light, polished logistics interface
   ============================================ */
:root{
  --dark:#1f2937;
  --blue:#2563eb;
}

::selection{
  background:rgba(200,16,46,.16);
  color:#1f2937;
}

body{
  line-height:1.5;
}

img{
  max-width:100%;
}

.container{
  width:100%;
}

.section{
  position:relative;
}

.section.bg-white{
  background:#fff;
}

section[style*="background:#f8fafc"],
section[style*="background:#f0f5fc"]{
  background:linear-gradient(180deg,#f8fbff 0%,#eef6fb 100%)!important;
  border-top:1px solid var(--border)!important;
  border-bottom:1px solid var(--border)!important;
}

section[style*="background:var(--dark)"],
section[style*="background:linear-gradient(135deg,#1a3464"]{
  background:linear-gradient(180deg,#f8fbff 0%,#eef6fb 100%)!important;
  padding:28px 0!important;
}

.page-hero .h1{
  max-width:650px!important;
}

.page-hero .sub,
.page-hero .sub.on-dark{
  max-width:590px!important;
}

/* Card chrome (bg/border/radius/shadow/hover) for these classes now lives
   in the single UNIFIED CARD SYSTEM block near the end of this file. */

.sfc-head,
.sfc-footer,
.blog-footer{
  border-color:#e9f0f7!important;
}

.sfc-title,
.val-title,
.tv-title,
.accred-name,
.veh-name,
.book-step h4,
.cov-city,
.htw-title,
.help-title,
.full-form-title,
.sdp-title,
.ipstep-t,
.do-val,
.hours-title,
.faq-q{
  color:#1f2937!important;
}

.sfc-desc,
.val-text,
.tv-text,
.accred-desc,
.veh-model,
.book-step p,
.cov-time,
.htw-text,
.help-text,
.full-form-sub,
.sdp-sub,
.ipstep-p,
.do-note,
.hours-row,
.faq-a,
.ifc-pillar-text{
  color:#64748b!important;
}

.veh-img-wrap{
  box-shadow:inset 0 0 0 1px rgba(200,16,46,.10);
}

/* Icon-box background/shadow for these classes lives in the single
   UNIFIED CARD SYSTEM block near the end of this file. */

.svc-full-grid,
.ind-full-grid,
.veh-grid,
.feature-grid,
.svc-grid,
.testi-grid{
  align-items:stretch;
}

.svc-full-card,
.ind-full-card,
.veh-card,
.blog-card{
  overflow:hidden;
}
.blog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.blog-card{display:flex;flex-direction:column}
.blog-img{height:200px;background-size:cover;background-position:center;position:relative}
.blog-img-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(6,14,29,.55) 100%)}
.blog-cat{position:absolute;top:14px;left:14px;background:var(--red);color:#fff;font-size:11px;font-weight:700;padding:4px 11px;border-radius:100px;text-transform:uppercase;letter-spacing:.5px}
.blog-body{padding:22px;flex:1;display:flex;flex-direction:column}
.blog-meta{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--grey);margin-bottom:10px}
.blog-meta i{color:var(--red);font-size:11px}
.blog-title{font-family:'Rethink Sans',sans-serif;font-size:22px;font-weight:600;color:var(--navy);margin-bottom:8px;line-height:1.15}
.blog-excerpt{font-size:13.5px;color:var(--grey);line-height:1.7;flex:1}
.blog-footer{padding:16px 22px;border-top:1px solid #f0f4fa;display:flex;justify-content:space-between;align-items:center}
.blog-read{font-size:13px;font-weight:700;color:var(--red);text-decoration:none;display:flex;align-items:center;gap:5px;transition:gap .2s}
.blog-read:hover{gap:10px}

.ifc-banner{
  min-height:85px;
}

.ifc-banner.c1,
.ifc-banner.c2,
.ifc-banner.c3,
.ifc-banner.c4,
.ifc-banner.c5,
.ifc-banner.c6,
.ifc-banner.c7,
.ifc-banner.c8{
  background:linear-gradient(135deg,#17355f 0%,#334155 100%)!important;
}

.ifc-banner::after{
  content:'';
  position:absolute;
  inset:auto 0 0 0;
  height:3px;
  background:var(--red);
}

.ifc-pillar{
  background:#f8fbff!important;
  border:1px solid #e3edf7;
  border-left-width:3px;
}

.ifc-pillar.challenge{
  border-left-color:#ef4444;
}

.ifc-pillar.solution{
  border-left-color:var(--navy);
}

.ifc-pillar.result{
  border-left-color:var(--green);
}

.ipsteps,
.book-steps,
.steps-3{
  gap:20px;
}

.ipstep,
.step{
  padding:22px 18px;
}

.steps::before,
.steps-3::before{
  opacity:.45;
}

.story-img,
.img-card,
.why-img{
  border-radius:14px!important;
  border:1px solid #e3edf7;
  box-shadow:none!important;
}

.story-img::after,
.why-img::before{
  background:linear-gradient(180deg,rgba(15,35,60,.02) 0%,rgba(15,35,60,.12) 52%,rgba(15,35,60,.40) 100%)!important;
}

.story-badge,
.story-badge2{
  border-radius:12px!important;
}

.story-badge2{
  background:#17355f!important;
  box-shadow:0 16px 36px rgba(23,53,95,.22)!important;
}

.stats-grid{
  border-radius:14px;
  transform:none;
}

section > .container > .stats-grid,
.container[data-counter-parent] .stats-grid{
  margin:0 auto;
}

.stat-box{
  background:#fff;
}

.stat-icon{
  opacity:1;
}

.contact-hero-inner{
  grid-template-columns:minmax(0,1fr) minmax(320px,.86fr);
}

.ch-phone-block,
.response-badge{
  background:#fff!important;
  border-color:#e3edf7!important;
  box-shadow:0 12px 32px rgba(15,35,60,.065);
}

.ch-phone-label{
  color:#64748b!important;
}

.ch-phone-num{
  color:#1f2937!important;
}

.ch-phone-sub,
.ch-trust-item{
  color:#64748b!important;
}

.ch-qcard{
  background:rgba(255,255,255,.95)!important;
  border-color:#e3edf7!important;
  box-shadow:none!important;
}

.ch-qcard-title,
.qg2 label{
  color:#52677f!important;
}

.qg2 input,
.qg2 select,
.sdp-fg input,
.sdp-fg select,
.fg input,
.fg select,
.fg textarea{
  background:#f8fbff!important;
  border-color:#dfeaf5!important;
  color:#233044!important;
}

.qg2 input::placeholder,
.sdp-fg input::placeholder,
.fg input::placeholder,
.fg textarea::placeholder{
  color:#97a7ba!important;
}

.qg2 input:focus,
.qg2 select:focus,
.sdp-fg input:focus,
.sdp-fg select:focus,
.fg input:focus,
.fg select:focus,
.fg textarea:focus{
  background:#fff!important;
  border-color:var(--red)!important;
  box-shadow:0 0 0 3px rgba(200,16,46,.10)!important;
}

.form-section-label{
  border-bottom-color:#e9f0f7!important;
}

.faq-item{
  border-color:#e9f0f7!important;
}

.sd-live{
  background:#ecfdf5!important;
  border-color:rgba(22,163,74,.22)!important;
  color:#168348!important;
}

.sd-phone-hero{
  border-radius:10px;
}

.sd-form-panel{
  padding:30px;
}

.sd-opt-card{
  border:none!important;
  box-shadow:none!important;
}

.sd-opt-card.featured,
.sd-opt-card:hover{
  background:#fff7f8!important;
}

.sd-avail{
  color:#15803d!important;
}

.track-box{
  background:#fff!important;
  border-color:#e3edf7!important;
  box-shadow:none!important;
}

.track-input{
  background:#f8fbff!important;
  color:#233044!important;
  border-color:#dfeaf5!important;
}

.track-input::placeholder{
  color:#91a0b4!important;
}

.track-hint{
  color:#64748b!important;
}

.tr-header{
  background:#17355f!important;
}

.app-section{
  background:linear-gradient(135deg,#17355f,#334155)!important;
  border-radius:14px!important;
  box-shadow:0 24px 64px rgba(15,35,60,.12);
}

.app-section::before{
  background:rgba(255,255,255,.06)!important;
}

.app-feat{
  color:rgba(255,255,255,.78)!important;
}

.veh-img-wrap{
  background:linear-gradient(135deg,#fbfdff 0%,#eef6fb 100%)!important;
}

.veh-open-btn{
  border-radius:10px!important;
}

.compare-table{
  overflow:hidden;
  border-radius:14px!important;
}

.compare-table th{
  background:#17355f!important;
}

.compare-table td{
  border-color:#e9f0f7!important;
}

.compare-table tr:nth-child(even) td{
  background:#f8fbff!important;
}

.blog-card img,
.blog-img img{
  filter:saturate(1.04);
}

.blog-read,
.ifc-cta,
.sfc-footer a,
.help-card a{
  color:var(--red)!important;
}

/* Card chrome for this group now lives in the EDITORIAL FLAT SYSTEM
   block near the end of this file — flat, no box, no shadow. */
.article-meta-bar,.conclusion-box{
  border:none;
  box-shadow:none;
}

.ao-icon,
.mc-icon,
.ri-icon,
.mv-ci-icon,
.benefit-icon,
.sfc-icon,
.why-item-icon,
.val-icon,
.tv-icon,
.pt-icon,
.region-icon{
  background:transparent;
}

.ao-title,
.mc-title,
.sea-card.lcl h3,
.compare-card.ltl h3,
.ri-name,
.lane-from,
.lane-to,
.mv-ci-name,
.dest-region,
.benefit-title,
.article-body h1,
.article-body h2,
.article-body h3,
.article-body strong,
.sidebar-links a,
.kw-tag,
.city-tag{
  color:#1f2937!important;
}

.ao-desc,
.mc-desc,
.sea-card.lcl .sc-sub,
.compare-card.ltl .cc-sub,
.ri-time,
.mv-ci-sub,
.dest-airports,
.lane-detail,
.benefit-text,
.article-body p,
.article-lead,
.check-list li{
  color:#64748b!important;
}

.air-opt.featured .ao-desc,
.air-opt.featured .ao-list li,
.move-card.featured .mc-desc,
.move-card.featured .mc-list li,
.sea-card.fcl .sc-sub,
.sea-card.fcl .sc-list li,
.compare-card.ftl .cc-sub,
.compare-card.ftl .cc-list li,
.sidebar-cta-sub{
  color:rgba(255,255,255,.72)!important;
}

.air-opt.featured .ao-title,
.move-card.featured .mc-title,
.sea-card.fcl h3,
.compare-card.ftl h3,
.sidebar-cta-title,
.cta-sidebar h3,
.cta-sidebar p{
  color:#fff!important;
}

.ao-label,
.mc-label,
.sea-badge,
.cc-badge,
.lane-transit,
.hours-badge,
.blog-cat{
  border-radius:999px!important;
}

.article-wrap{
  padding-top:64px!important;
}

.article-body{
  background:#fff;
  border:1px solid #e3edf7;
  border-radius:16px;
  padding:34px;
}

.article-body h2{
  border-bottom-color:#e9f0f7!important;
}

.article-lead{
  background:#f8fbff!important;
  border-left-color:var(--red)!important;
}

.city-tag,
.kw-tag{
  background:#f8fbff!important;
  border-color:#e3edf7!important;
}

.faq-item{
  border-color:#e3edf7!important;
}

.faq-q{
  background:#fff!important;
}

.faq-a{
  background:#f8fbff!important;
}

.cta-band{
  border-top:1px solid rgba(255,255,255,.08);
}

.cta-inner{
  align-items:center;
}

.footer-brand img{
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.12));
}

.footer-bottom{
  gap:18px;
}

.back-to-top{
  border-radius:10px;
}

@media(max-width:1024px){
  .page-hero{
    min-height:200px;
  }

  .page-hero .breadcrumb,
  .page-hero .page-hero-eyebrow,
  .page-hero .h1,
  .page-hero .sub,
  .page-hero .sub.on-dark,
  .page-hero .page-hero-btns{
    max-width:100%!important;
  }

  .contact-hero-inner{
    grid-template-columns:1fr;
  }
}

@media(max-width:768px){
  .page-hero{
    padding:22px 0 20px;
    min-height:0;
  }

  .page-hero-btns,
  .cta-btns{
    width:100%;
  }

  .page-hero-btns .btn,
  .cta-btns .btn{
    justify-content:center;
  }

  .full-form-wrap,
  .form-wrap,
  .sd-form-panel,
  .track-box,
  .app-section,
  .article-body{
    padding:24px!important;
  }

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

  .article-sidebar{
    position:static!important;
  }
}

@media(max-width:540px){
  .topbar .tb-left{
    gap:8px;
  }

  .tb-left span{
    width:100%;
  }

  .page-hero .breadcrumb{
    width:100%;
    justify-content:center;
  }

  .page-hero-eyebrow{
    width:100%;
    justify-content:center;
    text-align:center;
  }

  .svc-full-card,
  .ind-full-card,
  .veh-card,
  .blog-card,
  .full-form-wrap,
  .form-wrap{
    border-radius:12px!important;
  }

  .footer-bottom-links{
    flex-wrap:wrap;
  }
}

/* ============================================
   SITE-WIDE RESPONSIVE HARDENING
   Keeps page-local grids, tables and forms fluid on narrow screens.
   ============================================ */
html,
body{
  max-width:100%;
}

body{
  min-width:320px;
}

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

img{
  height:auto;
}

input,
select,
textarea,
button{
  max-width:100%;
}

.container,
.nav-wrap,
.cat-nav-inner{
  max-width:1220px;
  width:100%;
}

.nav-wrap,
.container{
  min-width:0;
}

.nav-logo{
  min-width:0;
  flex-shrink:0;
}

.nav-links{
  min-width:0;
}

.nav-links>li>a{
  white-space:nowrap;
}

.btn,
.form-btn,
.qbtn,
.qbtn2,
.sdp-btn,
.track-btn,
.quote-btn,
.quote-btn-spec{
  min-width:0;
  text-align:center;
}

.svc-full-card,
.svc-card,
.feat,
.feat-card,
.testi,
.blog-card,
.veh-card,
.ind-full-card,
.air-opt,
.sea-card,
.move-card,
.compare-card,
.route-item,
.lane-item,
.dest-item,
.benefit-card,
.sidebar-section,
.sidebar-card,
.info-box,
.form-wrap,
.full-form-wrap,
.sd-form-panel,
.track-box,
.track-result,
.app-section,
.article-body,
.blog-article{
  min-width:0;
}

.compare-table{
  min-width:720px;
}

.cat-nav{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

.cat-nav-inner{
  min-width:max-content;
}

.cat-nav-cta{
  padding-right:24px;
}

body .ph-overlay:not(.active){
  visibility:hidden;
}

body .ph-overlay:not(.active) .ph-panel{
  display:none;
}

@media(max-width:880px){
  .nav-links,
  .nav-quote,
  .nav-quote-stack,
  .nav-live-badge{
    display:none;
  }

  .hamburger{
    display:flex;
  }

  .mob-nav.open{
    max-height:calc(100vh - 76px);
    overflow-y:auto;
  }
}

@media(max-width:1220px){
  .nav-live-badge{
    display:none;
  }

  .nav-quote-stack,
  .nav-quote{
    margin-left:4px;
  }
}

@media(max-width:1024px){
  .svc-grid,
  .svc-grid-2,
  .svc-full-grid,
  .feature-grid,
  .testi-grid,
  .blog-grid,
  .why-grid-3,
  .team-vals,
  .accred-cards,
  .esg-grid,
  .facility-grid,
  .veh-grid,
  .fleet-grid,
  .ind-grid,
  .ind-full-grid,
  .route-grid,
  .lanes-grid,
  .dest-grid,
  .coverage-grid,
  .help-grid,
  .benefit-grid,
  .partner-type-grid,
  .book-steps,
  .htw-grid,
  .ipsteps,
  .air-opts,
  .sea-compare,
  .compare-grid,
  .values-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .contact-main-grid,
  .contact-hero-inner,
  .story-grid,
  .why-grid,
  .sd-grid,
  .sd-hero-inner,
  .rf-layout,
  .sd-layout,
  .nd-layout,
  .ov-layout,
  .sea-layout,
  .af-layout,
  .wh-layout,
  .fulfilment-grid,
  .blog-wrap,
  .article-wrap,
  .app-section,
  .join-wrap,
  .fleet-wrap,
  .sme-wrap,
  [style*="grid-template-columns:1fr 1fr"]{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:768px){
  .container,
  .nav-wrap,
  .cat-nav-inner{
    padding-inline:18px;
  }

  .topbar .container{
    justify-content:center;
    text-align:center;
  }

  .tb-left{
    justify-content:center;
    gap:10px 16px;
  }

  .page-hero,
  .sd-hero,
  .track-hero{
    text-align:center;
  }

  .page-hero .breadcrumb,
  .page-hero-eyebrow,
  .sd-live,
  .hero-eyebrow{
    margin-inline:auto;
  }

  .page-hero-btns,
  .hero-btns,
  .cta-btns,
  .veh-popup-ctas-el,
  .van-popup-ctas{
    justify-content:center;
  }

  .page-hero-btns .btn,
  .hero-btns .btn,
  .cta-btns .btn,
  .track-btn,
  .sdp-btn,
  .qbtn,
  .qbtn2,
  .form-btn{
    width:100%;
    justify-content:center;
    white-space:normal;
  }

  .hero-body,
  .sd-hero-inner{
    padding-block:58px 46px!important;
  }

  .qcard,
  .ch-qcard{
    padding:22px!important;
  }

  .qrow,
  .qrow2,
  .sdp-row,
  .frow,
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns:repeat(4,1fr)"]{
    grid-template-columns:1fr!important;
  }

  .track-input-row{
    flex-direction:column;
  }

  .tr-header,
  .hours-row,
  .blog-footer,
  .veh-bottom{
    align-items:flex-start;
    flex-direction:column;
    gap:10px;
  }

  .tr-status,
  .veh-open-btn{
    align-self:flex-start;
  }

  .benefit-card,
  .val-card,
  .do-card,
  .response-badge,
  .ch-phone-block{
    align-items:flex-start;
  }

  .article-meta-bar,
  .article-meta,
  .blog-meta{
    gap:10px 14px;
  }

  .app-badge-row,
  .ph-strip-btns{
    flex-direction:column;
    align-items:stretch;
  }

  .app-badge,
  .ph-strip-btn{
    justify-content:center;
  }

  .veh-popup-header,
  .van-popup-header{
    flex-direction:column;
    text-align:center;
  }

  .veh-popup-specs-el,
  .van-popup-specs,
  .sc-stats{
    grid-template-columns:1fr!important;
  }

  .compare-table{
    min-width:620px;
    width:100%;
  }

  .compare-table th,
  .compare-table td{
    padding:10px 12px;
    font-size:12.5px;
    line-height:1.4;
    white-space:nowrap;
  }
}

@media(max-width:600px){
  .svc-grid,
  .svc-grid-2,
  .svc-full-grid,
  .feature-grid,
  .testi-grid,
  .blog-grid,
  .why-grid-3,
  .team-vals,
  .accred-cards,
  .esg-grid,
  .facility-grid,
  .veh-grid,
  .fleet-grid,
  .ind-grid,
  .ind-full-grid,
  .route-grid,
  .lanes-grid,
  .dest-grid,
  .coverage-grid,
  .help-grid,
  .benefit-grid,
  .partner-type-grid,
  .book-steps,
  .htw-grid,
  .ipsteps,
  .air-opts,
  .sea-compare,
  .compare-grid,
  .values-grid,
  .stats-grid,
  .steps,
  .steps-3,
  .rf-steps{
    grid-template-columns:1fr!important;
  }

  .hero-trust,
  .accred-list,
  .integ-list,
  .city-tags,
  .kw-tags,
  .tag-cloud,
  .footer-bottom-links{
    justify-content:center;
  }

  .ph-strip,
  .spec-cta-band,
  .cta-inner{
    text-align:center;
  }

  .ph-strip-text{
    justify-content:center;
    width:100%;
  }

  .article-lead,
  .blog-lead,
  .conclusion-box,
  .diff-box,
  .full-form-wrap,
  .form-wrap,
  .sd-form-panel,
  .track-box,
  .track-result,
  .article-body,
  .blog-article{
    padding:20px 16px!important;
  }

  .veh-popup,
  .van-popup{
    max-height:calc(100vh - 28px);
    border-radius:14px!important;
  }

  .veh-popup-overlay,
  .van-popup-overlay{
    padding:14px!important;
  }

  .veh-popup-img-el,
  .van-popup-img{
    width:150px!important;
  }
}

@media(max-width:420px){
  .container,
  .nav-wrap,
  .cat-nav-inner{
    padding-inline:14px;
  }

  .h1,
  .hero-h{
    font-size:30px!important;
  }

  .h2{
    font-size:23px!important;
  }

  .btn{
    width:100%;
    justify-content:center;
    white-space:normal;
    padding-inline:16px;
  }

  .page-hero-eyebrow,
  .hero-eyebrow,
  .tag{
    letter-spacing:1.2px;
  }

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

/* ============================================
   EDITORIAL FLAT SYSTEM (no card boxes)
   Content sits directly on the section background — no white box,
   no border, no drop shadow, no rounded "chip" anywhere. Items are
   separated by generous whitespace and, in stacked lists, a hairline
   divider. A numbered/oversized-icon lead plus a small hover shift on
   the title/arrow provides the interactivity a card's hover-lift used
   to carry. Functional panels (forms, quote/tracking widgets) keep a
   minimal single hairline border only, since a control needs a
   readable boundary — that is a UI necessity, not decorative "card" styling.
   ============================================ */

/* Decorative content items: flat, no box, no shadow */
.svc-card,.svc-full-card,.feat,.feat-card,.testi,.cc,.sme-card,
.why-item,.val-card,.tv-card,.accred-card,.ind-full-card,.htw-card,.help-card,
.book-step,.cov-card,.do-card,.ind-process,
.veh-card,.blog-card,.van-card,.sd-opt-card,.stat-box,
.air-opt,.sea-card,.move-card,.compare-card,.route-item,.dest-item,.lane-item,
.mv-cover-item,.benefit-card,.sidebar-section,.sidebar-card,.conclusion-box,
.pt-card,.region-card,.fac-card,.industry-card,.company-card,.factor-card,.ph-van-card,
.step,.ipstep{
  background:transparent;
  border:none;
  border-radius:0;
  box-shadow:none;
  transition:transform .25s ease,color .25s ease;
}

/* Grid tiles: whole item shifts up slightly + title/arrow accent reacts (no shadow, nothing to "lift") */
.svc-card:hover,.svc-full-card:hover,.feat:hover,.feat-card:hover,.testi:hover,
.why-item:hover,.val-card:hover,.tv-card:hover,.accred-card:hover,.ind-full-card:hover,
.htw-card:hover,.help-card:hover,.book-step:hover,.cov-card:hover,.do-card:hover,
.veh-card:hover,.blog-card:hover,.van-card:hover,.sd-opt-card:hover,
.air-opt:hover,.sea-card:hover,.move-card:hover,.compare-card:hover,.route-item:hover,
.dest-item:hover,.lane-item:hover,.mv-cover-item:hover,.benefit-card:hover,
.sidebar-section:hover,.sidebar-card:hover,
.pt-card:hover,.region-card:hover,.fac-card:hover,.industry-card:hover,.company-card:hover,
.factor-card:hover,.ph-van-card:hover,
.step:hover,.ipstep:hover{
  transform:translateY(-3px);
  border-color:transparent;
  box-shadow:none;
}

/* List rows (contact details, key-account list) — hairline divider between rows, shift right on hover */
.cc{border-top:1px solid var(--border);border-radius:0;padding:18px 0}
.cc:first-child{border-top:none}
.sme-card{border-top:1px solid var(--border);border-radius:0;padding:20px 0}
.sme-card:first-child{border-top:none}
.cc:hover,.sme-card:hover{
  transform:translateX(6px);
  box-shadow:none;
  border-color:var(--border);
}

.svc-card::after,.svc-full-card::after,.testi::before,.van-card::before,
.ind-full-card::after,.veh-card::before,.blog-card::before{
  display:none;
}

/* Stat strip: numbers on the page, only hairline separators between them */
.stats-grid{background:transparent;border:none;border-radius:0;box-shadow:none;transform:none}
.stat-box{background:transparent;border:none;border-radius:0;box-shadow:none;border-right:1px solid var(--border)}
.stat-box:last-child{border-right:none}
.stat-box:hover{transform:none;box-shadow:none;border-color:var(--border)}

/* Icon glyphs: plain, larger, no colored "chip" background */
.svc-icon,.feat-icon,.wp-ic,.sme-ic,.cc-icon,.why-item-icon,.val-icon,.tv-icon,
.do-icon,.rb-icon,.sd-opt-icon,.htw-icon,.book-step-num,.ipstep-num,.ao-icon,
.mc-icon,.ri-icon,.mv-ci-icon,.benefit-icon,.fac-icon{
  background:transparent;
  border:none;
  width:auto;
  height:auto;
}
.svc-icon i,.feat-icon i,.wp-ic i,.sme-ic i,.cc-icon i,.why-item-icon i,.val-icon i,.tv-icon i,
.do-icon i,.rb-icon i,.sd-opt-icon i,.htw-icon i,.ao-icon i,.mc-icon i,.ri-icon i,.mv-ci-icon i,
.benefit-icon i,.fac-icon i{
  font-size:30px!important;
  color:var(--red);
}
.svc-card:hover .svc-icon i,.svc-card:hover .svc-icon,
.feat:hover .feat-icon i,.feat-card:hover .feat-icon i,.feat:hover .feat-icon,.feat-card:hover .feat-icon{
  background:transparent;
  color:var(--red);
}

/* Functional panels keep one hairline boundary only — no shadow, no heavy radius */
.hours-box,.track-result,.info-box,
.form-wrap,.full-form-wrap,.sd-form-panel,.track-box,.app-section,.article-body,
.qcard,.ch-qcard,.compare-table,.faq-item{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  box-shadow:none;
}
.qcard::before{display:none}
.qs{background:transparent;border:none;border-radius:0}

.cta-band::after{background:var(--red)}
.cta-h{color:#fff}
.cta-p{color:rgba(255,255,255,.65)}

/* "Featured/highlight" tier keeps its distinct navy panel — that is contrast, not a card */
.air-opt.featured,.sea-card.fcl,.move-card.featured,.compare-card.ftl,
.sidebar-cta,.cta-sidebar{
  background:linear-gradient(135deg,#17355f 0%,#334155 100%);
  border:none;
  border-radius:10px;
  padding:28px;
}
.air-opt.featured .ao-title,.move-card.featured .mc-title,.sea-card.fcl h3,
.compare-card.ftl h3,.sidebar-cta-title,.cta-sidebar h3,.cta-sidebar p{
  color:#fff;
}
.air-opt.featured .ao-desc,.air-opt.featured .ao-list li,
.move-card.featured .mc-desc,.move-card.featured .mc-list li,
.sea-card.fcl .sc-sub,.sea-card.fcl .sc-list li,
.compare-card.ftl .cc-sub,.compare-card.ftl .cc-list li,
.sidebar-cta-sub{
  color:rgba(255,255,255,.72);
}

.story-img,.img-card,.why-img{box-shadow:none;border:1px solid var(--border)}
.van-popup,.veh-popup,.drop{box-shadow:0 18px 40px rgba(15,35,60,.14)}

/* ============================================
   ELEVATED CARD SYSTEM — shared foundation
   Every ".xxx-elevated" block below draws on this same
   recipe: white surface, hairline border, layered shadow,
   a confident lift on hover with a premium ease-out curve.
   Centralising the constants here keeps every card on the
   site moving and feeling the same way.
   ============================================ */
:is(.svc-elevated .svc-card,
.steps-elevated .step,
.sme-elevated .sme-card,
.testi-elevated .testi,
.feat-elevated .feat,.feat-elevated .feat-card,
.route-elevated .route-item,.dest-elevated .dest-item,.lane-elevated .lane-item,
.fac-elevated .fac-card,.cov-elevated .cov-card,
.speed-elevated .sd-speed-card,
.val-elevated .val-card,.tv-elevated .tv-card,.accred-elevated .accred-card,
.ipstep-elevated .ipstep,.book-elevated .book-step,
.blog-elevated .blog-card,
.region-elevated .region-card,.pt-elevated .pt-card,.benefit-elevated .benefit-card,
.compare-elevated .compare-card:not(.ftl),.compare-elevated .air-opt:not(.featured),
.compare-elevated .sea-card:not(.fcl),.compare-elevated .move-card:not(.featured)){
  transition:transform .45s var(--ease-card),box-shadow .45s var(--ease-card),border-color .45s var(--ease-card);
}

/* ============================================
   SERVICES SECTION — ELEVATED CARD TREATMENT
   Scoped to .svc-elevated so it doesn't affect the flat
   system used everywhere else. Reuses the site's own
   "Dispatch Manifest" mono vocabulary (route waypoint mark,
   mono spec badge) instead of introducing new language.
   ============================================ */
.svc-elevated .section-head-row{padding-bottom:28px;border-bottom:1px solid var(--border);margin-bottom:0}
.svc-elevated .svc-grid{margin-top:34px}

.svc-elevated .svc-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-xs);
  padding:38px 30px 30px;
}
.svc-elevated .svc-card:hover{
  transform:translateY(-9px) scale(1.01);
  box-shadow:var(--shadow-lg);
  border-color:rgba(200,16,46,.3);
}
.svc-elevated .svc-card::after{
  content:'';display:block;position:absolute;bottom:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--red),var(--red2));
  transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease-card);
}
.svc-elevated .svc-card:hover::after{transform:scaleX(1)}

.svc-elevated .svc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:22px}
.svc-elevated .svc-icon{
  width:56px;height:56px;border-radius:var(--radius);
  background:linear-gradient(135deg,rgba(200,16,46,.11),rgba(200,16,46,.05));
  border:1.5px solid rgba(200,16,46,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 2px 6px rgba(200,16,46,.07);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  transition:all .3s var(--ease-card);
}
.svc-elevated .svc-icon i{font-size:22px!important;color:var(--red);transition:color .3s var(--ease-card),transform .3s var(--ease-card)}
.svc-elevated .svc-card:hover .svc-icon{background:var(--red);border-color:var(--red);box-shadow:0 4px 12px rgba(200,16,46,.28);transform:scale(1.08) rotate(-4deg)}
.svc-elevated .svc-card:hover .svc-icon i{color:#fff}

.svc-elevated .svc-badge{
  font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:1px;
  text-transform:uppercase;color:var(--red);background:var(--red-light);
  border:1px solid var(--red-mid);padding:6px 9px 6px 8px;border-radius:4px;
  display:inline-flex;align-items:center;gap:5px;white-space:nowrap;margin-top:6px;
  transition:all .3s var(--ease-card);
}

/* Corner stamp on the featured card — reads like a courier's priority
   label rather than a decorative ribbon */
.svc-elevated .svc-ribbon{
  position:absolute;top:22px;right:-36px;z-index:2;
  transform:rotate(45deg);
  background:linear-gradient(90deg,var(--red),var(--red2));
  color:#fff;font-family:var(--mono);font-size:9.5px;font-weight:700;
  letter-spacing:1.5px;text-transform:uppercase;
  padding:5px 42px;box-shadow:0 3px 10px rgba(0,0,0,.28);
}

.svc-elevated .svc-title{
  font-family:'Rethink Sans',sans-serif;font-weight:600;font-size:21px;
  letter-spacing:-.2px;color:var(--charcoal);line-height:1.1;margin-bottom:12px;
}
.svc-elevated .svc-text{font-size:14px;color:var(--grey);line-height:1.7;margin-bottom:18px}
.svc-elevated .svc-list{list-style:none;display:flex;flex-direction:column;gap:9px;margin-bottom:0}
.svc-elevated .svc-list li{font-size:13px;color:var(--grey);display:flex;align-items:center;gap:9px}
.svc-elevated .svc-list li i{display:none}
.svc-elevated .svc-list li::before{content:'';width:5px;height:5px;background:var(--red);border-radius:1px;transform:rotate(45deg);flex-shrink:0}
.svc-elevated .svc-more{
  display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;
  color:var(--red);margin-top:auto;padding-top:19px;
  border-top:1px solid var(--border);transition:gap .25s var(--ease-card),border-color .3s var(--ease-card);
}
.svc-elevated .svc-card:hover .svc-more{gap:12px}

/* Featured tier: Same Day / Express is the urgent, premium-priced service */
.svc-elevated .svc-card.dark{
  background:linear-gradient(135deg,var(--navy) 0%,#13294f 100%);
  border-color:transparent;
  box-shadow:var(--shadow-sm);
}
.svc-elevated .svc-card.dark::after{transform:scaleX(1)}
.svc-elevated .svc-card.dark .svc-icon{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.22);box-shadow:none}
.svc-elevated .svc-card.dark .svc-icon i{color:#fff}
.svc-elevated .svc-card.dark:hover .svc-icon{background:var(--red);border-color:var(--red)}
.svc-elevated .svc-card.dark:hover .svc-icon i{color:#fff}
.svc-elevated .svc-card.dark .svc-title{color:#fff}
.svc-elevated .svc-card.dark .svc-text{color:rgba(255,255,255,.72)}
.svc-elevated .svc-card.dark .svc-list li{color:rgba(255,255,255,.82)}
.svc-elevated .svc-card.dark .svc-list li::before{background:#ff6b81}
.svc-elevated .svc-card.dark .svc-more{color:#fff;border-top-color:rgba(255,255,255,.18)}

@media(max-width:1024px){
  .svc-elevated .svc-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:540px){
  .svc-elevated .svc-grid{grid-template-columns:1fr}
  .svc-elevated .svc-card{padding:28px 24px 24px}
  .svc-elevated .svc-ribbon{top:18px;right:-40px;font-size:9px;padding:4px 44px}
}

/* Extra service cards: hidden by default so the section still reads as
   a tight, curated 4-card row on laptop screens. On a genuinely large
   monitor there's room to show the fuller service line-up in one row
   instead of leaving the newly widened container mostly empty. */
.svc-elevated .lg-only{display:none}
@media(min-width:1440px){
  .svc-elevated .lg-only{display:flex}
  .svc-elevated .svc-grid{grid-template-columns:repeat(7,1fr);gap:20px}
}

/* ============================================
   SIMPLE PROCESS — bordered step panels
   The 4 stages are a genuine sequence, so a mono
   "Stage 0X" label is earned here (unlike a plain
   decorative 01/02/03 elsewhere on the page).
   ============================================ */
.steps-elevated .steps::before,
.steps-elevated .rf-steps::before,
.steps-elevated .steps-3::before,
.steps-elevated .mv-steps::before{opacity:0}
.steps-elevated .steps,
.steps-elevated .rf-steps,
.steps-elevated .steps-3,
.steps-elevated .mv-steps{gap:22px}
.steps-elevated .step{
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:36px 22px 30px;
}
.steps-elevated .step:hover{transform:translateY(-7px);box-shadow:var(--shadow-sm);border-color:rgba(200,16,46,.26)}
.steps-elevated .step-stage{
  display:block;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:1.5px;
  text-transform:uppercase;color:var(--red);margin-bottom:6px;
}
.steps-elevated .step-title{
  font-family:'Rethink Sans',sans-serif;font-weight:600;font-size:19px;letter-spacing:-.1px;
}

/* ============================================
   ABOUT / "YOUR FREIGHT IS OUR PRIORITY" — feature rows
   ============================================ */
.why-pts{margin:26px 0}
.wp{display:flex;gap:14px;align-items:flex-start}
.wp-p{font-size:14px;color:var(--mute);line-height:1.6;margin:0}
.wp-elevated .wp{border-top:1px solid var(--border);padding:16px 0;align-items:center}
.wp-elevated .wp:first-child{border-top:none;padding-top:0}
.wp-elevated .wp-ic{
  width:44px;height:44px;min-width:44px;border-radius:var(--radius);
  background:linear-gradient(135deg,rgba(200,16,46,.11),rgba(200,16,46,.05));
  border:1px solid rgba(200,16,46,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 2px 6px rgba(200,16,46,.06);
  display:flex;align-items:center;justify-content:center;padding-top:0;
  transition:transform .3s var(--ease-card);
}
.wp-elevated .wp:hover .wp-ic{transform:scale(1.06)}
.wp-elevated .wp-ic i{font-size:18px!important}
.wp-elevated .wp-t{
  font-family:'Rethink Sans',sans-serif;font-weight:600;font-size:16.5px;
  letter-spacing:-.1px;color:var(--charcoal);margin-bottom:3px;
}

/* ============================================
   STATS STRIP + NETWORK COVERAGE
   ============================================ */
/* Floating separate cards — each stat is its own card with gap, shadow and lift-on-hover */
.stats-elevated .stats-grid{
  background:transparent;border:none;border-radius:0;box-shadow:none;overflow:visible;gap:20px;
}
.stats-elevated .stat-box{
  background:#fff;border:1px solid var(--border);border-radius:16px;
  box-shadow:var(--shadow-sm);
  transition:transform .35s var(--ease-card),box-shadow .35s var(--ease-card),border-color .35s var(--ease-card);
}
.stats-elevated .stat-box:last-child{border:1px solid var(--border)}
.stats-elevated .stat-box:hover{
  background:#fff;transform:translateY(-8px);
  box-shadow:0 24px 46px rgba(15,35,60,.16);border-color:rgba(200,16,46,.3);
}
.stats-elevated .stat-box::before{
  content:'';display:block;position:absolute;top:0;left:0;right:0;height:3px;border-radius:16px 16px 0 0;
  background:var(--red);transform:scaleX(0);transition:transform .4s var(--ease-card);
}
.stats-elevated .stat-box:hover::before{transform:scaleX(1)}
.stats-elevated .stat-box{padding:34px 20px}
.stats-elevated .stat-icon{
  opacity:1;width:64px;height:64px;margin:0 auto 16px;font-size:0;
  border-radius:50%;background:linear-gradient(135deg,rgba(200,16,46,.12),rgba(200,16,46,.05));
  border:1px solid rgba(200,16,46,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 2px 8px rgba(200,16,46,.08);
  display:flex;align-items:center;justify-content:center;
  transition:transform .3s var(--ease-card);
}
.stats-elevated .stat-icon i{font-size:28px!important}
.stats-elevated .stat-box:hover .stat-icon{transform:scale(1.08) rotate(-4deg)}
.stats-elevated .stat-num{font-size:40px !important;}
.stats-elevated .stat-suf{font-size:22px}
.stats-elevated .stat-label{font-size:12px;letter-spacing:.8px}

.network-elevated .img-card{box-shadow:var(--shadow-sm);border-radius:var(--radius-lg);overflow:hidden}
.network-check-list li i{display:none}
.network-check-list li::before{
  content:'';width:5px;height:5px;background:var(--red);border-radius:1px;
  transform:rotate(45deg);flex-shrink:0;margin-top:7px;
}

/* ============================================
   SCALES WITH YOU — feature cards
   ============================================ */
.sme-elevated .sme-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.sme-elevated .sme-card{
  flex-direction:column;align-items:flex-start;gap:0;
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:24px 22px;
}
.sme-elevated .sme-card::before{display:none}
.sme-elevated .sme-card:hover{transform:translateY(-7px);box-shadow:var(--shadow-sm);border-color:rgba(200,16,46,.26)}
.sme-elevated .sme-ic{
  width:42px;height:42px;min-width:42px;border-radius:var(--radius);
  background:linear-gradient(135deg,rgba(200,16,46,.11),rgba(200,16,46,.05));
  border:1px solid rgba(200,16,46,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 2px 6px rgba(200,16,46,.06);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:14px;padding-top:0;transition:transform .3s var(--ease-card);
}
.sme-elevated .sme-card:hover .sme-ic{transform:scale(1.06)}
.sme-elevated .sme-ic i{font-size:18px!important}
.sme-elevated .sme-t{font-family:'Rethink Sans',sans-serif;font-weight:600;font-size:15.5px;letter-spacing:-.1px;margin-bottom:4px}
.sme-elevated .sme-p{font-size:12.5px}
@media(max-width:560px){.sme-elevated .sme-cards{grid-template-columns:1fr}}

/* ============================================
   TESTIMONIALS — boxed cards
   ============================================ */
.testi-elevated .testi{
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:34px 32px;box-shadow:var(--shadow-sm);
}
.testi-elevated .testi::before{
  content:'';display:block;position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--red),var(--red2));transform:scaleX(0);
  transition:transform .4s var(--ease-card);border-radius:3px 3px 0 0;
}
.testi-elevated .testi:hover{transform:translateY(-7px);box-shadow:var(--shadow-lg);border-color:rgba(200,16,46,.24)}
.testi-elevated .testi:hover::before{transform:scaleX(1)}
.testi-elevated .testi-av{transition:transform .3s var(--ease-card)}
.testi-elevated .testi:hover .testi-av{transform:scale(1.08)}

/* ============================================
   FEATURE GRID — boxed cards (service-detail pages)
   Reusable across every "Key Features" style section
   built from .feature-grid > .feat / .feat-card
   ============================================ */
.feat-elevated .feat,.feat-elevated .feat-card{
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:32px 28px;box-shadow:var(--shadow-xs);
}
.feat-elevated .feat:hover,.feat-elevated .feat-card:hover{
  transform:translateY(-7px);box-shadow:var(--shadow-sm);border-color:rgba(200,16,46,.26);
}
.feat-elevated .feat-icon{
  width:52px;height:52px;border-radius:var(--radius);
  background:linear-gradient(135deg,rgba(200,16,46,.11),rgba(200,16,46,.05));
  border:1.5px solid rgba(200,16,46,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 2px 6px rgba(200,16,46,.07);
  display:flex;align-items:center;justify-content:center;
  transition:all .3s var(--ease-card);
}
.feat-elevated .feat-icon i{font-size:20px!important;color:var(--red);transition:color .3s var(--ease-card)}
.feat-elevated .feat:hover .feat-icon,.feat-elevated .feat-card:hover .feat-icon{background:var(--red);border-color:var(--red);transform:scale(1.08) rotate(-4deg)}
.feat-elevated .feat:hover .feat-icon i,.feat-elevated .feat-card:hover .feat-icon i{color:#fff}
.feat-elevated .feat-title{font-family:'Rethink Sans',sans-serif;font-weight:600;font-size:17px;letter-spacing:-.1px}

/* ============================================
   FLAT INFO-TILE GRIDS — route / destination / lane /
   facility tiles. Same recipe, different child class
   names per page, so each is scoped individually.
   ============================================ */
.route-elevated .route-item,
.dest-elevated .dest-item,
.lane-elevated .lane-item,
.fac-elevated .fac-card,
.cov-elevated .cov-card{
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--shadow-xs);
}
.route-elevated .route-item:hover,
.dest-elevated .dest-item:hover,
.lane-elevated .lane-item:hover,
.fac-elevated .fac-card:hover,
.cov-elevated .cov-card:hover{
  transform:translateY(-6px);box-shadow:var(--shadow-sm);border-color:rgba(200,16,46,.26);
}
.dest-elevated .dest-flag,.fac-elevated .fac-icon i{color:var(--red)}

/* Same Day "choose your speed" tier cards */
.speed-elevated .sd-speed-card{
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-xs);
}
.speed-elevated .sd-speed-card:hover{
  transform:translateY(-6px);box-shadow:var(--shadow-sm);border-color:rgba(200,16,46,.26);
}

/* About page — Mission & Values / Team / Accreditations tiles */
.val-elevated .val-card{
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-xs);padding:28px 26px;
}
.val-elevated .val-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-sm);border-color:rgba(200,16,46,.26)}
.tv-elevated .tv-card,
.accred-elevated .accred-card{
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-xs);
}
.tv-elevated .tv-card:hover,
.accred-elevated .accred-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-sm);border-color:rgba(200,16,46,.26)}

/* Numbered-step sequences (industries "sector solution" build steps,
   vehicles "book in 3 steps") — genuine sequences, so the numbered
   circle earns its keep here. */
.ipstep-elevated .ipstep,
.book-elevated .book-step{
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-xs);
}
.ipstep-elevated .ipstep:hover,
.book-elevated .book-step:hover{transform:translateY(-6px);box-shadow:var(--shadow-sm);border-color:rgba(200,16,46,.26)}

/* Blog listing — boxed article cards */
.blog-elevated .blog-card{
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-xs);overflow:hidden;
}
.blog-elevated .blog-card:hover{
  transform:translateY(-7px);box-shadow:var(--shadow-sm);border-color:rgba(200,16,46,.26);
}
.blog-elevated .blog-footer{border-top:1px solid var(--border)}
.blog-elevated .blog-card img{transition:transform .5s var(--ease-card)}
.blog-elevated .blog-card:hover img{transform:scale(1.05)}

/* Network page — region tiles, partner-type cards, benefit tiles */
.region-elevated .region-card,
.pt-elevated .pt-card,
.benefit-elevated .benefit-card{
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-xs);
}
.region-elevated .region-card:hover,
.pt-elevated .pt-card:hover,
.benefit-elevated .benefit-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-sm);border-color:rgba(200,16,46,.26)}

/* ============================================
   COMPARISON CARDS — give the "standard" tier a box
   The featured/premium tier (.ftl/.featured/.fcl) already
   gets a navy gradient panel; its sibling was left fully
   flat for contrast. A light card reads more intentional
   than "no styling at all".
   ============================================ */
.compare-elevated .compare-card:not(.ftl),
.compare-elevated .air-opt:not(.featured),
.compare-elevated .sea-card:not(.fcl),
.compare-elevated .move-card:not(.featured){
  background:linear-gradient(180deg,#fff 0%,#fcfdff 100%);border:1px solid var(--border);border-radius:12px;
  box-shadow:var(--shadow-xs);
}
.compare-elevated .compare-card:not(.ftl):hover,
.compare-elevated .air-opt:not(.featured):hover,
.compare-elevated .sea-card:not(.fcl):hover,
.compare-elevated .move-card:not(.featured):hover{
  transform:translateY(-6px);box-shadow:var(--shadow-sm);border-color:rgba(200,16,46,.26);
}

/* ============================================
   LARGE / 4K SCREEN SCALING
   The layout was capped at max-width:1220px everywhere,
   so on a 2K/4K monitor the whole site sits in a narrow
   column with huge empty margins either side. Widen the
   shared container progressively on bigger viewports
   instead of letting it stay pinned at a laptop width.
   ============================================ */
@media(min-width:1440px){
  .container,.nav-wrap,.cat-nav-inner{max-width:1360px}
}
@media(min-width:1680px){
  .container,.nav-wrap,.cat-nav-inner{max-width:1400px}
}
@media(min-width:1920px){
  .container,.nav-wrap,.cat-nav-inner{max-width:1400px}
}
@media(min-width:2560px){
  .container,.nav-wrap,.cat-nav-inner{max-width:1400px}
}

/* ============================================
   FINAL RESPONSIVE UI POLISH
   A shared layout layer for all static pages and article pages.
   ============================================ */
:root{
  --container-pad:clamp(14px,2.6vw,40px) !important;
  --section-y:clamp(34px,5.2vw,86px) !important;
  --section-y-tight:clamp(26px,3.4vw,54px) !important;
  --content-measure:72ch !important;
}

html{
  overflow-x:clip;
}

body{
  overflow-wrap:anywhere;
}

main{
  overflow-x:clip;
}

.container,
.nav-wrap,
.cat-nav-inner{
  padding-inline:var(--container-pad);
}

.section{
  padding-block:var(--section-y);
}

.section[style*="padding:40px 0"],
.section[style*="padding:48px 0"],
.section[style*="padding:56px 0"],
section[style*="padding:48px 0"],
section[style*="padding:56px 0"]{
  padding-block:8px!important;
}

.section-head{
  margin-bottom:clamp(22px,3.2vw,44px);
}

.sub,
.svc-text,
.feat-text,
.testi-text,
.blog-excerpt,
.article-body p,
.blog-article p{
  overflow-wrap:break-word;
}

.sub.center,
.section-head.center .sub{
  max-width:min(680px,100%);
}

.h1,
.hero-h{
  font-size:clamp(34px,6vw,76px);
  line-height:.98;
  letter-spacing:0;
}

.h2{
  font-size:clamp(22px,2.8vw,38px);
  line-height:1.1;
  letter-spacing:0;
}

.h3,
.form-title,
.full-form-title,
.cta-h{
  letter-spacing:0;
}

.btn,
.form-btn,
.qbtn,
.qbtn2,
.sdp-btn,
.track-btn,
.quote-btn,
.quote-btn-spec{
  min-height:44px;
  max-width:100%;
  line-height:1.2;
}

.btn i,
.form-btn i,
.qbtn i,
.qbtn2 i{
  flex-shrink:0;
}

.nav-wrap{
  gap:16px;
}

.nav-logo img{
  height:clamp(40px,3.3vw,52px)!important;
}

.hamburger{
  width:44px;
  height:44px;
  align-items:center;
  justify-content:center;
  border-radius:10px;
}

.hamburger:focus-visible,
.btn:focus-visible,
.mob-nav a:focus-visible,
.nav-links a:focus-visible,
.drop a:focus-visible,
.cat-nav-item:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
a:focus-visible{
  outline:3px solid rgba(200,16,46,.28);
  outline-offset:3px;
}

.mob-nav{
  max-height:0;
  display:block;
  overflow:hidden;
  opacity:0;
  transform:translateY(-6px);
  transition:max-height .28s ease,opacity .22s ease,transform .22s ease;
}

.mob-nav.open{
  max-height:calc(100vh - 72px);
  opacity:1;
  transform:translateY(0);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}

.page-hero{
  padding-block:clamp(34px,5vw,72px);
  min-height:clamp(260px,25vw,420px);
}

.page-hero-content{
  max-width:min(660px,100%);
}

.breadcrumb{
  max-width:100%;
  width:max-content;
}

.page-hero-btns,
.hero-btns,
.cta-btns{
  gap:12px;
}

.svc-grid,
.svc-full-grid,
.feature-grid,
.testi-grid,
.blog-grid,
.veh-grid,
.ind-grid,
.ind-full-grid,
.facility-grid,
.region-grid,
.coverage-grid,
.route-grid,
.lanes-grid,
.dest-grid,
.help-grid,
.benefit-grid,
.partner-type-grid,
.why-grid-3,
.book-steps,
.htw-grid,
.ipsteps,
.air-opts,
.sea-compare,
.compare-grid,
.values-grid,
.team-vals,
.accred-cards,
.fleet-grid{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:clamp(18px,2vw,30px);
}

.svc-grid > *,
.svc-full-grid > *,
.feature-grid > *,
.testi-grid > *,
.blog-grid > *,
.veh-grid > *,
.ind-grid > *,
.ind-full-grid > *,
.facility-grid > *,
.region-grid > *,
.coverage-grid > *,
.route-grid > *,
.lanes-grid > *,
.dest-grid > *,
.help-grid > *,
.benefit-grid > *,
.partner-type-grid > *,
.why-grid-3 > *,
.book-steps > *,
.htw-grid > *,
.ipsteps > *,
.air-opts > *,
.sea-compare > *,
.compare-grid > *,
.values-grid > *,
.team-vals > *,
.accred-cards > *,
.fleet-grid > *{
  flex:1 1 260px;
}

.svc-grid-2,
.why-grid,
.sd-grid,
.contact-main-grid,
.contact-hero-inner,
.story-grid,
.rf-layout,
.sd-layout,
.nd-layout,
.ov-layout,
.sea-layout,
.af-layout,
.wh-layout,
.fulfilment-grid,
.blog-wrap,
.article-wrap,
.join-wrap,
.fleet-wrap,
.sme-wrap,
[style*="grid-template-columns:1fr 1fr"],
[style*="grid-template-columns:1fr 1.6fr"],
[style*="grid-template-columns:1.15fr 0.85fr"]{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:clamp(24px,4vw,56px)!important;
}

.svc-card,
.svc-full-card,
.feat,
.feat-card,
.testi,
.blog-card,
.veh-card,
.ind-full-card,
.htw-card,
.help-card,
.book-step,
.benefit-card,
.fac-card,
.region-card,
.pt-card,
.air-opt,
.sea-card,
.move-card,
.compare-card,
.route-item,
.dest-item,
.lane-item,
.val-card,
.tv-card,
.accred-card,
.ipstep{
  height:100%;
}

.blog-img,
.hp-blog-hero .card-img,
.hp-blog-side .card-img,
.ifc-media,
.veh-img-wrap{
  overflow:hidden;
}

.blog-img,
.hp-blog-side .card-img{
  height:auto;
  aspect-ratio:16/10;
  min-height:0;
}

.hp-blog-hero .card-img{
  min-height:0;
  aspect-ratio:16/9;
}

.img-card,
.story-img,
.why-img,
[style*="height:450px"],
[style*="height:459px"],
[style*="height:460px"]{
  height:auto!important;
  min-height:0;
  aspect-ratio:16/10;
}

.img-card img,
.story-img img,
.why-img img,
[style*="height:450px"] img,
[style*="height:459px"] img,
[style*="height:460px"] img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.veh-img-wrap{
  min-height:clamp(210px,20vw,300px);
  padding:clamp(26px,3vw,44px) clamp(16px,2vw,28px);
}

.veh-img-wrap img{
  max-height:clamp(140px,11vw,190px);
}

.form-wrap,
.full-form-wrap,
.sd-form-panel,
.track-box,
.qcard,
.ch-qcard{
  padding:clamp(20px,3vw,36px)!important;
}

.fg input,
.fg select,
.fg textarea,
.qg input,
.qg select,
.qg textarea,
.qg2 input,
.qg2 select,
.sdp-fg input,
.sdp-fg select,
.track-input{
  min-height:30px;
}

.table-wrap,
[style*="overflow-x:auto"]{
  max-width:100%;
  overflow-x:auto!important;
  -webkit-overflow-scrolling:touch;
}

.compare-table{
  width:100%;
  min-width:680px;
}

.footer-grid{
  grid-template-columns:2fr repeat(3,minmax(150px,1fr));
  gap:clamp(24px,4vw,56px);
}

.footer-brand img{
  height:clamp(68px,7vw,90px)!important;
}

.footer-bottom{
  align-items:center;
}

.footer-bottom-links{
  flex-wrap:wrap;
}

@media(max-width:1320px){
  .nav-wrap{
    height:72px;
  }
}

@media(max-width:900px){
  .svc-grid-2,
  .why-grid,
  .sd-grid,
  .contact-main-grid,
  .contact-hero-inner,
  .story-grid,
  .rf-layout,
  .sd-layout,
  .nd-layout,
  .ov-layout,
  .sea-layout,
  .af-layout,
  .wh-layout,
  .fulfilment-grid,
  .blog-wrap,
  .article-wrap,
  .join-wrap,
  .fleet-wrap,
  .sme-wrap,
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns:1fr 1.6fr"],
  [style*="grid-template-columns:1.15fr 0.85fr"]{
    grid-template-columns:1fr!important;
  }

  .hero-grid{
    grid-template-columns:1fr!important;
    text-align:center;
  }

  .hero-p,
  .hero-trust,
  .hero-stats{
    margin-inline:auto;
  }

  .qcard-stage{
    width:min(560px,100%);
    margin-inline:auto;
  }

  .cat-nav{
    top:72px;
  }
}

@media(max-width:768px){
  :root{
    --section-y:clamp(30px,8vw,52px) !important;
  }

  .page-hero{
    min-height:0;
    text-align:center;
  }

  .page-hero-slanted .page-hero-bg{
    width:100%;
    opacity:.12;
    clip-path:none;
  }

  .breadcrumb,
  .page-hero-eyebrow{
    margin-inline:auto;
  }

  .page-hero-btns,
  .hero-btns,
  .cta-btns,
  .veh-popup-ctas-el,
  .van-popup-ctas{
    width:100%;
  }

  .page-hero-btns .btn,
  .hero-btns .btn,
  .cta-btns .btn,
  .veh-popup-ctas-el a,
  .van-popup-ctas a,
  .track-btn,
  .sdp-btn,
  .qbtn,
  .qbtn2,
  .form-btn{
    width:100%;
    justify-content:center;
    white-space:normal;
  }

  .qrow,
  .qrow2,
  .sdp-row,
  .frow,
  .diff-box,
  .qstats,
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns:repeat(4,1fr)"]{
    grid-template-columns:1fr!important;
  }

  .hp-blog-layout{
    flex-direction:column;
  }

  .hp-blog-side-group{
    grid-template-columns:1fr!important;
  }

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

  .footer-bottom{
    justify-content:center;
    text-align:center;
  }

  .footer-bottom-links{
    justify-content:center;
  }
}

@media(max-width:560px){
  :root{
    --container-pad:14px;
  }

  .nav-wrap{
    height:66px;
  }

  .mob-nav.open{
    max-height:calc(100vh - 66px);
  }

  .h1,
  .hero-h{
    font-size:clamp(30px,11vw,44px)!important;
    line-height:1.02;
  }

  .h2{
    font-size:clamp(24px,8vw,34px)!important;
  }

  .sub,
  .hero-p,
  .cta-p{
    font-size:14.5px!important;
    line-height:1.65;
  }

  .breadcrumb{
    width:100%;
    justify-content:center;
    flex-wrap:wrap;
    padding-inline:12px;
  }

  .page-hero-eyebrow,
  .hero-eyebrow,
  .tag{
    letter-spacing:1px;
  }

  .page-hero-eyebrow,
  .hero-eyebrow{
    width:100%;
    justify-content:center;
    text-align:center;
  }

  .btn{
    width:100%;
    justify-content:center;
    white-space:normal;
    padding-inline:16px;
  }

  .svc-grid,
  .svc-full-grid,
  .feature-grid,
  .testi-grid,
  .blog-grid,
  .veh-grid,
  .ind-grid,
  .ind-full-grid,
  .facility-grid,
  .region-grid,
  .coverage-grid,
  .route-grid,
  .lanes-grid,
  .dest-grid,
  .help-grid,
  .benefit-grid,
  .partner-type-grid,
  .why-grid-3,
  .book-steps,
  .htw-grid,
  .ipsteps,
  .air-opts,
  .sea-compare,
  .compare-grid,
  .values-grid,
  .team-vals,
  .accred-cards,
  .esg-grid,
  .fleet-grid,
  .stats-grid,
  .steps,
  .steps-3,
  .rf-steps,
  .mv-steps{
    grid-template-columns:1fr!important;
  }

  .sd-opt,
  .response-badge,
  .ch-phone-block,
  .do-card,
  .cc,
  .wp{
    align-items:flex-start;
  }

  .sd-opt{
    flex-direction:column;
    gap:10px;
  }

  .avail{
    align-self:flex-start;
  }

  .form-wrap,
  .full-form-wrap,
  .sd-form-panel,
  .track-box,
  .qcard,
  .ch-qcard,
  .article-body,
  .blog-article{
    padding:18px 14px!important;
  }

  .compare-table{
    min-width:560px;
  }

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

  .footer-top{
    text-align:left;
  }

  .back-to-top{
    right:14px;
    bottom:14px;
  }
}

@media(min-width:561px) and (max-width:768px){
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns:repeat(4,1fr)"],
  .sd-services-row{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(min-width:1440px){
  .section{
    padding-block:clamp(58px,4.6vw,96px);
  }

  .page-hero{
    min-height:clamp(360px,23vw,520px);
  }
}

@media(min-width:1920px){
  .h1,
  .hero-h{
    font-size:clamp(64px,4.2vw,92px);
  }

  .sub{
    font-size:16.5px;
  }
}

/* ============================================
   FULL-WIDTH SCREEN COVERAGE PASS
   Uses the full viewport on desktop/2K/4K while keeping text readable.
   ============================================ */
:root{
  --container-pad:clamp(14px,2.2vw,72px)!important;
  --section-y:clamp(30px,3.8vw,72px) !important;
  --wide-gap:clamp(18px,1.7vw,48px) !important;
  --card-min:clamp(250px,17vw,360px) !important;
}

.container,
.nav-wrap,
.cat-nav-inner{
  max-width:1600px!important;
  width:100%!important;
  margin-inline:auto;
  padding-inline:var(--container-pad)!important;
}

/* ============================================
   WIDE-ROW CONTAINER (.ct-container)
   The original template gives carousel/card-grid rows (services,
   sectors, etc.) their own wider container than body text uses:
   1320px at xl, 1645px at xxl (portfolio.scss narrows its own
   .ct-container to 1530px at xxxl to leave room for the section's
   decorative background block). The blanket .container rule above
   is !important and matches these elements too (they carry both
   classes: class="container ct-container"), which had been flattening
   every wide row down to the plain 1400px text width. Restoring the
   wider, section-appropriate value here - later in the cascade, so it
   wins the !important tie - fixes every .ct-container section at once
   instead of patching each one individually.
   ============================================ */
@media(min-width:1200px){
  .ct-container{
    max-width:1450px!important;
  }
}
@media(min-width:1400px){
  .ct-container{
    max-width:1850px!important;
  }
}
@media(min-width:1600px){
  .portfolio-sec .ct-container{
    max-width:1730px!important;
  }
}

/* ============================================
   COMPACT ICON-CARD GRIDS: OPT OUT OF THE WIDE CONTAINER
   Small icon + short-text cards (team values, ESG, accreditations,
   partner types, benefits, booking steps) look stretched and thin
   when they inherit the full 1600px container width - each card
   ends up 450px+ wide but only ~150-280px tall. Cap the grid itself
   narrower so these cards stay proportionate; everything else on
   the page still gets the wider container.
   ============================================ */
@media(min-width:1200px){
  .team-vals,
  .accred-cards,
  .esg-grid,
  .partner-type-grid,
  .benefit-grid,
  .book-steps{
    max-width:1200px!important;
    margin-inline:auto!important;
  }
}

/* ============================================
   FOOTER: OPT OUT OF THE WIDE CONTAINER
   The footer's own layout (subscribe bar, widget columns, bottom
   bar) was sized for the original 1400px container. Keep it there
   instead of stretching to the new wider site container.
   ============================================ */
footer.footer .container{
  max-width:1400px!important;
}

/* ============================================
   MORE SECTIONS THAT OPT OUT OF THE WIDE CONTAINER
   Testimonial/review section, the feature-card grid ("Built for
   Growing Brands" etc.) and the vehicle card grid all read better
   at their original width instead of stretching with the page.
   ============================================ */
.review-sec .container,
.pricing-sec .container{
  max-width:1400px!important;
}
.feature-grid,
.veh-grid{
  max-width:1400px!important;
  margin-inline:auto!important;
}

/* ============================================
   CHOOSE SECTION MEDIA: ONE REAL PHOTO PER PAGE
   Each page's choose-media uses a single real photo (the same one
   already used in that page's own hero banner, so it's guaranteed
   thematically correct) cropped to a consistent size. Uses a plain
   uniform rounded corner, matching the site's own convention for wide/
   landscape photos (product cards, industry cards, etc.) - the organic
   4-value asymmetric radius used for the testimonial photo only reads
   correctly on a tall portrait crop; on this wide landscape photo it
   looked lopsided/cut off on one side. The homepage keeps its own
   original, purpose-cropped two-image collage (choose-img.png/
   choose-img2.png) and is explicitly exempted below so it renders at
   its natural size.
   ============================================ */
.choose-sec .row{
  align-items:stretch!important;
}
.choose-sec .row > .col-lg-6:first-child{
  display:flex!important;
}
.choose-media{
  width:100%;
  min-height:420px;
}
.choose-media img.img-fluid{
  width:100%!important;
  height:100%!important;
  min-height:420px!important;
  object-fit:cover!important;
  border-radius:16px!important;
  display:block!important;
}
.choose-media img[src="choose-img.png"],
.choose-media img[src="choose-img2.png"]{
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  object-fit:unset!important;
  border-radius:0!important;
  display:inline-block!important;
}
@media(max-width:768px){
  .choose-media img.img-fluid:not([src="choose-img.png"]):not([src="choose-img2.png"]){height:320px!important}
}

.section-head{
  margin-bottom:clamp(20px,2.2vw,38px);
}
.sec-title span{color:var(--red)}

/* Process step connector: template used a plane icon between steps -
   swap for a delivery van, matching the logistics business. Sized and
   centered a little larger/lower so it sits squarely on the dashed
   connector line (process-line.png) running through the step circles. */
.process-card:after{
  height:36px!important;
  top:12px!important;
  background:url(../van-icon.svg) no-repeat 50%/contain!important;
}

.section-head.center{
  max-width:min(980px,100%);
  margin-inline:auto;
}

.page-hero-content{
  max-width:clamp(300px,calc(46vw - 90px),620px)!important;
}

.hero-h{
  max-width:min(980px,100%)!important;
}

.page-hero .h1{
  max-width:clamp(300px,calc(46vw - 90px),620px)!important;
}

.hero-p{
  max-width:min(760px,100%)!important;
}

.page-hero .sub,
.page-hero .sub.on-dark{
  max-width:clamp(300px,calc(46vw - 90px),620px)!important;
}

.hero-grid{
  gap:var(--wide-gap)!important;
  align-items:center!important;
  min-height:clamp(560px,42vw,860px);
  padding-block:clamp(34px,4vw,82px)!important;
}

.qcard-stage{
  width:100%;
}

.qcard,
.ch-qcard,
.form-wrap,
.full-form-wrap,
.sd-form-panel,
.track-box{
  max-width:none;
}

.svc-grid,
.svc-full-grid,
.feature-grid,
.testi-grid,
.blog-grid,
.veh-grid,
.ind-grid,
.ind-full-grid,
.facility-grid,
.region-grid,
.coverage-grid,
.route-grid,
.lanes-grid,
.dest-grid,
.help-grid,
.benefit-grid,
.partner-type-grid,
.why-grid-3,
.book-steps,
.htw-grid,
.ipsteps,
.air-opts,
.sea-compare,
.compare-grid,
.values-grid,
.team-vals,
.accred-cards,
.fleet-grid{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:var(--wide-gap)!important;
}

.svc-grid > *,
.svc-full-grid > *,
.feature-grid > *,
.testi-grid > *,
.blog-grid > *,
.veh-grid > *,
.ind-grid > *,
.ind-full-grid > *,
.facility-grid > *,
.region-grid > *,
.coverage-grid > *,
.route-grid > *,
.lanes-grid > *,
.dest-grid > *,
.help-grid > *,
.benefit-grid > *,
.partner-type-grid > *,
.why-grid-3 > *,
.book-steps > *,
.htw-grid > *,
.ipsteps > *,
.air-opts > *,
.sea-compare > *,
.compare-grid > *,
.values-grid > *,
.team-vals > *,
.accred-cards > *,
.fleet-grid > *{
  flex:1 1 var(--card-min);
}

.svc-grid-2,
.why-grid,
.sd-grid,
.contact-main-grid,
.contact-hero-inner,
.story-grid,
.rf-layout,
.sd-layout,
.nd-layout,
.ov-layout,
.sea-layout,
.af-layout,
.wh-layout,
.fulfilment-grid,
.blog-wrap,
.article-wrap,
.join-wrap,
.fleet-wrap,
.sme-wrap,
[style*="grid-template-columns:1fr 1fr"],
[style*="grid-template-columns:1fr 1.6fr"],
[style*="grid-template-columns:1.15fr 0.85fr"]{
  gap:var(--wide-gap)!important;
}

.svc-card,
.svc-full-card,
.feat,
.feat-card,
.testi,
.blog-card,
.veh-card,
.ind-full-card,
.htw-card,
.help-card,
.book-step,
.benefit-card,
.fac-card,
.region-card,
.pt-card,
.air-opt,
.sea-card,
.move-card,
.compare-card,
.route-item,
.dest-item,
.lane-item,
.val-card,
.tv-card,
.accred-card,
.ipstep{
  min-height:100%;
}

.blog-img,
.hp-blog-side .card-img,
.ifc-media,
.veh-img-wrap{
  aspect-ratio:16/10;
}

.hp-blog-hero .card-img,
.img-card,
.story-img,
.why-img{
  aspect-ratio:16/9;
}

.ind-card{
  min-height:clamp(235px,18vw,420px);
}

.veh-img-wrap{
  min-height:clamp(220px,17vw,380px);
}

.veh-img-wrap img{
  max-height:clamp(145px,10vw,260px);
}

.form-wrap,
.full-form-wrap,
.sd-form-panel,
.track-box,
.qcard,
.ch-qcard{
  padding:clamp(20px,2.1vw,46px)!important;
}

.fg input,
.fg select,
.fg textarea,
.qg input,
.qg select,
.qg textarea,
.qg2 input,
.qg2 select,
.sdp-fg input,
.sdp-fg select,
.track-input{
  font-size:clamp(14px,.85vw,17px);
}

.footer-grid{
  grid-template-columns:minmax(280px,1.6fr) repeat(3,minmax(180px,1fr));
  gap:var(--wide-gap)!important;
}

@media(min-width:1600px){
  :root{
    --container-pad:clamp(48px,3vw,96px);
    --card-min:clamp(285px,15vw,390px);
  }

  .section{
    padding-block:clamp(46px,3vw,84px);
  }

  .h1,
  .hero-h{
    font-size:clamp(72px,4.8vw,118px)!important;
  }

  .h3{
    font-size:clamp(28px,1.8vw,44px);
  }

  .sub,
  .hero-p,
  .svc-text,
  .feat-text,
  .testi-text,
  .blog-excerpt{
    font-size:clamp(16px,1vw,20px);
  }

  .svc-title,
  .feat-title,
  .blog-title,
  .veh-name{
    font-size:clamp(22px,1.4vw,34px);
  }

  .btn{
    min-height:clamp(46px,2.8vw,58px);
    padding:clamp(13px,.9vw,18px) clamp(24px,1.6vw,38px);
    font-size:clamp(14px,.85vw,18px);
  }

  .page-hero{
    min-height:clamp(460px,30vw,760px);
  }
}

@media(min-width:2560px){
  :root{
    --container-pad:clamp(72px,3.5vw,144px);
    --card-min:clamp(330px,12vw,460px);
  }

  .section{
    padding-block:clamp(56px,2.5vw,98px);
  }

  .hero-grid{
    min-height:clamp(720px,34vw,1080px);
  }

  .page-hero-content{
    max-width:min(1040px,44vw)!important;
  }

  .page-hero .sub,
  .hero-p,
  .page-hero .sub.on-dark{
    max-width:min(900px,100%)!important;
  }

  .form-wrap,
  .full-form-wrap,
  .sd-form-panel,
  .track-box,
  .qcard,
  .ch-qcard{
    padding:clamp(34px,1.7vw,62px)!important;
  }
}

@media(min-width:3400px){
  :root{
    --container-pad:clamp(112px,4vw,190px);
    --card-min:clamp(380px,10.5vw,520px);
  }

  .h1,
  .hero-h{
    font-size:clamp(96px,4vw,150px)!important;
  }

  .sub,
  .hero-p{
    font-size:clamp(20px,.75vw,26px)!important;
  }
}

@media(max-width:768px){
  :root{
    --container-pad:clamp(14px,4.6vw,22px) !important;
    --section-y:clamp(28px,7vw,48px) !important;
    --wide-gap:clamp(16px,5vw,24px) !important;
  }

  .hero-grid{
    min-height:auto;
    padding-block:clamp(28px,8vw,54px)!important;
  }

  .page-hero-content,
  .page-hero .h1,
  .page-hero .sub,
  .hero-p,
  .page-hero .sub.on-dark{
    max-width:100%!important;
  }
}

@media(max-width:380px){
  :root{
    --container-pad:12px !important;
    --section-y:26px !important;
    --wide-gap:14px !important;
  }

  .h1,
  .hero-h{
    font-size:clamp(28px,10vw,36px)!important;
  }

  .h2{
    font-size:clamp(22px,7.5vw,30px)!important;
  }

  .sub,
  .hero-p,
  .cta-p{
    font-size:14px!important;
  }

  .form-wrap,
  .full-form-wrap,
  .sd-form-panel,
  .track-box,
  .qcard,
  .ch-qcard{
    padding:16px 12px!important;
  }
}

/* Final mobile correction after full-width desktop rules */
@media(max-width:900px){
  .footer-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

.section-head{
  margin-bottom:clamp(16px,1.8vw,30px)!important;
}

.page-hero{
  padding-block:clamp(28px,3.2vw,58px)!important;
  min-height:clamp(260px,22vw,420px)!important;
}

.hero-grid{
  min-height:clamp(500px,36vw,760px)!important;
  padding-block:clamp(28px,3.2vw,64px)!important;
}

.page-hero .h1,
.hero-h{
  margin-bottom:clamp(14px,1.3vw,24px)!important;
}

.page-hero .sub,
.hero-p{
  margin-bottom:clamp(18px,1.8vw,30px)!important;
}

.breadcrumb,
.page-hero-eyebrow,
.hero-eyebrow,
.tag{
  margin-bottom:clamp(10px,1.2vw,20px)!important;
}

.svc-grid,
.svc-full-grid,
.feature-grid,
.testi-grid,
.blog-grid,
.veh-grid,
.ind-grid,
.ind-full-grid,
.facility-grid,
.region-grid,
.coverage-grid,
.route-grid,
.lanes-grid,
.dest-grid,
.help-grid,
.benefit-grid,
.partner-type-grid,
.why-grid-3,
.book-steps,
.htw-grid,
.ipsteps,
.air-opts,
.sea-compare,
.compare-grid,
.values-grid,
.team-vals,
.accred-cards,
.esg-grid,
.fleet-grid{
  gap:var(--wide-gap)!important;
}

.svc-full-card .sfc-head,
.svc-full-card .sfc-body,
.svc-full-card .sfc-footer,
.blog-body,
.blog-footer{
  padding-inline:clamp(18px,1.45vw,30px)!important;
}

.sfc-head{
  padding-top:clamp(20px,1.7vw,32px)!important;
  padding-bottom:clamp(16px,1.3vw,24px)!important;
}

.sfc-body{
  padding-block:clamp(16px,1.3vw,24px)!important;
}

.sfc-footer{
  padding-block:clamp(14px,1.1vw,20px)!important;
}

.form-wrap,
.full-form-wrap,
.sd-form-panel,
.track-box,
.qcard,
.ch-qcard{
  padding:clamp(10px,0.8vw,20px) clamp(18px,1.8vw,40px) clamp(18px,1.8vw,40px)!important;
}

.fg,
.qg,
.qg2{
  margin-bottom:clamp(10px,1vw,16px)!important;
}

@media(min-width:1600px){
  :root{
    --section-y:clamp(38px,2.45vw,68px) !important;
    --wide-gap:clamp(20px,1.25vw,38px) !important;
  }

  .page-hero{
    min-height:clamp(390px,24vw,620px)!important;
  }

  .hero-grid{
    min-height:clamp(540px,34vw,820px)!important;
  }
}

@media(min-width:2560px){
  :root{
    --section-y:clamp(46px,2vw,82px) !important;
    --wide-gap:clamp(26px,1.1vw,46px) !important;
  }

  .page-hero{
    min-height:clamp(500px,24vw,820px)!important;
  }

  .hero-grid{
    min-height:clamp(640px,30vw,980px)!important;
  }
}

@media(max-width:768px){
  :root{
    --section-y:clamp(24px,6vw,42px) !important;
    --wide-gap:clamp(14px,4vw,22px) !important;
  }

  .page-hero,
  .hero-grid{
    min-height:0!important;
  }

  .page-hero{
    padding-block:clamp(24px,7vw,42px)!important;
  }
}

@media(max-width:620px){
  .footer-grid,
  .footer-bottom,
  .footer-bottom-links,
  .cta-inner,
  .cta-btns,
  .page-hero-btns,
  .hero-btns{
    grid-template-columns:1fr!important;
  }

  .footer-grid{
    display:grid;
    gap:22px!important;
  }

  .footer-bottom,
  .footer-bottom-links{
    justify-content:center;
    text-align:center;
  }

  .footer-bottom-links{
    width:100%;
  }

  .footer-bottom-links a{
    min-width:0;
  }

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

  .cta-btns .btn,
  .page-hero-btns .btn,
  .hero-btns .btn{
    width:100%;
    justify-content:center;
  }
}

/* Large-screen scale lock: make 1600px-4K feel designed, not zoomed out */
@media(min-width:1600px){
  :root{
    --container-pad:clamp(64px,4vw,128px) !important;
    --section-y:clamp(48px,2.8vw,82px) !important;
    --wide-gap:clamp(28px,1.8vw,56px) !important;
    --card-min:clamp(390px,21vw,520px) !important;
  }

  body{
    font-size:clamp(16px,.95vw,19px);
  }

  .nav-wrap{
    /* min-height:clamp(82px,5vw,50px); */
  }

  .nav-logo img{
    height:clamp(64px,4vw,86px);
  }

  .nav-links>li>a{
    font-size:clamp(15px,.85vw,18px);
    padding:clamp(9px,.7vw,14px) clamp(13px,.9vw,20px);
  }

  .page-hero{
    min-height:clamp(520px,30vw,760px)!important;
    padding-block:clamp(46px,3vw,86px)!important;
  }

  .hero-grid{
    min-height:clamp(650px,38vw,980px)!important;
  }

  .h1,
  .hero-h,
  .page-hero .h1{
    font-size:clamp(78px,5.6vw,132px)!important;
    line-height:.94!important;
  }

  .h3,
  .form-title,
  .full-form-title{
    font-size:clamp(30px,2vw,46px)!important;
  }

  .sub,
  .hero-p,
  .page-hero .sub,
  .page-hero .sub.on-dark,
  .svc-text,
  .sfc-desc,
  .feat-text,
  .testi-text,
  .blog-excerpt,
  .wp-p,
  .sme-p{
    font-size:clamp(17px,1.05vw,22px)!important;
    line-height:1.65!important;
  }

  .svc-title,
  .sfc-title,
  .feat-title,
  .blog-title,
  .veh-name,
  .ind-name,
  .why-item h4{
    font-size:clamp(26px,1.7vw,42px)!important;
    line-height:1.08!important;
  }

  .svc-list li,
  .sfc-features li,
  .check-list li,
  .flist a,
  .fci span,
  .fci a,
  .blog-meta,
  .veh-model{
    font-size:clamp(15px,.9vw,19px)!important;
  }

  .btn,
  .form-btn,
  .qbtn,
  .qbtn2,
  .quote-btn,
  .quote-btn-spec{
    min-height:clamp(52px,3.2vw,70px)!important;
    padding:clamp(15px,1vw,22px) clamp(28px,1.9vw,46px)!important;
    font-size:clamp(15px,.95vw,20px)!important;
  }

  .svc-full-card .sfc-head,
  .svc-full-card .sfc-body,
  .svc-full-card .sfc-footer,
  .blog-body,
  .blog-footer{
    padding-inline:clamp(28px,2vw,48px)!important;
  }

  .sfc-head,
  .blog-body{
    padding-top:clamp(28px,2vw,48px)!important;
  }

  .sfc-body,
  .blog-footer{
    padding-block:clamp(22px,1.5vw,34px)!important;
  }

  .form-wrap,
  .full-form-wrap,
  .sd-form-panel,
  .track-box,
  .qcard,
  .ch-qcard{
    padding:clamp(30px,2.2vw,58px)!important;
  }

  .fg label,
  .qg label,
  .qg2 label{
    font-size:clamp(12px,.75vw,15px)!important;
  }

  .fg input,
  .fg select,
  .fg textarea,
  .qg input,
  .qg select,
  .qg textarea,
  .qg2 input,
  .qg2 select{
    min-height:clamp(30px,3vw,0px)!important;
    font-size:clamp(15px,.95vw,19px)!important;
    padding:clamp(10px,.9vw,0px) clamp(16px,1.2vw,26px)!important;
  }

  .veh-img-wrap{
    min-height:clamp(330px,20vw,520px)!important;
  }

  .veh-img-wrap img{
    max-height:clamp(220px,13vw,360px)!important;
  }

  .blog-img,
  .hp-blog-side .card-img,
  .ifc-media{
    min-height:clamp(260px,15vw,420px)!important;
  }

  .hp-blog-hero .card-img,
  .img-card,
  .story-img,
  .why-img{
    min-height:clamp(420px,24vw,680px)!important;
  }

  .ind-card{
    min-height:clamp(340px,20vw,540px)!important;
  }
}

@media(min-width:2560px){
  :root{
    --container-pad:clamp(96px,4.2vw,180px) !important;
    --section-y:clamp(64px,2.6vw,108px) !important;
    --wide-gap:clamp(36px,1.5vw,72px) !important;
    --card-min:clamp(520px,19vw,720px) !important;
  }

  body{
    font-size:clamp(19px,.72vw,24px);
  }

  .h1,
  .hero-h,
  .page-hero .h1{
    font-size:clamp(118px,4.9vw,180px)!important;
  }

  .sub,
  .hero-p,
  .page-hero .sub,
  .page-hero .sub.on-dark,
  .svc-text,
  .sfc-desc,
  .feat-text,
  .testi-text,
  .blog-excerpt{
    font-size:clamp(22px,.85vw,30px)!important;
  }

  .svc-title,
  .sfc-title,
  .feat-title,
  .blog-title,
  .veh-name,
  .ind-name{
    font-size:clamp(34px,1.35vw,54px)!important;
  }
}

@media(min-width:3400px){
  :root{
    --container-pad:clamp(140px,4vw,240px);
    --card-min:clamp(620px,17vw,860px);
  }

  .page-hero{
    min-height:clamp(760px,24vw,1040px)!important;
  }

  .hero-grid{
    min-height:clamp(900px,28vw,1180px)!important;
  }
}

/* Remove dead air between major sections */
main > .page-hero + .section,
main > .hero + .section,
main > .page-hero + section,
main > .hero + section{
  padding-top:clamp(24px,1.7vw,44px)!important;
}

.section + .section{
  padding-top:clamp(22px,1.8vw,46px)!important;
}

.section-head.center .tag,
.section-head.center .courier-badge,
.section-head.center .specialist-badge{
  margin-bottom:clamp(8px,.8vw,14px)!important;
}

@media(min-width:1600px){
  main > .page-hero + .section,
  main > .hero + .section,
  main > .page-hero + section,
  main > .hero + section{
    padding-top:clamp(28px,1.35vw,42px)!important;
  }

  .section + .section{
    padding-top:clamp(30px,1.5vw,54px)!important;
  }
}

@media(max-width:768px){
  main > .page-hero + .section,
  main > .hero + .section,
  main > .page-hero + section,
  main > .hero + section,
  .section + .section{
    padding-top:clamp(20px,5vw,34px)!important;
  }
}

/* Final large-screen correction: bigger content, less vertical dead space */
@media(min-width:1440px){
  :root{
    --container-pad:clamp(46px,3.2vw,96px) !important;
    --section-y:clamp(34px,2vw,58px) !important;
    --wide-gap:clamp(24px,1.35vw,44px) !important;
    --card-min:clamp(410px,22vw,560px) !important;
  }

  .section{
    padding-block:var(--section-y)!important;
  }

  .section-head{
    margin-bottom:clamp(14px,1.2vw,24px)!important;
  }

  .page-hero{
    min-height:clamp(380px,22vw,560px)!important;
    padding-block:clamp(26px,1.8vw,48px)!important;
  }

  .hero-grid{
    min-height:clamp(520px,30vw,760px)!important;
    padding-block:clamp(26px,2vw,52px)!important;
  }

  main > .page-hero + .section,
  main > .hero + .section,
  main > .page-hero + section,
  main > .hero + section{
    padding-top:clamp(18px,1vw,30px)!important;
  }

  .section + .section{
    padding-top:clamp(22px,1.2vw,38px)!important;
  }

  .h1,
  .hero-h,
  .page-hero .h1{
    font-size:clamp(82px,5.8vw,128px)!important;
    line-height:.92!important;
  }

  .sub,
  .hero-p,
  .page-hero .sub,
  .page-hero .sub.on-dark{
    font-size:clamp(20px,1.2vw,26px)!important;
    line-height:1.55!important;
  }

  .svc-text,
  .sfc-desc,
  .feat-text,
  .testi-text,
  .blog-excerpt,
  .wp-p,
  .sme-p,
  .why-item p{
    font-size:clamp(18px,1vw,23px)!important;
    line-height:1.58!important;
  }

  .svc-title,
  .sfc-title,
  .feat-title,
  .blog-title,
  .veh-name,
  .ind-name,
  .why-item h4{
    font-size:clamp(30px,1.85vw,46px)!important;
  }

  .svc-list li,
  .sfc-features li,
  .check-list li,
  .footer-brand p,
  .flist a,
  .fci span,
  .fci a{
    font-size:clamp(16px,.9vw,20px)!important;
    line-height:1.55!important;
  }

  .svc-full-card .sfc-head,
  .svc-full-card .sfc-body,
  .svc-full-card .sfc-footer,
  .blog-body,
  .blog-footer{
    padding-inline:clamp(30px,1.7vw,46px)!important;
  }

  .sfc-head{
    padding-top:clamp(24px,1.4vw,36px)!important;
    padding-bottom:clamp(16px,1vw,24px)!important;
  }

  .sfc-body{
    padding-block:clamp(16px,1vw,26px)!important;
  }

  .form-wrap,
  .full-form-wrap,
  .sd-form-panel,
  .track-box,
  .qcard,
  .ch-qcard{
    padding:clamp(28px,1.8vw,52px)!important;
  }

  .blog-img,
  .hp-blog-side .card-img,
  .ifc-media{
    min-height:clamp(300px,16vw,430px)!important;
  }

  .hp-blog-hero .card-img,
  .img-card,
  .story-img,
  .why-img{
    min-height:clamp(420px,22vw,620px)!important;
  }

  .veh-img-wrap{
    min-height:clamp(330px,18vw,500px)!important;
  }

  .ind-card{
    min-height:clamp(330px,18vw,520px)!important;
  }
}

@media(min-width:1920px){
  :root{
    --container-pad:clamp(64px,3.4vw,128px) !important;
    --section-y:clamp(38px,1.9vw,68px) !important;
    --wide-gap:clamp(30px,1.4vw,56px) !important;
    --card-min:clamp(470px,21vw,660px) !important;
  }

  .page-hero{
    min-height:clamp(420px,20vw,640px)!important;
  }

  .h1,
  .hero-h,
  .page-hero .h1{
    font-size:clamp(104px,5.2vw,152px)!important;
  }

}

@media(min-width:2560px){
  :root{
    --container-pad:clamp(90px,3.8vw,176px) !important;
    --section-y:clamp(46px,1.8vw,82px) !important;
    --wide-gap:clamp(38px,1.35vw,72px) !important;
    --card-min:clamp(640px,22vw,860px) !important;
  }

  .page-hero{
    min-height:clamp(520px,18vw,760px)!important;
  }

  .hero-grid{
    min-height:clamp(680px,25vw,980px)!important;
  }
}

@media(min-width:3400px){
  :root{
    --container-pad:clamp(120px,3.6vw,220px) !important;
    --section-y:clamp(58px,1.6vw,96px) !important;
    --card-min:clamp(760px,20vw,980px) !important;
  }

  .page-hero{
    min-height:clamp(600px,17vw,860px)!important;
  }

  .hero-grid{
    min-height:clamp(760px,23vw,1060px)!important;
  }
}

/* Final content-only scale pass: larger readable content on wide screens without inflating images */
@media(min-width:1440px){
  :root{
    --container-pad:clamp(50px,3.4vw,110px) !important;
    --section-y:clamp(0px,1.45vw,44px) !important;
    --wide-gap:clamp(20px,1.2vw,36px) !important;
    --card-min:clamp(430px,23vw,620px) !important;
  }

  html{
    font-size:clamp(16px,.92vw,20px);
  }

  body{
    font-size:clamp(17px,.95vw,20px);
  }

  .section,
  .sd-wrap.section{
    padding-block:var(--section-y)!important;
  }

  .section-head{
    margin-bottom:clamp(12px,.9vw,20px)!important;
  }

  main > .page-hero + .section,
  main > .hero + .section,
  main > .sd-hero + .section,
  main > .page-hero + section,
  main > .hero + section,
  main > .sd-hero + section,
  .section + .section{
    padding-top:clamp(16px,.9vw,30px)!important;
  }

  .page-hero,
  .sd-hero{
    min-height:auto!important;
    padding-block:clamp(28px,1.7vw,46px)!important;
  }

  .hero-grid{
    min-height:clamp(500px,28vw,720px)!important;
    padding-block:clamp(26px,1.8vw,46px)!important;
  }

  .h1,
  .hero-h,
  .page-hero .h1{
    font-size:clamp(88px,4.9vw,136px)!important;
    line-height:.92!important;
  }

  .sub,
  .hero-p,
  .page-hero .sub,
  .page-hero .sub.on-dark,
  .sd-wrap .sub{
    font-size:clamp(20px,1.08vw,27px)!important;
    line-height:1.5!important;
  }

  .svc-text,
  .sfc-desc,
  .feat-text,
  .testi-text,
  .blog-excerpt,
  .wp-p,
  .sme-p,
  .why-item p,
  .cov-time,
  .sd-opt-time,
  .sd-opt-detail,
  .check-list li,
  .svc-list li,
  .sfc-features li,
  .footer-brand p,
  .flist a,
  .fci span,
  .fci a{
    font-size:clamp(18px,1vw,23px)!important;
    line-height:1.55!important;
  }

  .svc-title,
  .sfc-title,
  .feat-title,
  .blog-title,
  .veh-name,
  .ind-name,
  .why-item h4,
  .cov-city,
  .wp-t,
  .sme-t,
  .sd-opt-name{
    font-size:clamp(28px,1.55vw,42px)!important;
    line-height:1.08!important;
  }

  .tag,
  .sd-badge,
  .sd-live,
  .courier-badge,
  .specialist-badge{
    font-size:clamp(12px,.7vw,16px)!important;
    line-height:1.1!important;
  }

  .btn,
  .btn-lg,
  button,
  input,
  select,
  textarea,
  label{
    font-size:clamp(16px,.9vw,20px)!important;
  }

  .btn,
  .btn-lg{
    min-height:clamp(50px,2.7vw,64px)!important;
    padding:clamp(14px,.85vw,0px) clamp(22px,1.35vw,34px)!important;
  }

  .sd-grid{
    grid-template-columns:minmax(0,1fr) minmax(520px,1.35fr)!important;
    gap:clamp(28px,2.2vw,56px)!important;
    align-items:center!important;
  }

  .sd-wrap .check-list{
    margin-block:clamp(16px,.9vw,24px)!important;
  }

  .sd-wrap .check-list li{
    margin-bottom:clamp(10px,.65vw,16px)!important;
  }

  .sd-opts{
    gap:0!important;
  }

  .sd-opt{
    padding-block:clamp(16px,.9vw,24px)!important;
    gap:clamp(14px,.9vw,22px)!important;
  }

  .sd-opt-l{
    gap:clamp(12px,.8vw,18px)!important;
  }

  .avail,
  .sd-avail,
  .sd-eta{
    font-size:clamp(15px,.85vw,19px)!important;
    line-height:1.25!important;
    white-space:nowrap;
  }

  .stats-elevated{
    padding-block:clamp(22px,1.35vw,42px)!important;
  }

  .stat-num{
    font-size:clamp(50px,2.9vw,82px)!important;
  }

  .stat-label{
    font-size:clamp(16px,.9vw,20px)!important;
  }

  .svc-full-card .sfc-head,
  .svc-full-card .sfc-body,
  .svc-full-card .sfc-footer,
  .blog-body,
  .blog-footer{
    padding:clamp(24px,1.45vw,42px)!important;
  }

  .form-wrap,
  .full-form-wrap,
  .sd-form-panel,
  .track-box,
  .qcard,
  .ch-qcard{
    padding:clamp(12px,0.9vw,20px) clamp(24px,1.45vw,42px) clamp(24px,1.45vw,42px)!important;
  }

  .blog-img,
  .hp-blog-side .card-img,
  .ifc-media{
    min-height:0!important;
    height:auto!important;
    aspect-ratio:16/10!important;
  }

  .hp-blog-hero .card-img,
  .img-card,
  .story-img,
  .why-img{
    min-height:0!important;
    height:auto!important;
    aspect-ratio:16/9!important;
  }

  .veh-img-wrap{
    min-height:clamp(220px,12vw,300px)!important;
  }

  .veh-img-wrap img{
    max-height:clamp(145px,8vw,220px)!important;
  }

  .ind-card{
    min-height:clamp(240px,13vw,340px)!important;
  }
}

@media(min-width:1920px){
  .h1,
  .hero-h,
  .page-hero .h1{
    font-size:clamp(110px,4.7vw,158px)!important;
  }

  .sub,
  .hero-p,
  .page-hero .sub,
  .page-hero .sub.on-dark,
  .sd-wrap .sub{
    font-size:clamp(22px,1vw,30px)!important;
  }

  .svc-text,
  .sfc-desc,
  .feat-text,
  .testi-text,
  .blog-excerpt,
  .wp-p,
  .sme-p,
  .why-item p,
  .cov-time,
  .sd-opt-time,
  .sd-opt-detail,
  .check-list li{
    font-size:clamp(19px,.92vw,25px)!important;
  }

  .svc-title,
  .sfc-title,
  .feat-title,
  .blog-title,
  .veh-name,
  .ind-name,
  .why-item h4,
  .cov-city,
  .wp-t,
  .sme-t,
  .sd-opt-name{
    font-size:clamp(32px,1.45vw,48px)!important;
  }
}

@media(min-width:2560px){
  :root{
    --container-pad:clamp(92px,3.3vw,168px) !important;
    --section-y:clamp(30px,1.25vw,58px) !important;
    --wide-gap:clamp(28px,1.05vw,48px) !important;
    --card-min:clamp(560px,18vw,760px) !important;
  }

  .page-hero,
  .sd-hero{
    padding-block:clamp(34px,1.25vw,58px)!important;
  }

  .h1,
  .hero-h,
  .page-hero .h1{
    font-size:clamp(132px,4.15vw,178px)!important;
  }

  .sub,
  .hero-p,
  .page-hero .sub,
  .page-hero .sub.on-dark,
  .sd-wrap .sub{
    font-size:clamp(25px,.92vw,34px)!important;
  }
}

@media(min-width:3400px){
  :root{
    --container-pad:clamp(126px,3.2vw,220px) !important;
    --section-y:clamp(36px,1vw,68px) !important;
    --card-min:clamp(660px,17vw,900px) !important;
  }

  .hero-grid{
    min-height:clamp(660px,19vw,880px)!important;
  }
}

/* Wide screens need wider text measure, not oversized imagery */
@media(min-width:1440px){
  .sub,
  .hero-p{
    max-width:clamp(680px,38vw,980px)!important;
  }

  .section-head.center .sub,
  .sub.center{
    max-width:clamp(760px,42vw,1120px)!important;
  }

  .page-hero .sub,
  .page-hero .sub.on-dark{
    max-width:clamp(760px,40vw,1080px)!important;
  }

  .sd-wrap .sub{
    max-width:clamp(620px,32vw,920px)!important;
  }

  .sd-wrap > .container{
    width:100%!important;
  }
}

@media(min-width:2560px){
  .sub,
  .hero-p{
    max-width:clamp(820px,34vw,1220px)!important;
  }

  .section-head.center .sub,
  .sub.center{
    max-width:clamp(900px,38vw,1400px)!important;
  }

  .page-hero .sub,
  .page-hero .sub.on-dark{
    max-width:clamp(920px,36vw,1320px)!important;
  }

  .sd-wrap .sub{
    max-width:clamp(780px,30vw,1180px)!important;
  }
}

/* Final small-screen typography correction: shrink content to fit the viewport */
@media(max-width:768px){
  html{
    font-size:15px;
  }

  body{
    font-size:14px;
  }

  .container,
  .nav-wrap{
    padding-inline:clamp(12px,4vw,22px)!important;
  }

  .section,
  .sd-wrap.section,
  .stats-elevated{
    padding-block:clamp(20px,5vw,34px)!important;
  }

  .section-head{
    margin-bottom:clamp(12px,4vw,20px)!important;
  }

  .h1,
  .hero-h,
  .page-hero .h1{
    font-size:clamp(34px,8vw,52px)!important;
    line-height:1!important;
    letter-spacing:0!important;
  }

  .h2,
  .sd-wrap .h2{
    font-size:clamp(28px,6.5vw,42px)!important;
    line-height:1.04!important;
    letter-spacing:0!important;
  }

  .h3{
    font-size:clamp(20px,5vw,28px)!important;
  }

  .sub,
  .hero-p,
  .page-hero .sub,
  .page-hero .sub.on-dark,
  .sd-wrap .sub,
  .cta-p{
    font-size:clamp(14px,3.3vw,16px)!important;
    line-height:1.55!important;
    max-width:100%!important;
  }

  .svc-text,
  .sfc-desc,
  .feat-text,
  .testi-text,
  .blog-excerpt,
  .wp-p,
  .sme-p,
  .why-item p,
  .cov-time,
  .sd-opt-time,
  .sd-opt-detail,
  .check-list li,
  .svc-list li,
  .sfc-features li,
  .footer-brand p,
  .flist a,
  .fci span,
  .fci a{
    font-size:clamp(13.5px,3.2vw,15px)!important;
    line-height:1.5!important;
  }

  .svc-title,
  .sfc-title,
  .feat-title,
  .blog-title,
  .veh-name,
  .ind-name,
  .why-item h4,
  .cov-city,
  .wp-t,
  .sme-t,
  .sd-opt-name{
    font-size:clamp(17px,4.3vw,22px)!important;
    line-height:1.18!important;
  }

  .tag,
  .sd-badge,
  .sd-live,
  .courier-badge,
  .specialist-badge,
  .page-hero-eyebrow,
  .hero-eyebrow{
    font-size:clamp(10px,2.6vw,12px)!important;
    letter-spacing:.7px!important;
    line-height:1.2!important;
  }

  .btn,
  .btn-lg,
  button,
  input,
  select,
  textarea,
  label{
    font-size:clamp(13.5px,3.3vw,15px)!important;
  }

  .btn,
  .btn-lg{
    min-height:44px!important;
    padding:clamp(10px,3vw,13px) clamp(14px,4vw,18px)!important;
    border-radius:6px!important;
  }

  .page-hero{
    padding-block:clamp(20px,5.5vw,34px)!important;
  }

  .hero-grid{
    padding-block:clamp(22px,6vw,40px)!important;
  }

  .sd-grid{
    grid-template-columns:1fr!important;
    gap:clamp(18px,5vw,28px)!important;
  }

  .sd-wrap .check-list{
    margin-block:clamp(12px,3vw,18px)!important;
  }

  .sd-wrap .check-list li{
    margin-bottom:clamp(8px,2.4vw,12px)!important;
  }

  .sd-opt{
    padding-block:clamp(12px,3vw,16px)!important;
    gap:8px!important;
  }

  .sd-opt-l{
    gap:10px!important;
  }

  .avail,
  .sd-avail,
  .sd-eta{
    font-size:clamp(11.5px,2.9vw,13px)!important;
    line-height:1.25!important;
    white-space:normal!important;
  }

  .stat-num{
    font-size:clamp(32px,8vw,48px)!important;
  }

  .stat-label{
    font-size:clamp(12px,3vw,14px)!important;
  }

  .svc-full-card .sfc-head,
  .svc-full-card .sfc-body,
  .svc-full-card .sfc-footer,
  .blog-body,
  .blog-footer,
  .form-wrap,
  .full-form-wrap,
  .sd-form-panel,
  .track-box,
  .qcard,
  .ch-qcard,
  .article-body,
  .blog-article{
    padding:clamp(16px,4vw,22px)!important;
  }
}

@media(max-width:480px){
  html{
    font-size:14px;
  }

  .section,
  .sd-wrap.section,
  .stats-elevated{
    padding-block:clamp(18px,5vw,28px)!important;
  }

  .h1,
  .hero-h,
  .page-hero .h1{
    font-size:clamp(30px,8.8vw,40px)!important;
  }

  .h2,
  .sd-wrap .h2{
    font-size:clamp(24px,7.2vw,32px)!important;
  }

  .sub,
  .hero-p,
  .page-hero .sub,
  .page-hero .sub.on-dark,
  .sd-wrap .sub,
  .cta-p{
    font-size:clamp(13.5px,3.7vw,14.5px)!important;
    line-height:1.5!important;
  }

  .svc-text,
  .sfc-desc,
  .feat-text,
  .testi-text,
  .blog-excerpt,
  .wp-p,
  .sme-p,
  .why-item p,
  .cov-time,
  .sd-opt-time,
  .sd-opt-detail,
  .check-list li,
  .svc-list li,
  .sfc-features li{
    font-size:clamp(13px,3.6vw,14px)!important;
  }

  .svc-title,
  .sfc-title,
  .feat-title,
  .blog-title,
  .veh-name,
  .ind-name,
  .why-item h4,
  .cov-city,
  .wp-t,
  .sme-t,
  .sd-opt-name{
    font-size:clamp(16px,4.5vw,19px)!important;
  }

  .sd-badge,
  .tag,
  .page-hero-eyebrow,
  .hero-eyebrow{
    font-size:10px!important;
  }

  .sd-opt{
    flex-direction:column!important;
    align-items:flex-start!important;
  }
}

@media(max-width:360px){
  .container,
  .nav-wrap{
    padding-inline:12px!important;
  }

  .h1,
  .hero-h,
  .page-hero .h1{
    font-size:clamp(28px,8.6vw,34px)!important;
  }

  .h2,
  .sd-wrap .h2{
    font-size:clamp(23px,7vw,28px)!important;
  }

  .sub,
  .hero-p,
  .page-hero .sub,
  .page-hero .sub.on-dark,
  .sd-wrap .sub,
  .cta-p{
    font-size:13px!important;
  }

  .check-list li,
  .sd-opt-time,
  .sd-opt-detail,
  .svc-text,
  .sfc-desc,
  .feat-text,
  .testi-text,
  .blog-excerpt{
    font-size:12.75px!important;
  }

  .btn,
  .btn-lg,
  button,
  input,
  select,
  textarea,
  label{
    font-size:13px!important;
  }
}

/* Home hero containment on very small screens */
@media(max-width:768px){
  .hero{
    overflow:hidden!important;
  }

  .hero-grid{
    width:100%!important;
    max-width:100%!important;
    justify-items:center!important;
  }

  .hero-grid > *,
  .hero-body,
  .hero-content,
  .hero-h,
  .hero-p{
    min-width:0!important;
    max-width:100%!important;
  }

  .hero-h{
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    text-wrap:balance;
    letter-spacing:0!important;
  }
}

@media(max-width:480px){
  .hero-body{
    padding-block:clamp(28px,8vw,42px)!important;
  }

  .hero-grid{
    padding-block:clamp(18px,5vw,28px)!important;
    gap:clamp(16px,5vw,24px)!important;
  }

  .hero-h{
    font-size:clamp(24px,8vw,32px)!important;
    line-height:1.02!important;
    margin-bottom:clamp(12px,4vw,18px)!important;
  }

  .hero-p{
    font-size:clamp(12.5px,3.8vw,14px)!important;
    line-height:1.45!important;
    margin-bottom:clamp(14px,4vw,20px)!important;
  }

  .hero-eyebrow{
    max-width:100%!important;
    justify-content:center!important;
    white-space:normal!important;
    padding:7px 12px!important;
  }

  .hero-trust,
  .hero-stats{
    width:100%!important;
    max-width:100%!important;
    gap:10px!important;
  }

  .trust-item{
    font-size:12.5px!important;
    min-width:0!important;
  }
}

@media(max-width:360px){
  .hero-h{
    font-size:clamp(22px,7.5vw,28px)!important;
  }

  .hero-p{
    font-size:12.5px!important;
  }
}

/* ============================================
   SERVICES PAGE REDESIGN — ENHANCED STYLING
   ============================================ */

/* Services hero enhanced */
.services-hero-new {
  min-height:380px;
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#f8fbff 0%,#eef6fb 100%);
}

.services-hero-new::before {
  content:'';
  position:absolute;
  top:0;
  right:-100px;
  width:600px;
  height:100%;
  background:radial-gradient(circle,rgba(200,16,46,.08) 0%,transparent 70%);
  z-index:0;
}

.services-hero-new .page-hero-content {
  position:relative;
  z-index:10;
}

/* Enhanced service cards */
.svc-full-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
  gap:28px;
  margin-top:36px;
}

.svc-full-card {
  background:#fff;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 4px 20px rgba(26,52,100,.08);
  transition:all .35s cubic-bezier(.16,1,.3,1);
  border:1px solid #e9f0f7;
  display:flex;
  flex-direction:column;
  position:relative;
}

.svc-full-card::before {
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  background:linear-gradient(90deg,var(--red),var(--red2));
  opacity:0.8;
}

.svc-full-card:hover {
  transform:translateY(-12px);
  box-shadow:0 20px 50px rgba(26,52,100,.15);
  border-color:rgba(200,16,46,.2);
}

.sfc-head {
  padding:32px 28px 24px;
  border-bottom:1px solid #f0f4fa;
  background:linear-gradient(135deg,#fafbfc 0%,#f5f9fd 100%);
}

.sfc-head:hover {
  background:linear-gradient(135deg,#f5f9fd 0%,#f0f8fc 100%);
}

.sfc-icon {
  width:56px;
  height:56px;
  border-radius:12px;
  background:linear-gradient(135deg,rgba(200,16,46,.08) 0%,rgba(200,16,46,.04) 100%);
  border:1.5px solid rgba(200,16,46,.15);
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:16px;
  transition:all .3s ease;
}

.svc-full-card:hover .sfc-icon {
  background:linear-gradient(135deg,var(--red) 0%,var(--red2) 100%);
  border-color:var(--red);
  transform:scale(1.1) rotate(5deg);
}

.sfc-icon i {
  font-size:28px;
  color:var(--red);
  transition:color .3s ease;
}

.svc-full-card:hover .sfc-icon i {
  color:#fff;
}

.sfc-title {
  font-family:'Rethink Sans',sans-serif;
  font-size:22px;
  font-weight:600;
  color:var(--navy);
  margin-bottom:10px;
  letter-spacing:-.2px;
}

.sfc-desc {
  font-size:14px;
  color:var(--grey);
  line-height:1.68;
}

.sfc-body {
  padding:28px;
  flex:1;
  display:flex;
  flex-direction:column;
}

.sfc-features {
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:12px;
  flex:1;
}

.sfc-features li {
  display:flex;
  align-items:flex-start;
  gap:11px;
  font-size:13.5px;
  color:#475569;
  line-height:1.55;
  transition:color .2s ease;
}

.sfc-features li i {
  color:var(--red);
  font-size:12px;
  margin-top:2px;
  flex-shrink:0;
  opacity:.8;
}

.svc-full-card:hover .sfc-features li {
  color:#334155;
}

.sfc-footer {
  padding:18px 28px 24px;
  border-top:1px solid #f0f4fa;
  display:flex;
  flex-direction:column;
  gap:12px;
  background:linear-gradient(135deg,#fafbfc 0%,#f5f9fd 100%);
}

.sfc-footer a {
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13.5px;
  font-weight:700;
  text-decoration:none;
  transition:all .25s ease;
  border-radius:8px;
  padding:10px 14px;
}

.sfc-footer a:not(.quote-btn):not(.quote-btn-spec) {
  color:var(--navy);
}

.sfc-footer a:not(.quote-btn):not(.quote-btn-spec):hover {
  color:var(--red);
  background:rgba(200,16,46,.06);
  gap:12px;
}

.quote-btn {
  background:linear-gradient(135deg,var(--red) 0%,var(--red2) 100%);
  color:#fff !important;
  padding:13px 0;
  border-radius:10px;
  font-size:14px;
  font-weight:700;
  text-decoration:none;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  transition:all .3s ease;
  box-shadow:0 8px 18px rgba(200,16,46,.2);
}

.quote-btn:hover {
  transform:translateY(-3px);
  box-shadow:0 14px 28px rgba(200,16,46,.3);
}

.quote-btn-spec {
  background:linear-gradient(135deg,var(--navy) 0%,#26394d 100%);
  color:#fff !important;
  padding:13px 0;
  border-radius:10px;
  font-size:14px;
  font-weight:700;
  text-decoration:none;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  transition:all .3s ease;
  box-shadow:0 8px 18px rgba(26,52,100,.2);
}

.quote-btn-spec:hover {
  transform:translateY(-3px);
  box-shadow:0 14px 28px rgba(26,52,100,.3);
}

/* Courier badge */
.courier-badge {
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:rgba(200,16,46,.08);
  border:1.5px solid rgba(200,16,46,.2);
  color:var(--red);
  padding:8px 16px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.5px;
  margin-bottom:14px;
  text-transform:uppercase;
}

.specialist-badge {
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:rgba(26,52,100,.08);
  border:1.5px solid rgba(26,52,100,.2);
  color:var(--navy);
  padding:8px 16px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.5px;
  margin-bottom:14px;
  text-transform:uppercase;
}

/* Section styling */
#courier-services {
  border-top:none;
  background:#fff;
  padding:48px 0 56px;
}

#specialist-services {
  border-top:none;
  background:linear-gradient(180deg,#f8fbff 0%,#eef6fb 100%);
  padding:48px 0 56px;
}

.section-head {
  margin-bottom:36px;
}

.section-head.center {
  text-align:center;
}

.section-head .h2 {
  margin-bottom:12px;
}

.section-head .sub {
  font-size:15px;
  line-height:1.72;
  max-width:620px;
}

/* CTA Strip */
.courier-cta-strip {
  background:linear-gradient(135deg,#fff0f2 0%,#f8fbff 100%);
  border:1.5px solid rgba(200,16,46,.15);
  border-radius:14px;
  padding:28px 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
  margin-top:44px;
  transition:all .3s ease;
}

.courier-cta-strip:hover {
  border-color:rgba(200,16,46,.25);
  background:linear-gradient(135deg,#fbe7ea 0%,#f5f9fd 100%);
  box-shadow:0 12px 32px rgba(200,16,46,.12);
}

/* Specialist CTA band */
.spec-cta-band {
  background:linear-gradient(135deg,#17355f 0%,#26394d 100%);
  border-radius:16px;
  padding:40px 42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  flex-wrap:wrap;
  margin-top:48px;
  box-shadow:0 16px 42px rgba(26,52,100,.2);
  position:relative;
  overflow:hidden;
}

.spec-cta-band::before {
  content:'';
  position:absolute;
  top:-50%;
  right:-20%;
  width:400px;
  height:400px;
  background:radial-gradient(circle,rgba(200,16,46,.08) 0%,transparent 70%);
  z-index:0;
}

.spec-cta-text {
  position:relative;
  z-index:1;
}

.spec-cta-text h3 {
  font-family:'Rethink Sans',sans-serif;
  font-size:32px;
  font-weight:600;
  color:#fff;
  margin-bottom:8px;
  letter-spacing:-.3px;
}

.spec-cta-text p {
  font-size:15px;
  color:rgba(255,255,255,.8);
  line-height:1.68;
  max-width:520px;
}

/* Why Choose Grid */
.why-grid-3 {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:28px;
  margin-top:32px;
}

.why-item {
  background:#fff;
  border-radius:12px;
  padding:32px 28px;
  text-align:center;
  box-shadow:0 4px 16px rgba(26,52,100,.06);
  border:1px solid #e9f0f7;
  transition:all .35s cubic-bezier(.16,1,.3,1);
}

.why-item:hover {
  transform:translateY(-8px);
  box-shadow:0 16px 40px rgba(26,52,100,.12);
  border-color:rgba(200,16,46,.15);
}

.why-item-icon {
  width:64px;
  height:64px;
  margin:0 auto 20px;
  border-radius:12px;
  background:linear-gradient(135deg,rgba(200,16,46,.08) 0%,rgba(200,16,46,.04) 100%);
  border:1.5px solid rgba(200,16,46,.15);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all .3s ease;
}

.why-item:hover .why-item-icon {
  background:linear-gradient(135deg,var(--red) 0%,var(--red2) 100%);
  border-color:var(--red);
  transform:scale(1.12);
}

.why-item-icon i {
  font-size:32px;
  color:var(--red);
  transition:color .3s ease;
}

.why-item:hover .why-item-icon i {
  color:#fff;
}

.why-item h4 {
  font-family:'Rethink Sans',sans-serif;
  font-size:20px;
  font-weight:600;
  color:var(--navy);
  margin-bottom:12px;
  letter-spacing:-.1px;
}

.why-item p {
  font-size:13.5px;
  color:var(--grey);
  line-height:1.72;
}

/* Responsive */
@media(max-width:1024px) {
  .svc-full-grid {
    grid-template-columns:repeat(2,1fr);
  }
  
  .why-grid-3 {
    grid-template-columns:repeat(2,1fr);
  }
  
  .spec-cta-band {
    flex-direction:column;
    align-items:flex-start;
    text-align:left;
  }
}

@media(max-width:768px) {
  .svc-full-grid {
    grid-template-columns:1fr;
    gap:22px;
  }
  
  .why-grid-3 {
    grid-template-columns:1fr;
  }
  
  .courier-cta-strip {
    flex-direction:column;
    align-items:flex-start;
    text-align:left;
  }
  
  .spec-cta-band {
    padding:28px 24px;
  }
  
  .services-hero-new {
    min-height:320px;
  }
}

@media(max-width:640px) {
  .svc-full-grid {
    gap:18px;
  }
  
  .sfc-head {
    padding:24px 20px 18px;
  }
  
  .sfc-body {
    padding:20px;
  }
  
  .sfc-footer {
    padding:14px 20px 18px;
  }
  
  .sfc-title {
    font-size:19px;
  }
  
  .sfc-desc {
    font-size:13px;
  }
  
  .why-item {
    padding:24px 20px;
  }
  
  .spec-cta-text h3 {
    font-size:26px;
  }
  
  .spec-cta-text p {
    font-size:14px;
  }
}

/* Client request: constrained header bar — ensure logo and quote button stay within view */
.nav-wrap{
  max-width:1400px!important;
  margin-inline:auto!important;
  padding-inline:40px!important;
  height:auto!important;
  padding-block:2px!important;
}
@media(max-width:768px){
  .nav-wrap{
    padding-inline:20px!important;
    padding-block:6px!important;
  }
}

/* Service cards (Complete Logistics Solutions etc.): keep equal-height,
   aligned rows. A site-wide rule turns .svc-grid into a wrapping flexbox,
   but flex "stretch" only equalizes height within a single row — with
   9 cards wrapping across rows that leaves them visibly uneven. Grid
   stretches every row (however many there are) to match automatically. */
.svc-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.svc-grid > *{
  flex:none!important;
  width:auto!important;
}
@media(max-width:1024px){
  .svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:600px){
  .svc-grid{grid-template-columns:minmax(0,1fr)!important}
}

/* Client request: remove hover animation from the service cards —
   kill lift, icon rotate/scale, sweeping underline and gap-grow motion */
.svc-card,
.svc-card *,
.svc-elevated .svc-card,
.svc-elevated .svc-card *{
  transition:none!important;
}
.svc-card:hover,
.svc-elevated .svc-card:hover,
.svc-card:hover .svc-icon,
.svc-elevated .svc-card:hover .svc-icon{
  transform:none!important;
}

/* Client request: equal-height, aligned card rows sitewide. A shared
   rule earlier in this file turns every one of these grids into a
   wrapping flexbox, but flex "stretch" only equalizes height within a
   single row — once a grid wraps to more than one row, cards drift out
   of alignment. Restoring `display:grid` lets each grid's own column
   count (already defined per page, including its own responsive
   breakpoints) stretch every row evenly, however many rows there are. */
.feature-grid,
.testi-grid,
.blog-grid,
.veh-grid,
.ind-grid,
.ind-full-grid,
.facility-grid,
.region-grid,
.coverage-grid,
.route-grid,
.lanes-grid,
.dest-grid,
.help-grid,
.benefit-grid,
.partner-type-grid,
.why-grid-3,
.book-steps,
.htw-grid,
.ipsteps,
.air-opts,
.sea-compare,
.compare-grid,
.values-grid,
.team-vals,
.accred-cards,
.fleet-grid{
  display:grid!important;
}
.feature-grid > *,
.testi-grid > *,
.blog-grid > *,
.veh-grid > *,
.ind-grid > *,
.ind-full-grid > *,
.facility-grid > *,
.region-grid > *,
.coverage-grid > *,
.route-grid > *,
.lanes-grid > *,
.dest-grid > *,
.help-grid > *,
.benefit-grid > *,
.partner-type-grid > *,
.why-grid-3 > *,
.book-steps > *,
.htw-grid > *,
.ipsteps > *,
.air-opts > *,
.sea-compare > *,
.compare-grid > *,
.values-grid > *,
.team-vals > *,
.accred-cards > *,
.fleet-grid > *{
  flex:none!important;
  width:auto!important;
}

/* Logo size adjustment */
.nav-logo img,
.footer-brand-top img {
  max-width: 160px !important;
  height: auto !important;
  max-height: 45px !important;
}

@media (max-width: 768px) {
  .nav-logo img {
    max-width: 130px !important;
    max-height: 32px !important;
  }
}

/* Header parity: keep the template's own logo size and pill-shaped CTA button
   on every page — css/style.css loads after style2.css here, so its generic
   .btn/.navbar-brand rules would otherwise shrink/reshape them differently
   than on the homepage (where the load order is reversed). */
header.header-default .navbar-brand img {
  max-width: none !important;
  height: 70px !important;
  max-height: none !important;
}
/* The offcanvas nav list used to carry an inline `padding-left:8rem !important`
   for its vertical mobile layout. That's moved here, mobile-only, since an
   inline !important can't be overridden by the overflow:hidden rules below
   (it clipped almost the whole inline menu once those were added). */
@media (max-width: 991.98px) {
  header.header-default .offcanvas-nav-list {
    padding-left: 8rem !important;
  }
}
/* Force genuine horizontal overflow (rather than link text wrapping) so the
   priority-nav script in js/main.js can measure it and fold items into "Pages". */
@media (min-width: 992px) {
  header.header-default .navbar .offcanvas,
  header.header-default .offcanvas-body {
    min-width: 0 !important;
  }
  /* Center the (possibly shrunk) nav row in the space between the logo and
     the CTA button, instead of Bootstrap's .mx-auto — auto margins fight the
     shrink below by treating shrunk-away space as "free" and dumping it into
     the margins, crushing the visible content. Centering via the parent's
     justify-content avoids that fight entirely. */
  header.header-default .offcanvas-body {
    justify-content: center !important;
  }
  header.header-default .navbar-nav {
    flex-wrap: nowrap !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    /* Not flex-grow:1 and no explicit width — the list should stay at its
       natural content size (and get centered above) when it fits, and only
       shrink when it doesn't. overflow is deliberately left visible: a
       dropdown-menu popup extends below the row's own height, and clipping
       it here (e.g. via overflow:hidden) hid every dropdown regardless of
       its own position:absolute. scrollWidth vs clientWidth still reflects
       true overflow either way — hidden was never required for that check. */
    flex-shrink: 1;
  }
  header.header-default .navbar-nav > .nav-item {
    flex-shrink: 0 !important;
    /* The template's own CSS has `@media (max-width:1199.98px){.navbar
       .navbar-nav>li{width:100%}}`, written back when the inline menu only
       ever appeared above 1200px. Now that it appears from 992px up, that
       rule wrongly stretches every item to full width in the 992-1199.98px
       band, ballooning the row to (item count × container width). */
    width: auto !important;
  }
  header.header-default .navbar-nav > .nav-item > .nav-link {
    white-space: nowrap !important;
  }
}
/* Same legacy-1200px assumption as above: the template's nav-link padding
   drops to "16px 0" (built for the full-width vertical mobile list) below
   1200px. That's now wrong for 992-1199.98px too, where the inline row
   needs real horizontal spacing between items — match the >=1200px look. */
@media (min-width: 992px) and (max-width: 1199.98px) {
  header.header-default .navbar .navbar-nav > li > a.nav-link {
    padding: 32px 18px !important;
  }
  header.header-default .navbar .navbar-nav > li:first-child > a.nav-link {
    padding-left: 0 !important;
  }
}
/* The dropdown menus (Services/Pages) were sitting behind whatever section
   is directly below the header — the header itself only has z-index:9,
   which sections further down the page (hero badges, sliders, cards, etc.)
   can and do exceed. Raise both the header and its dropdown well above any
   normal page content, while staying under the preloader/scroll-top-button
   (999999/10000), which must always stay topmost regardless. */
header.header-default {
  z-index: 500 !important;
}
header.header-default .navbar .navbar-nav .dropdown-menu {
  z-index: 501 !important;
}
/* Same issue, same fix, for the form dropdowns (Service Type, Weight, Size,
   etc. — anything using the nice-select plugin, e.g. on the homepage's
   "Request a Quote" form): nice-select.css ships its options list at
   z-index:9, low enough for nearby content to sit on top of it once opened. */
.nice-select .list {
  z-index: 100 !important;
  /* nice-select.css never caps the list's height, so a long option set
     (e.g. Weight (kg)'s 14 entries) just renders as one tall uncapped list.
     Cap it and let it scroll instead — ~6 options (40px line-height each)
     before a scrollbar kicks in. */
  max-height: 240px !important;
  overflow-y: auto !important;
}
/* The section right after the homepage's "Request a Quote" form
   (.services-sec) already sits at position:relative with no explicit
   z-index, so it was contesting the open dropdown lists above for the strip
   where an open list overhangs into it. Push it behind instead — it never
   overlaps its own siblings in normal flow, so this only affects that
   overhang, not the section's normal visibility. */
.services-sec {
  z-index: -1 !important;
}
header.header-default .nav-cta-pill {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  background: var(--red) !important;
  border-radius: 30px !important;
  padding: 5px 18px !important;
  gap: 0 !important;
  text-decoration: none !important;
}
header.header-default .nav-cta-pill:hover {
  background: var(--red2) !important;
}
header.header-default .nav-cta-pill-top {
  font-family: 'DM Sans', sans-serif;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: #fff !important;
  text-decoration: none !important;
  display: flex;
  align-items: center;
  gap: 8px;
}
header.header-default .nav-cta-pill-bottom {
  font-family: 'DM Sans', sans-serif;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  color: rgba(255, 255, 255, .8) !important;
  text-decoration: none !important;
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  justify-content: center;
}
header.header-default .nav-cta-pill-bottom:hover {
  color: #fff !important;
}
/* Bootstrap's navbar-expand-lg breakpoint (992px) shows the inline nav from
   laptop width up (the toggler is reserved for tablet/mobile); keep nav-link
   text from ever mid-word wrapping as a guard against a squeeze on unusual
   viewport/zoom combinations. */
header.header-default .navbar-nav .nav-link {
  white-space: nowrap !important;
}

.floating-contact {
  position: fixed;
  left: 1.875rem;
  bottom: 1.875rem;
  z-index: 10000;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.floating-contact-btn {
  width: 3.125rem;
  height: 3.125rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  color: #fff;
  box-shadow: 0 .3125rem .9375rem rgba(0, 0, 0, .14);
  transition: transform .2s ease;
}
.floating-contact-btn:hover {
  transform: scale(1.08);
  color: #fff;
}
.floating-contact-whatsapp {
  background: #25D366;
}
.floating-contact-email {
  background: var(--navy);
}
@media (max-width: 575.98px) {
  .floating-contact {
    left: 1rem;
    bottom: 1rem;
    gap: 10px;
  }
  .floating-contact-btn {
    width: 2.75rem;
    height: 2.75rem;
    font-size: 1.2rem;
  }
}

/* Full-bleed dark hero banner — used with the template's floating .header-default nav,
   which needs a dark photo underneath it to stay legible */
.page-hero.page-hero-full{
  background:none;
  padding:0;
  min-height:340px;
  border-bottom:none;
  overflow:hidden;
  align-items:flex-end;
}
.page-hero.page-hero-full .page-hero-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  background-size:cover;
  background-position:center;
  z-index:0;
}
.page-hero.page-hero-full .hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg, rgba(6,14,29,.35) 0%, rgba(6,14,29,.86) 100%);
}
/* Banner content: title first (with a left accent bar), breadcrumb below it -
   reordered visually via flex `order` without touching the HTML, which keeps
   breadcrumb-before-h1 markup (and its SEO/semantic value) intact everywhere.
   padding-top is generous (195px) so the title never sits under the
   floating/absolute-positioned header (~163px tall) above it.
   Some pages wrap breadcrumb+h1 in a .page-hero-content div, others (the
   blog articles) have them as direct children of .container - `display:contents`
   makes the optional wrapper "disappear" from layout so both structures behave
   identically as flex children of .container, without needing two markup patterns. */
.page-hero.page-hero-full .container{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  padding:195px 0 40px;
}
.page-hero.page-hero-full .page-hero-content{
  display:contents;
}
.page-hero.page-hero-full .container .h1{
  order:1;
  color:#fff!important;
  border-left:5px solid var(--red);
  padding-left:20px;
  margin-bottom:14px;
  max-width:min(1000px,100%)!important;
  font-size:clamp(28px,3.8vw,52px)!important;
  white-space:nowrap!important;
  overflow:hidden;
}
@media(max-width:600px){
  .page-hero.page-hero-full .container .h1{white-space:normal!important}
}
.page-hero.page-hero-full .container .h1 span{color:var(--red)!important}
.page-hero.page-hero-full .container .breadcrumb{
  order:2;
  background:none;
  border:none;
  box-shadow:none;
  padding:0 0 0 25px;
  margin-bottom:0;
  width:auto;
}
.page-hero.page-hero-full .breadcrumb a:first-child{color:var(--red)!important;font-weight:700}
.page-hero.page-hero-full .breadcrumb a:not(:first-child){color:#fff!important}
.page-hero.page-hero-full .breadcrumb i{color:rgba(255,255,255,.5)}
.page-hero.page-hero-full .breadcrumb span{color:rgba(255,255,255,.75)}
.page-hero.page-hero-full .sub,
.page-hero.page-hero-full .sub.on-dark{color:rgba(255,255,255,.8)!important}
@media(max-width:768px){
  .page-hero.page-hero-full{min-height:300px}
  .page-hero.page-hero-full .container{padding:150px 0 32px}
}

/* AUX WhatsApp floating chat button */
.aux-whatsapp-btn{position:fixed;left:1.875rem;bottom:1.875rem;height:3.125rem;width:3.125rem;border-radius:50%;background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;z-index:10000;box-shadow:0 5px 15px rgba(0,0,0,.25);transition:transform .25s ease}
.aux-whatsapp-btn:hover{transform:scale(1.08);color:#fff}
@media(max-width:640px){
  .aux-whatsapp-btn{left:1rem;bottom:1rem;height:2.75rem;width:2.75rem;font-size:24px}
}
