:root {
  --sp-bg: #070708;
  --sp-cream: #f1e9de;
  --sp-muted: #b9ad9c;
  --sp-faint: #8d8172;
  --sp-pink: #ef91b1;
  --sp-pink-strong: #ffb0c8;
  --sp-gold: #c49a6d;
  --sp-line: rgba(239, 231, 220, .15);
  --sp-line-soft: rgba(239, 231, 220, .08);
  --sp-panel: rgba(255, 255, 255, .035);
  --sp-display: 'Playfair Display', Georgia, serif;
  --sp-ui: 'Hanken Grotesk', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --sp-page: min(calc(100% - 48px), 1180px);
  --sp-reading: 72ch;
}

body.secondary-page {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  color: var(--sp-cream);
  background:
    radial-gradient(58% 42% at 100% 0, rgba(239, 145, 177, .13), transparent 70%),
    radial-gradient(44% 35% at 0 78%, rgba(196, 154, 109, .08), transparent 72%),
    var(--sp-bg);
  font-family: var(--sp-ui);
  font-size: 16px;
  line-height: 1.68;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.secondary-page :where(*, *::before, *::after) { box-sizing: border-box; }
body.secondary-page img { display: block; max-width: 100%; }
body.secondary-page button { font: inherit; }
body.secondary-page a { color: inherit; }
body.secondary-page .wrap { width: var(--sp-page); margin-inline: auto; }

body.secondary-page :where(a, button, [tabindex='-1']):focus-visible {
  outline: 3px solid var(--sp-pink-strong);
  outline-offset: 4px;
  border-radius: 7px;
  box-shadow: 0 0 0 4px rgba(239, 145, 177, .15);
}

body.secondary-page .skip-link {
  position: fixed;
  top: 14px;
  left: 18px;
  z-index: 50;
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  padding: 0 18px;
  border-radius: 999px;
  color: var(--sp-bg);
  background: var(--sp-cream);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .1em;
  text-decoration: none;
  text-transform: uppercase;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-10px);
  transition: opacity .18s ease, transform .18s ease;
}

body.secondary-page .skip-link:focus-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

body.secondary-page > header {
  position: sticky;
  top: 0;
  z-index: 20;
  border-bottom: 1px solid var(--sp-line);
  background: rgba(7, 7, 8, .86);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
  backdrop-filter: blur(18px) saturate(120%);
}

body.secondary-page .nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 84px;
  padding: 9px 0;
  border-bottom: 0;
}

body.secondary-page .brand {
  min-width: 0;
  color: var(--sp-cream);
  text-decoration: none;
}

body.secondary-page .brand-mark {
  width: 68px;
  height: 68px;
  flex-basis: 68px;
  filter: drop-shadow(0 0 14px rgba(239, 145, 177, .32));
  mix-blend-mode: screen;
}

body.secondary-page .wordmark {
  color: var(--sp-cream);
  font-family: var(--sp-display);
  font-size: 24px;
  letter-spacing: .16em;
}

body.secondary-page .est {
  color: var(--sp-faint);
  font-family: var(--sp-ui);
  font-size: 13px;
  letter-spacing: .26em;
}

body.secondary-page .nav-actions { min-width: 0; }
body.secondary-page .lang-switch { border-color: var(--sp-line); }
body.secondary-page .lang-switch a,
body.secondary-page .back,
body.secondary-page .footer-links a {
  min-height: 44px;
}

