/* ============================================================
   Side — lyst indholdsside-mønster (Om, Presse, Kontakt, Bøger, Video)
   Genbrugeligt: samme lyse palette/typografi som resten af systemet.
   Mørk ramme (nav/signal-bar/footer) om lys flade. border-radius 0,
   ingen skygger, 1px rules. Side-scopet under .page-side.
   ============================================================ */

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

main.side {
  background: var(--s-paper);
  color: var(--s-ink);
  max-width: 880px;
  margin: 0 auto;
  padding: clamp(44px,7vw,96px) clamp(22px,6vw,80px) clamp(56px,9vw,112px);
  border-left: 1px solid var(--s-rule-faint);
  border-right: 1px solid var(--s-rule-faint);
  font-family: var(--s-serif);
}

.side-head { margin-bottom: clamp(32px,5vw,52px); padding-bottom: 22px; border-bottom: 1px solid var(--s-rule); }
.side-eyebrow {
  font-family: var(--s-mono); font-size: 11px; letter-spacing: .24em; text-transform: uppercase;
  color: var(--s-ink-mute); margin: 0 0 18px;
}
.side-title {
  font-family: var(--s-serif); font-weight: 600;
  font-size: clamp(40px,8vw,84px); line-height: .98; letter-spacing: -.02em;
  margin: 0; color: var(--s-ink);
}
.side-subt {
  font-family: var(--s-mono); font-size: 11px; letter-spacing: .26em; text-transform: uppercase;
  color: var(--s-ink-mute); margin: 16px 0 0;
}

.side-body { font-family: var(--s-serif); }
.side-body p {
  font-size: clamp(18px,2vw,22px); line-height: 1.7; color: var(--s-ink); margin: 0 0 1.4em;
}
.side-body p em { font-style: italic; }
.side-body p strong { font-weight: 600; font-style: normal; }
.side-body a {
  color: var(--s-ink); text-decoration: none;
  border-bottom: 1px solid var(--s-accent); transition: color .15s linear;
}
.side-body a:hover { color: var(--s-accent); }
.side-body a:focus-visible { outline: 2px solid var(--s-accent); outline-offset: 2px; }

.side-pull {
  margin: clamp(36px,5vw,56px) 0;
  padding: 24px 0 24px 28px;
  border-left: 3px solid var(--s-accent);
  font-family: var(--s-serif); font-style: italic;
  font-size: clamp(22px,2.6vw,28px); line-height: 1.4; color: var(--s-ink);
}
.side-pull .src {
  display: block; margin-top: 16px;
  font-family: var(--s-mono); font-style: normal;
  font-size: 10px; letter-spacing: .26em; text-transform: uppercase; color: var(--s-ink-mute);
}

.side-facts {
  margin-top: clamp(40px,6vw,64px);
  display: grid; grid-template-columns: repeat(3,1fr);
  border-top: 1px solid var(--s-rule); border-left: 1px solid var(--s-rule);
}
.side-facts .cell {
  padding: 22px 24px;
  border-right: 1px solid var(--s-rule); border-bottom: 1px solid var(--s-rule);
}
.side-facts .k {
  font-family: var(--s-mono); font-size: 10px; letter-spacing: .28em; text-transform: uppercase;
  color: var(--s-ink-mute); margin-bottom: 10px;
}
.side-facts .v {
  font-family: var(--s-serif); font-weight: 600; font-size: 40px; line-height: 1; color: var(--s-ink);
}
.side-facts .vsub {
  font-family: var(--s-serif); font-style: italic; font-size: 14px; color: var(--s-ink-soft); margin-top: 8px;
}

/* generisk liste (bøger/presse-rækker) */
.side-list { margin-top: clamp(32px,4vw,48px); }
.side-row {
  display: flex; align-items: baseline; gap: 18px;
  padding: 16px 2px; min-height: 44px;
  text-decoration: none; color: var(--s-ink);
  border-bottom: 1px solid var(--s-rule-faint);
}
.side-row:hover { background: rgba(23,19,17,.03); }
.side-row-title { font-family: var(--s-serif); font-size: clamp(20px,2.4vw,26px); }
.side-row-lead { flex: 1; align-self: flex-end; height: 0; margin-bottom: 6px; border-bottom: 1px dotted rgba(23,19,17,.34); }
.side-row-meta { font-family: var(--s-mono); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--s-ink-mute); white-space: nowrap; }

@media (max-width: 700px) { .side-facts { grid-template-columns: 1fr; } }

/* === Bredt layout til grid-tunge sider (bøger/presse/video) === */
main.side--wide { max-width: 1180px; }

/* CTA-link (fx email) */
.side-cta-link {
  display: inline-block; margin-top: 10px;
  font-family: var(--s-mono); font-size: 12px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--s-ink); text-decoration: none;
  border: 1px solid var(--s-ink); padding: 12px 22px; transition: background .15s linear, color .15s linear;
}
.side-cta-link:hover { background: var(--s-ink); color: var(--s-paper); }
.side-cta-link:focus-visible { outline: 2px solid var(--s-accent); outline-offset: 2px; }

