@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600 800;font-display:swap;src:url('/fonts/plus-jakarta-sans-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600 800;font-display:swap;src:url('/fonts/plus-jakarta-sans-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400 700;font-display:swap;src:url('/fonts/figtree-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400 700;font-display:swap;src:url('/fonts/figtree-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

/* ============================================================
   MedGo Transportation — site styles (v2, 2026-09-03)
   Palette (approved by the client):
     navy #1B3A6B · teal #1A7A8B · ink #0B1626 · paper #FBFCFD · amber #E9A23B
   Type: Plus Jakarta Sans (headings, step numerals) · Figtree (body, buttons, labels)
   Readability guardrails for an older audience: headings 600–800 only; Figtree body
   17.5px/1.7; labels 12.5px+ and 600+; no light weights anywhere.
   Layout rule: every block centres its own content (text, icons, buttons),
   on every screen size. Zero dependencies. Root-relative asset paths.
   ============================================================ */

:root{
  --navy:#1B3A6B;
  --navy-deep:#142D55;
  --navy-50:#EEF2F8;
  --teal:#1A7A8B;
  --teal-deep:#146270;
  --teal-50:#E9F3F5;
  --teal-100:#CFE5E9;
  --ink:#0B1626;
  --paper:#FBFCFD;
  --white:#FFFFFF;
  --amber:#E9A23B;
  --amber-deep:#D48F2A;
  --text:#2A3644;
  --muted:#5A6878;
  --line:#DCE3EB;
  --on-dark:rgba(255,255,255,.86);
  --display:'Plus Jakarta Sans','Helvetica Neue',Arial,sans-serif;
  --body:'Figtree','Helvetica Neue',Arial,sans-serif;
  --r-card:24px;
  --wrap:1200px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--paper);color:var(--text);
  font-family:var(--body);font-size:17.5px;line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block;}
svg{display:block;}
a{color:var(--teal);}
::selection{background:var(--teal-100);color:var(--ink);}
:focus-visible{outline:3px solid var(--amber);outline-offset:3px;border-radius:4px;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px;}

/* ---------- type ---------- */
h1,h2,h3{font-family:var(--display);font-weight:700;color:var(--navy);margin:0;letter-spacing:-.02em;}
h1{font-weight:800;}
h1{font-size:clamp(36px,4.2vw,54px);line-height:1.08;}
h2{font-size:clamp(31px,3.4vw,44px);line-height:1.1;}
h3{font-size:23px;line-height:1.25;font-weight:600;letter-spacing:-.01em;}
p{margin:0 0 1em;}
.lede{font-size:19px;line-height:1.65;}
.eyebrow{
  display:block;font-family:var(--body);font-size:13px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;line-height:1.4;color:var(--teal);margin:0 0 16px;
}
.rule{display:block;width:56px;height:3px;border-radius:2px;background:var(--amber);border:0;margin:22px auto 0;}

/* ---------- buttons (always centred inside their row) ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--body);font-size:15px;font-weight:600;line-height:1.2;
  padding:15px 28px;border-radius:999px;text-decoration:none;text-align:center;
  border:2px solid transparent;cursor:pointer;
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease;
}
.btn:hover{transform:translateY(-1px);}
.btn-primary{background:var(--amber);color:var(--ink);border-color:var(--amber);}
.btn-primary:hover{background:var(--amber-deep);border-color:var(--amber-deep);color:var(--ink);}
.btn-outline{border-color:var(--navy);color:var(--navy);background:transparent;}
.btn-outline:hover{background:var(--navy);color:var(--white);}
.btn-outline-light{border-color:rgba(255,255,255,.75);color:var(--white);background:transparent;}
.btn-outline-light:hover{background:var(--white);color:var(--navy);border-color:var(--white);}
.btn-sm{padding:11px 20px;font-size:14px;}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:center;}

/* ---------- skip link ---------- */
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--navy);color:var(--white);padding:10px 18px;border-radius:0 0 12px 0;}
.skip:focus{left:0;}

/* ---------- top bar ---------- */
.topbar{background:var(--navy);color:var(--white);}
.topbar .wrap{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding-top:9px;padding-bottom:9px;
  font-size:12.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;line-height:1.4;
}
.topbar a{color:var(--white);text-decoration:none;white-space:nowrap;}
.topbar a:hover{color:var(--amber);}

