/* ============================================================
   iTruck India — Comprehensive Layout & Responsive Fixes
   fixes.css — Full sanity patch for inner pages
   ============================================================ */

/* ============================================================
   ROOT — Missing variable aliases
   ============================================================ */
:root {
  --transition-normal: 0.3s ease;
}

/* ============================================================
   GLOBAL — Prevent horizontal overflow
   ============================================================ */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}

section, article, aside, .container {
  max-width: 100%;
}

svg {
  max-width: 100%;
}

/* ============================================================
   UTILITY — Missing utility classes
   ============================================================ */

/* Inline gold highlight */
.gold { color: var(--accent-gold); }

/* ============================================================
   SECTION — Core layout class (used everywhere but not defined)
   ============================================================ */
.section {
  padding: var(--section-pad) 0;
  position: relative;
}

/* ============================================================
   BACKGROUNDS — Dark alternate background
   ============================================================ */
.bg-dark-alt {
  background: linear-gradient(160deg, #0a1525 0%, #0d1f3a 50%, #111e35 100%);
}

/* ============================================================
   SECTION HEADER — Used across all inner pages
   ============================================================ */
.section-header {
  margin-bottom: 56px;
  text-align: center;
}

.section-title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(1.9rem, 3.5vw, 3.2rem);
  line-height: 1.05;
  letter-spacing: -0.01em;
  color: var(--primary-navy);
  margin-bottom: 16px;
}

.section-sub {
  font-size: 1rem;
  color: var(--mid-gray);
  line-height: 1.8;
  max-width: 720px;
  margin: 0 auto;
}

.section-body {
  font-size: 1rem;
  color: var(--mid-gray);
  line-height: 1.8;
  margin-bottom: 18px;
}

/* Text overrides inside dark sections */
.bg-dark-alt .section-title,
.bg-dark-alt h2,
.bg-dark-alt h3 {
  color: var(--white);
}

.bg-dark-alt .section-sub,
.bg-dark-alt .section-body {
  color: rgba(255, 255, 255, 0.6);
}

.bg-dark-alt .section-header .section-label,
.bg-dark-alt .section-label {
  color: var(--accent-gold);
}

.bg-dark-alt .section-header .section-sub {
  color: rgba(255, 255, 255, 0.55);
}

/* ============================================================
   CALL-TO-ACTION SECTION
   ============================================================ */
.section-cta {
  background: linear-gradient(135deg, var(--navy-900) 0%, #0d1f3a 40%, var(--steel-navy) 100%);
  padding: 100px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.section-cta::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 700px;
  height: 700px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 162, 39, 0.08) 0%, transparent 70%);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.cta-block {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0 auto;
}

.cta-block .section-label {
  color: rgba(255, 255, 255, 0.45);
  margin-bottom: 16px;
}

.cta-block h2 {
  color: var(--white);
  margin-bottom: 20px;
}

.cta-block > p {
  color: rgba(255, 255, 255, 0.6);
  font-size: 1.05rem;
  line-height: 1.75;
  margin-bottom: 40px;
  max-width: 580px;
  margin-left: auto;
  margin-right: auto;
}

.cta-btns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

/* ============================================================
   NAVBAR — Inner pages consistent background
   ============================================================ */

/* Ensure nav inner doesn't overflow */
.nav-inner {
  width: 100%;
  box-sizing: border-box;
}

/* nav-logo-wrap: text block for sub label */
.nav-logo-wrap {
  display: block;
  line-height: 1;
}

/* Logo image sizing — consistent across pages */
.nav-logo-img {
  height: 52px;
  width: auto;
  display: block;
  object-fit: contain;
}

/* ============================================================
   PAGE HERO — Inner pages (Industries / Careers / Contact)
   ============================================================ */

/* Shared hero base */
.page-hero {
  position: relative;
  padding: 160px 0 100px;
  overflow: hidden;
  background: linear-gradient(135deg, var(--navy-900) 0%, var(--steel-navy) 100%);
}