body.secondary-page .lang-switch a[aria-current='page'] {
  color: #1d0d13;
  background: linear-gradient(180deg, #f7aec5, #e47e9f);
}

body.secondary-page .back {
  border: 1px solid rgba(196, 154, 109, .54);
  border-radius: 999px;
  color: var(--sp-cream);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

body.secondary-page .back:hover {
  border-color: var(--sp-pink);
  color: var(--sp-cream);
  background: rgba(239, 145, 177, .09);
}

body.secondary-page main { min-width: 0; }
body.secondary-page .hero { border-bottom-color: var(--sp-line); }
body.secondary-page .hero .wrap,
body.secondary-page main > .wrap { position: relative; z-index: 1; }

body.secondary-page .hero .wrap {
  max-width: 960px;
  padding-block: clamp(66px, 9vw, 116px) clamp(54px, 7vw, 78px);
}

body.secondary-page .eyebrow,
body.secondary-page .route-kicker {
  color: var(--sp-pink);
  font-family: var(--sp-ui);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .25em;
  line-height: 1.4;
  text-transform: uppercase;
}

body.secondary-page .hero h1,
body.secondary-page .error-copy h1 {
  max-width: 900px;
  margin: 18px 0 20px;
  color: var(--sp-cream);
  font-family: var(--sp-display);
  font-size: clamp(42px, 6.2vw, 76px);
  font-weight: 600;
  letter-spacing: -.035em;
  line-height: 1.01;
  text-wrap: balance;
}

body.secondary-page .lede {
  max-width: var(--sp-reading);
  color: var(--sp-muted);
  font-size: clamp(17px, 1.7vw, 21px);
  line-height: 1.58;
  text-wrap: pretty;
}

body.secondary-page .status,
body.secondary-page .callout {
  max-width: var(--sp-reading);
  padding: 19px 22px;
  border: 1px solid var(--sp-line-soft);
  border-left: 3px solid var(--sp-pink);
  border-radius: 0 12px 12px 0;
  background: linear-gradient(110deg, rgba(239, 145, 177, .105), var(--sp-panel));
}

body.secondary-page .status { margin-top: 28px; }
body.secondary-page .status strong { color: var(--sp-cream); }
body.secondary-page .status p,
body.secondary-page .callout { color: var(--sp-muted); }
body.secondary-page .section { border-bottom-color: var(--sp-line); }

body.secondary-page .section h2 {
  max-width: 27ch;
  margin: 0 0 22px;
  color: var(--sp-cream);
  font-family: var(--sp-display);
  font-size: clamp(31px, 4vw, 50px);
  font-weight: 600;
  letter-spacing: -.028em;
  line-height: 1.06;
  scroll-margin-top: 112px;
  text-wrap: balance;
}

body.secondary-page .section :where(p, li, .fact span, .principle span, .prep span) {
  color: var(--sp-muted);
  font-size: 16px;
  line-height: 1.72;
  overflow-wrap: anywhere;
  text-wrap: pretty;
}

body.secondary-page .section > :where(p, ul, ol),
body.secondary-page .section > .callout,
body.secondary-page .status { max-width: var(--sp-reading); }

body.secondary-page .section strong,
body.secondary-page .section b,
body.secondary-page .fact strong { color: var(--sp-cream); }

body.secondary-page .section a:not(.back) {
  color: var(--sp-cream);
  text-decoration-color: rgba(239, 145, 177, .66);
  text-underline-offset: 4px;
}

body.secondary-page .section a:not(.back):hover { color: var(--sp-pink-strong); }

/* About and contribution routes */
body.secondary-page.about-contact-page .hero { position: relative; overflow: hidden; }
body.secondary-page.about-contact-page .hero::after {
  right: max(-11rem, -12vw);
  bottom: -18rem;
  width: min(42vw, 34rem);
  border-color: rgba(239, 145, 177, .24);
  box-shadow: 0 0 0 2rem rgba(196, 154, 109, .035), 0 0 0 5rem rgba(239, 145, 177, .025);
}

body.secondary-page.about-contact-page main > .wrap > .section {
  padding-block: clamp(46px, 6vw, 72px);
}

body.secondary-page.about-contact-page .about-route-grid,
body.secondary-page.about-contact-page .contact-route-grid {
  gap: 16px;
}

body.secondary-page.about-contact-page .about-route-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body.secondary-page.about-contact-page .contact-route-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

body.secondary-page .route-card {
  min-height: 244px;
  padding: 24px;
  border: 1px solid var(--sp-line);
  border-top: 2px solid var(--sp-pink);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .012));
  transition: border-color .18s ease, background-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

body.secondary-page .route-card:nth-child(2n) { border-top-color: var(--sp-gold); }
body.secondary-page .route-card:nth-child(3n) { border-top-color: #80beb3; }
body.secondary-page .route-card:nth-child(4n) { border-top-color: #9c8bcd; }

body.secondary-page .route-card:hover,
body.secondary-page .route-card:focus-visible {
  border-color: var(--sp-pink);
  background: rgba(239, 145, 177, .08);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .22);
  transform: translateY(-3px);
}

body.secondary-page .route-card h3 {
  color: var(--sp-cream);
  font-family: var(--sp-display);
  font-size: clamp(21px, 2.4vw, 29px);
  line-height: 1.1;
}

body.secondary-page .route-card p { margin: 0; }
body.secondary-page .route-link {
  color: var(--sp-pink-strong);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}

body.secondary-page .route-card:hover .route-link { color: var(--sp-cream); }

body.secondary-page .principles,
body.secondary-page .prep-grid { gap: 16px; }

body.secondary-page .principle,
body.secondary-page .prep {
  min-height: 156px;
  padding: 22px;
  border: 1px solid var(--sp-line-soft);
  border-radius: 12px;
  background: var(--sp-panel);
}

body.secondary-page .principle b,
body.secondary-page .prep b {
  font-family: var(--sp-display);
  font-size: 21px;
  line-height: 1.15;
}

body.secondary-page .section .callout { margin-top: 0; }
body.secondary-page .section .back,
body.secondary-page .section > p > a:not(.back) {
  color: var(--sp-pink-strong);
  font-weight: 800;
}

/* Editorial policy */
body.secondary-page.editorial-secondary-page main > .wrap > .section,
body.secondary-page.editorial-secondary-page main > .wrap > nav.section {
  padding-block: clamp(42px, 5vw, 68px);
}

body.secondary-page.editorial-secondary-page .page-guide {
  margin-top: clamp(24px, 4vw, 46px);
  padding: clamp(22px, 3vw, 32px) !important;
  border: 1px solid rgba(196, 154, 109, .42) !important;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(239, 145, 177, .075), var(--sp-panel));
}

body.secondary-page.editorial-secondary-page .page-guide h2 {
  margin-bottom: 16px;
  font-family: var(--sp-ui);
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
}

body.secondary-page.editorial-secondary-page .page-guide :is(ul, ol) {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  max-width: none;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.secondary-page.editorial-secondary-page .page-guide li { margin: 0; }
body.secondary-page.editorial-secondary-page .page-guide a {
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: 10px 14px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: rgba(7, 7, 8, .24);
  color: var(--sp-muted);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
}

body.secondary-page.editorial-secondary-page .page-guide a:hover,
body.secondary-page.editorial-secondary-page .page-guide a:focus-visible {
  border-color: rgba(239, 145, 177, .48);
  background: rgba(239, 145, 177, .10);
  color: var(--sp-cream);
}

body.secondary-page.editorial-secondary-page .facts { gap: 14px; }
body.secondary-page.editorial-secondary-page .fact {
  padding: 24px;
  border: 1px solid var(--sp-line);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .045), rgba(239, 145, 177, .025));
}

