/* =========================================================
   WAHID SUI — Two voices, one brand.
   Skuespil: editorial · reserveret · ink + silver
   Foredrag/Shows: varm · moderne · cream + butter gold + coral
   ========================================================= */

:root {
  /* Foundation */
  --paper: #FAFAF7;
  --paper-warm: #F4EFE3;      /* warm cream for shows/coaching */
  --paper-cool: #F2F2F0;      /* cool paper for skuespil/editorial */
  --ink: #0F0F12;             /* near-black, the reserved tone */
  --ink-soft: #2A2A30;
  --silver: #71717A;
  --silver-soft: #A8A8B0;
  --muted: #6E6E78;
  --rule: rgba(15, 15, 18, 0.10);
  --rule-soft: rgba(15, 15, 18, 0.06);

  /* Accents */
  --coral: #E94A3D;           /* primary accent — used sparingly in Skuespil */
  --gold: #E8B547;            /* warmth — Foredrag/Shows primary */
  --gold-deep: #B88822;
  --plum: #2B1F33;
  --accent-soft: #EFC97E;    /* lys guld — år/accenter på mørk baggrund */
  --accent-deep: var(--gold-deep);
  --radius-sm: 6px; --radius-md: 10px; --radius-lg: 14px;

  /* Typography */
  --font-body: "Inter Tight", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, sans-serif;
  --font-display: "Fraunces", "Playfair Display", Georgia, serif;

  /* Rhythm */
  --section-pad: clamp(96px, 14vw, 200px);
  --gutter: clamp(20px, 5vw, 80px);
  --content-max: 1400px;
  --text-max: 620px;
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

* , *::before, *::after { box-sizing: border-box; }
html {
  scroll-behavior: smooth;
  scroll-padding-top: 84px;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  overscroll-behavior-y: none;
  scrollbar-width: thin;
  scrollbar-color: var(--silver-soft) var(--paper);
}
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.55;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; padding: 0; margin: 0; }
button { font-family: inherit; cursor: pointer; }
h1, h2, h3, h4, h5 {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.05;
  color: var(--ink);
}
p { margin: 0 0 1em; }

.wrap {
  max-width: var(--content-max);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.section {
  padding: var(--section-pad) 0;
  position: relative;
}

/* =========================================================
   ZONE 1 — RESERVED (Skuespil)
   ========================================================= */
.zone-reserved {
  /* editorial dybde: blødt coral-lys foroven, plum-skygge i hjørnet, dæmpning nedad */
  background:
    radial-gradient(72% 48% at 50% -2%, rgba(233, 74, 61, 0.05) 0%, transparent 58%),
    radial-gradient(95% 80% at 102% 102%, rgba(43, 31, 51, 0.05) 0%, transparent 55%),
    linear-gradient(180deg, var(--paper-cool) 0%, #ECECEA 100%);
}
.zone-reserved .number { color: var(--silver); }
.zone-reserved .section-label { color: var(--silver); letter-spacing: 0.28em; }
.zone-reserved .section-title { color: var(--ink); }
.zone-reserved .section-title em {
  color: var(--ink);
  font-style: italic;
  border-bottom: 1px solid var(--silver);
}

/* =========================================================
   ZONE 2 — WARM (Shows, Coaching, Foredrag)
   ========================================================= */
.zone-warm {
  /* varmt scenelys: guld-glød foroven, dyb guld i hjørnet, blød dæmpning nedad */
  background:
    radial-gradient(72% 50% at 50% -2%, rgba(232, 181, 71, 0.12) 0%, transparent 60%),
    radial-gradient(90% 75% at 0% 102%, rgba(184, 136, 34, 0.06) 0%, transparent 55%),
    linear-gradient(180deg, var(--paper-warm) 0%, #EEE7D6 100%);
}
.zone-warm .number { color: var(--gold-deep); }
.zone-warm .section-label { color: var(--gold-deep); letter-spacing: 0.24em; }
.zone-warm .section-title em { color: var(--gold-deep); font-style: italic; }

/* =========================================================
   ZONE 3 — DARK (testimonials only)
   ========================================================= */
.zone-dark {
  /* teater-scenelys: varm spot fra oven, coral-strejf nedefra, dyb dimension */
  background:
    radial-gradient(80% 55% at 50% -4%, rgba(232, 181, 71, 0.13) 0%, transparent 55%),
    radial-gradient(55% 50% at 84% 112%, rgba(233, 74, 61, 0.07) 0%, transparent 55%),
    radial-gradient(130% 100% at 50% 42%, #1D1D24 0%, var(--ink) 70%);
  color: var(--paper);
  position: relative;
}
/* blød vignette i kanterne — biograflærred-dybde */
.zone-dark::before {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  background: radial-gradient(120% 90% at 50% 45%, transparent 60%, rgba(0,0,0,0.35) 100%);
}
.zone-dark .wrap { position: relative; z-index: 1; }
.zone-dark .number { color: var(--gold); }
.zone-dark .section-label { color: rgba(250, 250, 247, 0.5); }
.zone-dark .section-title, .zone-dark h3 { color: var(--paper); }
.zone-dark .section-title em { color: var(--gold); font-style: italic; }

/* =========================================================
   IDENTITETSFARVER PR. SEKTION
   Skuespil = rød · Instruktør = sort · Foredrag = gul
   ========================================================= */
/* Skuespil → rød (overruler zone-reserved sølv) */
#skuespil .number { color: var(--coral); }
#skuespil .section-label { color: var(--coral); }
#skuespil .section-title em { color: var(--coral); border-bottom-color: var(--coral); }

/* Instruktør → sort (overruler zone-warm guld) */
#instruktor .number { color: var(--ink); }
#instruktor .section-label { color: var(--ink); }
#instruktor .section-title em { color: var(--ink); }
#instruktor .coach-card__target { color: var(--ink); }
#instruktor .coach-card__target::before { background: var(--ink); }
#instruktor .coach-card:hover { border-color: var(--ink); }

/* Foredrag → guld (beholder zone-warm standard) */

/* =========================================================
   SECTION HEADER — centreret
   ========================================================= */
.section-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 14px;
  margin-bottom: 72px;
}
@media (max-width: 720px) { .section-head { margin-bottom: 48px; } }
.number {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: 28px;
  line-height: 1;
  text-align: center;
}
.section-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--muted);
  display: block;
  text-align: center;
}
.section-title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(40px, 6vw, 88px);
  line-height: 0.98;
  letter-spacing: -0.02em;
  max-width: 18ch;
  margin: 0 auto;
  text-align: center;
}
.section-title em { font-style: italic; }

/* =========================================================
   HEADER
   ========================================================= */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  padding: 20px var(--gutter);
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--ink);
  transition: background 0.4s var(--ease), padding 0.3s var(--ease), box-shadow 0.4s var(--ease);
}
.site-header.is-scrolled {
  background: rgba(250, 250, 247, 0.94);
  backdrop-filter: saturate(140%) blur(10px);
  padding: 14px var(--gutter);
  box-shadow: 0 1px 0 var(--rule);
}
.site-brand {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  font-size: 22px;
  letter-spacing: -0.02em;
  color: var(--ink);
}
.site-nav ul { display: flex; gap: 4px; align-items: center; }
.site-nav a {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--ink);
  padding: 8px 14px;
  border-radius: 999px;
  transition: background 0.2s var(--ease), color 0.2s var(--ease);
}
.site-nav a:hover { background: var(--ink); color: var(--paper); }
.site-nav .btn-book {
  background: var(--ink);
  color: var(--paper);
  padding: 10px 18px;
  margin-left: 8px;
}
.site-nav .btn-book:hover { background: var(--coral); }
.nav-toggle { display: none; background: none; border: none; font-size: 13px; letter-spacing: 0.1em; color: var(--ink); }
@media (max-width: 860px) {
  .site-nav { display: none; }
  .nav-toggle { display: block; }
  .site-nav.is-open {
    display: block;
    position: fixed; inset: 0;
    background: var(--paper);
    padding: 120px var(--gutter) 60px;
  }
  .site-nav.is-open ul { flex-direction: column; gap: 4px; align-items: flex-start; }
  .site-nav.is-open a {
    font-family: var(--font-display);
    font-size: 36px;
    font-style: italic;
    padding: 8px 0;
    border-radius: 0;
  }
  .site-nav.is-open .btn-book { background: var(--ink); color: var(--paper); padding: 12px 24px; }
}

/* =========================================================
   HERO
   ========================================================= */