/* ---------- header / nav ---------- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:var(--paper);border-bottom:1px solid var(--line);
  /* no backdrop-filter here: it would trap the fixed-position mobile drawer inside the header box */
}
.site-header .wrap{display:flex;align-items:center;gap:24px;min-height:84px;max-width:1280px;}
.brand{display:flex;align-items:center;flex-shrink:0;}
.brand img{width:196px;height:auto;}
.nav{flex:1;display:flex;justify-content:center;}
.nav > ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:2px;}
.nav li{position:relative;}
.nav a{
  display:flex;align-items:center;gap:6px;padding:10px 13px;border-radius:999px;
  font-size:15.5px;font-weight:500;color:var(--text);text-decoration:none;white-space:nowrap;
  transition:background .15s ease,color .15s ease;
}
.nav a:hover,.nav li:focus-within > a,.nav li.open > a{color:var(--navy);background:var(--navy-50);}
.nav .chev{width:14px;height:14px;color:var(--muted);flex-shrink:0;}
.nav ul.sub{
  position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);min-width:280px;
  background:var(--white);border:1px solid var(--line);border-radius:18px;
  box-shadow:0 18px 44px rgba(11,22,38,.12);padding:8px;margin:0;list-style:none;
  display:none;flex-direction:column;
}
.nav ul.sub::before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px;}
.nav li:hover > ul.sub,.nav li:focus-within > ul.sub,.nav li.open > ul.sub{display:flex;}
.nav ul.sub a{padding:11px 14px;border-radius:12px;font-weight:500;white-space:normal;justify-content:center;text-align:center;}
.header-actions{display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0;}
.header-phone{
  display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border-radius:999px;
  font-size:15.5px;font-weight:700;color:var(--navy);text-decoration:none;transition:background .15s ease;
}
.header-phone:hover{background:var(--navy-50);}
.header-phone svg{width:18px;height:18px;color:var(--teal);}
.header-book{padding:12px 22px;font-size:14.5px;}
.menu-toggle{
  display:none;align-items:center;justify-content:center;width:44px;height:44px;
  background:var(--white);border:1.5px solid var(--line);border-radius:12px;color:var(--navy);cursor:pointer;padding:0;
}
.menu-toggle svg{width:22px;height:22px;}
.menu-toggle .ico-close{display:none;}
body.nav-open .menu-toggle .ico-open{display:none;}
body.nav-open .menu-toggle .ico-close{display:block;}
.nav-overlay{display:none;}

/* ---------- sections ---------- */
.section{padding:88px 0;}
.section-sm{padding:72px 0;}
.band-white{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.band-teal{background:var(--teal-50);}
.band-navy{background:var(--navy);color:var(--white);position:relative;overflow:hidden;}
.band-navy h2,.band-navy h3{color:var(--white);}
.band-navy p{color:var(--on-dark);}
.band-navy .eyebrow{color:var(--amber);}
.band-navy::before{
  content:"";position:absolute;width:760px;height:760px;border-radius:50%;top:-420px;right:-260px;
  background:radial-gradient(circle,rgba(26,122,139,.55),rgba(26,122,139,0) 66%);pointer-events:none;
}
.band-navy .wrap{position:relative;z-index:1;}
.section-head{max-width:740px;margin:0 auto 44px;text-align:center;}
.section-head .sub{font-size:18.5px;color:var(--muted);margin:22px auto 0;max-width:620px;}
.band-navy .section-head .sub{color:var(--on-dark);}

/* ---------- hero (photo bleeds to the right edge) ---------- */
.hero{background:var(--paper);}
.hero-grid{display:grid;grid-template-columns:.9fr 1.1fr;align-items:stretch;min-height:560px;}   /* photo first (left), copy second (2026-09-03); the copy keeps the wider column so the headline stays four lines */
.hero-copy{
  display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;
  padding:76px max(24px,calc((100vw - var(--wrap)) / 2)) 76px 56px;   /* copy on the right: its outer padding lines up with the wrap's right edge */
}
.hero-copy > *{max-width:640px;}
.hero h1{margin:0 0 22px;}
.hero .lede{margin:0 0 34px;max-width:540px;}
.hero-media{position:relative;min-height:0;margin:44px 0 44px max(24px,calc((100vw - var(--wrap)) / 2 - 52px));}   /* 2026-09-03: the photo card is 68px in from the left edge (24px on small laptops), 573px wide at 1440, and stretches the full hero height minus 44px top and bottom, so it starts above the eyebrow and ends below the buttons */
.ph{
  position:relative;width:100%;aspect-ratio:4/3;border-radius:28px;overflow:hidden;
  background:linear-gradient(135deg,var(--navy) 0%,var(--teal) 100%);
  display:grid;place-items:center;
}
.hero-media .ph{position:absolute;inset:0;aspect-ratio:auto;border-radius:28px;}   /* all four corners rounded, like the inner-page photos */
.ph::before,.ph::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.07);}
.ph::before{width:70%;aspect-ratio:1;right:-22%;bottom:-34%;}
.ph::after{width:44%;aspect-ratio:1;left:-14%;top:-20%;}
.ph img{width:52%;max-width:420px;height:auto;opacity:.94;position:relative;z-index:1;}
.ph-label{
  position:absolute;left:22px;bottom:22px;z-index:1;
  font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--white);background:rgba(11,22,38,.38);padding:9px 14px;border-radius:999px;
}

/* ---------- trust strip: five icon badges ---------- */
.trust{background:var(--navy);border-top:1px solid rgba(255,255,255,.08);}
.trust ul{list-style:none;margin:0;padding:34px 0 30px;display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:22px 18px;}
.trust li{flex:0 1 208px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;color:var(--white);font-size:15.5px;font-weight:600;line-height:1.35;}
.trust .ring{width:52px;height:52px;border-color:var(--amber);color:var(--amber);}
.trust .ring svg{width:25px;height:25px;}

/* ---------- cards ---------- */
.cards{display:grid;gap:24px;}
.cards-3{grid-template-columns:repeat(3,1fr);}
.cards-4{grid-template-columns:repeat(4,1fr);}
.card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);
  padding:38px 30px 34px;display:flex;flex-direction:column;align-items:center;text-align:center;
  transition:border-color .2s ease,transform .2s ease;
}
.card:hover{border-color:var(--teal-100);transform:translateY(-3px);}
.card h3{margin:20px 0 12px;}
.card p{margin:0;font-size:16px;line-height:1.65;flex:1;}
.card .btn{margin-top:22px;}
.band-navy .card{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16);}
.band-navy .card:hover{border-color:rgba(255,255,255,.4);}
.band-navy .card h3{font-size:22px;}
.band-navy .card p{font-size:15.5px;}

