/* ==========================================================================
   BORSEN LONGREAD TEMPLATE
   ========================================================================== */

/* ==========================================================================
   TOKENS
   ========================================================================== */

:root{
  --borsen-magenta: #ff5073;

  --bg: #ffffffd2;
  --text: #111;
  --muted: rgba(0,0,0,.70);
  --caption: rgba(0,0,0,.58);
  --line: rgba(0,0,0,.12);

  --text-col: 600px;

  --lr-ink: #1f295f;
  --lr-ink-soft: #2b3f8a;
  --lr-sky: #b7c7da;
  --lr-mist: #dfe7f1;
  --lr-moon: #f1f0e4;
  --lr-paper: #f6f4ee;
}

/* ==========================================================================
   FONTS
   ========================================================================== */

@font-face{
  font-family: "TiemposHeadline";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/tiempos/headline/tiempos-headline-medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face{
  font-family: "TiemposFine";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/tiempos/fine/tiempos-fine-light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face{
  font-family: "TiemposText";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/tiempos/text/tiempos-text-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face{
  font-family: "TiemposText";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/tiempos/text/tiempos-text-regular-italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face{
  font-family: "TiemposText";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/tiempos/text/tiempos-text-semibold.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face{
  font-family: "TiemposText";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/tiempos/text/tiempos-text-semibold-italic.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face{
  font-family: "GTAmerica";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/gt-america/gt-america-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face{
  font-family: "GTAmerica";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/gt-america/gt-america-regular-italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face{
  font-family: "GTAmerica";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/gt-america/gt-america-medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face{
  font-family: "GTAmerica";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/gt-america/gt-america-medium-italic.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face{
  font-family: "GTAmericaCondensed";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/gt-america/condensed/gt-america-condensed-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face{
  font-family: "GTAmericaCondensed";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/gt-america/condensed/gt-america-condensed-medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face{
  font-family: "Gazpacho";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/gazpacho/gazpacho-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face{
  font-family: "Gazpacho";
  src: url("https://cdn.borsen.cloud/sites/borsendk/fonts/borsen-fonts/gazpacho/gazpacho-black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* ==========================================================================
   BASE
   ========================================================================== */

*{
  box-sizing: border-box;
}

html,
body{
  height: 100%;
  max-width: 100%;
  overflow-x: clip;
}

@supports not (overflow-x: clip){
  html,
  body{
    overflow-x: hidden;
  }
}

body{
  margin: 0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
}

img,
svg,
video{
  display: block;
  max-width: 100%;
  height: auto;
}

figure{
  margin: 0;
}

/* ==========================================================================
   GLOBAL AMBIENT QUOTE BLOB
   ========================================================================== */

body::before{
  content: "";
  position: fixed;
  left: 50%;
  top: 58%;
  z-index: -1;
  pointer-events: none;

  width: min(78vw, 980px);
  aspect-ratio: 1 / 1;

  transform: translate(-50%, -50%);
  transform-origin: center;

  background:
    radial-gradient(
      circle at 58% 30%,
      rgba(243,241,227,.10) 0%,
      rgba(195,208,228,.08) 24%,
      rgba(78,111,205,.07) 54%,
      rgba(21,41,124,.05) 76%,
      rgba(21,41,124,0) 100%
    );

  border-radius: 42% 58% 46% 54% / 50% 42% 58% 50%;
  filter: blur(42px);
  opacity: .42;

  animation:
    ambient-blob-breathe 12s ease-in-out infinite,
    ambient-blob-drift 24s ease-in-out infinite;
}

@keyframes ambient-blob-breathe{
  0%, 100%{
    border-radius: 42% 58% 46% 54% / 50% 42% 58% 50%;
    transform: translate(-50%, -50%) scale(1);
  }
  25%{
    border-radius: 48% 52% 40% 60% / 44% 56% 44% 56%;
    transform: translate(-50%, -50%) scale(1.03, .985);
  }
  50%{
    border-radius: 56% 44% 52% 48% / 46% 48% 52% 54%;
    transform: translate(-50%, -50%) scale(.985, 1.025);
  }
  75%{
    border-radius: 45% 55% 58% 42% / 58% 43% 57% 42%;
    transform: translate(-50%, -50%) scale(1.02, .99);
  }
}

@keyframes ambient-blob-drift{
  0%, 100%{
    translate: 0 0;
  }
  25%{
    translate: -18px -12px;
  }
  50%{
    translate: 14px 18px;
  }
  75%{
    translate: -10px 8px;
  }
}

@media (max-width: 700px){
  body::before{
    width: min(120vw, 760px);
    top: 55%;
    opacity: .32;
    filter: blur(34px);
  }
}

/* ==========================================================================
   LONGREAD HEADER
   DESKTOP: FULLSCREEN HERO
   MOBILE: PRESERVED MOBILE EXPERIENCE
   ========================================================================== */

.longread-header{
  position: relative;
  background: #000;
  overflow: hidden;
}

.longread-header__picture{
  display: contents;
}

.longread-header__masthead{
  position: absolute;
  top: clamp(18px, 2vw, 32px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 20;
}

.longread-header__logo{
  height: 20px;
  width: auto;
}

.longread-header__stage{
  position: relative;
  min-height: 100vh;
  background: #000;
}

.longread-header__art-track{
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: transparent;
}

.longread-header__art-track::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(
      to bottom,
      rgba(10,14,30,.10) 0%,
      rgba(10,14,30,.16) 24%,
      rgba(10,14,30,.28) 56%,
      rgba(10,14,30,.56) 100%
    );
}

.longread-header__image{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  transform: none;
  will-change: auto;
}

.longread-header__sticky-copy{
  position: relative;
  width: 100%;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

.longread-header__copy{
  width: min(88vw, 48rem);
  margin: 0 auto;
  padding:
    clamp(96px,12vh,140px)
    clamp(28px,4vw,44px)
    clamp(88px,12vh,120px);
  text-align: center;
  transform: none;
  transition: none;
}

.longread-header__kicker{
  margin: 0 0 18px;
  font-family: "GTAmerica", system-ui, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.82);
}

.longread-header__headline{
  margin: 0 0 16px;
  font-family: "TiemposFine", "TiemposHeadline", Georgia, serif;
  font-weight: 300;
  font-size: clamp(42px, 5.4vw, 78px);
  line-height: 1.05;
  letter-spacing: -0.01em;
  color: #f5f7fb;
  text-wrap: balance;
}

.longread-header__dek{
  margin: 0;
  max-width: 30rem;
  margin-inline: auto;
  font-family: "TiemposText", Georgia, serif;
  font-size: clamp(17px, 1.4vw, 21px);
  line-height: 1.45;
  color: rgba(255,255,255,.88);
  text-wrap: pretty;
}

.longread-header__caption{
  position: absolute;
  right: 16px;
  bottom: 12px;
  z-index: 15;
  max-width: min(460px, 80vw);
  font-family: "GTAmerica", system-ui, sans-serif;
  font-size: 12px;
  line-height: 1.35;
  color: rgba(255,255,255,.78);
  text-align: right;
  text-shadow: 0 1px 1px rgba(0,0,0,.18);
}

@media (max-width: 820px){

  .longread-header{
    background: #000;
  }

  .longread-header__masthead{
    left: 50%;
    transform: translateX(-50%);
    width: auto;
  }

  .longread-header__stage{
    min-height: 100svh;
    background: transparent;
  }

  .longread-header__art-track{
    position: absolute;
    inset: 0;
    background: transparent;
  }

  .longread-header__art-track::after{
    display: none;
  }

  .longread-header__art-track::before{
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
      linear-gradient(
        to bottom,
        rgba(10,14,30,.10) 0%,
        rgba(10,14,30,.22) 28%,
        rgba(10,14,30,.42) 58%,
        rgba(10,14,30,.72) 100%
      );
  }

  .longread-header__image{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 60% center;
    transform: none;
  }

  .longread-header__sticky-copy{
    position: relative;
    width: 100%;
    min-height: 100svh;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
  }

  .longread-header__copy{
    width: min(88vw, 22rem);
    margin: 0 auto;
    padding: 7.5rem 1rem 5.5rem;
    text-align: left;
  }

  .longread-header__kicker{
    margin: 0 0 0.9rem 0;
    color: rgba(255,255,255,.82);
    font-size: 0.85rem;
    letter-spacing: 0.14em;
  }

  .longread-header__headline{
    margin: 0 0 1rem 0;
    color: #f5f7fb;
    font-family: "TiemposFine", "TiemposHeadline", Georgia, serif;
    font-weight: 300;
    font-size: clamp(2.35rem, 8.4vw, 3.2rem);
    line-height: 1.06;
    letter-spacing: -0.01em;
    text-wrap: balance;
    overflow-wrap: break-word;
    max-width: 9ch;
  }

  .longread-header__dek{
    max-width: 19rem;
    margin: 0;
    color: rgba(255,255,255,.88);
    font-size: 1rem;
    line-height: 1.35;
    text-wrap: pretty;
  }

  .longread-header__caption{
    right: 12px;
    bottom: 10px;
    max-width: 72vw;
    font-size: 11px;
    color: rgba(255,255,255,.74);
  }
}

@media (max-width: 460px){

  .longread-header__copy{
    width: min(90vw, 20rem);
    padding: 7rem 0.9rem 5rem;
  }

  .longread-header__headline{
    font-size: clamp(2.05rem, 9.2vw, 2.7rem);
    line-height: 1.07;
    letter-spacing: -0.008em;
    max-width: 8.5ch;
  }

  .longread-header__dek{
    font-size: 0.95rem;
    line-height: 1.32;
  }
}

/* ==========================================================================
   STORY / PROSE
   ========================================================================== */

.story{
  padding: 56px 0 90px;
}

.prose{
  width: min(var(--text-col), 92vw);
  margin: 0 auto;
}

.prose p{
  margin: 0 0 .65em;
  font-family: "TiemposText", Georgia, "Times New Roman", Times, serif;
  font-size: 19px;
  line-height: 1.5;
  color: var(--text);
}

.prose a{
  color: var(--borsen-magenta);
  text-decoration: none;
}

.prose a:hover,
.prose a:focus{
  text-decoration: none;
}

.prose h2{
  margin: 72px 0 18px;

  font-family: "TiemposFine", "TiemposHeadline", Georgia, serif;
  font-weight: 300;

  font-size: clamp(36px, 4vw, 48px);
  line-height: 1.05;
  letter-spacing: -0.01em;

  color: var(--lr-ink-soft);

  text-wrap: balance;
}

/* mobile adjustments */

@media (max-width:700px){

  .prose h2{
    margin: 52px 0 14px;

    font-size: clamp(28px, 7vw, 34px);
    line-height: 1.08;
  }

}

/* ==========================================================================
   META
   ========================================================================== */

.meta{
  width: 100%;
  margin: 0 auto 28px;
  padding: 0 0 14px;
  position: relative;
}

.meta__byline{
  margin: 0 0 8px;
  font-family: "GT America", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: rgba(0,0,0,.70);
}

.meta__byline .role{
  font-weight: 1000;
}

.meta__byline .name{
  font-weight: 300; /* eller 400 afhængig af jeres fontfiler */
}

.meta__date{
  margin: 0;
  font-family: "GT America", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.4;
  color: rgba(0,0,0,.55);
}

.meta::after{
  content: "";
  display: block;
  height: 1px;
  margin-top: 12px;
  background: rgba(0,0,0,.14);
}

.role { color: rgba(0,0,0,.85); }
.name { color: rgba(0,0,0,.65); }

/* ==========================================================================
   INLINE IMAGE
   ========================================================================== */

.inline-image{
  position: relative;
  left: 50%;

  width: min(1400px, 96vw);

  margin: 64px 0;

  transform: translateX(-50%);
  cursor: zoom-in;
}

.inline-image img{
  width: 100%;
  height: auto;
}

.inline-image figcaption{
  margin-top: 10px;
  font: 12px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--caption);
  text-align: left;
}

@media (max-width: 700px){
  .inline-image{
    position: static;
    left: auto;
    width: 100%;
    margin: 32px 0;
    transform: none;
  }
}

/* ==========================================================================
   STICKY REVEAL
   ========================================================================== */

.sticky-reveal{
  width: min(1100px, 96vw);
  margin: 72px auto;
}

.sticky-reveal__grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  align-items: start;
}

.sticky-reveal__media{
  position: sticky;
  top: 10vh;
  height: 80vh;
  margin: 0;
  overflow: hidden;
  z-index: 0;
}

.sticky-reveal__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sticky-reveal__text{
  position: relative;
  z-index: 1;
}

.sticky-reveal__block{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 85vh;
  margin: 0;
  text-align: center;
}

.sticky-reveal__block > p{
  width: min(520px, 92%);
  margin: 0 auto;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-weight: 500;
  font-size: clamp(18px, 4vw, 20px);
  line-height: 1.5;
}

.sticky-reveal__header{
  margin: 0 0 18px;
}

.sticky-reveal__title{
  margin: 0;
  font-family: "Gazpacho", Georgia, serif;
  font-weight: 700;
  font-size: clamp(44px, 5vw, 76px);
  line-height: 1.02;
  letter-spacing: -0.01em;
}

@media (min-width: 900px){
  .sticky-reveal__grid{
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
}

@media (max-width: 899px){
  .sticky-reveal__media::after{
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,.35);
    pointer-events: none;
  }
}

/* ==========================================================================
   PULLQUOTE
   ========================================================================== */

.pullquote{
  position: relative;
  isolation: isolate;
  width: min(var(--text-col), 92vw);
  margin: 72px auto;
  padding: clamp(38px, 6vw, 72px) 0;
  border-top: 1px solid rgba(0,0,0,.12);
  border-bottom: 1px solid rgba(0,0,0,.12);
  overflow: visible;
}

.pullquote::before{
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: -1;

  width: clamp(240px, 44vw, 440px);
  aspect-ratio: 1 / 1;

  transform: translate(-50%, -50%);
  transform-origin: center;

  background:
    radial-gradient(
      circle at 60% 26%,
      rgba(243,241,227,.95) 0%,
      rgba(195,208,228,.82) 30%,
      rgba(78,111,205,.72) 65%,
      rgba(21,41,124,.55) 82%,
      rgba(21,41,124,0) 100%
    );

  border-radius: 42% 58% 46% 54% / 50% 42% 68% 50%;

  filter: blur(18px);
  opacity: .9;

  animation:
    pullquote-blob-breathe 3.5s ease-in-out infinite,
    pullquote-blob-drift 12s ease-in-out infinite;
}

.pullquote__quote{
  position: relative;
  z-index: 1;
  margin: 0;
  font-family: "TiemposFine", "TiemposHeadline", Georgia, serif;
  font-weight: 300;
  font-size: clamp(34px, 4.8vw, 58px);
  line-height: 1.04;
  letter-spacing: -0.01em;
  text-align: center;
  color: #111;
  text-wrap: balance;
}

.pullquote__meta{
  position: relative;
  z-index: 1;
  margin-top: 18px;
  font-family: "GTAmerica", system-ui, sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  text-align: center;
  opacity: 0.7;
}

@keyframes pullquote-blob-breathe{
  0%, 100%{
    border-radius: 42% 58% 46% 54% / 50% 42% 58% 50%;
    transform: translate(-50%, -50%) scale(1);
  }
  25%{
    border-radius: 48% 52% 40% 60% / 44% 56% 44% 56%;
    transform: translate(-50%, -50%) scale(1.035, .985);
  }
  50%{
    border-radius: 56% 44% 52% 48% / 46% 48% 52% 54%;
    transform: translate(-50%, -50%) scale(.985, 1.03);
  }
  75%{
    border-radius: 45% 55% 58% 42% / 58% 43% 57% 42%;
    transform: translate(-50%, -50%) scale(1.025, .99);
  }
}

@keyframes pullquote-blob-drift{
  0%, 100%{
    translate: 0 0;
  }
  25%{
    translate: -8px -6px;
  }
  50%{
    translate: 6px 8px;
  }
  75%{
    translate: -5px 4px;
  }
}

@media (max-width: 700px){
  .pullquote{
    margin: 56px auto;
    padding: 34px 0;
  }

  .pullquote::before{
    width: clamp(200px, 68vw, 320px);
  }

  .pullquote__quote{
    font-size: clamp(26px, 8vw, 38px);
    line-height: 1.05;
  }
}

/* ==========================================================================
   FACTBOXES
   ========================================================================== */

.factboxes{
  margin: 64px 0;
}

.factbox-wrap{
  position: relative;
  margin: 1.5rem 0;
}

.factbox-toggle__input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.factbox{
  margin: 0 0 22px;
  padding: 24px 26px 22px;
  background: rgba(0,0,0,.035);
}

.factbox h3{
  margin: 0 0 14px;
  font-family: "Gazpacho", Georgia, serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 1.15;
  color: #111;
}

.factbox__body{
  position: relative;
}

.factbox__body p,
.factbox__body li{
  margin: 0 0 .8em;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 15px;
  line-height: 1.55;
  color: rgba(0,0,0,.86);
}

.factbox__body ul{
  margin: 0 0 .9em 1.1em;
  padding: 0;
}

.factbox-toggle__input:not(:checked) + .factbox .factbox__body{
  max-height: 120px;
  overflow: hidden;
}

.factbox-toggle__input:not(:checked) + .factbox .factbox__body::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 90px;
  background: linear-gradient(to bottom, rgba(245,245,245,0), rgba(245,245,245,1));
  pointer-events: none;
}

.factbox-toggle{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  margin-top: 6px;
  cursor: pointer;
  background: linear-gradient(to bottom, rgba(245,245,245,0), rgba(245,245,245,1));
}

.factbox-toggle__chevron{
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
}

.factbox-toggle__chevron::before{
  content: "";
  width: 10px;
  height: 10px;
  border-right: 2px solid rgba(0,0,0,.28);
  border-bottom: 2px solid rgba(0,0,0,.28);
  transform: rotate(45deg);
  transition: transform .18s ease;
}

.factbox-toggle__input:checked + .factbox .factbox-toggle{
  background: transparent;
}

.factbox-toggle__input:checked + .factbox .factbox-toggle__chevron::before{
  transform: rotate(-135deg);
}

/* ==========================================================================
   PERSONGALLERY
   ========================================================================== */

.person-gallery{
  width: 100%;
  margin: 48px 0 56px;
  text-align: center;
}

.person-gallery__title{
  margin: 0 0 26px;
  font-family: "TiemposText", Georgia, serif;
  font-weight: 500;
  font-size: clamp(28px, 4.8vw, 36px);
  line-height: 1;
  letter-spacing: -0.02em;
  color: #2f3975;
  text-wrap: balance;
}

.person-gallery__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 28px 20px;
  justify-items: center;
}

.person-card{
  max-width: 240px;
}

.person-card__image{
  display: block;
  width: 100%;
  max-width: 190px;
  height: auto;
  margin: 0 auto 10px;
}

.person-card__name{
  margin: 0 0 6px;
  font-family: "GTAmerica", system-ui, sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: .01em;
  color: #111;
}

.person-card p{
  font-family: "GTAmerica", system-ui, sans-serif;
  font-size: 13px;
  line-height: 1.2;
}

.person-card__text{
  margin: 0;
  font-family: "GTAmerica", system-ui, sans-serif;
  font-size: 13px;
  line-height: 1.2;
  color: rgba(0,0,0,.75);
}

.person-gallery__grid > :nth-child(5){
  grid-column: 1 / -1;
  justify-self: center;
}

@media (max-width: 700px){
  .person-gallery{
    margin: 40px 0 48px;
  }

  .person-gallery__grid{
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .person-card{
    max-width: 260px;
  }

  .person-card__image{
    max-width: 180px;
  }
}


.longread-header__image--mobile{
  display: none;
}

@media (max-width: 700px){
  .longread-header__image--desktop{
    display: none;
  }

  .longread-header__image--mobile{
    display: block;
  }
}

/* ===== Bag historien box ===== */

.behind-story{
  max-width: 720px;
  margin: 48px auto;
  padding: 26px 28px;

  background: rgba(47,57,117,0.06);
  border-left: 4px solid #2f3975;
}

.behind-story__title{
  margin: 0 0 12px;

  font-family: "TiemposText", Georgia, serif;
  font-weight: 500;
  font-size: 20px;
  line-height: 1.2;

  color: #2f3975;
}

.behind-story p{
  margin: 0 0 10px;

  font-family: "GTAmerica", system-ui, sans-serif;
  font-size: 18px;
  line-height: 1.45;
  color: rgba(0,0,0,.85);
}

.behind-story p:last-child{
  margin-bottom: 0;
}

/* ===== Video block ===== */

.video-block{
  max-width: 720px;
  margin: 48px auto;
}

.video-player{
  position: relative;
  width: 100%;
}

.video-player video{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 4px;
  background: #000;
}