.site-footer {
  background: var(--deep, var(--ink));
  color: var(--deep-ink, var(--paper));
  padding: 96px 0 40px;
  margin-top: 120px;
}

.site-footer .grid-top {
  display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap: 56px; padding-bottom: 56px;
  border-bottom: 1px solid color-mix(in oklch, var(--deep-ink, var(--paper)) 22%, transparent);
}

.site-footer .brand {
  font-family: var(--serif); font-size: 30px; margin-bottom: 14px;
}
.site-footer .brand .dot { color: var(--s2, var(--spring-2)); }
.site-footer .brand-blurb {
  color: color-mix(in oklch, var(--deep-ink, var(--paper)) 70%, transparent);
  font-size: 15px; line-height: 1.55; max-width: 32ch; margin: 0;
}

.site-footer .footer-heading {
  font-family: var(--mono); font-size: 13px; letter-spacing: 0.14em;
  text-transform: uppercase;
  color: color-mix(in oklch, var(--deep-ink, var(--paper)) 55%, transparent);
  margin-bottom: 18px;
}

.site-footer ul {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 10px;
}
.site-footer ul li { font-size: 15px; cursor: pointer; }
.site-footer ul li a {
  color: color-mix(in oklch, var(--deep-ink, var(--paper)) 70%, transparent);
  transition: color 160ms ease;
}
.site-footer ul li a:hover { color: var(--deep-ink, var(--paper)); }

.site-footer .legal {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 28px; font-size: 14px;
  color: color-mix(in oklch, var(--deep-ink, var(--paper)) 55%, transparent);
}
.site-footer .legal .links { display: flex; gap: 24px; }

@media (max-width: 720px) {
  .site-footer { padding: 64px 0 32px; margin-top: 80px; }
  .site-footer .grid-top {
    grid-template-columns: 1fr; gap: 32px;
  }
  .site-footer .legal { flex-direction: column; gap: 12px; text-align: center; }
}

/* ============================
   DEEP FOOTER (Design v2 — site-wide editorial)
   ============================ */
.site-footer-deep {
  background: var(--deep, oklch(0.55 0.18 45));
  color: var(--deep-ink, oklch(0.99 0.02 85));
  padding: 96px 0 40px;
  margin-top: 0;
  transition: background 240ms ease;
}
.site-footer-deep__newsletter {
  display: grid; grid-template-columns: 1.2fr 1fr;
  gap: 80px; padding-bottom: 64px;
  border-bottom: 1px solid color-mix(in oklch, var(--deep-ink) 22%, transparent);
}
.site-footer-deep__newsletter h2 {
  margin: 0; font-family: var(--serif); font-weight: 400;
  font-size: clamp(44px, 5vw, 76px);
  line-height: 0.95; letter-spacing: -0.02em;
}
.site-footer-deep__newsletter h2 em {
  color: var(--pop, oklch(0.92 0.20 95)); font-style: italic;
}
.site-footer-deep__newsletter-lede {
  margin-top: 20px; max-width: 44ch;
  color: color-mix(in oklch, var(--deep-ink) 70%, transparent);
  font-size: 15.5px; line-height: 1.55;
}
.site-footer-deep__form-wrap { align-self: end; }
.site-footer-deep__form {
  display: flex; gap: 0;
  border: 1px solid color-mix(in oklch, var(--deep-ink) 22%, transparent);
  border-radius: 999px; padding: 4px;
  background: color-mix(in oklch, var(--paper) 30%, transparent);
}
.site-footer-deep__input {
  flex: 1; background: transparent; border: 0; outline: 0;
  color: var(--deep-ink); padding: 0 18px; font-size: 14px;
  font-family: var(--sans);
}
.site-footer-deep__input::placeholder {
  color: color-mix(in oklch, var(--deep-ink) 50%, transparent);
}
.site-footer-deep__submit {
  height: 40px; padding: 0 22px; border-radius: 999px;
  background: var(--deep-ink); color: var(--deep); border: 0;
  font-size: 13.5px; font-weight: 500; cursor: pointer;
  font-family: var(--sans);
}
.site-footer-deep__season-row {
  margin-top: 14px; display: flex; gap: 16px;
  align-items: center; flex-wrap: wrap;
}
.site-footer-deep__season-label {
  font-size: 12px;
  color: color-mix(in oklch, var(--deep-ink) 55%, transparent);
}
.site-footer-deep__season-btn {
  font-size: 12px;
  color: color-mix(in oklch, var(--deep-ink) 70%, transparent);
  background: none; border: 0; cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--sans); padding: 0;
}
.site-footer-deep__season-btn .dot {
  width: 8px; height: 8px; border-radius: 999px;
}
.site-footer-deep__cols {
  display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap: 56px; padding: 56px 0;
}
.site-footer-deep__brand {
  font-family: var(--serif); font-size: 30px; margin-bottom: 14px;
}
.site-footer-deep__brand .dot { color: var(--s2, var(--spring-2)); }
.site-footer-deep__about {
  color: color-mix(in oklch, var(--deep-ink) 70%, transparent);
  font-size: 13.5px; line-height: 1.55; max-width: 32ch; margin: 0;
}
.site-footer-deep__col-h {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em;
  text-transform: uppercase;
  color: color-mix(in oklch, var(--deep-ink) 55%, transparent);
  margin-bottom: 18px;
}
.site-footer-deep__list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 10px;
}
.site-footer-deep__list a {
  color: color-mix(in oklch, var(--deep-ink) 70%, transparent);
  font-size: 13.5px; transition: color 160ms ease;
}
.site-footer-deep__list a:hover { color: var(--deep-ink); }
.site-footer-deep__legal {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 28px;
  border-top: 1px solid color-mix(in oklch, var(--deep-ink) 22%, transparent);
  font-size: 12px;
  color: color-mix(in oklch, var(--deep-ink) 55%, transparent);
  flex-wrap: wrap; gap: 14px;
}
.site-footer-deep__legal-links { display: flex; gap: 24px; flex-wrap: wrap; }
.site-footer-deep__legal-links a {
  color: inherit; transition: color 160ms ease;
}
.site-footer-deep__legal-links a:hover {
  color: color-mix(in oklch, var(--deep-ink) 90%, transparent);
}

@media (max-width: 1080px) {
  .site-footer-deep__newsletter,
  .site-footer-deep__cols { grid-template-columns: 1fr 1fr; gap: 48px; }
}
@media (max-width: 720px) {
  .site-footer-deep { padding: 64px 0 32px; }
  .site-footer-deep__newsletter,
  .site-footer-deep__cols { grid-template-columns: 1fr; gap: 32px; padding-top: 32px; padding-bottom: 32px; }
  .site-footer-deep__legal { flex-direction: column; align-items: flex-start; }
}