/* Ensure ::after overlay pattern stays behind content */
.page-hero::after {
  z-index: 0;
}

/* The decorative bg layer (used in industries/careers/contact) */
.page-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
}

/* Containers inside hero must be above overlays */
.page-hero .container {
  position: relative;
  z-index: 2;
}

/* Direct-child content (industries/careers/contact pattern — no container wrapper) */
.page-hero > .page-hero-content {
  position: relative;
  z-index: 2;
  padding: 0 40px;
  max-width: 1280px;
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}

/* Hero image stays behind */
.page-hero-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
  opacity: 0.28;
}

/* Light decorative streaks */
.streak {
  position: absolute;
  height: 1px;
  width: 100%;
  background: linear-gradient(90deg, transparent 0%, rgba(201, 162, 39, 0.2) 40%,
    rgba(201, 162, 39, 0.35) 60%, transparent 100%);
  pointer-events: none;
}
.streak-1 { top: 25%; transform: rotate(-2.5deg); }
.streak-2 { top: 50%; transform: rotate(1deg); }
.streak-3 { top: 70%; transform: rotate(-1.5deg); }
.streak-4 { top: 15%; transform: rotate(2deg); }

/* Page hero headline (inner page variant) */
.page-hero-title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(2.4rem, 5vw, 4.8rem);
  line-height: 0.98;
  color: var(--white);
  text-transform: uppercase;
  letter-spacing: -0.01em;
  margin-bottom: 24px;
}

.page-hero-title .gold {
  color: var(--accent-gold);
}

/* Page hero subline */
.page-hero-sub {
  font-size: 1.05rem;
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.65);
  max-width: 620px;
  margin-bottom: 36px;
}

/* Breadcrumb spacing */
.page-hero .breadcrumb {
  margin-bottom: 28px;
}

.page-hero > .page-hero-content .breadcrumb {
  margin-bottom: 28px;
}

/* ============================================================
   NETWORK PAGE — Stats Strip
   ============================================================ */
.stats-strip {
  background: var(--steel-navy);
  padding: 40px 0;
  border-top: 3px solid var(--accent-gold);
  overflow: hidden;
}

.stats-strip-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
}

.stat-item {
  text-align: center;
  padding: 8px 4px;
}

/* ============================================================
   NETWORK PAGE — Coverage map section
   ============================================================ */
.map-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 60px 0 0;
}

.india-map-wrap {
  width: 100%;
  max-width: 760px;
}

/* ============================================================
   NETWORK PAGE — NE Deep Dive grid
   ============================================================ */
.ne-deep-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.ne-deep-visual {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* ============================================================
   FLEET PAGE — Fleet diff grid responsive
   ============================================================ */
.fleet-diff-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}

/* ============================================================
   FLEET PAGE — Tech section grid
   ============================================================ */
.tech-section-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.tech-visual {
  display: flex;
  justify-content: center;
  align-items: center;
}

.tech-content .section-title {
  color: var(--primary-navy);
}

/* ============================================================
   FLEET PAGE — Maintenance grid
   ============================================================ */
.maintenance-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 48px;
}

/* ============================================================
   INDUSTRIES PAGE — Hero and content fixes
   ============================================================ */

/* Industries hero has no container — direct children need padding */
.page-hero .page-hero-content .hero-cta-row {
  margin-top: 0;
  margin-bottom: 0;
}

/* industry-section spacing */
.industry-section {
  padding: 60px 0;
}

/* Industry header row */
.industry-header-row {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 36px;
}

/* Industry body grid */
.industry-body-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 48px;
  align-items: start;
}

/* ============================================================
   CAREERS PAGE — Roles and process
   ============================================================ */

/* Why join grid */
.why-join-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 48px;
}

/* Driver bilingual grid */
.driver-bilingual-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin-top: 48px;
}

