/* ========== Basalt ========== */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

:root{
  --container-max: 1600px;
  --page-pad: clamp(16px, 3vw, 32px);
  --gap: clamp(16px, 2.5vw, 28px);

  --radius: 16px;
  --border: 1px solid #1a1d56;
  --color: #fff;
  --color-negativ: #1a1d56;
  --muted: #4b5563;
  --bg-card: #000000;
  --bg-page: #fff;

  --h2: clamp(26px, 4vw, 40px);
  --h3: clamp(18px, 2.4vw, 22px);
  --lead: clamp(16px, 2.4vw, 18px);
  --text: 16px;

  --shadow: 0 6px 24px rgba(0,0,0,0.06);
  --shadow-hover: 0 10px 30px rgba(0,0,0,0.09);
}

/* ========== Sektion ========== */
.eds{
  background: var(--bg-page);
  padding: var(--page-pad);
}

.eds__intro{
  max-width: var(--container-max);
  margin: 0 auto;
  text-align: center;
  color: var(--color-negativ)!important;
}

.eds__title{
  font-size: var(--h2);
  line-height: 1.15;
  margin: 0 0 12px 0;
}

.eds__lead{
  font-size: var(--lead);
  line-height: 1.6;
  margin: 0 auto 8px;
  max-width: 920px;
  color: var(--color-negativ);
}

.eds__strong{
  font-size: var(--lead);
  margin: 0 auto;
  max-width: 920px;
  color: var(--color-negativ);
}

/* ========== Grid ========== */
.eds__grid{
  display: grid;
  gap: var(--gap);
  grid-template-columns: 1fr;
  max-width: var(--container-max);
  margin: 40px auto 0;
}

@media (min-width: 900px){
  .eds__grid{
    grid-template-columns: 1fr 1fr; /* to kolonner på større skærme */
    max-width: 980px;
  }
}

/* ========== Card ========== */
.card{
  display: flex;
  flex-direction: column;
  background: var(--bg-card);
  border: var(--border);
  border-radius: var(--radius);
  overflow: hidden;            /* sørger for at billedet klippes i hjørner */
  /* box-shadow: var(--shadow); */
  transition: transform .15s ease, box-shadow .15s ease;
}

.card:hover{
  transform: translateY(-2px);
  box-shadow: var(--shadow-hover);
}

.card__media{
  width: 100%;
  height: clamp(275px, 28vw, 320px);  /* responsiv højde */
  object-fit: cover;                  /* bevarer billedets format, croppes pænt */
  display: block;
  margin: 0!important;
}

.card__body{
  padding: 20px;
  color: var(--color);
}

.card__title{
  margin: 0 0 12px 0;
  font-size: var(--h3);
  line-height: 1.25;
  text-align: center;
  color: var(--color);
}

.card__list{
  margin: 0;
  padding-left: 20px; /* klassisk list-indent */
  font-size: var(--text);
  line-height: 1.6;
  color: var(--color);
}

.card__list li + li{
  margin-top: 6px;
}

/* ========== Tilgængelighed / Reduceret bevægelse ========== */
@media (prefers-reduced-motion: reduce){
  .card{ transition: none; }
}