.hero {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--paper);
  padding: 140px var(--gutter) 80px;
  text-align: center;
}
.hero__text {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 880px;
  margin: 0 auto 56px;
}
.hero__eyebrow {
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--coral);
  margin-bottom: 28px;
}
.hero__title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(34px, 8vw, 132px);
  line-height: 0.95;
  letter-spacing: -0.03em;
  color: var(--ink);
  margin-bottom: 32px;
  text-align: center;
}
.hero__title em { font-style: italic; }
/* Identitetsfarver: Skuespil rød · Instruktør sort · Foredrag gul */
.hero__title .t-red  { color: var(--coral); }
.hero__title .t-ink  { color: var(--ink); }
.hero__title .t-gold { color: var(--gold-deep); }
.hero__tagline {
  font-size: clamp(17px, 1.4vw, 21px);
  color: var(--ink-soft);
  max-width: 620px;
  line-height: 1.55;
  margin: 0 auto 40px;
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  text-align: center;
}
.hero__roles {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 36px;
}
.hero__role {
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 600;
  padding: 8px 14px;
  border: 1px solid var(--ink);
  border-radius: 999px;
}
.hero__role--coral { background: var(--coral); color: var(--paper); border-color: var(--coral); }
.hero__role--dark { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.hero__role--gold { background: var(--gold); color: var(--ink); border-color: var(--gold); }
.hero__cta-row {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  justify-content: center;
}
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 24px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: all 0.2s var(--ease);
  border: 1px solid transparent;
  cursor: pointer;
}
.btn--primary { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.btn--primary:hover { background: var(--coral); border-color: var(--coral); }
.btn--ghost { background: transparent; color: var(--ink); border-color: var(--ink); }
.btn--ghost:hover { background: var(--ink); color: var(--paper); }
.btn--warm { background: var(--gold); color: var(--ink); border-color: var(--gold); }
.btn--warm:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.btn::after { content: "→"; display: inline-block; transition: transform 0.25s var(--ease); }

.hero__image {
  background: var(--ink);
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 960px;
  aspect-ratio: 21/9;            /* letterbox — widescreen film still */
  margin: 0 auto;
  border-radius: 6px;
  box-shadow:
    0 40px 90px -30px rgba(15, 15, 18, 0.45),
    0 12px 30px -12px rgba(15, 15, 18, 0.25);
}
@media (max-width: 720px) { .hero__image { aspect-ratio: 16/10; } }
.hero__image img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  /* cinematic grade: lidt mere kontrast, varme highlights */
  filter: contrast(1.07) saturate(1.06) sepia(0.05) brightness(0.99);
  animation: hero-kenburns 18s var(--ease-out) both;
  transform-origin: 50% 40%;
}
@keyframes hero-kenburns {
  from { transform: scale(1.1); }
  to   { transform: scale(1.0); }
}
/* vignette + bund-scrim — giver dybde og bærer caption */
.hero__image::after {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  background:
    radial-gradient(125% 95% at 50% 32%, transparent 52%, rgba(15, 15, 18, 0.36) 100%),
    linear-gradient(to top, rgba(15, 15, 18, 0.5), transparent 28%);
}
.hero__caption {
  position: absolute;
  bottom: 16px; left: 20px;
  color: var(--paper);
  font-family: var(--font-display);
  font-style: italic;
  font-size: 13px;
  text-shadow: 0 1px 8px rgba(0,0,0,0.5);
  z-index: 2;
  letter-spacing: 0.04em;
}

/* =========================================================
   HERO — FULDSKÆRM (cinematisk, tekst ovenpå billedet)
   ========================================================= */
.hero--full {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  padding: 0;
  justify-content: center;
  overflow: hidden;
}
/* Billedet bliver baggrund — fylder hele skærmen */
.hero--full .hero__image {
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  aspect-ratio: auto;
  margin: 0;
  border-radius: 0;
  box-shadow: none;
  z-index: 0;
}
.hero--full .hero__image img {
  filter: contrast(1.08) saturate(1.05) sepia(0.04) brightness(0.92);
  animation: hero-kenburns 22s var(--ease-out) both;
}
/* Ingen slide på fuldskærms-baggrund — kun blød fade ind */
.hero--full .hero__image { animation: hero-fade 1.6s var(--ease-out) 0.2s both; }
@keyframes hero-fade { from { opacity: 0; } to { opacity: 1; } }
/* Stærkere scrim så teksten er knivskarp læsbar */
.hero--full .hero__image::after {
  background:
    radial-gradient(120% 105% at 50% 38%, transparent 30%, rgba(15,15,18,0.55) 100%),
    linear-gradient(to top, rgba(15,15,18,0.72) 0%, rgba(15,15,18,0.12) 45%, rgba(15,15,18,0.42) 100%);
}
/* Tekstblokken ovenpå */
.hero--full .hero__text {
  position: relative;
  z-index: 2;
  margin: 0 auto;
  padding: 130px var(--gutter) 96px;
}
/* Lyse tekstfarver på mørk baggrund — beholder rød + gul identitet */
.hero--full .hero__title .t-ink { color: var(--paper); }
.hero--full .hero__title .t-gold { color: var(--gold); }
.hero--full .hero__title { text-shadow: 0 2px 30px rgba(0,0,0,0.35); }
.hero--full .hero__tagline { color: rgba(250,250,247,0.88); text-shadow: 0 1px 16px rgba(0,0,0,0.4); }
.hero--full .hero__eyebrow { color: var(--gold); }
/* Ghost-knap skal være lys på mørk baggrund */
.hero--full .btn--ghost { color: var(--paper); border-color: rgba(250,250,247,0.55); }
.hero--full .btn--ghost:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }

/* Scroll-cue nederst */
.hero__scroll {
  position: absolute;
  left: 50%;
  bottom: 30px;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: rgba(250,250,247,0.8);
  font-size: 10px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  font-weight: 600;
}
.hero__scroll span { writing-mode: vertical-rl; }
.hero__scroll::after {
  content: "";
  width: 1px;
  height: 46px;
  background: linear-gradient(to bottom, rgba(250,250,247,0.7), transparent);
  animation: scroll-pulse 2.2s var(--ease) infinite;
}
@keyframes scroll-pulse {
  0%   { transform: scaleY(0); transform-origin: top; opacity: 0; }
  35%  { transform: scaleY(1); transform-origin: top; opacity: 1; }
  70%  { transform: scaleY(1); transform-origin: bottom; opacity: 1; }
  100% { transform: scaleY(0); transform-origin: bottom; opacity: 0; }
}
@media (max-width: 720px) {
  .hero--full .hero__image { aspect-ratio: auto; }
  .hero__scroll { display: none; }
}

/* =========================================================
   AD SLOTS — promotional banners (egne kampagner)
   ========================================================= */
.ad-strip {
  background:
    radial-gradient(70% 120% at 50% 0%, rgba(232, 181, 71, 0.08) 0%, transparent 60%),
    var(--ink);
  color: var(--paper);
  padding: 24px var(--gutter);
}
.ad-strip__inner {
  max-width: var(--content-max);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
}
.ad-strip__label {
  font-size: 10px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(250, 250, 247, 0.4);
  flex-shrink: 0;
}
.ad-strip__text {
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 300;
  color: var(--paper);
  flex: 1;
}
.ad-strip__text strong { color: var(--gold); font-weight: 400; }
.ad-strip__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  background: var(--gold);
  color: var(--ink);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background 0.2s var(--ease), color 0.2s var(--ease);
}
.ad-strip__cta:hover { background: var(--paper); color: var(--ink); }
.ad-strip__cta::after { content: "→"; }

.ad-card {
  background: var(--paper-warm);
  border: 1px solid var(--rule);
  padding: 48px;
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
  gap: 32px;
  align-items: center;
  border-radius: 4px;
}
@media (max-width: 900px) { .ad-card { grid-template-columns: 1fr; gap: 20px; text-align: left; } }
.ad-card__tag {
  display: inline-block;
  padding: 4px 10px;
  background: var(--gold);
  color: var(--ink);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  border-radius: 4px;
  align-self: start;
}
.ad-card__headline {
  font-family: var(--font-display);
  font-size: clamp(22px, 2.4vw, 32px);
  font-weight: 400;
  line-height: 1.15;
  color: var(--ink);
}
.ad-card__sub {
  font-size: 14px;
  color: var(--ink-soft);
  margin-top: 8px;
}
.ad-card .btn { white-space: nowrap; justify-self: end; }
@media (max-width: 900px) { .ad-card .btn { justify-self: start; } }

/* =========================================================
   SEKTION-UNIVERSER — hver sektion sin egen DOBBELT V-farve
   Mønster: ::before = billede (lav opacity + farvefilter)
            ::after  = paper-overlay (holder midten ren + læsbar)
   ========================================================= */
#om, #skuespil, #instruktor, #foredrag, #jury, #kontakt {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
#om > .wrap, #skuespil > .wrap, #instruktor > .wrap,
#foredrag > .wrap, #jury > .wrap, #kontakt > .wrap {
  position: relative;
  z-index: 1;
}
#om::before, #skuespil::before, #instruktor::before,
#foredrag::before, #jury::before, #kontakt::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-size: cover;
  background-repeat: no-repeat;
}
#om::after, #skuespil::after, #instruktor::after,
#foredrag::after, #jury::after, #kontakt::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
}

/* 01 OM — BLÅ */
#om::before {
  background-image: url('../images/projects/ep-dobbeltv.jpg');
  background-position: center 24%;
  opacity: 0.55;
  filter: saturate(1.2) brightness(1.04);
}
#om::after {
  background: linear-gradient(180deg,
    rgba(54,104,196,0.46) 0%,
    rgba(54,104,196,0.24) 14%,
    rgba(250,250,247,0.80) 34%,
    #FAFAF7 52%,
    #FAFAF7 100%);
}

/* 02 SKUESPIL — LILLA (blå billede hue-roteret) */
#skuespil::before {
  background-image: url('../images/projects/dv-blue.jpg');
  background-position: center 30%;
  opacity: 0.55;
  filter: hue-rotate(70deg) saturate(1.4) brightness(1.0);
}
#skuespil::after {
  background: linear-gradient(180deg,
    rgba(124,78,178,0.50) 0%,
    rgba(124,78,178,0.26) 14%,
    rgba(242,242,240,0.82) 34%,
    #F2F2F0 52%,
    #F2F2F0 100%);
}

/* 03 INSTRUKTØR — ORANGE */
#instruktor::before {
  background-image: url('../images/projects/dobbeltv-scene.jpg');
  background-position: center 38%;
  opacity: 0.55;
  filter: saturate(1.25) brightness(1.02);
}
#instruktor::after {
  background: linear-gradient(180deg,
    rgba(226,116,46,0.48) 0%,
    rgba(226,116,46,0.24) 14%,
    rgba(244,239,227,0.82) 34%,
    #F4EFE3 52%,
    #F4EFE3 100%);
}

/* 04 FOREDRAG — GUL/GULD (orange billede hue-roteret) */
#foredrag::before {
  background-image: url('../images/projects/dv-orange.jpg');
  background-position: center 34%;
  opacity: 0.55;
  filter: hue-rotate(18deg) saturate(1.45) brightness(1.1);
}
#foredrag::after {
  background: linear-gradient(180deg,
    rgba(232,181,71,0.52) 0%,
    rgba(232,181,71,0.28) 14%,
    rgba(244,239,227,0.82) 34%,
    #F4EFE3 52%,
    #F4EFE3 100%);
}