/* Application process steps */
.process-steps {
  display: flex;
  gap: 0;
  align-items: stretch;
  margin-top: 48px;
  overflow: visible;
}

.process-step {
  flex: 1;
  background: rgba(15, 29, 56, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 12px;
  padding: 28px;
  min-width: 0; /* prevent flex overflow */
}

.process-arrow {
  display: flex;
  align-items: center;
  padding: 0 12px;
  color: var(--accent-gold);
  font-size: 1.4rem;
  flex-shrink: 0;
}

/* ============================================================
   CONTACT PAGE — Form and layout
   ============================================================ */

/* Contact main grid */
.contact-main-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 60px;
  align-items: start;
}

/* Contact details headings on dark bg */
.contact-details-col h3 {
  color: var(--off-white);
}

/* Ensure contact section margin doesn't cause overflow */
.contact-section {
  padding-top: 0;
  margin-top: -24px;
}

/* contact form col */
.contact-form-col {
  width: 100%;
}

/* ============================================================
   FOOTER — Consistent across all pages
   ============================================================ */

/* Footer bottom container constraint */
.footer-bottom > .container {
  max-width: 1280px;
  padding: 0 40px;
  box-sizing: border-box;
}

/* Prevent footer text overflow */
.footer-address strong {
  margin-right: 4px;
}

/* ============================================================
   RESPONSIVE — 1280px
   ============================================================ */
@media (max-width: 1280px) {

  .stats-strip-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
  }

  .ne-deep-grid,
  .tech-section-grid {
    gap: 48px;
  }

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

  .contact-main-grid {
    gap: 40px;
  }
}

/* ============================================================
   RESPONSIVE — 1024px (tablet landscape)
   ============================================================ */
@media (max-width: 1024px) {

  /* Page hero spacing */
  .page-hero {
    padding: 130px 0 80px;
  }

  .page-hero > .page-hero-content {
    padding: 0 32px;
  }

  .page-hero-title {
    font-size: clamp(2.2rem, 5vw, 3.6rem);
  }

  /* Stats strip — 3 columns */
  .stats-strip-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
  }

  .stat-number {
    font-size: 2rem;
  }

  /* Network — NE deep grid */
  .ne-deep-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .ne-deep-visual {
    order: -1;
  }

  /* Network — corridors */
  .corridors-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  /* Fleet — diff cards */
  .fleet-diff-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }

  /* Fleet — tech grid */
  .tech-section-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .tech-visual {
    order: -1;
  }

  /* Fleet — maintenance */
  .maintenance-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }

  /* Industries — body grid */
  .industry-body-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  /* Careers — why join */
  .why-join-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Careers — driver bilingual */
  .driver-bilingual-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  /* Careers — process steps */
  .process-steps {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }

  .process-arrow {
    display: none;
  }

  .process-step {
    flex: none;
  }

  /* Contact */
  .contact-main-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .contact-form-wrap {
    padding: 36px;
  }

  /* CTA section */
  .section-cta {
    padding: 80px 0;
  }

  .cta-btns {
    flex-direction: column;
    align-items: center;
  }

  .cta-btns .btn {
    width: 100%;
    max-width: 380px;
    justify-content: center;
  }

  /* Footer bottom */
  .footer-bottom > .container {
    padding: 0 32px;
  }
}

/* ============================================================
   RESPONSIVE — 768px (tablet portrait / large mobile)
   ============================================================ */
