
/* SP Logistics Patch 4: page differentiation + premium polish */
:root{
  --sp-teal:#155263;
  --sp-sky:#1e758d;
  --sp-navy:#0c2f39;
  --sp-footer:#1E3A4E;
  --sp-gold:#ffbb09;
  --sp-yellow:#ffc93c;
  --sp-cream:#ffd76f;
  --sp-ink:#082b35;
  --sp-body:#344d58;
  --sp-muted:#60747d;
  --sp-border:#d9e5e9;
  --sp-soft:#f5f9fa;
  --sp-warm:#fff8e7;
  --shadow-soft:0 14px 34px rgba(12,47,57,.075);
  --shadow-hero:0 30px 70px rgba(12,47,57,.18);
}
body{font-size:16px;letter-spacing:-.012em}
.container{max-width:1180px}
.topline{font-size:.74rem;background:var(--sp-navy)}
.site-header{box-shadow:0 4px 18px rgba(12,47,57,.045)}
.nav-shell{min-height:74px}
.brand img{width:36px}
.brand strong{font-size:1.06rem}
.primary-nav a{font-size:.8rem;padding:9px 11px}
.primary-nav .quote{background:var(--sp-gold);color:var(--sp-navy)}
.quick-nav,.hero-badge{display:none!important}

/* Hero improvements */
.hero{background:linear-gradient(135deg,#fff 0%,#f8fbfb 60%,#fff8e7 100%)}
.hero.dark{background:linear-gradient(135deg,#0c2f39 0%,#155263 100%)}
.hero .container{padding-top:78px;padding-bottom:78px}
.hero-grid{grid-template-columns:minmax(0,1.02fr) minmax(380px,.98fr);gap:68px}
.hero h1{font-size:clamp(2.8rem,5vw,4.65rem);line-height:.98;letter-spacing:-.06em}
.hero.dark h1{color:#fff}
.hero h1:after{content:"";display:block;width:70px;height:5px;border-radius:999px;background:var(--sp-gold);margin-top:24px}
.hero .lead{font-size:1.08rem;line-height:1.72}
.media-card{border-radius:28px;box-shadow:var(--shadow-hero)}
.media-card img{aspect-ratio:16/9;object-fit:cover}
.hero.dark .media-card{border:1px solid rgba(255,255,255,.24)}

/* Careers page intent */
body[data-page="Careers"] .primary-nav .quote,
body[data-page="drivers"] .primary-nav .quote{background:var(--sp-teal);color:#fff}
body[data-page="Careers"] .hero h1,
body[data-page="drivers"] .hero h1{color:var(--sp-teal)}

/* Section rhythm */
.section{padding:88px 0}
.section.soft{background:linear-gradient(180deg,#f5f9fa 0%,#eef5f7 100%)}
.section.warm{background:linear-gradient(135deg,#fffdf5,#fff6d9)}
.section-head{margin-bottom:42px;align-items:start}
.section-head h2{color:var(--sp-teal);font-size:clamp(2rem,3vw,3.35rem);line-height:1.04}
.section-head p{line-height:1.68;color:var(--sp-muted)}
.eyebrow{color:var(--sp-teal)}

/* Cards */
.card,.quote-panel,.faq{border:1px solid var(--sp-border);border-radius:20px;box-shadow:var(--shadow-soft)}
.card{padding:28px;min-height:190px}
.card h3{color:var(--sp-navy)}
.card p,.quote-panel p,.faq p,.mini-kpi span{color:var(--sp-body)}
.card .mini{color:var(--sp-teal)}
.linked-card:hover{transform:translateY(-3px);box-shadow:0 22px 45px rgba(12,47,57,.12)}
.card-link{color:var(--sp-teal);border-color:var(--sp-border)}
.card-link:hover{background:var(--sp-gold);border-color:var(--sp-gold);color:var(--sp-navy)}
.quote-panel{padding:36px}
.mini-kpis{gap:12px}
.mini-kpi{background:#f8fbfc;border:1px solid var(--sp-border);border-radius:14px}
.mini-kpi strong{color:var(--sp-navy);font-size:.94rem}

/* CTA */
.cta-band{background:linear-gradient(135deg,var(--sp-navy),var(--sp-teal));border-radius:24px}
.cta-band .actions{margin-top:0}

/* Footer */
.site-footer{background:var(--sp-footer)}
.site-footer a:hover{color:var(--sp-gold)}

@media(max-width:980px){
  .hero-grid,.split,.section-head{grid-template-columns:1fr;gap:34px}
  .hero .container{padding-top:56px;padding-bottom:62px}
  .grid.three,.grid.four,.service-matrix{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .topline .container span:first-child{display:none}
  .container{padding-left:18px;padding-right:18px}
  .hero h1{font-size:2.42rem}
  .section{padding:58px 0}
  .grid.two,.grid.three,.grid.four,.mini-kpis,.service-matrix{grid-template-columns:1fr!important}
  .quote-panel,.card{padding:22px}
}
