@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/inter-latin.woff2") format("woff2");
}
@font-face {
  font-family: Domine;
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/assets/domine-latin.woff2") format("woff2");
}
:root {
  --cherry-red: #dc2626;
  --cherry-dark: #991b1b;
  --background: #ffffff;
  --foreground: #1f2937;
  --muted: #4b5563;
  --rule: #e5e7eb;
  --footer-background: #101828;
  --footer-muted: #99a1af;
  --footer-rule: #1e2939;
  --footer-hover: #ff6568;
  --footer-brand-mid: #ef4444;
  --footer-brand-end: #f87171;
  --font-body: Inter, Arial, sans-serif;
  --font-heading: Domine, Georgia, serif;
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4rem;
  --radius: 0.5rem;
  --content-width: 42rem;
  --site-width: 72rem;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--foreground); background: var(--background); font-family: var(--font-body); font-size: 1.125rem; line-height: 1.65; }
.site-header { max-width: var(--site-width); margin: auto; padding: var(--space-3) var(--space-4); display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); border-bottom: 1px solid var(--rule); }
.site-header img { display: block; width: 280px; max-width: 100%; height: auto; }
main { max-width: var(--content-width); padding: var(--space-5) var(--space-3); margin: auto; }
h1 { font-family: var(--font-heading); }
h1 { margin: 0 0 var(--space-3); font-size: clamp(2.25rem, 5vw, 3.25rem); line-height: 1.18; letter-spacing: -0.035em; }
.intro { margin: 0 0 var(--space-3); }
.redirect-note { margin: 0 0 var(--space-3); color: var(--muted); font-size: 1rem; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-3); padding: var(--space-2) var(--space-3); border-radius: var(--radius); color: var(--background); background: var(--cherry-red); font-weight: 700; text-decoration: none; }
.button:hover { background: var(--cherry-dark); }
a:focus-visible { outline: 3px solid var(--cherry-dark); outline-offset: 5px; }
@media (max-width: 36rem) {
  .site-header { padding: var(--space-3); }
  .site-header img { width: 230px; }
  main { padding-top: var(--space-4); }
  .button { display: flex; width: 100%; }
}

.site-footer { background: var(--footer-background); color: var(--background); padding: var(--space-5) 0; font-size: 1rem; line-height: 1.5; }
.footer-inner { max-width: 80rem; padding: 0 var(--space-3); margin: auto; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: var(--space-4); margin-bottom: var(--space-4); }
.footer-brand { font-family: var(--font-heading); font-size: 1.5rem; line-height: 2rem; margin: 0 0 var(--space-2); background: linear-gradient(135deg, var(--cherry-red), var(--footer-brand-mid), var(--footer-brand-end)); background-clip: text; -webkit-background-clip: text; color: transparent; }
.footer-description { max-width: 28rem; color: var(--footer-muted); margin: 0 0 var(--space-2); }
.footer-contact { display: flex; gap: var(--space-2); }
.footer-contact-link { display: inline-flex; color: var(--background); padding: var(--space-1); margin-left: calc(-1 * var(--space-1)); }
.footer-icon { width: var(--space-3); height: var(--space-3); }
.footer-heading { font-family: var(--font-body); font-weight: 600; font-size: 1.125rem; margin: 0 0 var(--space-2); }
.footer-links { list-style: none; padding: 0; margin: 0; }
.footer-links li + li { margin-top: var(--space-1); }
.footer-link { color: var(--footer-muted); text-decoration: none; }
.site-footer a:hover { color: var(--footer-hover); }
.site-footer a:focus-visible { outline-color: var(--footer-hover); }
.footer-bottom { border-top: 1px solid var(--footer-rule); padding-top: var(--space-4); display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); color: var(--footer-muted); font-size: 0.875rem; }
.footer-copyright, .footer-credit { margin: 0; }
.footer-legal { display: flex; align-items: center; gap: var(--space-3); }
@media (max-width: 48rem) {
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .footer-legal { flex-wrap: wrap; justify-content: center; }
}