@media (max-width: 768px) {

  /* Page hero */
  .page-hero {
    padding: 110px 0 64px;
  }

  .page-hero > .page-hero-content {
    padding: 0 20px;
  }

  .page-hero-title {
    font-size: clamp(2rem, 8vw, 3rem);
    line-height: 1.0;
  }

  .page-hero-sub {
    font-size: 0.95rem;
    margin-bottom: 28px;
  }

  /* Stats strip — 2 cols on mobile */
  .stats-strip-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .stat-item {
    padding: 6px 2px;
  }

  .stat-number {
    font-size: 1.8rem;
  }

  .stat-label {
    font-size: 0.62rem;
    margin-top: 4px;
  }

  /* Network — corridors */
  .corridors-grid {
    grid-template-columns: 1fr;
    margin-top: 36px;
  }

  .corridor-card {
    padding: 28px 22px;
  }

  .corridor-number {
    font-size: 4rem;
  }

  /* NE deep */
  .ne-deep-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .ne-stats-mini {
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 24px;
  }

  /* States grid */
  .states-grid {
    gap: 8px;
    margin-top: 28px;
  }

  .state-badge {
    font-size: 0.72rem;
    padding: 6px 12px;
  }

  .states-legend {
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 16px;
    font-size: 0.72rem;
    justify-content: flex-start;
  }

  /* Fleet — diff cards */
  .fleet-diff-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .fleet-diff-card {
    padding: 24px;
  }

  /* Fleet — tech */
  .tech-section-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  /* Fleet — maintenance */
  .maintenance-grid {
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 32px;
  }

  .maint-card {
    padding: 22px;
  }

  /* Industries — header row */
  .industry-header-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 24px;
  }

  .industry-title {
    font-size: 1.6rem;
  }

  .industry-section {
    padding: 40px 0;
  }

  /* Industries — body grid */
  .industry-body-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .industry-clients-panel {
    padding: 22px;
  }

  /* Careers — why join */
  .why-join-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  /* Careers — roles */
  .roles-grid {
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 32px;
  }

  .role-card {
    padding: 24px;
  }

  .role-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .role-loc {
    white-space: normal;
    margin-top: 0;
  }

  /* Careers — driver bilingual */
  .driver-bilingual-grid {
    grid-template-columns: 1fr;
    gap: 24px;
    margin-top: 32px;
  }

  .driver-lang-card {
    padding: 28px 22px;
  }

  /* Careers — process steps */
  .process-steps {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 32px;
  }

  .process-step {
    flex: none;
    width: 100%;
    padding: 22px;
  }

  .process-arrow {
    display: none;
  }

  .careers-contact-note {
    margin-top: 24px;
    font-size: 0.85rem;
    padding: 16px;
  }

  /* Contact */
  .contact-main-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .contact-form-wrap {
    padding: 24px 20px;
    border-radius: 12px;
  }

  .form-title {
    font-size: 1.4rem;
  }

  .form-row.two-col {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .form-submit-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .form-submit-btn {
    width: 100%;
    justify-content: center;
  }

  /* Contact compliance strip */
  .contact-compliance-strip {
    flex-wrap: wrap;
    gap: 6px;
  }

  /* Response commitment */
  .response-commitment {
    padding: 20px;
  }

  /* CTA */
  .section-cta {
    padding: 72px 0;
  }

  .cta-block h2 {
    font-size: clamp(1.6rem, 5vw, 2.4rem);
  }

  .cta-btns {
    flex-direction: column;
    align-items: center;
  }

  .cta-btns .btn {
    width: 100%;
    max-width: 340px;
    justify-content: center;
  }

  /* Footer */
  .footer-bottom > .container {
    padding: 0 20px;
  }
}

/* ============================================================
   RESPONSIVE — 480px (mobile)
   ============================================================ */