/* JURY / Blåstemplinger — BLÅ hvisken */
#jury::before {
  background-image: url('../images/projects/dobbeltv-scene2.jpg');
  background-position: center 36%;
  opacity: 0.45;
  filter: saturate(1.15) brightness(1.05);
}
#jury::after {
  background: linear-gradient(180deg,
    rgba(70,120,200,0.34) 0%,
    rgba(70,120,200,0.16) 14%,
    rgba(250,250,247,0.84) 34%,
    #FAFAF7 52%,
    #FAFAF7 100%);
}

/* 05 KONTAKT — KORAL/RØD (luk cirklen) */
#kontakt::before {
  background-image: url('../images/projects/dv-hero.jpg');
  background-position: center 38%;
  opacity: 0.55;
  filter: saturate(1.2) brightness(1.02);
}
#kontakt::after {
  background: linear-gradient(180deg,
    rgba(233,74,61,0.48) 0%,
    rgba(233,74,61,0.24) 14%,
    rgba(250,250,247,0.80) 34%,
    #FAFAF7 52%,
    #FAFAF7 100%);
}

.om__layout {
  display: flex;
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
  max-width: 960px;
  margin: 0 auto;
  text-align: left;
}
@media (max-width: 760px) { .om__layout { flex-direction: column; text-align: center; } }
.om__layout > .number { display: none; }
.om__portrait {
  flex-shrink: 0;
  width: clamp(220px, 33vw, 360px);
  margin: 0;
}
.om__portrait img {
  width: 100%;
  border-radius: 8px;
  filter: grayscale(100%) contrast(1.05);
  box-shadow: 0 26px 60px -30px rgba(15,15,18,0.5);
}
.om__lead {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(24px, 2.2vw, 32px);
  line-height: 1.3;
  color: var(--ink);
  margin: 0 auto 40px;
  max-width: 620px;
  text-align: center;
}
.om__body {
  flex: 1;
  font-size: 17px;
  line-height: 1.65;
  color: var(--ink-soft);
  max-width: 560px;
}
@media (max-width: 760px) { .om__body { margin: 0 auto; } }
.om__body p { margin-bottom: 1.4em; }
.om__body strong { color: var(--ink); font-weight: 600; }
.om__pull {
  margin-top: 56px;
  padding: 32px 0;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.3;
  color: var(--ink);
}
.om__pull span { color: var(--coral); }

/* =========================================================
   SKUESPIL — RESERVED EDITORIAL
   Større billeder, mindre tekst, mere whitespace, sølv accent
   ========================================================= */
.work-filters {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin-bottom: 80px;
  border-top: 1px solid var(--rule);
  padding-top: 32px;
}
.filter-btn {
  background: transparent;
  border: 1px solid transparent;
  color: var(--silver);
  padding: 10px 18px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-radius: 999px;
  transition: color 0.2s var(--ease), background 0.2s var(--ease);
}
.filter-btn:hover { color: var(--ink); }
.filter-btn.is-active { background: var(--ink); color: var(--paper); }

.project-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px 22px;
}
@media (max-width: 1100px) { .project-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 760px) { .project-grid { grid-template-columns: repeat(2, 1fr); gap: 28px 16px; } }
@media (max-width: 460px) { .project-grid { grid-template-columns: 1fr; row-gap: 36px; } }

.proj-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--ink);
  transition: opacity 0.3s var(--ease);
}
.proj-card.is-hidden { display: none; }
.proj-card:hover .proj-card__image img { transform: scale(1.04); }
.proj-card:hover .proj-card__title { color: var(--coral); }

.proj-card__image {
  aspect-ratio: 4/5;
  overflow: hidden;
  background: var(--ink);
  margin-bottom: 14px;
  position: relative;
}
.proj-card__image img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: grayscale(15%) contrast(1.03);
  transition: transform 1s var(--ease-out), filter 0.6s var(--ease);
}
.proj-card:hover .proj-card__image img { filter: grayscale(0%) contrast(1.05); }
.proj-card__image--text {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  padding: 20px;
  background: linear-gradient(135deg, var(--ink) 0%, var(--plum) 100%);
}
/* Bogcover — vis hele coveret (ikke beskåret), fuld farve */
.proj-card__image--book { background: #15151a; }
.proj-card__image--book img { object-fit: contain; padding: 20px; filter: none; }
.proj-card:hover .proj-card__image--book img { filter: none; transform: scale(1.03); }
.proj-card__image--text strong {
  font-family: var(--font-display);
  font-weight: 300;
  font-style: italic;
  font-size: 18px;
  color: var(--paper);
  letter-spacing: -0.01em;
}

.proj-card__type {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--silver);
  margin-bottom: 7px;
}
.proj-card__title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 18px;
  line-height: 1.18;
  letter-spacing: -0.01em;
  margin-bottom: 6px;
  transition: color 0.25s var(--ease);
}
.proj-card__meta {
  font-size: 12px;
  color: var(--silver);
  line-height: 1.45;
}
.proj-card__year {
  font-family: var(--font-display);
  font-style: italic;
  color: var(--ink);
  font-weight: 400;
  margin-right: 8px;
}

/* Subsection divider (Teater / Film / TV) — centreret */
.sub-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  margin: 72px 0 40px;
  padding-top: 32px;
  border-top: 1px solid var(--rule);
  text-align: center;
}
.sub-head:first-of-type { margin-top: 0; border-top: none; padding-top: 0; }
.sub-head__num {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: 16px;
  color: var(--silver);
  letter-spacing: 0.04em;
}
.sub-head__inner { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; justify-content: center; }
.sub-head__title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(28px, 3vw, 40px);
  letter-spacing: -0.01em;
  color: var(--ink);
  text-align: center;
}
.sub-head__count {
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--silver);
  font-weight: 500;
}

/* "Egen produktion" badge — markeres på cards der er hans egne */
.proj-card__badge {
  position: absolute;
  top: 12px; left: 12px;
  z-index: 2;
  padding: 4px 10px;
  background: var(--coral);
  color: var(--paper);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  border-radius: 4px;
}

/* Reserved skuespil credits row — centreret */
.credits-row {
  margin-top: 80px;
  padding-top: 32px;
  border-top: 1px solid var(--rule);
  text-align: center;
  max-width: 880px;
  margin-left: auto;
  margin-right: auto;
}
.credits-row h4 {
  font-family: var(--font-display);
  font-weight: 400;
  font-style: italic;
  font-size: 18px;
  color: var(--silver);
  margin-bottom: 16px;
  text-align: center;
}
.credits-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  font-size: 13px;
  color: var(--ink-soft);
  letter-spacing: 0.04em;
}
.credits-list strong { color: var(--ink); font-weight: 600; }

/* =========================================================
   SHOWS — WARM, MODERN
   ========================================================= */
.shows-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
}
@media (max-width: 760px) { .shows-grid { grid-template-columns: 1fr; } }

.show-card {
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
.show-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(15,15,18,0.08); }
.show-card__image {
  aspect-ratio: 16/10;
  background: linear-gradient(135deg, var(--gold) 0%, var(--coral) 100%);
  display: flex;
  align-items: flex-end;
  padding: 32px;
}
.show-card__image strong {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(32px, 4vw, 56px);
  color: var(--paper);
  line-height: 0.95;
  letter-spacing: -0.02em;
}
.show-card__body { padding: 32px 32px 36px; }
.show-card__type {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold-deep);
  margin-bottom: 12px;
}
.show-card__title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 28px;
  line-height: 1.15;
  margin-bottom: 12px;
}
.show-card__pitch {
  font-size: 16px;
  color: var(--ink-soft);
  line-height: 1.55;
  margin-bottom: 20px;
}
.show-card__quote {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 14px;
  color: var(--silver);
  border-left: 2px solid var(--gold);
  padding-left: 12px;
  margin-bottom: 24px;
}
.show-card__quote span { color: var(--ink); display: block; font-style: normal; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; margin-top: 6px; }
.show-card__actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* =========================================================
   COACHING / FOREDRAG — WARM, BOOKING-FIRST
   ========================================================= */
.coach-intro {
  display: flex;
  justify-content: center;
  margin-bottom: 56px;
  text-align: center;
}
.coach-intro > .number { display: none; }
.coach-intro p {
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(20px, 1.8vw, 26px);
  line-height: 1.4;
  color: var(--ink);
  max-width: 680px;
  margin: 0 auto;
  font-weight: 300;
  text-align: center;
}

.coach-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
@media (max-width: 720px) { .coach-grid { grid-template-columns: 1fr; } }

.coach-card {
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: 6px;
  padding: 36px 36px 32px;
  display: flex;
  flex-direction: column;
  gap: 0;
  transition: border-color 0.3s var(--ease), transform 0.3s var(--ease);
  position: relative;
}
.coach-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.coach-card__target {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-deep);
  margin-bottom: 16px;
}
.coach-card__target::before {
  content: "";
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--gold);
}
.coach-card__title {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  font-size: 28px;
  line-height: 1.15;
  color: var(--ink);
  margin-bottom: 12px;
}
.coach-card__body {
  font-size: 15px;
  color: var(--ink-soft);
  line-height: 1.55;
  margin-bottom: 20px;
}
.coach-card__specs {
  display: flex;
  gap: 6px 14px;
  flex-wrap: wrap;
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--silver);
  padding: 12px 0;
  border-top: 1px solid var(--rule-soft);
  border-bottom: 1px solid var(--rule-soft);
  margin-bottom: 20px;
}
.coach-card__specs strong { color: var(--ink); font-weight: 600; }
.coach-card__price {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 17px;
  color: var(--ink);
  margin-bottom: 20px;
  font-weight: 400;
}
.coach-card__price small { color: var(--silver); font-size: 0.7em; letter-spacing: 0.08em; text-transform: uppercase; font-style: normal; margin-right: 4px; }
.coach-card__actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: auto; }

