/* Next Horizon shared styles.
   Extracted 2026-08-27 from the per-page inline <style> blocks. Everything here
   was already byte-identical on most pages; the footer had quietly drifted into
   three variants, so the superset became the one definition. Loaded last in
   <head> so it keeps the cascade position the inline blocks used to hold.

   Anything page-specific stays in that page. This file is only for rules that
   are genuinely the same site-wide. */

/* ---- Focus ring, every interactive element, every page ---- */
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:3px}a:focus:not(:focus-visible),button:focus:not(:focus-visible),summary:focus:not(:focus-visible){outline:none}

/* ---- Footer ---- */
/* ============ FOOTER ============ */
  footer {
    border-top: 1px solid var(--border);
    padding: 56px 0 24px;
  }
  .footer-grid {
    display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 48px;
    margin-bottom: 44px;
  }
  .footer-brand-row { display: flex; align-items: center; gap: 10px; }
  .footer-brand p { font-size: 13px; color: var(--dim); line-height: 1.65; margin-top: 14px; max-width: 260px; }
  .fwm { display: flex; flex-direction: column; line-height: 1; }
  .fwm-top { font-size: 16px; font-weight: 900; letter-spacing: 0.05em; color: var(--blue); }
  .fwm-bot { font-size: 16px; font-weight: 900; letter-spacing: 0.05em; color: white; margin-top: -1px; }

  .footer-col h4 {
    font-size: 10.5px; font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--muted);
    margin-bottom: 14px;
  }
  .footer-col a {
    display: block;
    font-size: 12.5px;
    color: var(--dim);
    margin-bottom: 9px;
    transition: color .18s;
  }
  .footer-col a:hover { color: white; }

  .footer-partners {
    padding: 24px 0;
    border-top: 1px solid var(--border);
    display: flex; align-items: center;
    gap: 24px; flex-wrap: wrap;
  }
  .fp-label {
    font-size: 10.5px; font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--dim);
    white-space: nowrap;
  }
  .fp-logos { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
  .fp-chip {
    height: 62px; padding: 6px 10px;
    background: rgba(232, 240, 251, 0.92);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 9px;
    display: inline-flex; align-items: center; justify-content: center;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12);
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
  }
  a.fp-chip:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(0,0,0,0.20); background: #FFFFFF; }
  .fp-chip img { height: 46px; width: auto; max-width: 200px; object-fit: contain; display: block; }
  .fp-chip-text { font-size: 13.5px; font-weight: 700; color: #0D1425; letter-spacing: 0.02em; padding: 0 6px; }
  @media (max-width: 720px) {
    .fp-chip { height: 54px; padding: 5px 8px; }
    .fp-chip img { height: 40px; max-width: 170px; }
  }

  .footer-bottom {
    padding-top: 18px;
    border-top: 1px solid var(--border);
    display: flex; align-items: center; justify-content: space-between;
    flex-wrap: wrap; gap: 12px;
  }
  .footer-bottom p { font-size: 11.5px; color: var(--dim); }

  @media (max-width: 880px) {
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
  }
  @media (max-width: 480px) {
    .footer-grid { grid-template-columns: 1fr; gap: 22px; }
  }
  /* Social icon row in footer (LinkedIn) */
  .footer-social { margin-top:18px; display:flex; gap:10px; }
  .footer-social a {
    width:34px; height:34px; border-radius:8px;
    display:flex; align-items:center; justify-content:center;
    background:var(--bg-card); border:1px solid var(--border-mid);
    color:var(--muted); transition:color .15s, background .15s, border-color .15s;
    font-size:15px; text-decoration:none;
  }
  .footer-social a:hover { color:white; background:var(--blue-dim); border-color:var(--blue-border); }
/* Footer logo: 40px tall */
.footer-brand img[src*="logo-wordmark"],
.footer-wordmark img[src*="logo-wordmark"],
footer img[src*="logo-wordmark"],
.footer-brand .wordmark-img, .footer-wordmark .wordmark-img,
footer .wordmark-img {
  display:block !important;
  height:40px !important;
  width:auto !important;
  max-width:240px !important;
}