@media (max-width: 480px) {

  /* Page hero */
  .page-hero {
    padding: 100px 0 56px;
  }

  .page-hero > .page-hero-content {
    padding: 0 16px;
  }

  .page-hero-title {
    font-size: clamp(1.8rem, 9vw, 2.4rem);
  }

  .page-hero-sub {
    font-size: 0.9rem;
  }

  /* Stats strip — 2 cols small */
  .stats-strip-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }

  .stat-number {
    font-size: 1.5rem;
  }

  /* Corridor cards */
  .corridor-card {
    padding: 20px 18px;
  }

  .corridor-number {
    font-size: 3rem;
  }

  .corridor-icon {
    font-size: 1.8rem;
  }

  /* Fleet diff */
  .fleet-diff-card {
    padding: 20px;
  }

  .fleet-diff-icon {
    font-size: 1.6rem;
    margin-bottom: 10px;
  }

  /* Fleet table cells */
  .fleet-table th,
  .fleet-table td {
    padding: 10px 12px;
    font-size: 0.8rem;
  }

  /* Fleet badge */
  .fleet-badge {
    display: none;
  }

  /* Maintenance */
  .maint-card {
    padding: 18px;
  }

  /* Industry section */
  .industry-title {
    font-size: 1.4rem;
  }

  .industry-icon-lg {
    width: 56px;
    height: 56px;
    font-size: 2rem;
  }

  .client-tag-lg {
    padding: 8px 12px;
    font-size: 0.82rem;
  }

  /* Why join */
  .why-join-card {
    padding: 22px;
  }

  /* Roles */
  .role-card {
    padding: 20px;
  }

  .role-title {
    font-size: 1.05rem;
  }

  /* Driver cards */
  .driver-lang-card {
    padding: 20px 18px;
  }

  .driver-apply-btn {
    width: 100%;
    justify-content: center;
    margin-right: 0;
    margin-bottom: 10px;
    display: flex;
  }

  /* Process steps */
  .process-step {
    padding: 18px;
  }

  .step-num {
    font-size: 1.8rem;
  }

  /* Contact form */
  .contact-form-wrap {
    padding: 18px 14px;
  }

  .form-title {
    font-size: 1.3rem;
  }

  .form-group input,
  .form-group select,
  .form-group textarea {
    padding: 10px 12px;
    font-size: 0.875rem;
  }

  /* CTA */
  .section-cta {
    padding: 56px 0;
  }

  .cta-btns .btn {
    max-width: 100%;
  }

  /* Footer */
  .footer-bottom > .container {
    padding: 0 16px;
  }

  /* ne stats */
  .ne-stats-mini {
    flex-direction: column;
    gap: 12px;
  }

  .ne-stat strong {
    font-size: 1.3rem;
  }

  /* Office cards in contact */
  .office-card {
    padding: 14px 16px;
  }

  /* Quick contact items */
  .quick-contact-item {
    padding: 12px 14px;
  }
}

/* ============================================================
   PRINT SAFETY
   ============================================================ */
@media print {
  .page-hero-bg,
  .page-hero-img,
  .streak { display: none !important; }
}

/* ============================================================
   FLEET TABLE — Dark section transparency fix
   The generic .fleet-table has background:white but it lives
   inside .bg-dark-alt — make it transparent
   ============================================================ */
.fleet-table-wrap .fleet-table {
  background: transparent;
}

/* Subtle row stripe in dark context */
.fleet-table-wrap .fleet-table tr:nth-child(even) td {
  background: rgba(255, 255, 255, 0.03);
}

/* Hover on dark table */
.fleet-table-wrap .fleet-row:hover td {
  background: rgba(30, 58, 95, 0.4);
}

/* ============================================================
   FLEET TECH SECTION — Fix white text on light background
   The tech features section is on a light .section background
   but has white/off-white text colors — override to dark
   ============================================================ */
.tech-feature strong {
  color: var(--primary-navy) !important;
}

.tech-feature p {
  color: var(--mid-gray) !important;
}

/* ============================================================
   NETWORK PAGE — Section sub text in dark section
   ============================================================ */
.section.bg-dark-alt .section-sub {
  color: rgba(255, 255, 255, 0.6);
  margin-left: auto;
  margin-right: auto;
}

/* ============================================================
   CAREERS PAGE — Role card on dark bg needs proper text
   ============================================================ */
.bg-dark-alt .role-title {
  color: var(--off-white);
}

.bg-dark-alt .role-desc {
  color: rgba(255, 255, 255, 0.6);
}