/* Under-sektion (kontakt) */
.side-section { margin-top: clamp(28px,4vw,44px); }
.side-section__h {
  font-family: var(--s-mono); font-size: 10px; letter-spacing: .28em; text-transform: uppercase;
  color: var(--s-ink-mute); margin-bottom: 10px;
}
.side-section p { font-family: var(--s-serif); font-size: clamp(17px,1.9vw,20px); line-height: 1.7; color: var(--s-ink); margin: 0; }
.side-section a, .side-table a { color: var(--s-ink); border-bottom: 1px solid var(--s-accent); text-decoration: none; }
.side-section a:hover, .side-table a:hover { color: var(--s-accent); }

/* Citater (presse) */
.side-quotes { margin-top: clamp(32px,5vw,56px); display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; background: var(--s-rule); border: 1px solid var(--s-rule); }
.side-quote { background: var(--s-paper); padding: 28px; }
.side-quote .q { font-family: var(--s-serif); font-style: italic; font-size: clamp(19px,2.2vw,23px); line-height: 1.45; color: var(--s-ink); margin: 0 0 16px; }
.side-quote .src { font-family: var(--s-mono); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var(--s-ink-mute); }

/* Key/value-tabel (presse fakta) */
.side-table { margin-top: clamp(32px,5vw,56px); border-top: 1px solid var(--s-rule); border-left: 1px solid var(--s-rule); }
.side-table .row { display: grid; grid-template-columns: 200px 1fr; border-right: 1px solid var(--s-rule); border-bottom: 1px solid var(--s-rule); }
.side-table .k { padding: 16px 20px; font-family: var(--s-mono); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var(--s-ink-mute); border-right: 1px solid var(--s-rule); background: var(--s-paper-lift); }
.side-table .v { padding: 16px 20px; font-family: var(--s-serif); font-size: 17px; line-height: 1.5; color: var(--s-ink); }
.side-table .v em { font-style: italic; }

/* Kort-grid (bøger, scener, presse-materiale) */
.side-cards { margin-top: clamp(32px,5vw,56px); display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.side-cards--books { grid-template-columns: repeat(5,1fr); }
.side-card {
  display: flex; flex-direction: column; justify-content: space-between; gap: 16px;
  background: var(--s-paper-lift); border: 1px solid var(--s-rule); padding: 20px;
  text-decoration: none; color: var(--s-ink); min-height: 190px; transition: border-color .15s linear;
}
.side-card:hover { border-color: var(--s-ink); }
.side-card:focus-visible { outline: 2px solid var(--s-accent); outline-offset: 2px; }
.side-card__meta { font-family: var(--s-mono); font-size: 9px; letter-spacing: .22em; text-transform: uppercase; color: var(--s-ink-mute); display: flex; justify-content: space-between; gap: 8px; }
.side-card__title { font-family: var(--s-serif); font-style: italic; font-size: clamp(18px,1.6vw,21px); line-height: 1.15; color: var(--s-ink); }
.side-card__desc { font-family: var(--s-serif); font-size: 14px; line-height: 1.5; color: var(--s-ink-soft); }
.side-card__foot { font-family: var(--s-mono); font-size: 9px; letter-spacing: .2em; text-transform: uppercase; color: var(--s-ink-mute); display: flex; justify-content: space-between; align-items: flex-end; gap: 8px; }
.side-card__foot .buy { color: var(--s-accent); }

/* Bog-kort med omslag */
.side-card--book { min-height: 0; gap: 12px; }
.side-card__cover { width: 100%; aspect-ratio: 2/3; object-fit: cover; display: block; border: 1px solid var(--s-rule); background: var(--s-paper-deep); }

/* Billed-kort (scener) */
.side-card--img { padding: 0; min-height: 0; aspect-ratio: 3/4; position: relative; overflow: hidden; display: block; }
.side-card--img .side-card__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.side-card--img .side-card__content { position: absolute; inset: auto 0 0 0; padding: 16px; background: linear-gradient(to top, rgba(23,19,17,.9), rgba(23,19,17,0)); }
.side-card--img .side-card__title { color: #f3ecdc; }
.side-card--img .side-card__meta { color: rgba(243,236,220,.7); }
.side-card--img .side-card__status { display: inline-block; margin-top: 8px; font-family: var(--s-mono); font-size: 9px; letter-spacing: .2em; text-transform: uppercase; color: #f3ecdc; border: 1px solid rgba(243,236,220,.4); padding: 3px 8px; }

.side-note { margin-top: clamp(28px,4vw,44px); padding: 16px 20px; border-left: 3px solid var(--s-accent); background: var(--s-paper-lift); font-family: var(--s-mono); font-size: 11px; letter-spacing: .12em; color: var(--s-ink-soft); }
.side-note a { color: var(--s-accent); text-decoration: none; border-bottom: 1px solid var(--s-accent); }

@media (max-width: 900px) {
  .side-cards, .side-cards--books { grid-template-columns: repeat(2,1fr); }
  .side-quotes { grid-template-columns: 1fr; }
  .side-table .row { grid-template-columns: 1fr; }
  .side-table .k { border-right: none; border-bottom: 1px solid var(--s-rule); }
}
@media (max-width: 560px) { .side-cards, .side-cards--books { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) { .page-side * { transition: none !important; } }