/* site-chrome.css: shared header + footer for rickduncan.net static pages.
   Matches the "Rick Duncan Game Day" blog theme (blog.rickduncan.net).
   Load AFTER the page's own CSS. Only touches the chrome; page content keeps its own styles.
   Contrast rules: orange text only on Navy; never white text on Orange or Summitt Blue. */

@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("fonts/Inter-Variable.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:italic;font-weight:100 900;font-display:swap;
  src:url("fonts/Inter-Italic-Variable.woff2") format("woff2")}

:root{
  --rd-orange:#FF8200;
  --rd-summitt:#489FDF;
  --rd-ink:#14161A;
  --rd-white:#FFFFFF;
  --rd-navy:#13294B;
  --rd-font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

/* Page frame: header, content, footer; footer sits at the bottom on short pages.
   Replaces the old body padding (2.5rem 1rem) with padding on <main>. */
body.rd-chrome{padding:0;min-height:100vh;display:flex;flex-direction:column;-webkit-text-size-adjust:100%}
.rd-main{flex:1 0 auto;padding:2.5rem 1rem 0}
.rd-main:focus{outline:none}

/* Visually hidden, still read by screen readers */
.rd-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Skip link: hidden until focused, then Navy text on white */
.rd-skip-link{position:absolute;left:1rem;top:-100px;z-index:1000;background:var(--rd-white);color:var(--rd-navy);
  font:700 1rem/1.2 var(--rd-font);padding:.7rem 1rem;border-radius:6px;text-decoration:none;
  box-shadow:0 2px 10px rgba(0,0,0,.25)}
.rd-skip-link:focus{top:1rem;outline:3px solid var(--rd-orange);outline-offset:2px}

/* Shared inner width (blog wideSize 1120px, 1.25rem side padding) */
.rd-site-header__inner,.rd-site-footer__inner{max-width:1120px;margin:0 auto;display:flex;flex-wrap:wrap;
  justify-content:space-between;align-items:center}

/* ---------- Header ---------- */
.rd-site-header{display:block;text-align:left;margin:0;background:var(--rd-navy);color:var(--rd-white);
  border-bottom:6px solid var(--rd-orange);padding:1.4rem 1.25rem;font-family:var(--rd-font);line-height:1.6}
.rd-site-header__inner{gap:1.5rem}
.rd-site-header .rd-brand{display:flex;flex-direction:column;gap:.2rem;min-width:0}
.rd-site-header .rd-wordmark{margin:0;padding:0;font-family:var(--rd-font);font-size:1.9rem;font-weight:800;
  letter-spacing:-0.025em;line-height:1.1;color:var(--rd-white)}
.rd-site-header .rd-wordmark a{color:var(--rd-white);text-decoration:none}
.rd-site-header .rd-wordmark a:hover{text-decoration:none}
.rd-site-header .rd-wordmark a{display:inline-flex;align-items:center;gap:.5rem}
/* RD Weave monogram (favicon cut, since it renders under 64px). 40px tile, glyph ~35px tall; the gap plus
   the file's own side margin gives >=25% of the mark's width as clear space. Tagline lines up with the title. */
.rd-site-header .rd-mark{display:block;flex:none;width:40px;height:40px;margin:-4px 0;padding:0;border:0;max-width:none}
.rd-site-header .rd-brand:has(.rd-mark) .rd-tagline{padding-left:calc(40px + .5rem)}
.rd-site-header .rd-tagline{margin:0;padding:0;color:var(--rd-summitt);font-size:1rem;line-height:1.6}
.rd-site-header .rd-nav ul{display:flex;flex-wrap:wrap;gap:.25rem;list-style:none;margin:0;padding:0;font-size:1rem}
.rd-site-header .rd-nav li{margin:0;padding:0}
.rd-site-header .rd-nav a{display:block;color:var(--rd-orange);font-weight:700;padding:.45rem .85rem;
  text-decoration:none;line-height:1.6}
.rd-site-header .rd-nav a:hover{text-decoration:underline;text-underline-offset:3px}
.rd-site-header .rd-nav a[aria-current="page"]{color:var(--rd-white);box-shadow:inset 0 -3px 0 var(--rd-orange)}
.rd-site-header a:focus-visible,.rd-site-footer a:focus-visible{outline:3px solid var(--rd-white);outline-offset:3px;border-radius:4px}

/* ---------- Footer ---------- */
.rd-site-footer{display:block;text-align:left;border:0;background:var(--rd-navy);color:var(--rd-white);
  padding:1.5rem 1.25rem;margin:3rem 0 0;font-family:var(--rd-font);font-size:.9rem;line-height:1.6}
.rd-site-footer__inner{gap:1.5rem}
.rd-site-footer .rd-copyright{margin:0;padding:0;color:var(--rd-white);font-size:.9rem}
.rd-site-footer .rd-social{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0}
.rd-site-footer .rd-social li{margin:0;padding:0}
.rd-site-footer .rd-social a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;
  padding:0;border:1.5px solid var(--rd-summitt);border-radius:50%;color:var(--rd-summitt);text-decoration:none;
  transition:background-color .15s ease,color .15s ease}
.rd-site-footer .rd-social svg{width:20px;height:20px;fill:currentColor;display:block}
.rd-site-footer .rd-social a:hover{background:var(--rd-summitt);color:var(--rd-ink)}

/* ---------- Mobile: stack brand above nav ---------- */
@media (max-width:640px){
  .rd-site-header{padding:1.1rem 1.25rem .9rem}
  .rd-site-header__inner{flex-direction:column;align-items:flex-start;gap:.6rem}
  .rd-site-header .rd-wordmark{font-size:1.6rem}
  .rd-site-header .rd-mark{width:36px;height:36px}
  .rd-site-header .rd-brand:has(.rd-mark) .rd-tagline{padding-left:calc(36px + .5rem)}
  .rd-site-header .rd-nav{margin-left:-.85rem}
  .rd-main{padding-top:2rem}
}

@media (prefers-reduced-motion:reduce){
  .rd-site-footer .rd-social a{transition:none}
}