/*
 * The site footer, shared by every page: index, privacy and terms link this
 * file and carry the same <footer> markup. Change it here, and in the markup
 * on each page, together.
 */
footer {
  --f-paper: #F7F6F3;
  --f-surface: #FFFFFF;
  --f-ink: #101014;
  --f-faint: #9CA1A9;
  --f-accent: #FF5A1F;
  color: var(--f-ink);
}
footer .wrap { width: 100%; max-width: 1120px; margin: 0 auto; padding-inline: clamp(20px, 5vw, 48px); }
/* Footer: one closing line, one button, a row of links, and the name
   itself, huge and faded, running off the bottom of the page. */
footer { position: relative; overflow: hidden; text-align: center; margin-top: clamp(24px, 4vw, 48px); padding-top: clamp(80px, 12vw, 150px); background: var(--f-surface); }
/* The top edge is torn from a sheet of stamps: perforated, like the stamps above. */
footer::before {
  content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 12px;
  background: radial-gradient(circle at 10px 0, var(--f-paper) 7px, transparent 7.5px) 0 0 / 20px 12px repeat-x;
}
.closing-line { margin: 0 auto 32px; max-width: 14em; font-size: clamp(40px, 7.2vw, 92px); line-height: 1; letter-spacing: -0.035em; font-weight: 700; }
.pill { display: inline-flex; align-items: center; gap: 10px; min-height: 56px; padding: 14px 30px; border-radius: 999px; background: #2A2A2E; color: #fff; font-size: clamp(16px, 1.5vw, 19px); font-weight: 600; letter-spacing: -0.01em; box-shadow: 0 10px 24px rgba(16,16,20,.18), inset 0 1px 0 rgba(255,255,255,.12); }
.links { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px clamp(20px, 6vw, 88px); margin: clamp(56px, 9vw, 110px) 0 0; padding: 0; list-style: none; font-size: 17px; }
.links a { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.links a:hover { color: var(--f-accent); }
.copyright { margin: 28px 0 0; color: var(--f-faint); font-size: 13.5px; }
.giant {
  /* Top padding leaves room for the pin: a mask hides anything outside the box. */
  position: relative; margin: 0 0 -0.2em; padding-top: .36em; white-space: nowrap;
  font-size: 17.4vw; line-height: .9; letter-spacing: -0.04em; font-weight: 800; color: #EDEAE3;
  -webkit-mask-image: linear-gradient(#000 55%, transparent 97%); mask-image: linear-gradient(#000 55%, transparent 97%);
  user-select: none; pointer-events: none;
}
/* A pin dots the I — the one mark of colour down here. */
.giant .i { position: relative; }
.giant .pin { position: absolute; left: 50%; bottom: 76%; width: .24em; height: .32em; transform: translateX(-50%); color: var(--f-accent); animation: bob 3.2s ease-in-out infinite; }
@keyframes bob { 50% { transform: translateX(-50%) translateY(-0.04em); } }

footer .closing-line { font-family: inherit; }
footer a { color: inherit; }

@media (prefers-reduced-motion: reduce) {
  .giant .pin { animation: none; }
}

/* Page stylesheets (like legal.css) set their own spacing on lists and text; the footer keeps its own. */
footer { line-height: 1.5; }
footer li { margin: 0; }
footer p { margin-bottom: 0; }
