/* ============================================================
   Gulf to Orbit — base.css
   Cross-cutting concerns shared by every page.
   Per-page inline <style> blocks handle layout/components.
   ============================================================ */

/* --- Accessibility: skip-to-content link --- */
.skip-link{
  position:absolute;top:-40px;left:8px;z-index:9999;
  padding:10px 18px;
  background:#0D1B2A;color:#F5F0E8;
  font-family:'Inter',sans-serif;font-size:13px;font-weight:600;
  text-decoration:none;border-radius:4px;
  transition:top .15s ease;
}
.skip-link:focus{top:8px;outline:2px solid #C4342D;outline-offset:2px;}

/* --- Accessibility: clear focus rings for keyboard users --- */
:focus{outline:none;}
:focus-visible{
  outline:2px solid #C4342D;
  outline-offset:2px;
  border-radius:2px;
}
/* exception: form controls keep their own focus styles */
input:focus-visible,textarea:focus-visible,button:focus-visible{outline-offset:3px;}

/* --- Reduced motion: honor OS-level preference --- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  /* kill fixed/parallax backgrounds that can trigger vertigo */
  .hero-bg,.article-hero-bg{background-attachment:scroll !important;}
  html{scroll-behavior:auto !important;}
}

/* --- Print styles: readable without the nav/footer chrome --- */
@media print{
  .nav,footer,.hero-form,.skip-link,.hero-credit{display:none !important;}
  body{background:#fff !important;color:#000 !important;}
  a{color:#000 !important;text-decoration:underline;}
  .hero,.article-hero{min-height:auto !important;padding:20px 0 !important;}
  .hero-bg,.article-hero-bg,.hero::before,.article-hero::before{display:none !important;}
  .hero *,.article-hero *{color:#000 !important;}
}

/* --- Selection highlight in brand color --- */
::selection{background:#C4342D;color:#F5F0E8;}

/* --- Breadcrumbs (shared) --- */
.breadcrumbs{background:var(--ink,#0B1520);border-bottom:1px solid rgba(245,240,232,0.08);padding:14px 0;margin-top:78px;}
.breadcrumbs .inner{max-width:1320px;margin:0 auto;padding:0 48px;}
.breadcrumbs ol{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0;font-family:'Inter',sans-serif;font-size:10px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:rgba(245,240,232,0.5);}
.breadcrumbs li+li::before{content:'/';margin-right:10px;color:rgba(245,240,232,0.3);}
.breadcrumbs a{color:rgba(245,240,232,0.7);border-bottom:1px solid transparent;transition:border-color .2s,color .2s;}
.breadcrumbs a:hover{color:var(--bone,#F4EEE2);border-bottom-color:rgba(245,240,232,0.4);}
.breadcrumbs [aria-current="page"]{color:var(--brass,#C9A86B);}
.breadcrumbs + .hero{margin-top:0;}
@media(max-width:700px){.breadcrumbs .inner{padding:0 24px;}}

/* --- Hero credit line (shared) --- */
.hero-credit{position:absolute;bottom:16px;right:24px;font-family:'Inter',sans-serif;font-size:10px;color:rgba(245,240,232,0.35);letter-spacing:1px;text-transform:uppercase;z-index:2;}
.hero-credit a{color:rgba(245,240,232,0.5);text-decoration:none;border-bottom:1px solid transparent;transition:all .2s;}
.hero-credit a:hover{color:rgba(245,240,232,0.8);border-bottom-color:rgba(245,240,232,0.4);}

/* --- Preview card WIP badge (shared) --- */
.preview-card-wip{position:absolute;top:12px;right:12px;padding:4px 10px;background:rgba(11,21,32,0.7);border:1px solid rgba(245,240,232,0.15);border-radius:4px;font-family:'Inter',sans-serif;font-size:9px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:rgba(245,240,232,0.6);pointer-events:none;}

/* --- Mobile tightening (320px–428px) --- */
@media(max-width:480px){
  .breadcrumbs .inner{padding:0 20px;}
  .breadcrumbs{margin-top:60px;padding:12px 0;}
}