.trust-bar {
  margin-top: 64px;
  padding: 28px 0;
  border-top: 1px solid var(--rule);
  text-align: center;
}
.trust-bar__label {
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--silver);
  font-weight: 600;
  margin-bottom: 14px;
  display: block;
  text-align: center;
}
.trust-bar__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  justify-content: center;
  font-family: var(--font-display);
  font-style: italic;
  font-size: 16px;
  color: var(--ink-soft);
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}
.trust-bar__list span { color: var(--ink); }

/* =========================================================
   SIGNATURFOREDRAG — KLASSENS TIME (feature block)
   ========================================================= */
.foredrag-feature {
  max-width: 920px;
  margin: 0 auto 80px;
  background: var(--paper);
  border: 1px solid var(--rule);
  border-top: 4px solid var(--gold);
  border-radius: 8px;
  padding: clamp(32px, 5vw, 64px);
  text-align: center;
  box-shadow: 0 24px 60px -34px rgba(15,15,18,0.4);
}
.foredrag-feature__eyebrow {
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--gold-deep);
  display: block;
  margin-bottom: 18px;
}
.foredrag-feature__title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(36px, 5.5vw, 64px);
  line-height: 1;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin-bottom: 14px;
}
.foredrag-feature__deck {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(19px, 2.2vw, 26px);
  color: var(--ink-soft);
  max-width: 30ch;
  margin: 0 auto 40px;
  line-height: 1.25;
}
.foredrag-feature__body {
  max-width: 640px;
  margin: 0 auto;
  text-align: left;
}
.foredrag-feature__body p {
  font-size: 16px;
  line-height: 1.65;
  color: var(--ink-soft);
  margin-bottom: 1.3em;
}
.foredrag-feature__body p strong { color: var(--ink); font-weight: 600; }
.foredrag-feature__metaphor {
  margin: 32px 0;
  padding: 20px 24px;
  background: var(--paper-warm);
  border-left: 3px solid var(--gold);
  border-radius: 0 6px 6px 0;
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(17px, 1.8vw, 21px);
  line-height: 1.4;
  color: var(--ink);
}
.foredrag-feature__metaphor b { font-style: normal; font-weight: 600; color: var(--gold-deep); }
.foredrag-feature__gets {
  list-style: none;
  margin: 28px 0;
  padding: 0;
}
.foredrag-feature__gets li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 14px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink-soft);
}
.foredrag-feature__gets li::before {
  content: "";
  position: absolute;
  left: 0; top: 7px;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--gold);
}
.foredrag-feature__facts {
  display: grid;
  gap: 16px 32px;
  grid-template-columns: 1fr 1fr;
  margin: 32px 0;
  padding: 24px 0;
  border-top: 1px solid var(--rule-soft);
  border-bottom: 1px solid var(--rule-soft);
}
@media (max-width: 560px) { .foredrag-feature__facts { grid-template-columns: 1fr; } }
.foredrag-feature__facts dt {
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--gold-deep);
  margin-bottom: 4px;
}
.foredrag-feature__facts dd {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink-soft);
}
.foredrag-feature__quote {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(22px, 2.6vw, 32px);
  line-height: 1.3;
  color: var(--ink);
  text-align: center;
  max-width: 22ch;
  margin: 40px auto 32px;
}
.foredrag-feature__connect {
  font-size: 13px;
  color: var(--silver);
  letter-spacing: 0.02em;
  margin: 0 0 28px;
}
.foredrag-feature__connect b { color: var(--ink); font-weight: 600; }
.foredrag-feature__cta { justify-content: center; }

/* =========================================================
   BLÅSTEMPLINGER — jury, uddannelse, tillidshverv
   ========================================================= */
.cred__layout {
  display: flex;
  gap: clamp(28px, 5vw, 64px);
  align-items: center;
  max-width: 960px;
  margin: 0 auto;
}
@media (max-width: 760px) { .cred__layout { flex-direction: column; } }
.cred__photo { flex-shrink: 0; width: clamp(180px, 26vw, 260px); margin: 0; }
.cred__frame {
  aspect-ratio: 1/1;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 18px 40px -20px rgba(15,15,18,0.4);
}
.cred__photo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(18%) contrast(1.03); }
.cred__photo figcaption {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 12px;
  color: var(--silver);
  text-align: center;
  margin-top: 10px;
  letter-spacing: 0.03em;
}
.cred__list { flex: 1; width: 100%; }
.cred__item {
  padding: 15px 0;
  border-top: 1px solid var(--rule);
  display: flex;
  gap: 18px;
  align-items: baseline;
}
.cred__item:last-child { border-bottom: 1px solid var(--rule); }
.cred__role {
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--gold-deep);
  flex-shrink: 0;
  width: 96px;
}
.cred__what { font-size: 15px; line-height: 1.5; color: var(--ink-soft); }
.cred__what b { color: var(--ink); font-weight: 600; }
.cred__what span { display: block; font-size: 13px; color: var(--silver); margin-top: 2px; }

/* =========================================================
   CINEMATISK FULD-BREDDE BAND (parallax)
   ========================================================= */
.cine-band {
  position: relative;
  width: 100%;
  min-height: 78vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-image: url("../images/projects/dv-orange.jpg");
  background-size: cover;
  background-position: center 28%;
  background-attachment: fixed;
  overflow: hidden;
}
.cine-band::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(15,15,18,0.55), rgba(15,15,18,0.25) 42%, rgba(15,15,18,0.72));
}
/* fint korn også her — sammenhæng med resten */
.cine-band__inner { position: relative; z-index: 2; padding: var(--gutter); max-width: 900px; }
.cine-band__line {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(30px, 5.2vw, 66px);
  line-height: 1.04;
  letter-spacing: -0.02em;
  color: var(--paper);
  text-shadow: 0 4px 34px rgba(0,0,0,0.45);
  margin: 0;
}
.cine-band__credit {
  margin: 22px 0 0;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(250,250,247,0.6);
}
@media (max-width: 760px) {
  .cine-band { background-attachment: scroll; min-height: 58vh; }
}

/* =========================================================
   DESIGN POLISH — premium editorial finish
   ========================================================= */
/* Projekt-kort: blødere hjørner, dybde, taktilt løft */
.proj-card { transition: transform 0.32s var(--ease-out); }
.proj-card:hover { transform: translateY(-8px); }
.proj-card__image { border-radius: 10px; box-shadow: 0 1px 3px rgba(15,15,18,0.06); transition: box-shadow 0.4s var(--ease), transform 0.4s var(--ease-out); }
.proj-card:hover .proj-card__image { transform: scale(1.015); }
.proj-card__image--book, .proj-card__image--text { border-radius: 10px; }
.proj-card__image::after {
  content: "";
  position: absolute; inset: 0;
  border-radius: 8px;
  background: linear-gradient(to top, rgba(15,15,18,0.5) 0%, rgba(15,15,18,0.08) 45%, transparent 65%);
  opacity: 0;
  transition: opacity 0.45s var(--ease);
  pointer-events: none;
  z-index: 1;
}
.proj-card:hover .proj-card__image::after { opacity: 1; }
.proj-card:hover .proj-card__image { box-shadow: 0 22px 44px -20px rgba(15,15,18,0.45); }
.proj-card:hover .proj-card__image img { transform: scale(1.07); }
/* badge + tekst skal ligge over hover-gradienten */
.proj-card__badge { z-index: 3; }
.proj-card__image--text strong { position: relative; z-index: 2; }

/* Show- & coach-kort: dybere, blødere hover */
.show-card:hover { box-shadow: 0 26px 54px -26px rgba(15,15,18,0.28); }
.coach-card { transition: transform 0.35s var(--ease), box-shadow 0.35s var(--ease), border-color 0.3s var(--ease); }
.coach-card:hover { box-shadow: 0 22px 46px -28px rgba(15,15,18,0.22); }

/* Sektion-numre: mere editorial vægt */
.section-head .number { font-size: 36px; opacity: 0.92; }

/* Knapper: blødere, mere taktile */
.btn { transition: transform 0.25s var(--ease), background 0.25s var(--ease), color 0.25s var(--ease), box-shadow 0.25s var(--ease), border-color 0.25s var(--ease); }
.btn:hover { transform: translateY(-2px); }
.btn--primary:hover { box-shadow: 0 14px 30px -12px rgba(233,74,61,0.5); }
.btn--warm:hover { box-shadow: 0 14px 30px -12px rgba(15,15,18,0.4); }

/* Skarpere billedrendering */
img { -webkit-backface-visibility: hidden; backface-visibility: hidden; }

/* Finere divider-linjer og rytme */
.sub-head { letter-spacing: 0; }
.proj-card__year { letter-spacing: 0; }

/* =========================================================
   EKSKLUSIV-LAG — bespoke håndværks-detaljer
   ========================================================= */

/* 3D-tilt: kortet får perspektiv, billedet vipper efter musen (sat via JS) */
.project-grid { perspective: 1200px; }
.proj-card__image {
  transform-style: preserve-3d;
  will-change: transform;
}
/* JS styrer transform på hover; deaktivér CSS-scale-hover så de ikke kæmper */
@media (hover: hover) and (pointer: fine) {
  .proj-card.tilt:hover .proj-card__image { transform: none; }
}

/* Glans-stribe der fejer hen over billedet ved hover */
.proj-card__image::before {
  content: "";
  position: absolute; inset: 0;
  z-index: 2;
  background: linear-gradient(115deg, transparent 35%, rgba(255,255,255,0.18) 50%, transparent 65%);
  transform: translateX(-120%);
  transition: transform 0.7s var(--ease-out);
  pointer-events: none;
  mix-blend-mode: soft-light;
}
.proj-card:hover .proj-card__image::before { transform: translateX(120%); }

/* Editorial index-nummer (00·01·02 …) sat ind via JS, vises i type-linjen */
.proj-card__index {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  font-size: 12px;
  color: var(--coral);
  margin-right: 9px;
  opacity: 0.85;
  transition: opacity 0.25s var(--ease);
}
.proj-card:hover .proj-card__index { opacity: 1; }

