/* ---------- the foot of the page ----------
   The navy of the opening again, so the page ends where it began: the mark
   and a line, the LA32 button, four columns of every way on (the kinds of
   work open their sheets), the language as the Segmented control, and the
   year. Label 11/14 over Body S 14/22 links. */
.ft{ position:relative; z-index:1; color:var(--porcelain);
  background-color:var(--navy-950); background-image:radial-gradient(60% 80% at 80% 0%, rgba(43,63,124,.45), transparent 70%); }
.ft-in{ max-width:1440px; margin:0 auto; padding:clamp(64px, 10vh, 104px) var(--gut) calc(28px + env(safe-area-inset-bottom)); }
.ft-top{ display:grid; grid-template-columns:auto minmax(0, 1fr) auto; align-items:center; gap:24px 48px; padding-bottom:clamp(40px, 7vh, 64px); border-bottom:1px solid rgba(246,244,239,.14); }
.ft-brand{ display:inline-flex; align-items:center; gap:14px; color:var(--porcelain); }
.ft-brand svg{ width:40px; height:40px; }
.ft-brand b{ font:500 40px/44px var(--sans); letter-spacing:-.025em; }
.ft-say{ font:400 20px/30px var(--sans); color:rgba(246,244,239,.78); }
.ft-say .acc{ font-family:var(--accent); font-style:italic; font-weight:300; color:var(--porcelain); }
.ft-cols{ display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:32px; padding:clamp(40px, 7vh, 64px) 0; }
.ft-col{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; font:400 14px/22px var(--sans); color:rgba(246,244,239,.6); }
.ft-col .label{ margin-bottom:4px; color:rgba(246,244,239,.5); }
.ft-col a, .ft-col button{ color:rgba(246,244,239,.86); font:inherit; text-align:left; transition:color .2s var(--ease); }
@media (hover:hover){ .ft-col a:hover, .ft-col button:hover{ color:var(--porcelain); text-decoration:underline; text-underline-offset:4px; text-decoration-color:rgba(246,244,239,.4); } }
.ft-seg{ padding:4px; border-radius:24px; background:rgba(255,255,255,.08); box-shadow:inset 0 0 0 1px rgba(255,255,255,.12); }
.ft-seg button{ height:36px; padding:0 14px; border-radius:18px; text-decoration:none !important; }
.ft-bot{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:24px; border-top:1px solid rgba(246,244,239,.14); font:400 12.5px/18px var(--sans); color:rgba(246,244,239,.5); }
.ft-up{ display:inline-flex; align-items:center; gap:8px; color:rgba(246,244,239,.75); }
.ft-up svg{ width:14px; height:14px; transition:transform .25s var(--ease); }
@media (hover:hover){ .ft-up:hover{ color:var(--porcelain); } .ft-up:hover svg{ transform:translateY(-2px); } }
.ft a:focus-visible, .ft button:focus-visible{ outline:2px solid var(--ultra); outline-offset:3px; border-radius:6px; }

@media (max-width:1023px){
  .ft-top{ grid-template-columns:minmax(0, 1fr); justify-items:start; }
  .ft-cols{ grid-template-columns:repeat(2, minmax(0, 1fr)); row-gap:40px; }
}
@media (max-width:767px){
  .ft-brand b{ font-size:32px; line-height:36px; }
  .ft-brand svg{ width:32px; height:32px; }
  .ft-say{ font-size:16px; line-height:26px; }
  .ft-top .btn{ width:100%; justify-content:space-between; }
}