/* ring icon: thin teal circle, teal line icon (amber on navy) */
.ring{
  width:64px;height:64px;border-radius:50%;border:2px solid var(--teal);color:var(--teal);
  display:grid;place-items:center;flex-shrink:0;margin:0 auto;background:transparent;
}
.ring svg{width:28px;height:28px;}
.band-navy .ring{border-color:var(--amber);color:var(--amber);}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:32px 28px;list-style:none;margin:0;padding:0;}
.step{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 6px;}
.step .num{
  width:60px;height:60px;border-radius:50%;border:2px solid var(--teal);color:var(--navy);background:var(--paper);
  font-family:var(--display);font-size:24px;font-weight:700;line-height:1;
  display:grid;place-items:center;margin:0 0 22px;position:relative;z-index:1;
}
.step:not(:last-child)::after{
  content:"";position:absolute;top:29px;left:calc(50% + 44px);width:calc(100% - 60px);border-top:2px dotted var(--teal-100);
}
.step h3{font-size:22px;margin-bottom:10px;}
.step p{font-size:16px;margin:0;}

/* ---------- statement band ---------- */
.statement{max-width:800px;margin:0 auto;text-align:center;}
.statement p{font-size:19.5px;line-height:1.65;margin:20px auto 30px;max-width:700px;}

/* ---------- callout card (facilities) ---------- */
.callout{
  max-width:900px;margin:0 auto;background:var(--white);border:1px solid var(--line);border-radius:28px;
  padding:56px 48px 52px;text-align:center;display:flex;flex-direction:column;align-items:center;
}
.callout .ring{margin-bottom:22px;}
.callout h2{font-size:clamp(28px,3vw,38px);}
.callout p{margin:16px auto 26px;font-size:17.5px;max-width:680px;}

/* ---------- split (where we go) ---------- */
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center;}
.split > div{text-align:center;display:flex;flex-direction:column;align-items:center;}
.split .lede{margin:18px auto 30px;max-width:560px;}
.homebase{
  width:100%;max-width:440px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);
  padding:40px 34px 36px;text-align:center;
}
.homebase .eyebrow{margin-bottom:18px;}
.homebase .ring{width:56px;height:56px;margin-bottom:16px;}
.homebase .ring svg{width:24px;height:24px;}
.homebase address{font-style:normal;font-size:17px;line-height:1.6;margin:0;}
.homebase address + .ring{margin-top:26px;}
.homebase strong{display:block;font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-.01em;color:var(--navy);margin-bottom:4px;}
.homebase a{color:var(--navy);font-weight:600;text-decoration:none;}
.homebase a:hover{color:var(--teal);}

/* ---------- CTA band ---------- */
.cta{text-align:center;}
.cta .wrap{max-width:820px;}
.cta h2{font-size:clamp(34px,4.2vw,52px);}
.cta .sub{font-size:19.5px;margin:18px auto 36px;}

