/* DeepFunded site chrome: the shared header and footer, on top of theme.css.
   index.html gets it through landing.css's @import; the redesigned inner pages <link> it
   right after theme.css. Markup: copy <header class="hdr"> and <footer class="ftr"> from
   index.html; inner pages load site.js right after the header for its logged-in state. */

/* above theme.css's film grain (it lifts <main>) */
.ftr,.hdr{position:relative;z-index:1}

/* ── header ──────────────────────────────────────────────── */
.hdr{position:sticky;top:0;z-index:var(--z-header);border-bottom:1px solid transparent;transition:background-color .3s,border-color .3s}
.hdr.is-scrolled{background:rgba(10,13,22,.8);border-color:var(--line);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2)}
.hdr-in{display:flex;align-items:center;gap:40px;height:68px}
.brand{display:flex;align-items:center;gap:12px;flex:none}
.brand-mark{width:30px;height:30px}
.brand-word{width:auto;height:18px}
.nav{display:flex;gap:28px}
.nav a,.link-quiet{font-size:.92rem;color:var(--text-2);text-decoration:none;padding:8px 0;transition:color .2s}
.hdr-actions{margin-left:auto;display:flex;align-items:center;gap:22px}
@media (hover:hover){.nav a:hover,.link-quiet:hover{color:var(--text)}}
@media (max-width:760px){
  .nav,.brand-word{display:none}
  .hdr-in{height:60px}
  .hdr-actions{gap:16px}
}

/* the page you're on, in the primary nav (index.html has no such link) */
.nav a[aria-current="page"]{color:var(--text);box-shadow:inset 0 -1px 0 var(--gold)}

/* ── footer ──────────────────────────────────────────────── */
.ftr{border-top:1px solid var(--line);background:var(--bg-2);padding:64px 0 28px}
.ftr-top{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:40px}
.ftr-brand img{height:18px;width:auto}
.ftr-brand p{margin-top:18px;max-width:40ch;font-size:.88rem;line-height:1.65;color:var(--text-3)}
.ftr-col{display:flex;flex-direction:column;gap:10px}
.ftr-col h4{margin-bottom:6px;font-family:var(--mono);font-size:.7rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3)}
.ftr-col a{font-size:.9rem;color:var(--text-2);text-decoration:none;transition:color .2s}
@media (hover:hover){.ftr-col a:hover{color:var(--gold)}}
.ftr-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:56px;padding-top:22px;border-top:1px solid var(--line);font-size:.8rem;color:var(--text-3)}
@media (max-width:820px){.ftr-top{grid-template-columns:repeat(2,minmax(0,1fr))}.ftr-brand{grid-column:1 / -1}}