/* Center public transportation content consistently at every width. */
html body header{flex-direction:column;justify-content:center;gap:20px;text-align:center}
html body header nav{justify-content:center;flex-wrap:wrap}
html body header .brand{margin-inline:auto;text-align:center}
html body main,html body footer{text-align:center}
html body main :is(h1,h2,h3,p,figcaption,summary,dt,dd,.eyebrow,.intro,.subtle,.approved-fare,.booking-routes,.route-directory){text-align:center}
html body main :is(h1,h2,h3,p,.intro,.subtle,.hero-copy,.approved-fare){margin-inline:auto}
html body main :is(.hero,.route-hero){grid-template-columns:minmax(0,1fr);justify-items:center;gap:30px;max-width:1160px}
html body main :is(.hero-copy,.route-hero>div){width:100%;max-width:850px}
html body main .hero .intro{max-width:680px}
html body main .hero figure{width:100%;max-width:740px;min-height:440px;margin-inline:auto}
html body main .route-hero>img,html body main .route-hero>figure{width:100%;max-width:740px;margin-inline:auto}
html body main :is(.section-head,.booking){display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:20px}
html body main .section-head p:last-child{max-width:680px}
html body main :is(.actions,.hero-actions,.contact-actions,.strip){justify-content:center!important}
html body main .route-details{grid-template-columns:minmax(0,1fr);max-width:1000px;justify-items:center}
html body main .route-details>aside{width:100%;max-width:700px}
html body main :is(.route-details ul,.route-details ol){list-style-position:inside;padding-inline:0;text-align:center}
html body main .destination{position:relative;justify-content:center;padding-inline:24px;text-align:center}
html body main .destination span[aria-hidden]{position:absolute;right:4px;top:50%;transform:translateY(-50%)}
html body main :is(.approved-fare-grid>div,.booking-route-grid>li,.route-directory-columns>div){min-width:0;text-align:center}
html body main .approved-fare{text-align:center!important;width:100%}
html body main .approved-fare p{max-width:720px}
html body main .booking-routes{box-sizing:border-box;width:calc(100% - 32px)}
html body main .booking-routes input{max-width:700px;margin-inline:auto}
html body main :is(.route-directory,.partner-section,.related){margin-inline:auto}
html body footer :is(p,h2,h3,nav){text-align:center;margin-inline:auto;justify-content:center}
@media(max-width:650px){html body main .hero figure{min-height:340px}html body main .hero h1,html body main .route-hero h1{font-size:clamp(1.9rem,8vw,2.8rem);line-height:1.18;overflow-wrap:break-word}html body main .hero .island-headline{font-size:clamp(1.9rem,8vw,2.8rem)}html body main .approved-fare-grid{grid-template-columns:minmax(0,1fr)}html body main .strip{justify-content:center!important}html body header nav>a:first-child{display:inline-flex}}

/* One consistent, left-to-right transportation brand on every public page. */
html body header .shuttle-brand{display:block!important;width:100%;max-width:100%;margin-inline:auto!important;text-align:center!important;direction:ltr;letter-spacing:0!important;line-height:1.3}
html body header .shuttle-brand .shuttle-brand-name{display:block!important;color:var(--ink,#143e38);font-family:Manrope,sans-serif;font-size:clamp(15px,3.75vw,27px);font-weight:600;letter-spacing:0;line-height:1.35;white-space:nowrap!important;text-align:center!important}
html body header .shuttle-brand small{display:block;margin-top:8px;font-size:11px;letter-spacing:1.5px;line-height:1.5;text-align:center}