body.secondary-page.editorial-secondary-page .fact b {
  font-family: var(--sp-display);
  font-size: 23px;
}

body.secondary-page .updated { color: var(--sp-faint); }

/* 404 recovery */
body.secondary-page.recovery-page .error-hero {
  display: grid;
  grid-template-columns: minmax(280px, .78fr) minmax(0, 1.22fr);
  align-items: center;
  gap: clamp(44px, 8vw, 100px);
  padding: clamp(62px, 9vw, 116px) 0 76px;
}

body.secondary-page.recovery-page .error-art { min-height: 380px; }
body.secondary-page.recovery-page .error-art::before,
body.secondary-page.recovery-page .error-art::after { border-color: rgba(196, 154, 109, .28); }
body.secondary-page.recovery-page .error-art::after { border-color: rgba(239, 145, 177, .3); }
body.secondary-page.recovery-page .error-art img { filter: drop-shadow(0 0 25px rgba(239, 145, 177, .34)); }
body.secondary-page.recovery-page .error-code { color: rgba(239, 231, 220, .08); }
body.secondary-page.recovery-page .error-copy { max-width: 680px; }
body.secondary-page.recovery-page .error-copy .lede { max-width: 590px; }
body.secondary-page.recovery-page .actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
body.secondary-page.recovery-page .button {
  min-height: 52px;
  border-radius: 9px;
  font-family: var(--sp-ui);
  transition: transform .18s ease, border-color .18s ease, background-color .18s ease;
}