/* ---------- footer ---------- */
.site-footer{background:var(--ink);color:#C9D1DB;padding:72px 0 0;font-size:15.5px;text-align:center;}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1.2fr;gap:48px;padding-bottom:52px;}
.footer-grid > div{display:flex;flex-direction:column;align-items:center;text-align:center;}
.site-footer .flogo{width:190px;height:auto;margin-bottom:20px;}
.site-footer p{margin:0 0 10px;line-height:1.65;max-width:340px;}
.site-footer a{color:var(--white);text-decoration:none;transition:color .15s ease;}
.site-footer a:hover{color:var(--amber);}
.flabel{font-size:12.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);margin:0 0 18px;}
.site-footer ul{list-style:none;margin:0;padding:0;}
.site-footer li{margin-bottom:11px;}
.site-footer address{font-style:normal;margin:0 0 10px;line-height:1.65;}
.social{
  display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  border:1px solid rgba(255,255,255,.24);border-radius:50%;color:var(--white);margin-top:8px;
  transition:border-color .15s ease,color .15s ease;
}
.social:hover{border-color:var(--amber);color:var(--amber);}
.social svg{width:20px;height:20px;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:22px 0;font-size:13px;color:#8D99A8;}

/* ---------- 404 ---------- */
.page-404{padding:120px 0 130px;text-align:center;}
.page-404 .wrap{display:flex;flex-direction:column;align-items:center;}
.page-404 .code{font-family:var(--display);font-size:clamp(80px,12vw,132px);font-weight:700;line-height:1;color:var(--teal-100);margin:0 0 8px;}
.page-404 p{max-width:540px;margin:18px auto 32px;font-size:18px;}

/* ============================================================
   responsive
   ============================================================ */
@media (max-width:1140px){
  .trust li{flex-basis:260px;}   /* five badges wrap 3 + 2 between tablet and desktop */
}
@media (max-width:1100px){
  .nav{display:none;}
  .menu-toggle{display:inline-flex;}
  body.nav-open .nav{
    display:block;position:fixed;top:0;right:0;bottom:0;width:min(360px,100vw);
    background:var(--white);z-index:150;padding:88px 24px 40px;overflow-y:auto;
    box-shadow:-16px 0 48px rgba(11,22,38,.2);text-align:center;
  }
  body.nav-open .nav > ul{display:block;}
  body.nav-open .nav li{margin-bottom:2px;}
  body.nav-open .nav a{font-size:18px;padding:12px 10px;white-space:normal;justify-content:center;border-radius:12px;}
  body.nav-open .nav .chev{display:none;}
  body.nav-open .nav ul.sub{
    display:block;position:static;transform:none;border:0;box-shadow:none;background:transparent;
    padding:0 0 8px;min-width:0;
  }
  body.nav-open .nav ul.sub a{font-size:16px;color:var(--muted);}
  body.nav-open .nav ul.sub a:hover{color:var(--navy);}
  body.nav-open .menu-toggle{position:fixed;top:18px;right:20px;z-index:160;}
  body.nav-open .nav-overlay{display:block;position:fixed;inset:0;background:rgba(11,22,38,.45);z-index:140;}
  body.nav-open{overflow:hidden;}
}
@media (max-width:900px){
  .topbar .area{display:none;}
  .topbar .wrap{justify-content:center;}
  .hero{padding:44px 0 0;}   /* stacked: the photo sits first, so the breathing room moves above it (2026-09-03) */
  .hero-grid{grid-template-columns:1fr;min-height:0;}
  .hero-copy{padding:28px 24px 56px;}
  .hero-media{min-height:0;aspect-ratio:16/10;max-height:420px;margin:0 auto;width:calc(100% - 48px);max-width:720px;}
  .hero-media .ph{border-radius:28px;}
  .cards-3,.cards-4,.steps{grid-template-columns:repeat(2,1fr);}
  .step:not(:last-child)::after{display:none;}
  .split{grid-template-columns:1fr;gap:40px;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .footer-grid > div:first-child{grid-column:1 / -1;}
  .section{padding:72px 0;}
  .section-sm{padding:60px 0;}
  .callout{padding:44px 32px 40px;}
}
@media (max-width:640px){
  .cards-3,.cards-4,.steps,.footer-grid{grid-template-columns:1fr;}
  .site-header .wrap{gap:8px;min-height:66px;padding:0 16px;}
  .brand img{width:132px;}
  .header-actions{gap:4px;}
  .header-phone span{display:none;}
  .header-phone{padding:8px;}
  .header-phone svg{width:20px;height:20px;}
  .header-book{padding:9px 13px;font-size:13px;}
  .menu-toggle{width:40px;height:40px;}
  body.nav-open .menu-toggle{top:13px;right:16px;}
  .btn{white-space:normal;}
  .btn-row .btn{width:100%;max-width:360px;}
  .hero{padding:32px 0 0;}
  .hero-copy{padding:24px 24px 44px;}
  .hero-media{width:calc(100% - 32px);aspect-ratio:4/3;max-height:none;}
  .hero-media .ph{border-radius:22px;}
  .ph img{width:60%;}
  .trust ul{gap:18px 12px;padding:28px 0 24px;}
  .trust li{flex:0 1 calc(50% - 6px);font-size:14.5px;gap:10px;}
  .trust .ring{width:46px;height:46px;}
  .eyebrow{font-size:12.5px;}
  .statement p{font-size:18px;}
  .callout{padding:36px 22px 34px;border-radius:22px;}
  .homebase{padding:32px 22px 30px;}
  .section{padding:56px 0;}
  .section-sm{padding:48px 0;}
}
/* ============================================================
   inner pages (About onward)
   ============================================================ */
.nav a[aria-current="page"]{color:var(--navy);background:var(--navy-50);}
.page-head{
  padding:76px 0 60px;text-align:center;border-bottom:1px solid var(--line);
  background:radial-gradient(820px 420px at 50% -20%,var(--teal-50) 0%,rgba(233,243,245,0) 70%),var(--paper);
}
.page-head .wrap{max-width:900px;display:flex;flex-direction:column;align-items:center;}
.page-head h1{font-size:clamp(34px,4vw,52px);}
.page-head .lede{max-width:700px;margin:20px auto 0;color:var(--muted);}
.page-head .btn-row{margin-top:30px;}
.story .split{grid-template-columns:1fr 1fr;gap:64px;}
.story h2{margin-bottom:22px;}
.story p{max-width:600px;margin:0 auto 1em;}
.story p:last-child{margin-bottom:0;}
.band-navy .section-head .sub{color:var(--on-dark);}
@media (max-width:900px){
  .page-head{padding:56px 0 44px;}
  .story .split{grid-template-columns:1fr;gap:36px;}
}
@media (max-width:640px){
  .page-head{padding:44px 0 36px;}
}

/* ---------- inner-page hero with photo ---------- */
.page-hero{
  padding:64px 0 72px;border-bottom:1px solid var(--line);
  background:radial-gradient(820px 420px at 18% -20%,var(--teal-50) 0%,rgba(233,243,245,0) 70%),var(--paper);
}
.page-hero .split{grid-template-columns:.95fr 1.05fr;gap:56px;}   /* photo column first (left) on desktop; the markup puts the photo first, so it is on top when stacked (2026-09-03) */
.page-hero h1{font-size:clamp(34px,4vw,50px);}
.page-hero .lede{max-width:560px;margin:18px auto 0;color:var(--muted);}
.page-hero .btn-row{margin-top:30px;}
.page-hero .ph{max-width:600px;}

/* ---------- open columns with dividers (no boxes) ---------- */
.columns{display:grid;grid-template-columns:repeat(4,1fr);gap:0;}
.col{padding:12px 28px;display:flex;flex-direction:column;align-items:center;text-align:center;}
.col + .col{border-left:1px solid rgba(255,255,255,.16);}
.col .ring{width:72px;height:72px;margin-bottom:20px;}
.col .ring svg{width:32px;height:32px;}
.col h3{font-size:24px;margin-bottom:10px;}
.col p{margin:0;font-size:16px;}

/* ---------- photo + feature grid split ---------- */
.split-features{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center;}
.split-features > div{display:flex;flex-direction:column;align-items:center;text-align:center;}
.split-features .ph{aspect-ratio:4/5;max-width:460px;}
.features{display:grid;grid-template-columns:1fr 1fr;gap:38px 28px;width:100%;}
.feature-item{display:flex;flex-direction:column;align-items:center;text-align:center;}
.feature-item .ring{width:56px;height:56px;margin-bottom:14px;}
.feature-item .ring svg{width:25px;height:25px;}
.feature-item h3{font-size:20px;margin-bottom:8px;}
.feature-item p{margin:0;font-size:15.5px;}

/* ---------- one panel, hairline-divided cells ---------- */
.panel{background:var(--white);border:1px solid var(--line);border-radius:28px;overflow:hidden;}
.panel-grid{display:grid;grid-template-columns:repeat(3,1fr);}
.cell{
  padding:38px 30px 34px;display:flex;flex-direction:column;align-items:center;text-align:center;
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);
}
.cell:nth-child(3n){border-right:0;}
.cell:nth-last-child(-n+3){border-bottom:0;}
.cell .ring{width:52px;height:52px;margin-bottom:16px;}
.cell .ring svg{width:24px;height:24px;}
.cell h3{font-size:20px;margin-bottom:8px;}
.cell p{margin:0;font-size:15.5px;}

@media (max-width:900px){
  .page-hero{padding:52px 0 56px;}
  .page-hero .split{grid-template-columns:1fr;gap:32px;}
  .columns{grid-template-columns:1fr 1fr;gap:36px 0;}
  .col + .col{border-left:0;}
  .col:nth-child(2n){border-left:1px solid rgba(255,255,255,.16);}
  .split-features{grid-template-columns:1fr;gap:36px;}
  .panel-grid{grid-template-columns:1fr 1fr;}
  .cell:nth-child(3n){border-right:1px solid var(--line);}
  .cell:nth-child(2n){border-right:0;}
  .cell:nth-last-child(-n+3){border-bottom:1px solid var(--line);}
  .cell:nth-last-child(-n+2){border-bottom:0;}
}
@media (max-width:640px){
  .page-hero{padding:44px 0 44px;}
  .columns{grid-template-columns:1fr;gap:0;}
  .col{padding:26px 8px;}
  .col:nth-child(2n){border-left:0;}
  .col + .col{border-top:1px solid rgba(255,255,255,.16);}
  .features{grid-template-columns:1fr;gap:30px;}
  .panel{border-radius:22px;}
  .panel-grid{grid-template-columns:1fr;}
  .cell{border-right:0;border-bottom:1px solid var(--line);}
  .cell:nth-child(2n){border-right:0;}
  .cell:last-child{border-bottom:0;}
}

/* ---------- stacked tab rows: every item visible, title sits in a folder-style tab ---------- */
.tabrows{max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:16px;}
.tabrow{
  position:relative;margin-top:45px;/* room for the tab that sits above the row */
  background:var(--white);border:1px solid var(--line);border-radius:22px;
  padding:38px 40px 36px;display:flex;flex-direction:column;align-items:center;text-align:center;
}
.tabrow h3{
  position:absolute;top:0;left:50%;transform:translate(-50%,-100%);
  display:inline-flex;align-items:center;gap:10px;
  background:var(--navy);color:var(--white);font-size:17px;font-weight:600;letter-spacing:-.01em;
  padding:12px 24px 11px;border-radius:16px 16px 0 0;white-space:nowrap;margin:0;
}
.tabrow h3 svg{width:20px;height:20px;color:var(--amber);flex-shrink:0;}
.tabrow p{margin:0;font-size:17.5px;line-height:1.65;max-width:660px;}
@media (max-width:640px){
  .tabrows{gap:14px;}
  .tabrow{margin-top:41px;padding:32px 20px 30px;border-radius:18px;}
  .tabrow h3{font-size:14.5px;padding:10px 16px 9px;}
  .tabrow p{font-size:16.5px;}
}
@media (max-width:360px){
  .tabrow{margin-top:62px;}
  .tabrow h3{white-space:normal;max-width:94%;justify-content:center;text-align:center;}
}

/* ============================================================
   components for the remaining pages (added 2026-09-03; unused until those pages exist)
   ============================================================ */
/* chips: short Title Case labels (Where … Riders Go, neighbourhoods, city lists) */
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0;padding:0;list-style:none;}
.chip{display:inline-block;font-size:14.5px;font-weight:600;color:var(--navy);background:var(--teal-50);border:1px solid var(--teal-100);border-radius:999px;padding:8px 16px;white-space:nowrap;}
.band-navy .chip{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:var(--white);}
.tabrow .chips{margin-top:4px;}
.chips + .btn-row{margin-top:28px;}