/* Titel: fin coral-streg der tegnes ind ved hover (i stedet for hård farveskift) */
.proj-card:hover .proj-card__title { color: var(--ink); }
.proj-card__title {
  display: inline;
  background-image: linear-gradient(var(--coral), var(--coral));
  background-size: 0% 1.5px;
  background-position: 0 1.05em;
  background-repeat: no-repeat;
  transition: background-size 0.45s var(--ease-out), color 0.25s var(--ease);
}
.proj-card:hover .proj-card__title { background-size: 100% 1.5px; }

/* (Film-grain findes allerede i CINEMATIC LAYER længere nede — ingen dublet her) */
@media (prefers-reduced-motion: reduce) {
  .proj-card__image::before { display: none; }
}

/* =========================================================
   TESTIMONIALS
   ========================================================= */
.quotes-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 48px;
}
@media (max-width: 900px) { .quotes-grid { grid-template-columns: 1fr; gap: 32px; } }
.quote {
  padding-left: 20px;
  border-left: 2px solid var(--gold);
}
.quote__production {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  display: block;
  margin-bottom: 16px;
}
.quote__text {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(18px, 1.5vw, 22px);
  line-height: 1.4;
  margin: 0 0 20px;
  color: var(--paper);
}
.quote__attr {
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(250, 250, 247, 0.55);
}

/* =========================================================
   KONTAKT
   ========================================================= */
.kontakt__layout {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 32px;
}
.kontakt__layout > .number { display: none; }
.kontakt__title {
  font-family: var(--font-display);
  font-weight: 200;
  font-style: italic;
  font-size: clamp(48px, 8vw, 120px);
  line-height: 0.95;
  letter-spacing: -0.03em;
  text-align: center;
  margin: 0 auto;
}
.kontakt__title span { color: var(--coral); }
.kontakt__info {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  text-align: center;
}
.kontakt__email {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(22px, 2vw, 30px);
  color: var(--ink);
  border-bottom: 1px solid var(--coral);
  padding-bottom: 4px;
  display: inline-block;
}
.kontakt__email:hover { color: var(--coral); }
.kontakt__sub {
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
}

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer { background: var(--ink); color: var(--paper); padding: 72px var(--gutter) 32px; }
.site-footer__inner {
  max-width: var(--content-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 48px;
}
@media (max-width: 800px) { .site-footer__inner { grid-template-columns: 1fr; gap: 32px; } }
.site-footer__brand { font-family: var(--font-display); font-style: italic; font-size: 36px; font-weight: 300; margin-bottom: 12px; color: var(--paper); }
.site-footer__tagline { font-size: 14px; color: rgba(250, 250, 247, 0.55); max-width: 320px; line-height: 1.6; }
.site-footer__col h5 { font-size: 11px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(250, 250, 247, 0.5); margin: 0 0 16px; font-family: var(--font-body); }
.site-footer__col ul { display: flex; flex-direction: column; gap: 8px; }
.site-footer__col a { font-size: 14px; color: rgba(250, 250, 247, 0.85); transition: color 0.2s var(--ease); }
.site-footer__col a:hover { color: var(--gold); }
.site-footer__bottom {
  max-width: var(--content-max);
  margin: 56px auto 0;
  padding-top: 24px;
  border-top: 1px solid rgba(250, 250, 247, 0.10);
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: rgba(250, 250, 247, 0.4);
  flex-wrap: wrap;
  gap: 12px;
  letter-spacing: 0.06em;
}

/* =========================================================
   MOTION — cinematisk: langsommere, blødere, trinvis
   ========================================================= */
.fade-up { transition: opacity 1.1s var(--ease-out), transform 1.1s var(--ease-out); }
.js .fade-up { opacity: 0; transform: translateY(34px); }
.js .fade-up.is-visible { opacity: 1; transform: translateY(0); }

/* Retnings-bestemt reveal — tekst glider ind fra siderne (inspireret af next:stage) */
.reveal { transition: opacity 1.2s var(--ease-out), transform 1.3s var(--ease-out); will-change: transform, opacity; }
.js .reveal { opacity: 0; }
.js .reveal--left  { transform: translateX(-26px); }
.js .reveal--right { transform: translateX(26px); }
.js .reveal--up    { transform: translateY(30px); }
.js .reveal--zoom  { transform: scale(0.97); }
.js .reveal.is-visible { opacity: 1; transform: translate(0, 0) scale(1); }

/* Stagger: cards i grids ankommer forskudt, som klip i en sekvens */
.js .project-grid.fade-up .proj-card,
.js .shows-grid.fade-up .show-card,
.js .coach-grid.fade-up .coach-card,
.js .quotes-grid .quote {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 0.9s var(--ease-out), transform 0.9s var(--ease-out);
}
.js .project-grid.fade-up.is-visible .proj-card,
.js .shows-grid.fade-up.is-visible .show-card,
.js .coach-grid.fade-up.is-visible .coach-card,
.js .quotes-grid .quote.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.js .project-grid.fade-up.is-visible .proj-card:nth-child(2),
.js .shows-grid.fade-up.is-visible .show-card:nth-child(2),
.js .coach-grid.fade-up.is-visible .coach-card:nth-child(2) { transition-delay: 0.12s; }
.js .project-grid.fade-up.is-visible .proj-card:nth-child(3),
.js .shows-grid.fade-up.is-visible .show-card:nth-child(3),
.js .coach-grid.fade-up.is-visible .coach-card:nth-child(3) { transition-delay: 0.24s; }
.js .project-grid.fade-up.is-visible .proj-card:nth-child(4),
.js .shows-grid.fade-up.is-visible .show-card:nth-child(4) { transition-delay: 0.36s; }
.js .project-grid.fade-up.is-visible .proj-card:nth-child(5) { transition-delay: 0.44s; }
.js .project-grid.fade-up.is-visible .proj-card:nth-child(6) { transition-delay: 0.52s; }
.js .project-grid.fade-up.is-visible .proj-card:nth-child(n+7) { transition-delay: 0.6s; }

/* =========================================================
   GRUPPE-UNFOLD — Teater/Film/TV folder sig elegant ud
   ========================================================= */
/* Kortene starter foldet bagud (panel) og folder ned på plads i 3D */
.js .project-grid.fade-up .proj-card {
  transform: translateY(44px) rotateX(-20deg) scale(0.98);
  transform-origin: 50% 0;
  transition: opacity 1s var(--ease-out), transform 1s var(--ease-out);
}
.js .project-grid.fade-up.is-visible .proj-card {
  transform: translateY(0) rotateX(0deg) scale(1);
}
/* hover-løftet skal stadig vinde efter unfold (højere specificitet) */
.js .project-grid.fade-up.is-visible .proj-card:hover {
  transform: translateY(-8px);
}

/* Sub-head: num, titel og count byder velkommen i takt — titlen wiper op */
.js .sub-head.fade-up { opacity: 1; transform: none; position: relative; }
.js .sub-head.fade-up .sub-head__num,
.js .sub-head.fade-up .sub-head__count {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out);
}
.js .sub-head.fade-up .sub-head__title {
  opacity: 0;
  clip-path: inset(0 0 108% 0);
  transform: translateY(10px);
  transition: clip-path 0.95s var(--ease-out), opacity 0.7s var(--ease-out), transform 0.95s var(--ease-out);
}
.js .sub-head.fade-up.is-visible .sub-head__num { opacity: 1; transform: none; }
.js .sub-head.fade-up.is-visible .sub-head__title {
  opacity: 1;
  clip-path: inset(0 0 -12% 0);
  transform: none;
  transition-delay: 0.1s;
}
.js .sub-head.fade-up.is-visible .sub-head__count { opacity: 1; transform: none; transition-delay: 0.26s; }
/* fin coral-accentstreg der tegnes ind under titlen ved reveal */
.js .sub-head.fade-up .sub-head__inner::after {
  content: "";
  position: absolute;
  left: 50%; bottom: -14px;
  width: 0; height: 2px;
  background: var(--coral);
  transform: translateX(-50%);
  transition: width 0.8s var(--ease-out) 0.3s;
}
.js .sub-head.fade-up.is-visible .sub-head__inner::after { width: 38px; }

/* Hero: titel, tagline, chips og CTA'er ankommer i takt — én gang ved load */
.hero__eyebrow, .hero__title, .hero__tagline, .hero__roles, .hero__cta-row {
  animation: hero-rise 1.2s var(--ease-out) both;
}
.hero__title   { animation-delay: 0.1s; }
.hero__tagline { animation-delay: 0.25s; }
.hero__roles   { animation-delay: 0.4s; }
.hero__cta-row { animation-delay: 0.5s; }
.hero__image   { animation: hero-rise 1.4s var(--ease-out) 0.35s both; }
@keyframes hero-rise {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* =========================================================
   CINEMATIC LAYER — film grain + grade + dybde
   ========================================================= */
/* Fint animeret korn over hele billedet — det der gør digital til film */
body::after {
  content: "";
  position: fixed;
  inset: -100%;
  pointer-events: none;
  z-index: 2000;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity: 0.05;
  mix-blend-mode: multiply;
  animation: grain-shift 0.9s steps(4) infinite;
}
@keyframes grain-shift {
  0%   { transform: translate(0, 0); }
  25%  { transform: translate(-2%, 1.5%); }
  50%  { transform: translate(1.5%, -2%); }
  75%  { transform: translate(-1%, -1%); }
  100% { transform: translate(0, 0); }
}

/* Instruktør-fotos: ensartet grade så blandede pressefotos ligner én film */
.show-card__image img {
  filter: contrast(1.06) saturate(0.96) sepia(0.04);
  transition: transform 1.2s var(--ease-out), filter 0.6s var(--ease);
}
.show-card:hover .show-card__image img { transform: scale(1.03); filter: contrast(1.07) saturate(1.04); }

/* Knapper løfter sig — taktilt, ikke fladt */
.btn--primary:hover, .btn--warm:hover, .ad-strip__cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px -8px rgba(15, 15, 18, 0.35);
}
.btn, .ad-strip__cta { transition: all 0.25s var(--ease); }