body.secondary-page.recovery-page .button-primary {
  color: #1a0d12;
  background: linear-gradient(180deg, #f7aec5, #e47e9f);
  box-shadow: 0 14px 32px rgba(239, 145, 177, .16);
}

body.secondary-page.recovery-page .button-secondary {
  border: 1px solid rgba(196, 154, 109, .6);
  color: var(--sp-cream);
  background: rgba(255, 255, 255, .025);
}

body.secondary-page.recovery-page .button:hover { transform: translateY(-2px); }
body.secondary-page.recovery-page .back-note { color: var(--sp-faint); }
body.secondary-page.recovery-page .route-panel { padding: 28px 0 80px; border-top-color: var(--sp-line); }
body.secondary-page.recovery-page .route-kicker { color: var(--sp-gold); }
body.secondary-page.recovery-page .route-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
body.secondary-page.recovery-page .route-link {
  min-height: 156px;
  padding: 18px;
  border: 1px solid var(--sp-line);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .012));
  transition: border-color .18s ease, background-color .18s ease, transform .18s ease;
}

body.secondary-page.recovery-page .route-link:hover,
body.secondary-page.recovery-page .route-link:focus-visible {
  border-color: var(--sp-pink);
  background: rgba(239, 145, 177, .08);
  transform: translateY(-3px);
}

body.secondary-page.recovery-page .route-number { color: var(--sp-gold); }
body.secondary-page.recovery-page .route-link strong {
  color: var(--sp-cream);
  font-family: var(--sp-display);
  font-size: clamp(18px, 1.8vw, 23px);
  line-height: 1.1;
}
body.secondary-page.recovery-page .route-arrow { color: var(--sp-pink); }
body.secondary-page.recovery-page .site-footer { border-top-color: var(--sp-line); }

body.secondary-page > footer {
  border-top: 1px solid var(--sp-line);
  color: var(--sp-faint);
}

body.secondary-page > footer .wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-block: 24px 34px;
  font-size: 12px;
}

body.secondary-page .footer-links { gap: 6px 16px; }
body.secondary-page .footer-links a { color: var(--sp-muted); text-decoration: none; }
body.secondary-page .footer-links a:hover { color: var(--sp-pink-strong); }

@media (max-width: 900px) {
  body.secondary-page.about-contact-page .about-route-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.secondary-page.recovery-page .route-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.secondary-page.recovery-page .error-hero { gap: 32px; }
}

@media (max-width: 680px) {
  body.secondary-page { --sp-page: min(calc(100% - 28px), 560px); }
  body.secondary-page .nav { align-items: flex-start; flex-wrap: wrap; }
  body.secondary-page .brand-mark { width: 58px; height: 58px; flex-basis: 58px; }
  body.secondary-page .wordmark { font-size: 22px; }
  body.secondary-page .est { font-size: 13px; }
  body.secondary-page .nav-actions { width: 100%; justify-content: space-between; }
  body.secondary-page .nav-actions .back { flex: 1; }
  body.secondary-page .hero .wrap { padding-block: 52px 48px; }
  body.secondary-page .about-route-grid,
  body.secondary-page .contact-route-grid,
  body.secondary-page .principles,
  body.secondary-page .prep-grid,
  body.secondary-page.editorial-secondary-page .page-guide :is(ul, ol) { grid-template-columns: 1fr; }
  body.secondary-page.about-contact-page .about-route-grid,
  body.secondary-page.about-contact-page .contact-route-grid { grid-template-columns: 1fr; }
  body.secondary-page .route-card { min-height: 0; padding: 21px; }
  body.secondary-page .status,
  body.secondary-page .callout { padding: 17px 18px; }
  body.secondary-page.recovery-page .error-hero { display: block; padding: 48px 0 54px; }
  body.secondary-page.recovery-page .error-art { min-height: 210px; margin-bottom: 38px; }
  body.secondary-page.recovery-page .actions { display: grid; }
  body.secondary-page.recovery-page .button { width: 100%; }
  body.secondary-page.recovery-page .route-link { min-height: 132px; padding: 15px; }
  body.secondary-page > footer .wrap { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 380px) {
  body.secondary-page .nav-actions,
  body.secondary-page .lang-switch { flex-wrap: wrap; }
  body.secondary-page .nav-actions .back { min-width: 0; white-space: normal; }
  body.secondary-page.recovery-page .route-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  body.secondary-page,
  body.secondary-page * {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}