/* badges: ring icon + title + short text, no boxes; wraps 5 / 3+2 / 2+2+1 (the repeated "What Every Ride Includes" block) */
.badges{display:flex;flex-wrap:wrap;justify-content:center;gap:34px 22px;list-style:none;margin:0;padding:0;}
.badge{flex:0 1 208px;display:flex;flex-direction:column;align-items:center;text-align:center;}
.badge .ring{width:60px;height:60px;margin-bottom:14px;}
.badge .ring svg{width:26px;height:26px;}
.badge h3{font-size:19px;margin-bottom:8px;}
.badge p{margin:0;font-size:15.5px;}

/* open columns on light backgrounds */
.columns-light .col + .col{border-left-color:var(--line);}
@media (max-width:900px){.columns-light .col:nth-child(2n){border-left-color:var(--line);}}
@media (max-width:640px){.columns-light .col + .col{border-top-color:var(--line);}}

/* flexible card set: centres a short last row (3 + 2, 2 + 2 + 1) */
.cards-flex{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;}
.cards-flex > .card{flex:0 1 calc(33.333% - 16px);min-width:260px;}
@media (max-width:900px){.cards-flex > .card{flex-basis:calc(50% - 12px);}}
@media (max-width:640px){.cards-flex > .card{flex-basis:100%;min-width:0;}}

