/* ─────────────────────────────────────────────────────────────────────────────
   ATHLAMOUR — shared layer, loaded after each page's own styles.
   Mobile menu, the full footer, and the intro-once rule. Page-specific layout
   stays in each page; only what must be identical everywhere lives here.
   ───────────────────────────────────────────────────────────────────────── */

/* intro plays once per visit — a returning page skips straight to content */
.seen .intro{display:none !important;}

/* ── header: menu button ─────────────────────────────────────────────────── */
.menu-btn{display:none;background:none;border:0;padding:10px;margin:-10px;cursor:pointer;color:#fff;
  font-family:inherit;font-size:var(--t-micro);letter-spacing:.26em;text-transform:uppercase;align-items:center;gap:12px;}
.menu-btn .bars{position:relative;width:24px;height:10px;display:inline-block;}
.menu-btn .bars::before,.menu-btn .bars::after{content:"";position:absolute;left:0;right:0;height:1.5px;background:currentColor;
  transition:transform .35s cubic-bezier(.2,.7,.15,1),top .35s;}
.menu-btn .bars::before{top:0;} .menu-btn .bars::after{top:8.5px;}
.menu-open .menu-btn .bars::before{top:4.25px;transform:rotate(45deg);}
.menu-open .menu-btn .bars::after{top:4.25px;transform:rotate(-45deg);}

/* ── mobile drawer ───────────────────────────────────────────────────────── */
.drawer{position:fixed;inset:0;z-index:55;background:#000;display:flex;flex-direction:column;justify-content:space-between;
  padding:clamp(96px,16vh,130px) var(--pad) 36px;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s;}
.menu-open .drawer{opacity:1;visibility:visible;}
.drawer nav{display:flex;flex-direction:column;gap:6px;}
.drawer nav a{font-family:var(--serif);font-style:italic;font-size:var(--t-h2);line-height:1.15;color:var(--bone);
  transform:translateY(12px);opacity:0;transition:transform .5s cubic-bezier(.2,.7,.15,1),opacity .5s;}
.menu-open .drawer nav a{transform:none;opacity:1;}
.menu-open .drawer nav a:nth-child(2){transition-delay:.04s}
.menu-open .drawer nav a:nth-child(3){transition-delay:.08s}
.menu-open .drawer nav a:nth-child(4){transition-delay:.12s}
.menu-open .drawer nav a:nth-child(5){transition-delay:.16s}
.drawer nav a[aria-current]{color:var(--teal-lift);}
.drawer .foot{display:grid;gap:10px;font-size:var(--t-small);color:var(--bone-dim);}
.drawer .foot b{font-family:var(--serif);font-style:italic;font-weight:400;font-size:var(--t-lead);color:var(--bone);}
.drawer .foot i{display:block;width:60px;height:2px;background:var(--teal);margin-bottom:8px;}
.menu-open{overflow:hidden;}

@media(max-width:900px){
  .menu-btn{display:inline-flex;}
  /* blend mode would invert the open drawer's colours — switch it off while open */
  .menu-open .hdr{mix-blend-mode:normal;}
}
@media(min-width:901px){.drawer{display:none;}}

/* ── footer ──────────────────────────────────────────────────────────────── */
.sf{background:#000;border-top:1px solid var(--hair);padding:clamp(70px,9vw,120px) var(--pad) 32px;color:var(--bone-2);}
.sf .sf-close{margin:0 0 clamp(50px,6vw,80px);font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:var(--t-h3);line-height:1.25;color:var(--bone);max-width:30ch;}
.sf .sf-close span{color:var(--teal-lift);}
.sf .sf-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:clamp(30px,4vw,60px);}
.sf .sf-brand img{width:170px;margin-bottom:18px;}
.sf .sf-brand p{margin:0;font-size:var(--t-body);line-height:1.7;max-width:34ch;}
.sf .sf-brand .tag{margin-top:14px;font-family:var(--serif);font-style:italic;color:var(--bone);}
.sf h4{margin:0 0 16px;font-size:var(--t-micro);letter-spacing:.26em;text-transform:uppercase;font-weight:400;color:var(--bone);}
.sf h4::after{content:"";display:block;width:28px;height:2px;background:var(--teal);margin-top:10px;}
.sf ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;}
.sf ul a{font-size:var(--t-body);color:var(--bone-2);transition:color .25s;}
.sf ul a:hover{color:var(--teal-lift);}
.sf .sf-base{margin-top:clamp(50px,6vw,80px);padding-top:22px;border-top:1px solid var(--hair);display:flex;justify-content:space-between;
  gap:16px 30px;flex-wrap:wrap;font-size:var(--t-small);color:var(--bone-dim);}
.sf .sf-base nav{display:flex;gap:22px;flex-wrap:wrap;}
.sf .sf-base a:hover{color:var(--bone);}
@media(max-width:900px){.sf .sf-grid{grid-template-columns:1fr 1fr;}.sf .sf-brand{grid-column:1/-1;}}
@media(max-width:520px){.sf .sf-grid{grid-template-columns:1fr;}}

/* older pages style bare `footer` elements — neutralise that for the shared footer */
footer.sf{display:block;justify-content:initial;flex-wrap:initial;line-height:1.6;font-size:var(--t-body);}
footer.sf a{border-bottom:0;}
footer.sf img{margin-bottom:18px;}