.bg-dark-alt .role-requirements li {
  color: rgba(255, 255, 255, 0.55);
}

/* ============================================================
   CONTACT PAGE — Details column on dark bg
   ============================================================ */
.contact-details-col {
  color: var(--off-white);
}

/* ============================================================
   GENERAL SECTION FIX — Section labels
   ============================================================ */
.section-label {
  margin-bottom: 16px;
}

/* ============================================================
   INDUSTRIES PAGE — Trust strip
   Already styled dark in style.css; ensure container padding
   ============================================================ */
.trust-strip .trust-logos {
  gap: 16px 32px;
}

/* ============================================================
   NE STAT mini — ensure colors in dark section
   ============================================================ */
.ne-stat strong {
  color: var(--accent-gold);
}

.ne-stat span {
  color: rgba(255, 255, 255, 0.5);
  font-size: 0.72rem;
}

/* ============================================================
   STATES GRID — centered and visible
   ============================================================ */
.states-grid {
  justify-content: flex-start;
}

/* ============================================================
   DRIVER LANG CARD — Button layout
   ============================================================ */
.driver-apply-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 12px;
  margin-bottom: 8px;
  font-size: 0.85rem;
}

/* ============================================================
   SECTION HEADER in non-centered contexts
   ============================================================ */
.ne-deep-content .section-header,
.tech-content .section-header,
.ne-deep-content,
.tech-content {
  text-align: left;
}

.ne-deep-content .section-sub,
.tech-content .section-sub {
  margin: 0;
}

/* ============================================================
   ADDITIONAL 768px FIXES
   ============================================================ */
@media (max-width: 768px) {

  .driver-apply-btn {
    display: flex;
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px;
  }

  .trust-strip .trust-logos {
    gap: 12px 20px;
  }

  .trust-logo-item {
    font-size: 0.85rem;
  }

  .industry-capabilities ul {
    padding: 0;
  }

  .industry-capabilities li {
    font-size: 0.85rem;
  }

  .section-cta .cta-block h2 {
    font-size: clamp(1.5rem, 5vw, 2.2rem);
  }

  /* Quick contact on mobile */
  .qc-value {
    font-size: 0.82rem;
    word-break: break-all;
  }

  /* Role apply button full width on mobile */
  .role-apply-btn {
    display: flex;
    width: 100%;
    justify-content: center;
  }
}

/* ============================================================
   ADDITIONAL 480px FIXES
   ============================================================ */
@media (max-width: 480px) {

  .trust-logos {
    gap: 10px 16px;
  }

  .industry-icon-lg {
    width: 52px;
    height: 52px;
    font-size: 1.8rem;
    border-radius: 12px;
  }

  .fleet-diff-icon {
    font-size: 1.6rem;
  }

  .wj-icon {
    font-size: 1.6rem;
  }

  .process-step h4 {
    font-size: 0.9rem;
  }

  .process-step p {
    font-size: 0.8rem;
  }

  .driver-requirements-box {
    padding: 12px;
  }

  .response-commitment {
    padding: 16px;
  }

  .rc-time {
    font-size: 1rem;
    min-width: 44px;
  }

  .rc-desc {
    font-size: 0.75rem;
  }
}

/* ============================================================
   SITE WRAPPER — Full-width, matches home & about style
   No dark outer borders. Sections span full width.
   ============================================================ */

body {
  background: var(--off-white);
  overflow-x: hidden;
}

.site-wrapper {
  width: 100%;
  overflow-x: hidden;
}

/* ============================================================
   CONSISTENT CONTAINER — All pages aligned the same
   ============================================================ */
.container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 48px;
}

/* ============================================================
   PAGE HERO — All inner pages match about/home hero height & feel
   ============================================================ */
.page-hero {
  position: relative;
  min-height: 58vh;
  display: flex;
  align-items: center;
  padding: 140px 0 90px;
  background: linear-gradient(135deg, var(--navy-900) 0%, var(--steel-navy) 100%);
  overflow: hidden;
}