/* Markering i brandfarve */
::selection { background: var(--coral); color: var(--paper); }
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto; }
  .js .fade-up, .js .reveal { opacity: 1 !important; transform: none !important; }
  /* unfold-laget neutraliseres: kort flade, titler synlige, accent fuld bredde */
  .js .project-grid.fade-up .proj-card { opacity: 1 !important; transform: none !important; }
  .js .sub-head.fade-up .sub-head__num,
  .js .sub-head.fade-up .sub-head__count { opacity: 1 !important; transform: none !important; }
  .js .sub-head.fade-up .sub-head__title { opacity: 1 !important; transform: none !important; clip-path: none !important; }
  .js .sub-head.fade-up .sub-head__inner::after { width: 38px !important; }
}

/* =========================================================
   FOREDRAG — cinematisk feature-billede (BCG-workshop)
   ========================================================= */
.coach-feature {
  position: relative;
  margin: 8px 0 48px;
  border-radius: 12px;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: var(--ink);
  box-shadow:
    0 36px 80px -34px rgba(15, 15, 18, 0.5),
    0 10px 24px -12px rgba(15, 15, 18, 0.25);
}
.coach-feature img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: 50% 44%;
  filter: contrast(1.06) saturate(1.05) brightness(0.98);
  transform: scale(1.04);
  transition: transform 1.2s var(--ease-out);
}
.coach-feature:hover img { transform: scale(1.08); }
/* varm scrim + vignette så caption bæres og dybden matcher resten */
.coach-feature::after {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  background:
    radial-gradient(120% 100% at 50% 40%, transparent 55%, rgba(15,15,18,0.32) 100%),
    linear-gradient(to top, rgba(15,15,18,0.6) 0%, transparent 38%);
}
.coach-feature figcaption {
  position: absolute;
  left: 24px; bottom: 18px;
  z-index: 1;
  color: var(--paper);
  font-family: var(--font-display);
  font-style: italic;
  font-size: 15px;
  letter-spacing: 0.02em;
  text-shadow: 0 1px 10px rgba(0,0,0,0.5);
}
@media (max-width: 640px) {
  .coach-feature { aspect-ratio: 4 / 3; }
  .coach-feature figcaption { font-size: 13px; left: 16px; bottom: 14px; }
}

/* =========================================================
   CINEMATISK PROJEKT-KORT — tekst over billede (filmplakat)
   Konsolideret override. Sidst i filen = vinder cascaden.
   ========================================================= */
.project-grid {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 26px 22px !important;
  perspective: none !important;
}
@media (max-width: 980px) { .project-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 560px) { .project-grid { grid-template-columns: 1fr !important; } }

.proj-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  aspect-ratio: 3 / 4 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  padding: 22px 20px 20px !important;
  background: var(--ink);
  box-shadow: 0 2px 8px rgba(15,15,18,0.10);
  transition: transform 0.5s var(--ease-out), box-shadow 0.5s var(--ease) !important;
  isolation: isolate;
}
.proj-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 28px 50px -22px rgba(15,15,18,0.55) !important;
}

/* Billedet fylder hele kortet */
.proj-card__image {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  aspect-ratio: auto !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}
.proj-card__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  filter: grayscale(20%) contrast(1.04) brightness(0.96) !important;
  transition: transform 1.1s var(--ease-out), filter 0.6s var(--ease) !important;
}
.proj-card:hover .proj-card__image img {
  transform: scale(1.07) !important;
  filter: grayscale(0%) contrast(1.06) brightness(1.0) !important;
}
/* Bogcovers: vis hele coveret */
.proj-card__image--book { background: #15151a; }
.proj-card__image--book img { object-fit: contain !important; padding: 16px 16px 64px !important; filter: none !important; }
/* Gradient-kort uden foto: behold gradienten, skjul den store dublerede titel */
.proj-card__image--text { background: linear-gradient(150deg, var(--ink) 0%, var(--plum) 60%, var(--accent-deep) 130%) !important; }
.proj-card__image--text strong { display: none !important; }

/* Cinematisk scrim så teksten er læsbar */
.proj-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to top,
    rgba(12,12,15,0.92) 0%,
    rgba(12,12,15,0.62) 26%,
    rgba(12,12,15,0.12) 52%,
    rgba(12,12,15,0.0) 72%);
  transition: opacity 0.5s var(--ease);
  pointer-events: none;
}
.proj-card:hover::after { background: linear-gradient(to top,
    rgba(12,12,15,0.94) 0%,
    rgba(12,12,15,0.66) 30%,
    rgba(12,12,15,0.16) 58%,
    rgba(12,12,15,0.0) 78%); }

/* Tekst oven på billedet */
.proj-card__type {
  position: relative; z-index: 2;
  color: var(--gold) !important;
  font-size: 10px !important;
  letter-spacing: 0.2em !important;
  margin-bottom: 8px !important;
  text-shadow: 0 1px 6px rgba(0,0,0,0.4);
}
.proj-card__title {
  position: relative; z-index: 2;
  color: var(--paper) !important;
  font-size: 21px !important;
  line-height: 1.12 !important;
  margin-bottom: 8px !important;
  background-image: none !important;
  text-shadow: 0 1px 12px rgba(0,0,0,0.45);
}
.proj-card:hover .proj-card__title { color: #fff !important; }
.proj-card__meta {
  position: relative; z-index: 2;
  color: rgba(244,241,236,0.78) !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  text-shadow: 0 1px 8px rgba(0,0,0,0.5);
}
.proj-card__year {
  color: var(--accent-soft) !important;
  font-style: italic;
  margin-right: 8px;
}

/* Tynd accent-streg der vokser ved hover */
.proj-card__type::before {
  content: "";
  display: block;
  width: 22px; height: 2px;
  background: var(--coral);
  margin-bottom: 12px;
  transform-origin: left;
  transform: scaleX(0.6);
  opacity: 0.7;
  transition: transform 0.5s var(--ease-out), opacity 0.5s var(--ease);
}
.proj-card:hover .proj-card__type::before { transform: scaleX(1.8); opacity: 1; }

/* "Egen"-badge over scrim */
.proj-card__badge {
  z-index: 3 !important;
  top: 14px !important; left: 14px !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

/* Slå gamle shine/tilt-effekter fra (de antog billede-i-flow) */
.proj-card__image::before, .proj-card__image::after { display: none !important; }
.proj-card__index { z-index: 3; }

/* =========================================================
   KONTAKT — cinematisk afslutnings-frame (mørk, fuld-bleed)
   ========================================================= */
#kontakt.kontakt--cine {
  min-height: 88vh;
  min-height: 88svh;
  display: flex;
  align-items: center;
  padding-top: 80px;
  padding-bottom: 80px;
}
/* Stærkt, mørkt DOBBELT V-billede som baggrund */
#kontakt.kontakt--cine::before {
  background-image: url('../images/projects/dv-hero.jpg') !important;
  background-position: center 42% !important;
  opacity: 0.6 !important;
  filter: saturate(1.1) brightness(0.62) !important;
}
#kontakt.kontakt--cine::after {
  background:
    radial-gradient(ellipse 90% 85% at 50% 45%, rgba(12,12,15,0.50) 0%, rgba(12,12,15,0.86) 100%) !important;
}
.kontakt--cine .kontakt__layout {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 26px;
  max-width: 760px;
  margin: 0 auto;
}
.kontakt--cine .section-label {
  color: var(--accent-soft) !important;
  letter-spacing: 0.28em;
}
.kontakt--cine .kontakt__title {
  color: var(--paper) !important;
  font-family: var(--font-display);
  font-weight: 200;
  font-style: normal;
  font-size: clamp(44px, 7.5vw, 104px);
  line-height: 0.98;
  letter-spacing: -0.03em;
  margin: 0;
  text-shadow: 0 2px 30px rgba(0,0,0,0.4);
}
.kontakt--cine .kontakt__title span {
  font-style: italic;
  color: var(--accent-soft);
}
.kontakt--cine .kontakt__lead {
  color: rgba(244,241,236,0.82);
  font-size: clamp(16px, 1.4vw, 19px);
  line-height: 1.6;
  max-width: 520px;
  margin: 0 auto;
}
.kontakt--cine .kontakt__btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 18px 38px;
  border-radius: 999px;
  background: var(--coral);
  color: #fff;
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(19px, 1.8vw, 25px);
  letter-spacing: -0.01em;
  box-shadow: 0 18px 40px -16px rgba(233,74,61,0.7);
  transition: transform 0.3s var(--ease-out), background 0.3s var(--ease), box-shadow 0.3s var(--ease);
}
.kontakt--cine .kontakt__btn:hover {
  transform: translateY(-3px);
  background: #fff;
  color: var(--ink);
  box-shadow: 0 22px 46px -16px rgba(0,0,0,0.5);
}
.kontakt--cine .kontakt__socials {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 8px;
  font-size: 13px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.kontakt--cine .kontakt__socials a { color: rgba(244,241,236,0.7); transition: color 0.2s var(--ease); }
.kontakt--cine .kontakt__socials a:hover { color: var(--accent-soft); }
.kontakt--cine .kontakt__socials span { color: rgba(244,241,236,0.3); }

/* =========================================================
   FIX — ingen vandret overflow (reveal-animationer glider ind
   fra siden og må ikke skabe sidelæns scroll)
   ========================================================= */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}


/* =========================================================
   PRE-LAUNCH POLISH — juli 2026
   ========================================================= */

/* Tastatur-fokus (topsite-baseline) */
:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; border-radius: 4px; }
.btn:focus-visible, .site-nav a:focus-visible, .ad-strip__cta:focus-visible { outline-offset: 2px; border-radius: 999px; }
.zone-dark :focus-visible, .site-footer :focus-visible, .kontakt--cine :focus-visible { outline-color: var(--gold); }