/* compact mini cards (the ten "Rides We're Built For") */
.cards-5{grid-template-columns:repeat(5,1fr);gap:16px;}
.card-mini{padding:24px 16px 22px;border-radius:18px;}
.card-mini h3{font-size:17.5px;margin:0 0 6px;}
.card-mini p{font-size:14.5px;line-height:1.5;}
@media (max-width:1100px){.cards-5{grid-template-columns:repeat(3,1fr);}}
@media (max-width:640px){.cards-5{grid-template-columns:repeat(2,1fr);gap:12px;}.card-mini{padding:18px 12px 16px;}.card-mini h3{font-size:16px;}}

/* two-up cards + photo-topped cards (airports) */
.cards-2{grid-template-columns:repeat(2,1fr);max-width:820px;margin:0 auto;}
.card-photo{padding:0 0 30px;overflow:hidden;}
.card-photo > .ph,.card-photo > img{border-radius:0;aspect-ratio:16/10;width:100%;object-fit:cover;}
.card-photo h3{margin-top:24px;padding:0 24px;}
.card-photo p{padding:0 24px;}
@media (max-width:640px){.cards-2{grid-template-columns:1fr;}}

/* feature grid: centre an odd last item */
.features > .feature-item:last-child:nth-child(odd){grid-column:1 / -1;max-width:50%;margin:0 auto;}
@media (max-width:640px){.features > .feature-item:last-child:nth-child(odd){max-width:none;}}

/* FAQ: visible text only, no FAQ schema */
.faq{max-width:820px;margin:0 auto;}
.faq-item{padding:30px 0;border-top:1px solid var(--line);text-align:center;}
.faq-item:last-child{border-bottom:1px solid var(--line);}
.faq-item h3{font-size:21px;margin-bottom:10px;}
.faq-item p{margin:0 auto;max-width:700px;}
.band-teal .faq-item{border-color:var(--teal-100);}

/* legal pages (Privacy, Terms): long-form text stays left-aligned for readability */
.legal{max-width:780px;margin:0 auto;text-align:left;}
.legal h1{font-size:clamp(32px,3.6vw,44px);}
.legal h2{font-size:24px;margin:36px 0 10px;}
.legal p,.legal li{font-size:16.5px;}
.legal ul{margin:10px 0 10px 24px;padding:0;}
.legal .legal-date{color:var(--muted);margin-bottom:26px;}


/* ---------- Services hub (added 2026-09-03) ---------- */
/* three alternating photo + text rows; the copy stays first in the markup so phones read copy, then photo */
.service-rows{display:flex;flex-direction:column;gap:80px;}
@media (min-width:901px){
  .service-rows .split{grid-template-columns:1fr 1fr;}
  .split-flip > div:first-child{order:2;}   /* desktop only: photo on the left for this row */
}
@media (max-width:900px){.service-rows{gap:60px;}}
@media (max-width:640px){.service-rows{gap:52px;}}
/* ten mini cards at tablet width (3 across): centre the lone tenth card */
@media (max-width:1100px) and (min-width:641px){.cards-5 > .card:last-child:nth-child(3n+1){grid-column:2;}}
/* a three-cell panel at tablet width (2 across): the third cell spans the full row */
@media (max-width:900px) and (min-width:641px){
  .panel-grid > .cell:last-child:nth-child(odd){grid-column:1 / -1;border-right:0;}
  .panel-grid > .cell:nth-last-child(2):nth-child(even){border-bottom:1px solid var(--line);}
}
/* badges wrap 5 / 3 + 2 / 2 + 2 + 1 (mirrors the Home trust strip; the base rule alone gave 4 + 1 on small laptops and one per row on phones) */
@media (max-width:1175px) and (min-width:641px){.badge{flex-basis:260px;}}
@media (max-width:640px){.badge{flex-basis:calc(50% - 11px);}}
/* panel on phones: the tablet rules (.cell:nth-child(3n), .cell:nth-last-child(-n+2)) outrank the single-column rules and
   dropped the hairline under the second-to-last cell (Hours / Payment here; HIPAA / ADA on About) — restated with higher specificity */
