/* Kingfisher Defense public site, Round 3 "A calm" theme (Will's pick, 2026-10-07).
   Loaded AFTER v441.css: it swaps the dark layout for a light, calm one (white header, navy text, serif headlines, one amber button,
   a dark hero) without touching the approved copy or the page structure. No inline styles (CSP). Fonts: self-hosted only; until the
   font files are added the serif/sans stacks below fall back to Georgia / system sans. */
:root {
  --a-navy: #14203A;
  --a-ink: #0B1220;
  --a-amber: #EE8118;
  --a-amber-hover: #FF9A3C;
  --a-amber-soft: #FDE8D2;
  --a-teal: #0B6A6D;
  --a-line: #E4E7EC;
  --a-mute: #4A5870;
  --a-panel: #F7F8FA;
  --a-serif: "Fraunces", Georgia, "Times New Roman", serif;
  --a-sans: "Libre Franklin", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --kf-focus-ring: 3px solid #0B6A6D;
}
html { color-scheme: light; }
body { background: #fff; color: var(--a-navy); font-family: var(--a-sans); line-height: 1.6; }
h1, h2, h3 { color: var(--a-navy); font-family: var(--a-serif); font-weight: 600; letter-spacing: -.005em; }
a { color: var(--a-teal); }
a:hover { color: var(--a-navy); }
.kf-wrap { max-width: 1160px; padding: 0 2rem; }
.kf-skip { background: var(--a-navy); color: #fff; }

/* header */
.kf-site-header { background: #fff; border-bottom: 1px solid var(--a-line); backdrop-filter: none; }
.kf-site-header__inner { padding: .7rem 1.5rem; max-width: 1240px; }
.kf-logo { display: flex; align-items: center; gap: .7rem; text-decoration: none; }
.kf-logo img { height: 56px; }
.kf-logo::after { content: "KINGFISHER DEFENSE"; font-weight: 700; letter-spacing: .04em; font-size: 1rem; color: var(--a-navy); }
.kf-nav__link { color: var(--a-navy); font-weight: 600; }
.kf-nav__link:hover { color: var(--a-amber); }
.kf-current-link { color: var(--a-navy); border-bottom: 2px solid var(--a-amber); }
.kf-dd { background: #fff; border: 1px solid var(--a-line); box-shadow: 0 14px 40px rgba(20, 32, 58, .14); border-radius: 12px; }
.kf-dd__link { color: var(--a-navy); }
.kf-dd__link:hover { background: var(--a-panel); color: var(--a-navy); }
.kf-dd__link strong { color: var(--a-navy); }
.kf-dd__link span { color: var(--a-mute); opacity: 1; }
.kf-dd__item--star .kf-dd__link { border-left-color: var(--a-amber); }
.kf-menu-btn { border-color: var(--a-line); color: var(--a-navy); }
.kf-overlay { background: rgba(11, 18, 32, .5); }

/* buttons: one amber button (navy-black text), outlined secondary */
.kf-btn { border-radius: 6px; }
.kf-btn--primary { background: #EE8118; color: #14203A; }
.kf-btn--primary:hover { background: #FF9A3C; color: #14203A; }
.kf-btn--secondary { border-color: var(--a-navy); color: var(--a-navy); }
.kf-btn--secondary:hover { background: var(--a-panel); color: var(--a-navy); }
.kf-btn--tertiary { color: var(--a-teal); }
.kf-hero .kf-btn--secondary { border-color: #6B7C99; color: #F5F7FA; }
.kf-hero .kf-btn--secondary:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.kf-hero .kf-btn--tertiary { color: #EE8118; }

/* hero: the one dark moment */
.kf-hero { background: #14203A; color: #D3DAE8; padding: 4.5rem 0 4rem; border-bottom: 0; }
.kf-hero h1, .kf-hero h2, .kf-hero h3, .kf-hero .kf-bold, .kf-hero .kf-question { color: #F5F7FA; }
.kf-hero h1 { font-size: clamp(2.25rem, 5vw, 4rem); line-height: 1.08; }
.kf-hero a:not(.kf-btn) { color: #EE8118; }
.kf-hero .kf-wrap > p:not(.kf-actions) { font-size: 1.15rem; color: #C3CCDB; }

/* bands: white and soft grey, calm spacing */
.kf-band { padding: 4.5rem 0; border-bottom: 0; background: #fff; }
.kf-band:nth-of-type(even) { background: var(--a-panel); }
.kf-major { border-left: 6px solid var(--a-amber); }
.kf-bold, .kf-flow { color: var(--a-navy); }
.kf-question { color: var(--a-navy); border-left: 5px solid var(--a-amber); }
.kf-convert { background: var(--a-navy); color: #C3CCDB; }
.kf-convert h1, .kf-convert h2, .kf-convert h3, .kf-convert .kf-bold { color: #F5F7FA; }
.kf-convert a:not(.kf-btn) { color: #EE8118; }
.kf-convert .kf-btn--secondary { border-color: #6B7C99; color: #F5F7FA; }
.kf-pair__item { background: #fff; border: 1px solid var(--a-line); border-radius: 14px; box-shadow: 0 6px 24px rgba(20, 32, 58, .06); }
.kf-pair__item--unit { border-left: 5px solid var(--a-amber); }
.kf-pair__item--watch { border-left: 5px solid var(--a-teal); }
.kf-pair__item--unit::after { color: var(--a-amber); }
.kf-figure img { border: 1px solid var(--a-line); border-radius: 12px; box-shadow: 0 14px 40px rgba(20, 32, 58, .18); }
.kf-callout { border-left: 5px solid var(--a-amber); background: var(--a-amber-soft); }
.kf-sources-list li:target { background: var(--a-amber-soft); }
.kf-sources, .kf-sources a { color: var(--a-mute); }

/* FAQ */
.kf-faq-item { border-top: 1px solid var(--a-line); }
.kf-faq-item:last-child { border-bottom: 1px solid var(--a-line); }
.kf-faq-btn { color: var(--a-navy); }
.kf-faq-btn::after { color: var(--a-amber); }

/* forms */
.kf-form { background: var(--a-panel); border: 1px solid var(--a-line); border-radius: 14px; }
.kf-field label { color: var(--a-navy); }
.kf-field input, .kf-field select, .kf-field textarea { background: #fff; color: var(--a-navy); border: 1px solid #9AA7BA; }
.kf-form-status.is-error { color: #A12614; }
.kf-form-status.is-ok { color: #1D6B3A; }

/* footer */
.kf-site-footer { background: #fff; border-top: 1px solid var(--a-line); color: var(--a-mute); margin-top: 0; }
.kf-footer-links a, .kf-footer-links .kf-current-link { color: var(--a-navy); }
.kf-footer-bird { color: var(--a-mute); }
.footer-badge { color: var(--a-navy); font-family: var(--a-serif); }
.kf-copyright { opacity: 1; }

@media (max-width: 1000px) {
  .kf-nav { background: #fff; }
  .kf-logo::after { font-size: .85rem; }
}
@media (max-width: 520px) {
  .kf-logo img { height: 44px; }
  .kf-logo::after { display: none; }
  .kf-hero { padding: 2.75rem 0 2.5rem; }
  .kf-band { padding: 2.75rem 0; }
  .kf-wrap { padding: 0 1.25rem; }
}

/* nav never wraps; on narrower desktops the wordmark steps aside so the menu fits on one line */
.kf-nav__link, .kf-btn { white-space: nowrap; }
.kf-nav__list { gap: .9rem; }
@media (max-width: 1260px) {
  .kf-logo::after { display: none; }
}

/* footer: the same navy as the hero */
.kf-site-footer { background: #14203A; border-top: 0; color: #D3DAE8; padding: 3rem 0 2.5rem; }
.kf-footer-links a, .kf-footer-links .kf-current-link { color: #F5F7FA; }
.kf-footer-links a:hover { color: #EE8118; }
.footer-badge { color: #F5F7FA; }
.kf-copyright { color: #AEB9CE; }
/* the two boxes are the same size */
.kf-pair { grid-auto-rows: 1fr; }
.kf-pair__item { height: 100%; }

/* the closing call-to-action band is always navy (it must beat the white/grey alternating bands) */
.kf-band.kf-convert { background: #14203A; color: #D3DAE8; }
.kf-band.kf-convert h1, .kf-band.kf-convert h2, .kf-band.kf-convert h3, .kf-band.kf-convert p { color: #F5F7FA; }
.kf-band.kf-convert .kf-btn--secondary { border-color: #8FA0BC; color: #F5F7FA; }
.kf-band.kf-convert .kf-btn--secondary:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.kf-band.kf-convert .kf-actions { margin-bottom: 0; }
main:has(> .kf-band.kf-convert:last-child) + .kf-site-footer { padding-top: 0; }

/* Home hero radar: teal = Kingfisher units, red = the rogue base station */
.kf-hero--radar { position: relative; overflow: hidden; }
.kf-radar { position: absolute; right: 2vw; top: 50%; width: min(26vw, 340px); transform: translateY(-50%); pointer-events: none; }
.kf-radar__sweep { transform-origin: 200px 200px; animation: kf-sweep 9s linear infinite; }
.kf-radar__bad circle:first-child { transform-origin: 268px 236px; animation: kf-ping 2.4s ease-out infinite; }
@keyframes kf-sweep { to { transform: rotate(360deg); } }
@keyframes kf-ping { 0% { transform: scale(.5); opacity: 1; } 100% { transform: scale(2); opacity: 0; } }
@media (max-width: 900px) { .kf-radar { position: static; display: block; width: min(80vw, 300px); margin: 1.5rem auto 0; transform: none; } }
@media (prefers-reduced-motion: reduce) { .kf-radar__sweep, .kf-radar__bad circle:first-child { animation: none; } }
.kf-figure img[src*="kingfisher-unit"] { max-width: 360px; }
@media (min-width: 901px) { .kf-hero--radar .kf-wrap > p { max-width: 60%; } }
@media (min-width: 901px) and (max-width: 1279px) { .kf-hero--radar .kf-wrap > h1 { max-width: 60%; } }

/* Federal page: White House photo beside the Where It Applies heading and list, top edges aligned */
@media (min-width: 901px) {
  .kf-band .kf-wrap:has(:is(img[src*="white-house-dusk"], img[src*="armed-forces-base"], img[src*="law-enforcement-stadium"])) { display: grid; grid-template-columns: max-content 1fr; grid-template-rows: auto 1fr; column-gap: 2rem; align-items: start; }
  .kf-band .kf-wrap:has(:is(img[src*="white-house-dusk"], img[src*="armed-forces-base"], img[src*="law-enforcement-stadium"])) > h2 { grid-column: 1; grid-row: 1; margin-top: 0; }
  .kf-band .kf-wrap:has(:is(img[src*="white-house-dusk"], img[src*="armed-forces-base"], img[src*="law-enforcement-stadium"])) > ul { grid-column: 1; grid-row: 2; }
  .kf-band .kf-wrap:has(:is(img[src*="white-house-dusk"], img[src*="armed-forces-base"], img[src*="law-enforcement-stadium"])) > figure { grid-column: 2; grid-row: 1 / span 2; margin: 0; justify-self: center; width: min(100%, 520px); }
}

/* Kingfisher page: unit photo beside the What Kingfisher Is text, top aligned with the heading */
@media (min-width: 901px) {
  .kf-band .kf-wrap:has(img[src*="kingfisher-unit"]) { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); grid-template-rows: repeat(4, auto) 1fr; column-gap: 2.5rem; align-items: start; }
  .kf-band .kf-wrap:has(img[src*="kingfisher-unit"]) > * { grid-column: 1; }
  .kf-band .kf-wrap:has(img[src*="kingfisher-unit"]) > h2 { margin-top: 0; }
  .kf-band .kf-wrap:has(img[src*="kingfisher-unit"]) > figure { grid-column: 2; grid-row: 1 / -1; margin: 0; justify-self: center; width: min(100%, 440px); }
  .kf-band .kf-wrap:has(img[src*="kingfisher-unit"]) > figure img { max-width: 100%; }
}



/* Photo credit sits under the Times Square photo */
@media (min-width: 901px) { .kf-band .kf-wrap:has(img[src*="law-enforcement-stadium"]) > p { grid-column: 2; grid-row: 3; justify-self: center; width: min(100%, 520px); margin: .6rem 0 0; font-size: .8rem; color: var(--a-mute); } }
.kf-wrap:has(img[src*="law-enforcement-stadium"]) > p { font-size: .8rem; color: var(--a-mute); }
/* Third (text) button on navy bands: readable orange, underlined */
.kf-band.kf-convert .kf-btn--tertiary, .kf-convert .kf-btn--tertiary { color: #EE8118; text-decoration: underline; text-underline-offset: 4px; font-weight: 700; }
.kf-band.kf-convert .kf-btn--tertiary:hover { color: #FF9A3C; }
/* Footer: badge at heading size (32px), links, badge and copyright close together */
.kf-footer-links { margin-bottom: .6rem; }
.footer-badge { font-size: 2rem; font-weight: 700; letter-spacing: 0; margin: 0 0 .15rem; line-height: 1.15; color: #F5F7FA; }
.kf-copyright { margin-top: 0; }