/* Skip-link */
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 300; background: var(--ink); color: var(--paper); padding: 12px 20px; border-radius: 0 0 6px 0; font-size: 14px; }
.skip-link:focus { left: 0; }

/* Custom scrollbar (WebKit) */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--paper); }
::-webkit-scrollbar-thumb { background: var(--silver-soft); border-radius: 8px; border: 2px solid var(--paper); }
::-webkit-scrollbar-thumb:hover { background: var(--silver); }

/* Pil-animation ved hover */
.btn:hover::after { transform: translateX(4px); }
.ad-strip__cta::after { display: inline-block; transition: transform 0.25s var(--ease); }
.ad-strip__cta:hover::after { transform: translateX(4px); }

/* Subtil 1px inderkant på projekt-billeder (definerer kanten) */
.proj-card__image { outline: 1px solid rgba(255,255,255,0.08); outline-offset: -1px; }

/* Lazy-billeder fader ind i stedet for at poppe */
img.lazy-fade { opacity: 0; transition: opacity 0.6s var(--ease-out); }
img.lazy-fade.is-loaded { opacity: 1; }

/* Konsistente hover-states */
.site-brand { transition: color 0.2s var(--ease); }
.site-brand:hover { color: var(--coral); }
.hero__scroll { transition: color 0.25s var(--ease); }
.hero__scroll:hover { color: var(--paper); }

/* Typografi-finish */
.section-title, .hero__title, .kontakt__title, .ad-card__headline, .show-card__title, .coach-card__title { text-wrap: balance; }
.hero__tagline, .coach-intro p { text-wrap: pretty; }
body { font-optical-sizing: auto; }
h1, h2, h3 { font-optical-sizing: auto; font-feature-settings: "kern" 1; }

/* Ingen tekstmarkering i knapper, ingen falsk klik-affordance */
.btn, .filter-btn, .ad-strip__cta, .hero__role, .proj-card__badge, .nav-toggle { -webkit-user-select: none; user-select: none; }
.proj-card:not([href]) { cursor: default; }

/* Mobilmenu: lås baggrunds-scroll */
body.nav-lock { overflow: hidden; }

/* Touch targets ≥44px + iPad parallax-fix (kun touch/smal skærm) */
@media (max-width: 1024px), (hover: none) {
  .cine-band { background-attachment: scroll; }
}
@media (hover: none), (max-width: 760px) {
  .site-nav a { padding: 12px 16px; }
  .site-footer__col a { display: inline-block; padding: 6px 0; }
  .ad-strip__cta { padding: 13px 22px; }
}

/* Hero forenklet: tagline+CTA pinnet i bunden — altid fri af ansigtet */
.hero--full .hero__bottom {
  position: absolute; left: 0; right: 0;
  bottom: clamp(56px, 10vh, 110px);
  z-index: 2;
  display: flex; flex-direction: column; align-items: center;
  gap: 18px;
  padding: 0 var(--gutter);
  text-align: center;
}
.hero--full .hero__bottom .hero__tagline { margin: 0; max-width: 640px; }
.hero--full .hero__bottom .hero__cta-row { margin: 0; flex-wrap: wrap; justify-content: center; }
@media (max-width: 760px) {
  .hero--full .hero__bottom { bottom: clamp(40px, 7vh, 72px); gap: 14px; }
  .hero--full .hero__bottom .hero__tagline { font-size: 15px; }
}

/* =========================================================
   CINEMATISKE SLIDES — retningsbestemt indglid ved scroll
   ========================================================= */
/* Kraftigere sideglid på standalone reveals */
.js .reveal--left  { transform: translateX(-48px); }
.js .reveal--right { transform: translateX(48px); }

/* Projekt-cards: glider ind fra deres egen side af gitteret (+ eksisterende fold) */
.js .project-grid.fade-up .proj-card:nth-child(odd)  { transform: translateX(-56px) translateY(36px) rotateX(-14deg) scale(0.98); }
.js .project-grid.fade-up .proj-card:nth-child(even) { transform: translateX(56px) translateY(36px) rotateX(-14deg) scale(0.98); }
.js .project-grid.fade-up.is-visible .proj-card:nth-child(odd),
.js .project-grid.fade-up.is-visible .proj-card:nth-child(even) { transform: none; }

/* Show-cards (instruktør): skiftevis venstre/højre */
.js .shows-grid.fade-up .show-card:nth-child(odd)  { transform: translateX(-56px) translateY(20px); }
.js .shows-grid.fade-up .show-card:nth-child(even) { transform: translateX(56px) translateY(20px); }
.js .shows-grid.fade-up.is-visible .show-card:nth-child(odd),
.js .shows-grid.fade-up.is-visible .show-card:nth-child(even) { transform: none; }

/* Coach-cards: mod hinanden som et klip */
.js .coach-grid.fade-up .coach-card:nth-child(odd)  { transform: translateX(-44px) translateY(16px); }
.js .coach-grid.fade-up .coach-card:nth-child(even) { transform: translateX(44px) translateY(16px); }
.js .coach-grid.fade-up.is-visible .coach-card:nth-child(odd),
.js .coach-grid.fade-up.is-visible .coach-card:nth-child(even) { transform: none; }

/* Citater: skiftevis fra hver side */
.js .quotes-grid .quote:nth-child(odd)  { transform: translateX(-44px); }
.js .quotes-grid .quote:nth-child(even) { transform: translateX(44px); }
.js .quotes-grid .quote.is-visible:nth-child(odd),
.js .quotes-grid .quote.is-visible:nth-child(even) { transform: none; }

/* Billet-CTA'er på kommende forestillinger */
.proj-card__cta-row { position: relative; z-index: 3; display: flex; gap: 8px; margin-top: 12px; }
.proj-card__cta {
  display: inline-block; font-size: 11px; font-weight: 600;
  letter-spacing: 0.09em; text-transform: uppercase;
  color: var(--gold); border: 1px solid rgba(232,181,71,0.55);
  padding: 8px 16px; border-radius: 999px; cursor: pointer;
  transition: background 0.25s var(--ease), color 0.25s var(--ease);
}
.proj-card__cta:hover { background: var(--gold); color: var(--ink); }

/* Klikbare anmeldelses-kilder */
.quote__attr a { color: inherit; text-decoration: underline; text-decoration-color: rgba(15,15,18,0.25); text-underline-offset: 3px; transition: color 0.2s var(--ease), text-decoration-color 0.2s var(--ease); }
.quote__attr a:hover { color: var(--coral); text-decoration-color: var(--coral); }

/* Footer: sociale ikoner i sitets stregstil */
.footer-social { display: flex; gap: 16px; margin: 18px 0 12px; }
.footer-social a { color: rgba(250,250,247,0.75); transition: color 0.2s var(--ease), transform 0.2s var(--ease); }
.footer-social a:hover { color: var(--gold); transform: translateY(-2px); }
.footer-social svg { width: 21px; height: 21px; display: block; }
.footer-dbs { margin: 0; font-size: 12px; }
.footer-dbs a { color: rgba(250,250,247,0.5); }
.footer-dbs a:hover { color: var(--gold); }

/* =========================================================
   MUSIK & LINKS — hub'en direkte på forsiden
   ========================================================= */
.musik-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 64px); align-items: start; margin-top: 48px; }
.musik-spotify iframe { border-radius: 14px; display: block; box-shadow: 0 18px 44px -18px rgba(15,15,18,0.35); }
.musik-links { display: flex; flex-direction: column; gap: 10px; }
.musik-link {
  display: grid; grid-template-columns: 24px 1fr auto 20px; align-items: center; gap: 16px;
  padding: 14px 18px; border: 1px solid var(--rule); border-radius: 12px;
  color: var(--ink); background: rgba(255,255,255,0.5);
  transition: border-color 0.25s var(--ease), transform 0.25s var(--ease), box-shadow 0.25s var(--ease);
}
.musik-link:hover { border-color: var(--gold-deep); transform: translateX(6px); box-shadow: 0 10px 26px -14px rgba(15,15,18,0.25); }
.musik-link__icon svg { width: 22px; height: 22px; display: block; color: var(--ink-soft); transition: color 0.25s var(--ease); }
.musik-link:hover .musik-link__icon svg { color: var(--gold-deep); }
.musik-link__name { font-weight: 600; font-size: 15px; }
.musik-link__meta { font-size: 13px; color: var(--muted); }
.musik-link__arrow { color: var(--muted); transition: transform 0.25s var(--ease), color 0.25s var(--ease); }
.musik-link:hover .musik-link__arrow { transform: translateX(4px); color: var(--gold-deep); }
@media (max-width: 900px) { .musik-grid { grid-template-columns: 1fr; } }

/* Subtile foto-strimler på Rødkilde-forestillingerne */
.show-card__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 18px 18px 0; }
.show-card__thumbs img {
  width: 100%; aspect-ratio: 1/1; object-fit: cover;
  border-radius: 8px; display: block;
  transition: transform 0.3s var(--ease-out);
}
.show-card__thumbs img:hover { transform: scale(1.04); }
@media (max-width: 560px) { .show-card__thumbs { gap: 6px; padding: 12px 12px 0; } }

/* =========================================================
   INSTRUKTØR-OVERBLIK + FOREDRAG-BILLEDER
   ========================================================= */
/* Gruppe-labels der skaber hierarki */
.shows-group-label {
  font-size: 11px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold-deep); margin: 40px 0 18px; padding-bottom: 10px;
  border-bottom: 1px solid var(--rule);
}
.shows-group-label:first-of-type { margin-top: 8px; }

/* C:ntact-rækken: 3 kompakte kort */
.shows-grid--3 { grid-template-columns: repeat(3, 1fr); gap: 24px; }
.shows-grid--3 .show-card__image { aspect-ratio: 16/11; padding: 20px; }
.shows-grid--3 .show-card__body { padding: 20px 22px 24px; }
.shows-grid--3 .show-card__title { font-size: clamp(20px, 1.8vw, 26px); }
.shows-grid--3 .show-card__pitch { font-size: 14px; line-height: 1.5; }
.shows-grid--3 .show-card__quote { font-size: 13px; }
@media (max-width: 980px) { .shows-grid--3 { grid-template-columns: 1fr; } }

