/* ============================================================
   OSPIPO — Cockpit reskin layer for interior pages.
   Loads AFTER each page's original CSS and restyles it to match
   the homepage. Content, structure, scripts and SEO untouched.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');

/* ---- palette shift to the near-black cockpit ---- */
:root{
  --navy:#0B0C0E!important; --black:#080809!important; --black-2:#101114!important;
  --navy-2:#16181D!important; --navy-3:#1F222A!important;
  --gold:#C9A85C!important; --gold-2:#E0C281!important;
  --ivory:#F4EEE4!important; --text:#E7E7E9!important; --muted:#9AA0AA!important;
  --border:rgba(255,255,255,.08)!important; --success:#4ADE80!important;
  --ck-mono:'JetBrains Mono',ui-monospace,monospace;
  --c1:#35E0FF; --c2:#5B8CFF; --c3:#9B6BFF; --c4:#FF4D8D; --c5:#FF6A3D;
}
@keyframes ckAmb2{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes ckBreath2{0%,100%{opacity:.4;transform:scale(1)}50%{opacity:.75;transform:scale(1.08)}}
@keyframes ckReveal{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}

html,body{background:#0B0C0E!important}
body{color:var(--text)}

/* ambient glow behind everything */
.ck-amb-bg{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 50% 22%,rgba(91,140,255,.16),transparent 55%);animation:ckBreath2 14s ease-in-out infinite;filter:blur(36px)}
.ck-rail{position:fixed;top:0;left:0;height:2px;width:0;z-index:9998;background:linear-gradient(90deg,var(--c1),var(--c3),var(--c5));box-shadow:0 0 12px rgba(155,107,255,.6)}
main,header,footer,section{position:relative;z-index:1}

/* ---- header / nav ---- */
header{background:rgba(11,12,14,.72)!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important;border-bottom:1px solid var(--border)!important;position:sticky!important;top:0;z-index:100}
header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--c1),var(--c2),var(--c3),var(--c4),var(--c5),var(--c1));background-size:200% 100%;animation:ckAmb2 9s linear infinite;opacity:.85}
.logo-mark,.logo b,.logo{color:var(--ivory)}
.nav-cta{background:var(--gold)!important;color:#0B0C0E!important;border-radius:9px!important;font-weight:700!important;box-shadow:0 6px 20px rgba(201,168,92,.28)}
.nav-cta:hover{background:var(--gold-2)!important}
.mobile-route-chips,.mobile-menu{background:rgba(11,12,14,.96)!important}

/* ---- hero (route/generic) ---- */
.hero-route,.hero,.hero-compact,.hero-extended,.page-hero{background:#0B0C0E!important;border-bottom:1px solid var(--border)!important}
.hero-route::after,.hero::after,.hero-compact::after{background:linear-gradient(180deg,rgba(11,12,14,.55) 0%,rgba(11,12,14,.8) 60%,#0B0C0E 100%)!important}
.hero-route h1,.hero h1,.hero-compact h1{color:var(--ivory)!important}
.hero-route h1 em,.hero h1 em,.section-title em,h2 em,.rb-section-title em{font-family:'Instrument Serif',serif!important;font-style:italic!important;color:var(--gold)!important}
.hero-badge,.hero-route-badge,.badge,.trust-badge{border:1px solid var(--border)!important;background:rgba(201,168,92,.1)!important;color:var(--gold)!important;font-family:var(--ck-mono)!important;letter-spacing:.08em!important;text-transform:uppercase}

/* ---- section labels → mono telemetry ---- */
.section-label,.rb-section-label,.qa-label,.eyebrow{font-family:var(--ck-mono)!important;letter-spacing:.3em!important;text-transform:uppercase!important;color:var(--gold)!important;font-size:11px!important}
.section-title,.rb-section-title{color:var(--ivory)!important}

/* ---- surfaces / cards ---- */
.feature-card,.route-card,.review-card,.compare-table,.quick-answer,.faq-item,.concierge-card,.concierge-standard .concierge-copy,.price-card,.info-card,.persona-card,.stat-card,.aside-card,aside,.rb-card,.rb-fare-box,.booking-card{
  background:var(--navy-2)!important;border:1px solid var(--border)!important;border-radius:16px!important
}
.feature-card:hover,.route-card:hover,.persona-card:hover{border-color:var(--gold)!important;transform:translateY(-3px);transition:all .25s}
.compare-row{border-color:var(--border)!important}
.compare-row.header{background:rgba(201,168,92,.08)!important;color:var(--gold)!important}
.compare-row.highlight,.compare-row.ospipo{background:rgba(201,168,92,.06)!important;border-color:var(--gold)!important}
.price-pill,.route-card-price,.hero-price,.rb-fare-total,.price-chip-value{font-family:var(--ck-mono)!important;color:var(--gold)!important}

/* ---- buttons ---- */
.btn-primary,.rb-submit,.cta-btn,.btn-gold,.hero-route-ctas .btn,button.primary{background:var(--gold)!important;color:#0B0C0E!important;border-radius:12px!important;font-weight:700!important;box-shadow:0 10px 30px rgba(201,168,92,.28)}
.btn-primary:hover,.rb-submit:hover{background:var(--gold-2)!important;transform:translateY(-2px)}
.btn-ghost,.btn-secondary,.btn-outline{background:transparent!important;color:var(--ivory)!important;border:1px solid var(--border)!important}
.btn-ghost:hover,.btn-outline:hover{border-color:var(--gold)!important;color:var(--gold)!important}

/* ---- FAQ ---- */
.faq-item{margin-bottom:0!important;border-radius:0!important;border-left:none!important;border-right:none!important;border-top:none!important;border-bottom:1px solid var(--border)!important;background:transparent!important}
.faq-question{color:var(--ivory)!important}
.faq-question:hover{color:var(--gold)!important}
.faq-icon{border:1px solid var(--border)!important;color:var(--gold)!important;border-radius:50%!important}
.faq-answer{color:var(--muted)!important}

/* ---- booking widget (route pages) ---- */
.rb-booking,.booking{background:#0B0C0E!important;border-top:1px solid var(--border)!important;border-bottom:1px solid var(--border)!important}
.rb-input,.rb-select,.booking input,.booking select,.booking textarea,.rb-field input{background:rgba(0,0,0,.3)!important;border:1px solid var(--border)!important;border-radius:12px!important;color:var(--ivory)!important}
.rb-input:focus,.booking input:focus{border-color:var(--gold)!important;outline:none!important}

/* ---- trust / marquee strips ---- */
.trust-strip,.trust-band,.trust-strip-inner{background:rgba(0,0,0,.35)!important;color:var(--muted)!important;border-color:var(--border)!important}
.trust-strip-item{font-family:var(--ck-mono)!important;letter-spacing:.08em}

/* ---- footer ---- */
footer{background:#080809!important;border-top:1px solid var(--border)!important}
footer h5{font-family:var(--ck-mono)!important;letter-spacing:.18em!important;color:var(--gold)!important;text-transform:uppercase}
footer a{color:var(--muted)!important}
footer a:hover{color:var(--gold)!important}
.footer-legal,.jet-disclaimer{color:var(--muted)!important}

/* ---- sticky mobile CTA ---- */
.ospipo-mobile-fab .fab-btn,.mobile-cta,.sticky-cta{background:var(--gold)!important;color:#0B0C0E!important;border-radius:14px!important;font-weight:700!important}

/* ---- reveal-on-scroll (added by enhance.js) ---- */
.ck-rv{opacity:0}
.ck-rv.ck-in{animation:ckReveal .7s cubic-bezier(.2,.7,.2,1) forwards}

/* ---- breadcrumbs ---- */
.breadcrumb,.breadcrumbs{color:var(--muted)!important;font-family:var(--ck-mono)!important;font-size:12px}
.breadcrumb a,.breadcrumbs a{color:var(--gold)!important}

@media(prefers-reduced-motion:reduce){*{animation:none!important}.ck-rv{opacity:1!important}}