@media (max-width:640px){
  .panel .panel-grid > .cell{border-right:0;border-bottom:1px solid var(--line);}
  .panel .panel-grid > .cell:last-child{border-bottom:0;}
}
/* Rides We're Built For on desktop: four across (last row centred), wider gap, bigger type (2026-09-03); tablets and phones unchanged */
@media (min-width:1101px){
  .cards-5{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;}
  .cards-5 > .card{flex:0 1 calc(25% - 18px);}
  .cards-5 > .card-mini{padding:32px 24px 30px;border-radius:22px;}
  .cards-5 > .card-mini h3{font-size:20px;margin-bottom:8px;}
  .cards-5 > .card-mini p{font-size:16px;line-height:1.55;}
}
/* ---------- Ambulatory page (added 2026-09-03) ---------- */
/* the "Who … Is For" bullets are a real list: <ul class="features"> > <li class="feature-item"> (title only, no paragraph) */
ul.features{list-style:none;margin:0;padding:0;}
/* chip rows balance better with a cap (nine chips wrap 5 + 4 instead of 6 + 3 at desktop width) */
.chips{max-width:900px;margin-left:auto;margin-right:auto;}
/* ---------- Ambulatory page v2 (2026-09-03): four-cell panel + large chips on the teal band ---------- */
ul.panel-grid{list-style:none;margin:0;padding:0;}
.panel-grid-4{grid-template-columns:repeat(4,1fr);}
.panel .panel-grid-4 > .cell{border-right:1px solid var(--line);border-bottom:0;padding:40px 26px 36px;}
.panel .panel-grid-4 > .cell:nth-child(4n){border-right:0;}
.panel-grid-4 .cell .ring{width:60px;height:60px;margin-bottom:18px;}
.panel-grid-4 .cell .ring svg{width:27px;height:27px;}
.panel-grid-4 .cell h3{margin-bottom:0;}
@media (max-width:900px){
  .panel-grid-4{grid-template-columns:1fr 1fr;}
  .panel .panel-grid-4 > .cell{border-right:1px solid var(--line);border-bottom:1px solid var(--line);}
  .panel .panel-grid-4 > .cell:nth-child(2n){border-right:0;}
  .panel .panel-grid-4 > .cell:nth-last-child(-n+2){border-bottom:0;}
}
@media (max-width:640px){
  .panel-grid-4{grid-template-columns:1fr;}
  .panel .panel-grid-4 > .cell{border-right:0;border-bottom:1px solid var(--line);padding:30px 20px 28px;}
  .panel .panel-grid-4 > .cell:last-child{border-bottom:0;}
}
/* large chips for the "Where … Riders Go" bands: bigger pills, white when they sit on the teal band */
.chips-lg{gap:14px;max-width:800px;}   /* nine large chips wrap 3 + 3 + 3 (980px gave 4 + 4 + 1) */
.chips-lg .chip{font-size:17px;padding:13px 24px;border-width:1.5px;}
.band-teal .chip{background:var(--white);}
.chips-lg + .btn-row{margin-top:34px;}
@media (max-width:640px){.chips-lg{gap:10px;}.chips-lg .chip{font-size:15.5px;padding:11px 18px;}}
/* ---------- Wheelchair page (added 2026-09-03) ---------- */
ol.tabrows{list-style:none;padding:0;}            /* numbered tab rows are a real ordered list */
.tabrow .tab-num{color:var(--amber);font-weight:700;}   /* step number inside the navy tab */
ul.columns{list-style:none;margin:0;padding:0;}    /* open columns as a real list */
.chips-narrow{max-width:640px;}                  /* eight chips wrap 3 + 3 + 2 (the 800px cap gave 4 + 3 + 1) */

/* ---------- Areas of Service page (added 2026-09-03) ---------- */
/* region rows: city chips, then a sentence, then (Los Angeles row only) a small link button */
.tabrow .chips + p{margin-top:18px;}
.tabrow p + .btn-row{margin-top:22px;}
.tabrow .chips{max-width:760px;}   /* 18 Valley chips wrap 6 + 6 + 6 and the 5 county chips 3 + 2 (the full 818px row gave 6 + 7 + 5 and 4 + 1) */

/* ---------- Areas of Service v2 (2026-09-03 review): every region row carries a photo beside its content ---------- */
/* rows use the full content width; photo left on odd rows, right on even rows; the navy tab stays centred on the top edge */
.tabrows-photo{max-width:none;gap:20px;}
.tabrow.tabrow-photo{display:grid;grid-template-columns:360px minmax(0,1fr);gap:36px;align-items:center;padding:30px;}
.tabrow-photo:nth-child(even){grid-template-columns:minmax(0,1fr) 360px;}
.tabrow-photo:nth-child(even) > .ph{order:2;}
.tabrow-photo > .ph{border-radius:16px;}
.tabrow-photo > .tabrow-body{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0;}
.tabrow-photo .chips-narrow{max-width:640px;}   /* outranks .tabrow .chips above: the 18 Valley chips wrap 4 + 5 + 5 + 4 beside the photo (the 694px column gave 5 + 6 + 5 + 2) */
@media (max-width:900px){
  .tabrow.tabrow-photo,.tabrow-photo:nth-child(even){grid-template-columns:1fr;gap:26px;padding:26px 26px 30px;}
  .tabrow-photo:nth-child(even) > .ph{order:0;}
  .tabrow-photo > .ph{max-width:560px;margin:0 auto;}
}
@media (max-width:640px){
  .tabrow.tabrow-photo{padding:18px 18px 26px;gap:22px;}
  .tabrow-photo > .ph{border-radius:12px;}
}

/* ---------- Los Angeles page (added 2026-09-03) ---------- */
.statement + .chips{margin-top:10px;}     /* neighbourhood chips under the Rides Across the City statement */
.faq-item .btn-row{margin-top:18px;}      /* a small link button under an answer */
@media (min-width:901px){.split-flip{grid-template-columns:.9fr 1.1fr;}}   /* flipped split: the photo (left) keeps the narrower column, as in the un-flipped split; the Services hub rows keep their own 1fr 1fr rule */

/* ---------- FAQ (2026-09-03 Los Angeles review): no hairline under the last question, on every page with a FAQ ---------- */
.faq-item:last-child{border-bottom:0;}   /* same specificity as the original rule above; later in the file, so it wins */

