/* ============================================================
   Forside — lys fordør (interim, Steven GO 2026-06-02)
   Mørk ramme (nav/signal-bar/footer fra base.njk) om lys flade.
   Den fulde designede Fordør (dagens-digt-rotation + Krog-copy) er v2;
   dette er en sammenhængende lys indgang der leder ind i læseverdenen.
   Side-scopet under .page-forside; samme palette som Tekstgulvet/Læse.
   ============================================================ */

.page-forside {
  --f-paper:      #f3ecdc;
  --f-paper-lift: #ece2cd;
  --f-ink:        #171311;
  --f-ink-soft:   #463d34;
  --f-ink-mute:   #8a7c6b;
  --f-accent:     #c1121f;
  --f-rule:       rgba(23,19,17,.16);
  --f-rule-faint: rgba(23,19,17,.09);
  --f-serif: 'Cormorant Garamond', Georgia, serif;
  --f-mono:  'Space Mono', ui-monospace, monospace;
}
body.page-forside { background: #171311; }

main.forside {
  background: var(--f-paper);
  color: var(--f-ink);
  max-width: 1180px;
  margin: 0 auto;
  padding: clamp(48px,8vw,104px) clamp(22px,6vw,104px) clamp(64px,10vw,128px);
  border-left: 1px solid var(--f-rule-faint);
  border-right: 1px solid var(--f-rule-faint);
  font-family: var(--f-serif);
}

/* --- Hero --- */
.forside-eyebrow {
  font-family: var(--f-mono);
  font-size: 11px; letter-spacing: .24em; text-transform: uppercase;
  color: var(--f-ink-mute); margin: 0 0 22px;
}
.forside-title {
  font-family: var(--f-serif); font-weight: 600;
  font-size: clamp(56px,12vw,140px); line-height: .94; letter-spacing: -.02em;
  margin: 0; color: var(--f-ink);
}
.forside-intro {
  font-family: var(--f-serif); font-style: italic; font-weight: 400;
  font-size: clamp(20px,2.6vw,28px); line-height: 1.3;
  color: var(--f-ink-soft); margin: 24px 0 0; max-width: 30ch;
}
.forside-intro-src {
  font-family: var(--f-mono); font-size: 11px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--f-ink-mute); margin: 12px 0 0;
}
.forside-cta {
  display: inline-flex; align-items: baseline; gap: 10px;
  margin-top: 36px;
  font-family: var(--f-mono); font-size: 12px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--f-ink); text-decoration: none;
  border-bottom: 1px solid var(--f-ink);
  padding-bottom: 4px;
}
.forside-cta:hover { color: var(--f-accent); border-color: var(--f-accent); }
.forside-cta:focus-visible { outline: 2px solid var(--f-accent); outline-offset: 4px; }

/* --- Signatur: manuskript-spejlet (rå ↔ rent) --- */
.forside-signatur {
  margin-top: clamp(56px,9vw,112px);
  padding-top: clamp(32px,5vw,56px);
  border-top: 1px solid var(--f-rule);
  display: grid; grid-template-columns: minmax(0,360px) 1fr;
  gap: clamp(24px,5vw,64px); align-items: start;
}
.forside-scan-img {
  display: block; width: 100%; height: auto;
  border: 1px solid var(--f-paper-lift);
}
.forside-sig-label {
  font-family: var(--f-mono); font-size: 10px; letter-spacing: .24em; text-transform: uppercase;
  color: var(--f-ink-mute); margin: 0 0 14px;
}
.forside-sig-title {
  font-family: var(--f-serif); font-weight: 500; font-style: italic;
  font-size: clamp(30px,4.5vw,52px); line-height: 1.04; margin: 0; color: var(--f-ink);
}
.forside-sig-body {
  font-family: var(--f-serif); font-size: clamp(18px,2vw,22px); line-height: 1.45;
  color: var(--f-ink-soft); margin: 16px 0 0; max-width: 42ch;
}
.forside-sig-link {
  display: inline-block; margin-top: 20px;
  font-family: var(--f-mono); font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--f-accent); text-decoration: none; border-bottom: 1px solid transparent;
}
.forside-sig-link:hover { border-bottom-color: var(--f-accent); }
.forside-sig-link:focus-visible { outline: 2px solid var(--f-accent); outline-offset: 3px; }

/* --- Manuskripter-stribe --- */
.forside-spejle { margin-top: clamp(48px,7vw,88px); }
.forside-spejle-head {
  font-family: var(--f-mono); font-size: 10px; letter-spacing: .24em; text-transform: uppercase;
  color: var(--f-ink-mute); padding-bottom: 12px; margin-bottom: 4px;
  border-bottom: 1px solid var(--f-rule);
}
.forside-ark {
  display: flex; align-items: baseline; gap: 18px;
  padding: 16px 4px; min-height: 44px;
  text-decoration: none; color: var(--f-ink);
  border-bottom: 1px solid var(--f-rule-faint);
}
.forside-ark:hover { background: rgba(23,19,17,.03); }
.forside-ark:focus-visible { outline: 2px solid var(--f-accent); outline-offset: -2px; }
.forside-ark-title {
  font-family: var(--f-serif); font-size: clamp(20px,2.4vw,26px); color: var(--f-ink);
}
.forside-ark-leader { flex: 1; align-self: flex-end; height: 0; margin-bottom: 6px; border-bottom: 1px dotted rgba(23,19,17,.34); }
.forside-ark-meta {
  font-family: var(--f-mono); font-size: 10px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--f-ink-mute); white-space: nowrap;
}

@media (max-width: 720px) {
  .forside-signatur { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .page-forside * { transition: none !important; }
}