/* ============================================================
   SITE FOOTER — newsletter strip + footer, shared by every page.
   To add it to a new page:
     1. In <head>:  <link rel="stylesheet" href="assets/site-footer.css">   (../assets/ from media/)
     2. Paste the markup from assets/site-footer.html as the last thing in <body>, before any <script>s.
   Self-contained: prefixed sf- classes, its own colours and fonts, no dependence on page CSS.
   ============================================================ */
@font-face { font-family: 'Right Grotesk Compact'; src: url('RightGroteskCompact-Black.ttf') format('truetype'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: 'ABC Monument Grotesk'; src: url('ABCMonumentGroteskEdu-Regular.otf') format('opentype'); font-weight: 100 900; font-display: swap; }
:root { --sf-red: #9b0041; --sf-pink: #f0a4c0; --sf-head: 'Right Grotesk Compact', 'Arial Narrow', Arial, sans-serif; --sf-body: 'ABC Monument Grotesk', Inter, -apple-system, 'Segoe UI', sans-serif; }

.sf-signup, .sf-footer { position: relative; z-index: 2; background: var(--sf-red); color: #fff; font-family: var(--sf-body); font-size: 16px; line-height: 1.5; -webkit-font-smoothing: antialiased; margin: 0; }
.sf-signup *, .sf-footer * { box-sizing: border-box; }
.sf-signup a, .sf-footer a { color: inherit; text-decoration: none; }
.sf-inner { max-width: var(--max, var(--max-width, 1320px)); margin: 0 auto; padding-left: var(--gutter, var(--page-margin, clamp(20px, 4vw, 56px))); padding-right: var(--gutter, var(--page-margin, clamp(20px, 4vw, 56px))); }

/* Newsletter strip */
.sf-signup__inner { display: grid; grid-template-columns: auto 1fr; gap: 16px clamp(24px, 4vw, 64px); align-items: center; padding-top: clamp(24px, 2.6vw, 34px); padding-bottom: clamp(24px, 2.6vw, 34px); }
.sf-signup__title { margin: 0; font-family: var(--sf-head); font-weight: 700; font-size: clamp(22px, 2vw, 28px); line-height: 1.05; color: #fff; text-transform: none; letter-spacing: 0; }
.sf-signup__title small { display: block; font-family: var(--sf-body); font-weight: 400; font-size: 13px; color: rgba(255,255,255,0.72); margin-top: 4px; }
.sf-signup__form { display: grid; grid-template-columns: 1fr 1fr 1.4fr auto; gap: 8px; margin: 0; }
.sf-signup__form input { min-width: 0; border: 0; border-radius: 0; padding: 13px 14px; font: inherit; font-size: 14px; background: #fff; color: #0d0d12; margin: 0; }
.sf-signup__form button { border: 1px solid #fff; border-radius: 0; background: #fff; color: var(--sf-red); padding: 13px 24px; font: inherit; font-size: 14px; cursor: pointer; transition: background 0.3s ease, color 0.3s ease; margin: 0; }
.sf-signup__form button { display: inline-flex; align-items: center; gap: 10px; }
.sf-signup__form button:hover { background: transparent; color: #fff; }
.sf-arr { display: inline-block; transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1); }
.sf-signup__form button:hover .sf-arr { transform: translateX(4px); }
@media (max-width: 1024px) {
  .sf-signup__inner { grid-template-columns: 1fr; }
  .sf-signup__form { grid-template-columns: 1fr 1fr; }
  .sf-signup__form .email { grid-column: 1 / -1; }
  .sf-signup__form button { justify-self: start; }
}

/* Footer */
.sf-footer { border-top: 1px solid rgba(255,255,255,0.18); }
.sf-footer__inner { padding-top: clamp(48px, 6vw, 80px); padding-bottom: 32px; }
.sf-footer__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 32px; flex-wrap: wrap; }
.sf-footer__logo img { width: min(383px, calc(100vw - 2 * clamp(20px, 4vw, 56px))); height: auto; display: block; }
.sf-footer__nav { display: flex; flex-wrap: wrap; gap: 12px 28px; font-size: 15px; }
.sf-footer__nav a:hover { color: var(--sf-pink); }
.sf-footer__contact { display: grid; grid-template-columns: repeat(3, auto); gap: 12px clamp(32px, 5vw, 80px); justify-content: start; margin-top: clamp(32px, 4vw, 48px); font-size: 14.5px; line-height: 1.5; color: rgba(255,255,255,0.86); }
.sf-footer__contact b { display: block; font-family: var(--sf-head); font-weight: 700; font-size: 15px; letter-spacing: 0.02em; color: var(--sf-pink); margin-bottom: 4px; }
.sf-footer__contact a:hover { color: var(--sf-pink); }
.sf-footer__ack { font-size: 13px; line-height: 1.55; color: rgba(255,255,255,0.72); max-width: 70ch; margin: clamp(40px, 5vw, 64px) 0 0; padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.18); }
.sf-footer__legal { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 32px; margin-top: 20px; font-size: 12.5px; line-height: 1.5; color: rgba(255,255,255,0.6); }
.sf-footer__legal p { margin: 0; }
.sf-footer__legal a { text-decoration: underline; text-underline-offset: 2px; }
.sf-footer__legal a:hover { color: var(--sf-pink); }
@media (max-width: 720px) { .sf-footer__contact { grid-template-columns: 1fr; } }