/* ---------- Destinations page (added 2026-09-03) ---------- */
/* an h2 that takes the cell's h3 size (the four panel cells are sections of their own, so each keeps a real h2) */
.h3-size{font-size:21px;line-height:1.25;font-weight:600;letter-spacing:-.01em;}
.cell .h3-size{margin-bottom:10px;}
/* four-cell panel: 2 × 2 on desktop and tablet, one column on phones; hairline logic restated at (0,3,0) so the 3-across base rules never win */
.panel-grid-2{grid-template-columns:1fr 1fr;}
.panel .panel-grid-2 > .cell{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:44px 40px 40px;}
.panel .panel-grid-2 > .cell:nth-child(2n){border-right:0;}
.panel .panel-grid-2 > .cell:nth-last-child(-n+2){border-bottom:0;}
.panel-grid-2 .cell .ring{width:60px;height:60px;margin-bottom:18px;}
.panel-grid-2 .cell .ring svg{width:27px;height:27px;}
.panel-grid-2 .cell p{font-size:16.5px;max-width:460px;}
@media (max-width:900px){.panel .panel-grid-2 > .cell{padding:36px 28px 34px;}}
@media (max-width:640px){
  .panel-grid-2{grid-template-columns:1fr;}
  .panel .panel-grid-2 > .cell{border-right:0;border-bottom:1px solid var(--line);padding:30px 20px 28px;}
  .panel .panel-grid-2 > .cell:nth-last-child(-n+2){border-bottom:1px solid var(--line);}   /* restated: the 2 × 2 rule above outranks the single-column rule */
  .panel .panel-grid-2 > .cell:last-child{border-bottom:0;}
}
/* photo-topped airport cards carry a title only: no stray space under it */
.card-photo h3:last-child{margin-bottom:0;}
/* the fifth hospital tab ("Every Other Hospital and Medical Center in LA County") is long: below 506px it wraps onto two lines, centred, with room above the row (at 506px and up it fits on one line, so the row keeps the normal top margin) */
@media (max-width:505px){
  .tabrow.tabrow-long{margin-top:58px;}
  .tabrow.tabrow-long h3{left:0;right:0;width:max-content;max-width:94%;margin:0 auto;transform:translateY(-100%);white-space:normal;justify-content:center;text-align:center;}
}

/* ---------- Contact page (added 2026-09-03) ---------- */
/* a three-step list (the other step lists have four): three across, 2 + 1 with the last step centred on tablets, one column on phones;
   the column counts are restated inside the media queries because this rule sits later in the file than the base .steps rules */
.steps-3{grid-template-columns:repeat(3,1fr);max-width:1000px;margin-left:auto;margin-right:auto;}
@media (max-width:900px){
  .steps-3{grid-template-columns:repeat(2,1fr);}
  .steps-3 > .step:last-child{grid-column:1 / -1;width:calc(50% - 14px);justify-self:center;}
}
@media (max-width:640px){
  .steps-3{grid-template-columns:1fr;}
  .steps-3 > .step:last-child{width:auto;}
}
/* a callout with no button keeps its bottom padding even */
.callout p:last-child{margin-bottom:0;}

/* ---------- Technology section (Home, added 2026-09-04): the Duet live-tracking split on the teal band ---------- */
/* .split-flip already puts the image on the left at desktop and the copy first when stacked; the link reads as navy text with an amber underline (amber alone fails contrast as text on white) */
.split-tech .ph{max-width:600px;}
.split-tech .shot{width:100%;max-width:600px;height:auto;border-radius:28px;border:1px solid var(--line);background:var(--white);}
.split-tech .lede{margin-bottom:18px;}
.split-tech .tech-note{font-family:var(--display);font-weight:700;font-size:18px;letter-spacing:-.01em;color:var(--navy);margin:0;}
.split-tech .lede a{color:var(--navy);font-weight:600;text-decoration-color:var(--amber);text-decoration-thickness:2px;text-underline-offset:4px;}
.split-tech .lede a:hover{color:var(--teal);}

/* ---------- real photos in the slots (added 2026-09-23) ---------- */
/* Home hero: the image fills the photo card and is center-cropped (the card is nearly square on a desktop, 16:10 stacked, 4:3 on phones) */
.hero-media .hero-frame{position:absolute;inset:0;border-radius:28px;overflow:hidden;}   /* pinned to all four edges, so its height never depends on a percentage of the grid cell (Safari left the image at 4:3 with the percentage version, 2026-09-23) */
.hero-media .hero-img{display:block;width:100%;height:100%;object-fit:cover;border-radius:28px;}
/* every other 4:3 slot: same box as the placeholder it replaces */
img.photo{display:block;width:100%;height:auto;border-radius:28px;margin:0 auto;}
.page-hero .photo{max-width:600px;}
.tabrow-photo > .photo{border-radius:16px;}
@media (max-width:640px){
  .hero-media .hero-frame,.hero-media .hero-img{border-radius:22px;}
  .tabrow-photo > .photo{border-radius:12px;}
}

/* Areas of Service region rows with real photos (added 2026-09-23): same placement rules as the placeholder */
.tabrow-photo:nth-child(even) > .photo{order:2;}
@media (max-width:900px){
  .tabrow-photo:nth-child(even) > .photo{order:0;}
  .tabrow-photo > .photo{max-width:560px;margin:0 auto;}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none !important;scroll-behavior:auto !important;}
  .btn:hover,.card:hover{transform:none;}
}