/* Foredrag: subtile billed-headers */
.coach-card__img { margin: -1px -1px 18px; border-radius: 12px 12px 0 0; overflow: hidden; }
.coach-card__img img { width: 100%; aspect-ratio: 16/7; object-fit: cover; display: block; transition: transform 0.4s var(--ease-out); }
.coach-card:hover .coach-card__img img { transform: scale(1.03); }

/* =========================================================
   BALANCE + MOTION — ingen forældreløse kort, alt lever
   ========================================================= */
/* Kolonne-bevidst balance: sidste kort udfylder resten af rækken — på ALLE skærmbredder.
   Desktop = 3 kolonner, tablet = 2, mobil = 1 (matcher grid-definitionerne med !important). */
@media (min-width: 981px) {
  /* rest 1 af 3: sidste kort fylder hele rækken */
  .project-grid .proj-card:last-child:nth-child(3n+1):not(:first-child) { grid-column: 1 / -1; aspect-ratio: 21/8 !important; }
  /* rest 2 af 3: sidste kort fylder de to sidste kolonner */
  .project-grid .proj-card:last-child:nth-child(3n+2) { grid-column: span 2; aspect-ratio: 1.55/1 !important; }
}
@media (min-width: 561px) and (max-width: 980px) {
  .project-grid .proj-card:last-child:nth-child(odd):not(:first-child) { grid-column: 1 / -1; aspect-ratio: 21/9 !important; }
}

/* Hero: langsom Ken Burns — billedet ånder */
@keyframes kenburns { from { transform: scale(1.03); } to { transform: scale(1.10) translateY(-1.2%); } }
.hero--full .hero__image img { animation: kenburns 28s ease-in-out infinite alternate; will-change: transform; }

/* Kundeliste som rullende marquee */
.marquee { overflow: hidden; flex: 1; min-width: 0; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee__track { display: flex; gap: 56px; width: max-content; animation: marquee 30s linear infinite; }
.marquee__track .trust-bar__list { white-space: nowrap; margin: 0; }
.marquee:hover .marquee__track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(calc(-50% - 28px)); } }

/* Primær CTA: blød puls */
@keyframes cta-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(233,74,61,0.30); } 55% { box-shadow: 0 0 0 12px rgba(233,74,61,0); } }
.hero__cta-row .btn--primary { animation: cta-pulse 3.4s ease-out infinite; }

/* Gradient-kort driver langsomt */
.proj-card__image--text { background-size: 170% 170% !important; animation: grad-drift 18s ease-in-out infinite alternate; }
@keyframes grad-drift { from { background-position: 0% 0%; } to { background-position: 100% 100%; } }

/* =========================================================
   HERO DESKTOP: elementer i hjørnerne — ansigtet står frit
   ========================================================= */
@media (min-width: 761px) {
  /* Tagline + knapper: venstre hjørne, venstrestillet */
  .hero--full .hero__bottom {
    left: var(--gutter); right: auto;
    align-items: flex-start; text-align: left;
    padding: 0; max-width: 460px;
    bottom: clamp(64px, 11vh, 120px);
  }
  .hero--full .hero__bottom .hero__cta-row { justify-content: flex-start; }
  /* Foto-kredit: højre hjørne */
  .hero--full .hero__caption { left: auto; right: var(--gutter); bottom: 22px; }
  /* Scroll-indikator: helt i højre side, med luft fra alt andet */
  .hero--full .hero__scroll { left: auto; right: calc(var(--gutter) + 6px); bottom: clamp(88px, 14vh, 150px); transform: none; }
}

/* Minimal hero: tagline lige under navnet */
.hero__tagline--top { margin: 14px 0 8px; font-size: clamp(14px, 1.2vw, 17px); }
.hero--full .hero__tagline--top { color: rgba(250,250,247,0.85); }

/* Guld-highlighter på anmelder-ros om Wahid */
mark.hl {
  background: linear-gradient(transparent 58%, rgba(232,181,71,0.40) 58%, rgba(232,181,71,0.40) 94%, transparent 94%);
  color: inherit; padding: 0 1px;
}

/* Klikbare projekt-kort → undersider */
.proj-card__link { color: inherit; }
.proj-card:has(.proj-card__link) { cursor: pointer; }
.proj-card__cta-row { position: relative; z-index: 4; }

/* =========================================================
   CINE-BAND + WORKSHOP-KORT — design-løft
   ========================================================= */
.cine-band__l { display: block; }
.cine-band__line em { font-style: italic; color: var(--gold); }
.cine-band__l.reveal { transition-delay: 0.1s; }
.cine-band__l.reveal + .cine-band__l.reveal { transition-delay: 0.32s; }

.ad-card--cine {
  position: relative; overflow: hidden; border-radius: 18px;
  background: var(--ink); color: var(--paper);
  display: block; padding: 0; border: 0;
  box-shadow: 0 30px 70px -30px rgba(15,15,18,0.55);
}
.ad-card--cine .ad-card__bg { position: absolute; inset: 0; }
.ad-card--cine .ad-card__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 65% 35%; opacity: 0.55; transition: transform 6s var(--ease-out), opacity 0.4s; }
.ad-card--cine:hover .ad-card__bg img { transform: scale(1.05); opacity: 0.65; }
.ad-card--cine::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(15,15,18,0.92) 25%, rgba(15,15,18,0.55) 60%, rgba(43,31,51,0.25) 100%); }
.ad-card--cine .ad-card__content { position: relative; z-index: 2; padding: clamp(36px, 5vw, 64px); max-width: 620px; }
.ad-card--cine .ad-card__tag { background: var(--gold); color: var(--ink); }
.ad-card--cine .ad-card__headline { color: var(--paper); font-size: clamp(26px, 3.2vw, 40px); margin: 18px 0 10px; }
.ad-card--cine .ad-card__headline em { color: var(--gold); font-style: italic; }
.ad-card--cine .ad-card__sub { color: rgba(250,250,247,0.78); margin: 0 0 26px; max-width: 480px; }

/* Coach-kort med procestal */
.coach-card__img--step { position: relative; }
.coach-card__step {
  position: absolute; right: 14px; bottom: -18px;
  font-family: var(--font-display); font-style: italic; font-weight: 300;
  font-size: 64px; line-height: 1; color: var(--gold);
  text-shadow: 0 2px 18px rgba(15,15,18,0.35);
}
.coach-card { transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease); }
.coach-card:hover { transform: translateY(-4px); box-shadow: 0 22px 44px -20px rgba(15,15,18,0.25); }

/* =========================================================
   SAMLET LØFT: marquee én linje · Også instrueret · intro
   ========================================================= */
/* Kundeliste: ÉN ubrudt linje, større, kører i ring */
.marquee__track { gap: 48px; animation-duration: 38s; }
.marquee__track .trust-bar__list {
  display: flex; flex-wrap: nowrap; white-space: nowrap;
  gap: 0 48px; margin: 0;
  font-size: clamp(20px, 2.3vw, 32px);
}
.marquee__track .trust-bar__list span { white-space: nowrap; }

/* Også instrueret: tre elegante mini-kort */
.credits-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; text-align: left; margin-top: 18px; }
.credits-list span {
  display: block; border-left: 3px solid var(--gold);
  background: rgba(255,255,255,0.55); border-radius: 0 12px 12px 0;
  padding: 16px 20px; font-size: 14px; line-height: 1.5;
  transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease);
}
.credits-list span:hover { transform: translateY(-3px); box-shadow: 0 14px 30px -16px rgba(15,15,18,0.25); }
.credits-list span b, .credits-list span strong { display: block; font-family: var(--font-display); font-size: 18px; font-weight: 500; margin-bottom: 4px; }
@media (max-width: 760px) { .credits-list { grid-template-columns: 1fr; } }

/* Intro: guld-kursiv nøgleord */
.coach-intro em.g { font-style: italic; color: var(--gold-deep); }

/* Spejlet cine-kort: tekst til højre, billedfokus til venstre (Wahid synlig) */
.ad-card--flip::after { background: linear-gradient(260deg, rgba(15,15,18,0.92) 25%, rgba(15,15,18,0.55) 60%, rgba(43,31,51,0.2) 100%); }
.ad-card--flip .ad-card__content { margin-left: auto; text-align: left; }

/* =========================================================
   SAMARBEJDS-MARQUEE — selvstændig, elegant, ubrudt flow
   ========================================================= */
.sm-marquee {
  overflow: hidden; width: 100%;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}
.sm-track { display: flex; width: max-content; animation: sm-loop 60s linear infinite; }
.sm-marquee:hover .sm-track { animation-play-state: paused; }
.sm-half { display: flex; align-items: baseline; white-space: nowrap; flex: none; }
.sm-half span {
  display: inline-block; white-space: nowrap;
  font-family: var(--font-display); font-style: italic; font-weight: 400;
  font-size: clamp(22px, 2.4vw, 34px); color: var(--ink-soft);
  padding: 0 26px;
}
.sm-half .sm-dot { color: var(--gold); padding: 0; font-style: normal; }
@keyframes sm-loop { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .sm-track { animation: none; } }

/* Musik: single-label + ekstra player */
.musik-single-label { font-size: 11px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold-deep); margin: 18px 0 10px; }
.musik-spotify iframe + .musik-single-label + iframe { border-radius: 14px; }

/* Kontakt: fire prækvalificerende døre */
.kontakt__doors { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin: 0 0 22px; }
.kontakt__door {
  font-size: 13px; font-weight: 600; letter-spacing: 0.06em;
  color: var(--paper); border: 1px solid rgba(250,250,247,0.4);
  padding: 11px 20px; border-radius: 999px;
  transition: background 0.25s var(--ease), color 0.25s var(--ease), border-color 0.25s var(--ease);
}
.kontakt__door:hover { background: var(--gold); color: var(--ink); border-color: var(--gold); }