.page-hero-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0.45;
  z-index: 0;
}

.page-hero-content {
  position: relative;
  z-index: 2;
  max-width: 780px;
}

.page-hero-content h1 {
  color: var(--white);
  margin-bottom: 20px;
}

.page-hero-content .lead {
  color: rgba(255, 255, 255, 0.7);
  font-size: 1.05rem;
  line-height: 1.8;
  max-width: 640px;
}

/* ============================================================
   SECTIONS — Consistent padding across all pages
   ============================================================ */
.section {
  padding: 96px 0;
  position: relative;
}

.section-pad {
  padding: 96px 0;
}

.bg-off {
  background: var(--off-white);
}

/* ============================================================
   SECTION HEADER — Centered, aligned like homepage
   ============================================================ */
.section-header {
  text-align: center;
  margin-bottom: 56px;
}

.section-header .section-label {
  justify-content: center;
}

.section-title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(2rem, 3.5vw, 3rem);
  line-height: 1.08;
  color: var(--primary-navy);
  margin-bottom: 16px;
}

.section-sub {
  font-size: 1.05rem;
  color: var(--mid-gray);
  line-height: 1.8;
  max-width: 700px;
  margin: 0 auto;
}

/* Dark sections get white text */
.bg-dark-alt .section-title,
.bg-dark-alt h2,
.bg-dark-alt h3 {
  color: var(--white);
}
.bg-dark-alt .section-sub {
  color: rgba(255, 255, 255, 0.6);
}

/* ============================================================
   FLEET CARDS — Match homepage card style exactly
   ============================================================ */
.fleet-diff-card {
  background: #ffffff;
  border: 1px solid rgba(15, 29, 56, 0.07);
  border-radius: 16px;
  padding: 36px 30px;
  box-shadow: 0 2px 16px rgba(15, 29, 56, 0.05);
  transition: box-shadow 0.3s, transform 0.3s;
}
.fleet-diff-card:hover {
  box-shadow: 0 12px 40px rgba(15, 29, 56, 0.12);
  transform: translateY(-4px);
}
.fleet-diff-card h3 {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--primary-navy);
  margin-bottom: 10px;
}
.fleet-diff-card p {
  color: var(--mid-gray);
  font-size: 0.92rem;
  line-height: 1.7;
}

/* ============================================================
   CORRIDOR CARDS — Match homepage card style
   ============================================================ */
.corridor-card {
  background: #ffffff;
  border: 1px solid rgba(15, 29, 56, 0.07);
  border-radius: 16px;
  padding: 40px;
  box-shadow: 0 2px 16px rgba(15, 29, 56, 0.05);
  transition: box-shadow 0.3s, transform 0.3s;
}
.corridor-card:hover {
  box-shadow: 0 12px 40px rgba(15, 29, 56, 0.12);
  transform: translateY(-4px);
}

/* ============================================================
   STATS STRIP — Matches home stats style
   ============================================================ */
.stats-strip {
  background: var(--steel-navy);
  padding: 48px 0;
  border-top: 3px solid var(--accent-gold);
}

/* ============================================================
   CTA SECTION — Aligned, centered like homepage CTA
   ============================================================ */
.section-cta {
  background: linear-gradient(135deg, var(--navy-900) 0%, #0d1f3a 50%, var(--steel-navy) 100%);
  padding: 100px 0;
  text-align: center;
}

.cta-block {
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}

.cta-block h2 {
  color: var(--white);
  margin-bottom: 18px;
}

.cta-block > p {
  color: rgba(255, 255, 255, 0.65);
  font-size: 1.05rem;
  margin-bottom: 40px;
}

.cta-btns {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

/* ============================================================
   NAVBAR — Stays full-width, proper fixed behaviour
   ============================================================ */
#navbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1000;
}