/* Brighton Flyway Transport — unified public brand system, 14 Sep 2026 */
:root{
  --bft-brand-orange:#cf4800;
  --bft-accent-light:#a63b00;
  --bft-accent-dark:#f16419;
  --bft-ink:#0b0b0b;
  --bft-cream:#fbf6ed;
  --bft-surface:#ffffff;
  --bft-muted:#615b54;
  --bft-line:#e4dbd1;
  --bft-page-gutter:clamp(20px,4.2vw,68px);
  --bft-container:1560px;
  --bft-radius:18px;
  --bft-radius-lg:22px;
  --bft-shadow:0 20px 52px rgba(42,31,21,.13);
  --bft-header-height:78px;
}

/* One customer-facing header language across the homepage and static pages. */
.public-site-header{
  min-height:var(--bft-header-height)!important;
  height:auto!important;
  padding:12px var(--bft-page-gutter)!important;
  background:var(--bft-ink)!important;
  color:#fff!important;
  border:0!important;
  border-bottom:1px solid #252525!important;
  display:grid!important;
  grid-template-columns:minmax(250px,1fr) auto auto auto!important;
  align-items:center!important;
  gap:clamp(12px,2vw,28px)!important;
  position:relative;
  z-index:90;
}
.public-site-header .public-brand{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
  text-decoration:none!important;
  color:#fff!important;
  background:transparent!important;
  border:0!important;
  padding:0!important;
  text-align:left!important;
  cursor:pointer;
}
.public-site-header .brand-mark,
.public-site-header .seo-brand-mark{
  color:var(--bft-accent-dark)!important;
  background:transparent!important;
  width:auto!important;
  height:auto!important;
  border-radius:0!important;
  box-shadow:none!important;
  font-size:25px!important;
  transform:rotate(-10deg)!important;
}
.public-site-header .brand-copy strong,
.public-site-header .seo-brand strong{
  display:block!important;
  color:#fff!important;
  font-size:17px!important;
  line-height:1.05!important;
  letter-spacing:-.035em!important;
  font-weight:900!important;
  white-space:nowrap;
}
.public-site-header .brand-copy strong em,
.public-site-header .seo-brand strong span{color:var(--bft-accent-dark)!important}
.public-site-header .brand-copy small,
.public-site-header .seo-brand small{
  display:block!important;
  margin-top:5px!important;
  color:#979797!important;
  font-size:12px!important;
  line-height:1.25!important;
  letter-spacing:.12em!important;
  font-weight:800!important;
  white-space:nowrap;
}
.public-site-header .public-nav{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  width:auto!important;
  overflow:visible!important;
}
.public-site-header .public-nav a,
.public-site-header .public-nav .nav-link{
  display:inline-flex!important;
  align-items:center!important;
  min-height:42px!important;
  padding:10px 11px!important;
  color:#e9e9e9!important;
  background:transparent!important;
  border:0!important;
  border-radius:10px!important;
  font-size:14px!important;
  line-height:1.2!important;
  font-weight:800!important;
  text-decoration:none!important;
  white-space:nowrap;
}
.public-site-header .public-nav a:hover,
.public-site-header .public-nav a[aria-current="page"],
.public-site-header .public-nav .nav-link:hover,
.public-site-header .public-nav .nav-link.active{
  color:#fff!important;
  background:#202024!important;
  box-shadow:none!important;
}
.public-booking-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:11px 18px;
  border-radius:999px;
  background:var(--bft-accent-light);
  color:#fff!important;
  text-decoration:none!important;
  font-size:14px;
  line-height:1;
  font-weight:900;
  white-space:nowrap;
  box-shadow:0 8px 24px rgba(166,59,0,.18);
}
.public-booking-cta:hover{background:#8d3200!important;transform:translateY(-1px)}
.public-site-header .phone,
.public-site-header .seo-phone{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-end!important;
  justify-content:center!important;
  min-width:118px!important;
  padding:0!important;
  margin:0!important;
  color:#fff!important;
  text-decoration:none!important;
  text-align:right!important;
}
.public-site-header .phone:before{display:none!important}
.public-site-header .phone span,
.public-site-header .phone small,
.public-site-header .seo-phone small{
  display:block!important;
  color:#8f8f8f!important;
  font-size:12px!important;
  line-height:1.2!important;
  letter-spacing:.04em!important;
  margin:0 0 3px!important;
  text-transform:none!important;
}
.public-site-header .phone strong,
.public-site-header .seo-phone strong{font-size:14px!important;line-height:1.15!important;color:#fff!important}

/* Shared visual rhythm for all public marketing surfaces. */
#customer-view,.seo-page,body:has(.seo-hero){background:var(--bft-cream)}
#customer-view .hero,
.seo-hero,
.breadcrumb,
.seo-section,
.area-proof-strip{max-width:var(--bft-container)!important}
#customer-view .hero{padding-left:var(--bft-page-gutter)!important;padding-right:var(--bft-page-gutter)!important}
.seo-hero{padding:72px var(--bft-page-gutter) 68px!important;gap:clamp(38px,5vw,76px)!important}
.seo-section{padding-left:var(--bft-page-gutter)!important;padding-right:var(--bft-page-gutter)!important}
.breadcrumb{padding-left:var(--bft-page-gutter)!important;padding-right:var(--bft-page-gutter)!important}
.seo-card,.fleet-card,.faq details,.directory-card,.area-guide-card,.area-city-card{border-radius:var(--bft-radius)!important}
.seo-photo{border-radius:var(--bft-radius-lg)!important;box-shadow:var(--bft-shadow)!important;background:#161616!important}
.seo-photo img{transition:transform .45s ease;object-position:center center}
.seo-photo:hover img{transform:scale(1.018)}
.seo-photo:before{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  border-radius:inherit;
  pointer-events:none;
}
.seo-photo[data-visual="about"] img{object-position:62% 55%}
.seo-photo[data-visual="airports"] img{object-position:center 58%}
.seo-photo[data-visual="area"] img{object-position:center center}
.seo-photo[data-visual="vehicle"] img{object-position:center 52%}
.seo-photo[data-visual="service"] img{object-position:center 55%}

/* Accessible contextual use of one orange brand system. */
.seo-kicker,.seo-hero h1 em,.seo-card a:hover,.price-table .price-value,.supplement-grid strong,
.vehicles-page .vehicle-capacity b,.area-city-badge,.area-guide-meta,.area-section-kicker,
#customer-view .hero h1 span{color:var(--bft-accent-light)!important}
.announcement i,.announcement strong,.footer-cta h2 em,.seo-footer h2 span,
.route-box h2 span,.seo-footer-links a:hover{color:var(--bft-accent-dark)!important}
.seo-btn.primary,.hero-cta-solid,#customer-view .primary,.footer-cta>a,.seo-crosslink{
  background:var(--bft-accent-light)!important;
  border-color:var(--bft-accent-light)!important;
  color:#fff!important;
}
.seo-btn.primary:hover,.hero-cta-solid:hover,#customer-view .primary:hover,.footer-cta>a:hover{background:#8d3200!important;border-color:#8d3200!important}

/* Make booking the unmistakable homepage action. */
#customer-view .hero-actions{gap:12px!important;margin-bottom:34px!important}
#customer-view .hero-actions .hero-cta-solid{min-height:50px!important;padding:14px 22px!important;font-size:15px!important}
#customer-view .hero-actions .how-link{display:none!important}

/* Mobile: brand + booking + menu. Navigation opens below as a single task-focused panel. */
@media(max-width:1120px){
  .public-site-header{grid-template-columns:minmax(220px,1fr) auto auto!important;gap:10px!important}
  .public-site-header .public-nav{order:4;grid-column:1/-1}
  .public-site-header .phone,.public-site-header .seo-phone{display:none!important}
}
@media(max-width:900px){
  .public-site-header{grid-template-columns:minmax(0,1fr) auto auto!important;min-height:72px!important;padding:10px 14px!important}
  .public-site-header .public-booking-cta{min-height:42px;padding:10px 14px;font-size:13px}
  .public-site-header .public-menu-toggle{display:inline-flex!important;order:3}
  .public-site-header .public-nav{
    display:none!important;
    position:absolute!important;
    top:calc(100% + 8px)!important;
    left:12px!important;
    right:12px!important;
    z-index:100!important;
    padding:10px!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:4px!important;
    background:#0d0d0f!important;
    border:1px solid #303033!important;
    border-radius:16px!important;
    box-shadow:0 18px 42px rgba(0,0,0,.26)!important;
  }
  .public-site-header.nav-open .public-nav{display:flex!important}
  .public-site-header .public-nav a,.public-site-header .public-nav .nav-link{min-height:46px!important;padding:12px 14px!important;font-size:15px!important;color:#fff!important}
  .public-site-header .brand-copy strong,.public-site-header .seo-brand strong{font-size:15px!important}
  .public-site-header .brand-copy small,.public-site-header .seo-brand small{display:none!important}
  .seo-hero{padding-top:54px!important}
}
@media(max-width:620px){
  .public-site-header{gap:8px!important}
  .public-site-header .brand-mark,.public-site-header .seo-brand-mark{font-size:21px!important}
  .public-site-header .public-booking-cta{padding:9px 12px!important;font-size:12px!important}
  .public-site-header .public-menu-toggle{min-width:44px!important;padding:0 10px!important}
  .public-site-header .public-menu-toggle .menu-label{display:none}
  .seo-hero{padding:44px 18px 48px!important;gap:28px!important}
  .seo-section{padding-left:18px!important;padding-right:18px!important}
  .breadcrumb{padding-left:18px!important;padding-right:18px!important}
}
@media(prefers-reduced-motion:reduce){.seo-photo img,.public-booking-cta{transition:none!important}.seo-photo:hover img,.public-booking-cta:hover{transform:none!important}}

.announcement .announcement-route{color:#cf4800!important}
