/* ============================================================
   Global Shapers Hamburg – Theme-Styles
   ------------------------------------------------------------
   Nachbau des Designs von globalshapers.org. Die Farben kommen aus
   theme.json (Palette) – hier wird nur auf sie verwiesen.

   Aufbau der Inhalte (siehe Block-Muster in /patterns):
     <section class="gs-section is-style-gs-mist">   Abschnitt, volle Breite
       <div class="gs-container">                   Inhaltsbreite 1312 px
   Die Hintergründe (is-style-gs-…) sind im Editor als „Stil“ der Gruppe
   wählbar: Weiß, Hellgrau, Sand, Blau, Navy.
   ============================================================ */

:root {
  --color-navy: var(--wp--preset--color--navy);
  --color-blue: var(--wp--preset--color--blue);
  --color-blue-hover: #123a7c;
  --color-sky: var(--wp--preset--color--sky);
  --color-sky-hover: #5a92e8;
  --color-midnight: var(--wp--preset--color--midnight);
  --color-white: var(--wp--preset--color--white);
  --color-mist: var(--wp--preset--color--mist);
  --color-sand: var(--wp--preset--color--sand);
  --color-text-muted: #545b78;
  --color-text-inverse-muted: #b6bacb;
  --color-border: #e6e6e6;
  --color-border-dark: #3c4264;
  --color-focus: #ffcb05;

  --font-sans: var(--wp--preset--font-family--system);
  --layout-max-width: 1312px;
  --layout-prose-width: 720px;
  --layout-gutter: 24px;
  --layout-radius: 4px;
  --radius-pill: 9999px;

  --fs-display: clamp(2.5rem, 1.6rem + 2.6vw, 4rem);
  --fs-h2: clamp(1.875rem, 1.5rem + 1.1vw, 2.5rem);
  --fs-h2-s: clamp(1.625rem, 1.4rem + .7vw, 2rem);
  --fs-h3: clamp(1.25rem, 1.15rem + .35vw, 1.5rem);
  --fs-h4: 1.25rem;
  --fs-lead: clamp(1.0625rem, 1rem + .25vw, 1.25rem);
  --fs-body: 1.125rem;
  --fs-base: 1rem;
  --fs-small: .875rem;
  --fs-xs: .75rem;
  --fs-tag: .6875rem;

  --section-space: clamp(56px, 4vw + 32px, 96px);
  --shadow-card: 0 4px 12px 0 rgba(0, 0, 0, .08), 0 1px 2px 0 rgba(0, 0, 0, .04);
}

/* ------------------------------------------------------------
   Grundlagen
   ------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: 1.5;
  color: var(--color-navy);
  background: var(--color-white);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img, svg, video { max-width: 100%; height: auto; }
h1, h2, h3, h4 {
  font-weight: 700; line-height: 1.2; letter-spacing: .005em;
  margin: 0 0 16px; text-wrap: balance;
  overflow-wrap: break-word; color: inherit;
}
h1 { font-size: var(--fs-display); line-height: 1.125; }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); line-height: 1.33; }
h4 { font-size: var(--fs-h4); line-height: 1.4; }
p, ul, ol { margin: 0 0 16px; }
p { text-wrap: pretty; }
/* Lange deutsche Wörter nur auf schmalen Bildschirmen trennen */
@media (max-width: 640px) { h1, h2, h3 { hyphens: auto; } }
:where(p, ul, ol, h1, h2, h3, h4):last-child { margin-bottom: 0; }
a { color: var(--color-blue); text-underline-offset: .18em; }
a:hover { color: var(--color-blue-hover); }
:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; border-radius: 2px; }
[hidden] { display: none !important; }
.screen-reader-text, .visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: 16px; top: -100%; z-index: 100; padding: 8px 16px;
  background: var(--color-blue); color: #fff; text-decoration: none;
}
.skip-link:focus { top: 16px; color: #fff; }

/* Block-Abstände: Bilder in Gruppen ohne Standard-Rand */
.wp-block-image { margin: 0; }
.wp-block-image img { display: block; }
.wp-block-group { margin-block: 0; }

/* Inhaltsbreite */
.gs-container { width: min(100% - 2 * var(--layout-gutter), var(--layout-max-width)); margin-inline: auto; }

/* Freier Text direkt auf einer Seite (ohne Abschnitt) bekommt Lesebreite */
.gs-content > :not(.gs-section, .gs-hero, .gs-signals, .gs-cta-band, .gs-photo-strip, .gs-feature-split, .alignfull, .alignwide) {
  width: min(100% - 2 * var(--layout-gutter), var(--layout-prose-width));
  margin-inline: auto;
}
.gs-content > p:first-child, .gs-content > h2:first-child { margin-top: var(--section-space); }
.gs-content > :not(.gs-section, .gs-hero, .gs-signals, .gs-cta-band, .gs-photo-strip, .gs-feature-split):last-child { margin-bottom: var(--section-space); }

/* ------------------------------------------------------------
   Buttons (Pillenform, 48 px)
   ------------------------------------------------------------ */
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 16px; }
.wp-block-button__link, .gs-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 0 26px;
  border: 2px solid transparent; border-radius: var(--radius-pill);
  background: var(--color-blue); color: #fff;
  font-size: var(--fs-base); font-weight: 700; line-height: 1.2;
  text-decoration: none; white-space: nowrap;
  transition: background-color .15s ease, color .15s ease;
}
.wp-block-button__link:hover, .gs-btn:hover { background: var(--color-blue-hover); color: #fff; }
.is-style-outline .wp-block-button__link, .gs-btn--outline { background: transparent; border-color: var(--color-blue); color: var(--color-blue); }
.is-style-outline .wp-block-button__link:hover, .gs-btn--outline:hover { background: var(--color-blue); color: #fff; }
.is-style-sky .wp-block-button__link, .gs-btn--sky { background: var(--color-sky); color: var(--color-navy); }
.is-style-sky .wp-block-button__link:hover, .gs-btn--sky:hover { background: var(--color-sky-hover); color: var(--color-navy); }
.gs-btn--small { min-height: 40px; padding: 0 20px; font-size: var(--fs-small); }

/* Textlink in Fett („Lesen“, „Visit …“) */
.gs-link { font-size: var(--fs-small); font-weight: 700; }
.gs-link a { color: var(--color-blue); text-decoration: none; }
.gs-link a:hover { text-decoration: underline; }
.is-style-gs-blue .gs-link a, .is-style-gs-navy .gs-link a { color: var(--color-sky); }

.gs-tag {
  font-size: var(--fs-tag); font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--color-blue); margin: 0;
}

/* ------------------------------------------------------------
   Abschnitte und Hintergründe
   ------------------------------------------------------------ */
.gs-section { padding-block: var(--section-space); }
.gs-section--flush-top { padding-top: 0; }
.is-style-gs-mist { background: var(--color-mist); }
.is-style-gs-sand { background: var(--color-sand); }
.is-style-gs-blue { background: var(--color-blue); color: #fff; }
.is-style-gs-navy { background: var(--color-navy); color: #fff; }

.gs-section-head { max-width: 864px; margin-bottom: 64px; }
.gs-section-head h2 { margin-bottom: 24px; }
.gs-section-head p { font-size: var(--fs-lead); line-height: 1.4; }
.gs-section-head--small h2 { font-size: var(--fs-h2-s); }
.gs-section-head--center { margin-inline: auto; text-align: center; }
.gs-section-head--tight { margin-bottom: 40px; }
.gs-section-head--row { max-width: none; display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin-bottom: 40px; }
.gs-section-head--row h2 { font-size: var(--fs-h2-s); margin: 0; }
.gs-spaced { margin-top: 96px; }

/* Raster */
.gs-grid { display: grid; gap: 24px; }
.gs-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gs-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gs-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gs-grid--wide-gap { row-gap: 64px; }
@media (max-width: 1100px) { .gs-grid.gs-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px)  { .gs-grid.gs-cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px)  { .gs-grid.gs-cols-2, .gs-grid.gs-cols-3, .gs-grid.gs-cols-4 { grid-template-columns: minmax(0, 1fr); } }

/* ------------------------------------------------------------
   Aufmacher (Hero)
   ------------------------------------------------------------ */
.gs-hero {
  position: relative; display: flex; align-items: center;
  min-height: 600px; color: #fff; background: var(--color-navy);
  isolation: isolate;
}
.gs-hero--medium { min-height: 520px; }
.gs-hero--short { min-height: 400px; }
.gs-hero__media { position: absolute !important; inset: 0; z-index: -2; }
.gs-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.gs-hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(90deg, rgba(10, 19, 60, .72) 0%, rgba(10, 19, 60, .45) 55%, rgba(10, 19, 60, .25) 100%);
}
.gs-hero--green::before { background: linear-gradient(90deg, rgba(74, 110, 0, .72) 0%, rgba(90, 125, 0, .45) 60%, rgba(60, 84, 0, .3) 100%); }
.gs-hero > .gs-container { position: relative; }
.gs-hero__content { padding-block: 64px; max-width: 900px; }
.gs-hero__title { margin-bottom: 24px; }
.gs-hero__lead { font-size: var(--fs-lead); line-height: 1.4; }
.gs-hero .wp-block-buttons { margin-top: 32px; }

/* ------------------------------------------------------------
   Titel links, Text rechts
   ------------------------------------------------------------ */
.gs-intro-split { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.gs-intro-split h2 { margin: 0; max-width: 560px; }
.gs-intro-split__text { font-size: var(--fs-body); line-height: 1.55; }
@media (max-width: 800px) { .gs-intro-split { grid-template-columns: 1fr; gap: 24px; } }

/* ------------------------------------------------------------
   Kennzahlen
   ------------------------------------------------------------ */
.gs-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 96px; }
.gs-stats.gs-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gs-stats.gs-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gs-stats--flush { margin-top: 0; }
.gs-section--stats { padding-block: 80px; }
.gs-stat { border-left: 2px solid var(--color-border); padding: 2px 0 2px 24px; }
.gs-stat__value { font-size: clamp(2.25rem, 1.8rem + 1.2vw, 3rem); font-weight: 700; line-height: 1.2; margin: 0; }
.gs-stat__label { font-size: var(--fs-h4); font-weight: 700; line-height: 1.4; margin: 8px 0 0; }
.is-style-gs-navy .gs-stat { border-color: var(--color-border-dark); }
@media (max-width: 900px) { .gs-stats, .gs-stats.gs-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; } }
@media (max-width: 480px) { .gs-stats, .gs-stats.gs-cols-2, .gs-stats.gs-cols-4 { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------
   Datenband mit Punkte-Weltkarte
   ------------------------------------------------------------ */
.gs-signals {
  position: relative; display: flex; align-items: center; min-height: 596px;
  background-color: var(--color-midnight); color: #fff;
  overflow: hidden; isolation: isolate;
  --continents:
    radial-gradient(ellipse 11% 19% at 19% 27%, #000 25%, transparent 100%),
    radial-gradient(ellipse 4% 9% at 25% 50%, #000 25%, transparent 100%),
    radial-gradient(ellipse 5.5% 21% at 31% 74%, #000 25%, transparent 100%),
    radial-gradient(ellipse 6% 10% at 51% 24%, #000 25%, transparent 100%),
    radial-gradient(ellipse 7.5% 23% at 54% 62%, #000 25%, transparent 100%),
    radial-gradient(ellipse 17% 18% at 72% 30%, #000 25%, transparent 100%),
    radial-gradient(ellipse 3% 10% at 69% 52%, #000 25%, transparent 100%),
    radial-gradient(ellipse 5% 7% at 82% 56%, #000 25%, transparent 100%),
    radial-gradient(ellipse 5.5% 9% at 88% 80%, #000 25%, transparent 100%);
}
.gs-signals::before, .gs-signals::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  -webkit-mask-image: var(--continents); mask-image: var(--continents);
}
.gs-signals::before {
  background: radial-gradient(circle, rgba(120, 160, 230, .45) 1.4px, transparent 2px) 0 0 / 13px 13px, rgba(25, 72, 151, .35);
}
.gs-signals::after {
  background-image: radial-gradient(circle, rgba(200, 220, 250, .75) 3px, transparent 4px), radial-gradient(circle, rgba(200, 220, 250, .5) 2.5px, transparent 3.5px);
  background-size: 97px 71px, 61px 113px;
  background-position: 13px 22px, 41px 5px;
}
.gs-signals > .gs-container { position: relative; z-index: 1; }
.gs-signals__content { padding-block: 80px; max-width: 980px; }
.gs-signals h2 { margin-bottom: 24px; }
.gs-signals p { font-size: var(--fs-body); margin-bottom: 32px; }

/* ------------------------------------------------------------
   Karten
   ------------------------------------------------------------ */
.gs-card {
  display: flex; flex-direction: column;
  background: #fff; color: var(--color-navy);
  border-radius: var(--layout-radius); box-shadow: var(--shadow-card);
  padding: 24px;
}
.gs-card h3 { font-size: var(--fs-h3); margin-bottom: 8px; }
.gs-card .gs-card__title--s, .gs-card h3.gs-card__title--s { font-size: var(--fs-h4); }
.gs-card p { font-size: var(--fs-body); line-height: 1.55; margin-bottom: 12px; }
.gs-card .gs-link { margin-top: auto; font-size: var(--fs-small); }

.gs-media-card { display: flex; flex-direction: column; }
.gs-media-card__media { margin-bottom: 32px !important; }
.gs-media-card__media img { width: 100%; aspect-ratio: 421 / 240; object-fit: cover; }
.gs-media-card__media--report { margin-bottom: 24px !important; }
.gs-media-card__media--report img { aspect-ratio: 248 / 192; }
.gs-media-card__media--wide { margin-bottom: 24px !important; }
.gs-media-card__media--wide img { aspect-ratio: 440 / 164; }
.gs-media-card h3 { font-size: var(--fs-h3); margin-bottom: 12px; }
.gs-media-card h3.gs-media-card__title--s { font-size: var(--fs-h4); line-height: 1.3; margin-bottom: 8px; }
.gs-media-card__text { font-size: var(--fs-lead); line-height: 1.4; }
.gs-media-card__text--s { font-size: var(--fs-body); line-height: 1.45; }
.gs-media-card__footer { margin-top: auto !important; padding-top: 24px; }

.gs-project-card { position: relative; display: flex; flex-direction: column; }
.gs-project-card__media { margin-bottom: 24px !important; }
.gs-project-card__media img { width: 100%; aspect-ratio: 248 / 128; object-fit: cover; }
.gs-project-card h3 { font-size: var(--fs-h4); line-height: 1.4; margin-bottom: 8px; }
.gs-project-card h3 a { color: inherit; text-decoration: none; }
.gs-project-card h3 a:hover { text-decoration: underline; }
.gs-project-card__hub { font-size: var(--fs-small); color: var(--color-text-muted); margin: 0; }
.gs-project-card__text { font-size: var(--fs-base); margin: 12px 0 0; }
.gs-project-card .gs-link { margin-top: 12px; }

/* ------------------------------------------------------------
   Video (verlinkt, kein Einbetten)
   ------------------------------------------------------------ */
.gs-video { position: relative; height: clamp(220px, 28vw, 480px); background: #000; color: #fff; overflow: hidden; }
.gs-video__media { position: absolute !important; inset: 0; }
.gs-video__media img { width: 100%; height: 100%; object-fit: cover; }
.gs-video__title { position: absolute; top: 24px; left: 32px; right: 32px; font-size: var(--fs-h4); font-weight: 700; z-index: 1; }
.gs-video__play { margin: 0; }
.gs-video__play a {
  position: absolute; inset: 0; z-index: 2; font-size: 0; color: transparent;
  background: url("../img/play.svg") no-repeat center / 72px 72px;
}
.gs-video__play a:hover { background-image: url("../img/play-hover.svg"); }

/* Global Shapers Show */
.gs-show-card { display: flex; flex-direction: column; }
.gs-show-card__media { margin-bottom: 32px !important; }
.gs-show-card__media img { width: 100%; aspect-ratio: 310 / 240; object-fit: cover; background: #000; }
.gs-show-card h3 { font-size: var(--fs-h3); margin-bottom: 8px; }
.gs-show-card p { font-size: var(--fs-lead); line-height: 1.4; }

/* ------------------------------------------------------------
   Zitate
   ------------------------------------------------------------ */
.gs-quotes { display: grid; grid-template-columns: 1fr 1fr; gap: 64px 96px; }
.gs-quote { position: relative; display: flex; flex-direction: column; }
.gs-quote::before {
  content: "\201C"; position: absolute; left: -32px; top: -44px;
  font-family: Georgia, 'Times New Roman', serif; font-size: 120px; line-height: 1;
  color: var(--color-border);
}
.gs-quote__text { position: relative; font-size: var(--fs-lead); line-height: 1.4; margin-bottom: 80px !important; }
.gs-quote__person { display: flex; align-items: center; gap: 16px; margin-top: auto; }
.gs-quote__avatar { flex-shrink: 0; }
.gs-quote__avatar img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }
.gs-quote__name { font-size: var(--fs-h4); font-weight: 700; line-height: 1.3; margin: 0; }
.gs-quote__meta { font-size: var(--fs-base); margin: 0; }
.gs-quotes--small { margin-top: 96px; }
.gs-quotes--small .gs-quote__text { font-size: var(--fs-body); margin-bottom: 48px !important; }
.gs-quotes--small .gs-quote__avatar img { width: 52px; height: 52px; }
.gs-quotes--small .gs-quote__name { font-size: var(--fs-base); }
.gs-quotes--small .gs-quote__meta { font-size: var(--fs-xs); }
@media (max-width: 800px) { .gs-quotes { grid-template-columns: 1fr; } .gs-quote::before { left: -8px; } }

/* ------------------------------------------------------------
   Fotoreihe
   ------------------------------------------------------------ */
.gs-photo-strip { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.gs-photo-strip::-webkit-scrollbar { display: none; }
.gs-photo-strip > .wp-block-image { flex: 0 0 auto; scroll-snap-align: start; height: clamp(280px, 27vw, 468px); }
.gs-photo-strip img { height: 100%; width: 100%; object-fit: cover; }
.gs-photo-strip > :nth-child(4n + 1) { aspect-ratio: 300 / 468; }
.gs-photo-strip > :nth-child(4n + 2), .gs-photo-strip > :nth-child(4n + 3) { aspect-ratio: 376 / 468; }
.gs-photo-strip > :nth-child(4n + 4) { aspect-ratio: 582 / 468; }

/* ------------------------------------------------------------
   Personen
   ------------------------------------------------------------ */
.gs-people { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 64px 24px; }
.gs-person { width: 176px; max-width: 100%; margin-inline: auto; }
.gs-person__media { margin-bottom: 24px !important; }
.gs-person__media img { width: 100%; aspect-ratio: 176 / 248; object-fit: cover; }
.gs-person__name { font-size: var(--fs-base); font-weight: 700; margin: 0 0 4px; line-height: 1.4; }
.gs-person__role { font-size: var(--fs-small); line-height: 1.45; margin: 0; }
@media (max-width: 900px) { .gs-people { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .gs-people { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ------------------------------------------------------------
   Abschluss-Band vor dem Footer
   ------------------------------------------------------------ */
.gs-cta-band { background: var(--color-navy); color: #fff; padding: 64px 0 32px; }
.gs-cta-band__inner { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.gs-cta-band__title { font-size: var(--fs-h3); margin-bottom: 16px; }
.gs-cta-band__text { font-size: var(--fs-body); margin: 0; }
@media (max-width: 700px) { .gs-cta-band__inner { flex-direction: column; align-items: flex-start; } }

/* ------------------------------------------------------------
   Text links, Bild bis zum Rand
   ------------------------------------------------------------ */
.gs-feature-split {
  display: grid;
  grid-template-columns: minmax(var(--layout-gutter), 1fr) minmax(0, calc(var(--layout-max-width) / 2)) minmax(0, calc(var(--layout-max-width) / 2)) 0;
  align-items: center; padding-block: 32px;
}
.gs-feature-split__text { grid-column: 2; padding: 48px 64px 48px 0; }
.gs-feature-split__text h2 { font-size: var(--fs-h2-s); }
.gs-feature-split__text p { font-size: var(--fs-body); line-height: 1.5; }
.gs-feature-split__text .wp-block-buttons { margin-top: 24px; }
.gs-feature-split__text .wp-block-button__link { min-height: 40px; padding: 0 20px; font-size: var(--fs-small); }
.gs-feature-split__media { grid-column: 3 / 5; height: clamp(300px, 34vw, 582px); }
.gs-feature-split__media img { width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 1360px) { .gs-feature-split { grid-template-columns: 1fr calc(var(--layout-max-width) / 2) calc(var(--layout-max-width) / 2) 1fr; } }
@media (max-width: 900px) {
  .gs-feature-split { grid-template-columns: var(--layout-gutter) 1fr var(--layout-gutter); }
  .gs-feature-split__text { grid-column: 2; padding-right: 0; }
  .gs-feature-split__media { grid-column: 1 / -1; }
}

/* ------------------------------------------------------------
   Aufklapp-Karussell (Flagship Collaborations)
   Ohne JavaScript ist die erste Karte geöffnet; mit JavaScript lassen
   sich die Karten anklicken und per Pfeil wechseln.
   ------------------------------------------------------------ */
.gs-panel { background: #fff; border: 1px solid var(--color-border); border-radius: 8px; padding: 32px; }
.gs-panel__title { font-size: var(--fs-h4) !important; margin-bottom: 24px; }
.gs-expander { display: flex; gap: 8px; height: 400px; counter-reset: gs-exp; }
.gs-expander__item {
  position: relative; flex: 1 1 0; min-width: 0;
  border-radius: 6px; overflow: hidden; color: #fff; cursor: pointer;
  transition: flex-grow .35s ease; counter-increment: gs-exp;
}
.gs-expander__item.is-active, .gs-expander:not(.is-ready) > .gs-expander__item:first-child { flex-grow: 3.1; cursor: default; }
.gs-expander__media { position: absolute !important; inset: 0; }
.gs-expander__media img { width: 100%; height: 100%; object-fit: cover; }
.gs-expander__item::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 19, 60, .05) 30%, rgba(10, 19, 60, .8) 100%); }
.gs-expander__item::before {
  content: "0" counter(gs-exp); position: absolute; top: 0; left: 0; z-index: 2;
  min-width: 40px; padding: 8px 10px; background: #fff; color: var(--color-navy);
  font-size: var(--fs-small); font-weight: 700; text-align: center; border-bottom-right-radius: 8px;
}
.gs-expander__body { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding: 24px; }
.gs-expander__title { font-size: var(--fs-h4) !important; margin: 0 !important; overflow: hidden; text-overflow: ellipsis; }
.gs-expander__body > :not(.gs-expander__title) { display: none; }
.gs-expander__item.is-active .gs-expander__body > :not(.gs-expander__title),
.gs-expander:not(.is-ready) > .gs-expander__item:first-child .gs-expander__body > :not(.gs-expander__title) { display: block; }
.gs-expander__body p { font-size: var(--fs-small); line-height: 1.6; margin: 12px 0 0; max-width: 340px; }
.gs-expander__body .wp-block-buttons { margin-top: 16px; }
.gs-expander__item.is-active .gs-expander__body > .wp-block-buttons,
.gs-expander:not(.is-ready) > .gs-expander__item:first-child .gs-expander__body > .wp-block-buttons { display: flex; }
.gs-expander__body .wp-block-button__link { min-height: 40px; padding: 0 20px; font-size: var(--fs-small); }
@media (max-width: 800px) {
  .gs-expander { flex-direction: column; height: auto; }
  .gs-expander__item { flex: none; height: 96px; transition: none; }
  .gs-expander__item.is-active, .gs-expander:not(.is-ready) > .gs-expander__item:first-child { height: 380px; }
}

/* Pfeile (von theme.js eingefügt) */
.gs-carousel-nav { display: flex; justify-content: flex-end; gap: 16px; margin-top: 24px; }
.gs-carousel-nav button {
  display: grid; place-items: center; width: 36px; height: 36px;
  background: none; border: 0; border-radius: 50%; color: var(--color-navy); cursor: pointer;
}
.gs-carousel-nav button:hover { background: var(--color-mist); }
.gs-carousel-nav button[disabled] { opacity: .35; cursor: default; }
.gs-carousel-nav svg { width: 20px; height: 20px; }

/* ------------------------------------------------------------
   Projekt-Raster mit Filtern (Block „gs/project-grid“)
   ------------------------------------------------------------ */
.gs-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 64px; }
.gs-filters__search { position: relative; flex: 0 1 260px; }
.gs-filters__search svg { position: absolute; left: 14px; top: 50%; width: 14px; height: 14px; transform: translateY(-50%); }
.gs-filters__search input {
  width: 100%; height: 36px; padding: 0 16px 0 36px;
  border: 1px solid var(--color-border); border-radius: var(--radius-pill); background: #fff; font: inherit; font-size: var(--fs-small);
}
.gs-filters__divider { width: 1px; height: 24px; background: var(--color-border); }
.gs-filters select {
  height: 32px; padding: 0 32px 0 16px; border: 0; border-radius: var(--radius-pill);
  background: var(--color-border) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5 6 7.5 9 4.5' fill='none' stroke='%230A133C' stroke-width='1.4'/%3E%3C/svg%3E") no-repeat right 12px center / 12px;
  appearance: none; font: inherit; font-size: var(--fs-small); color: var(--color-navy);
}
.gs-filters__sort { margin-left: auto; display: flex; align-items: center; gap: 8px; font-size: var(--fs-xs); font-weight: 700; }
.gs-filters__sort select { background-color: transparent; padding-left: 4px; font-weight: 700; font-size: var(--fs-xs); }
.no-js .gs-filters { display: none; }
.gs-show-more { display: flex; justify-content: center; margin-top: 48px; }
.gs-show-more .gs-btn { background: var(--color-border); color: var(--color-navy); }

/* ------------------------------------------------------------
   Beiträge-Mosaik (Block „gs/posts-mosaic“)
   ------------------------------------------------------------ */
.gs-stories { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 48px 24px; list-style: none; margin: 0; padding: 0; }
.gs-story { position: relative; display: flex; flex-direction: column; }
.gs-story__media { display: block; width: 100%; aspect-ratio: 248 / 128; object-fit: cover; margin-bottom: 16px; }
.gs-story--wide { grid-column: span 2; }
.gs-story--wide .gs-story__media { aspect-ratio: 516 / 128; }
.gs-story__title { font-size: var(--fs-h4); line-height: 1.4; font-weight: 400; margin: 8px 0 12px; }
.gs-story__title a { color: inherit; text-decoration: none; }
.gs-story__title a::after { content: ""; position: absolute; inset: 0; }
.gs-story__title a:hover { text-decoration: underline; }
.gs-story__meta { display: flex; align-items: center; gap: 16px; font-size: var(--fs-small); margin: 0; }
.gs-story__meta span + span { border-left: 1px solid var(--color-navy); padding-left: 16px; }
.gs-story__read { color: var(--color-blue); }
.gs-story--lead { grid-column: span 2; min-height: 318px; }
.gs-story--lead .gs-story__media { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; margin: 0; }
.gs-story--lead .gs-story__box { position: relative; z-index: 1; margin: auto auto 32px 24px; width: min(424px, 80%); background: #fff; padding: 24px; }
@media (max-width: 1100px) { .gs-stories { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .gs-stories { grid-template-columns: 1fr; } .gs-story--wide, .gs-story--lead { grid-column: auto; } }

/* ------------------------------------------------------------
   Waagerechtes Karussell (Videos)
   ------------------------------------------------------------ */
.gs-carousel {
  display: flex; gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
  scrollbar-width: none; padding-bottom: 8px;
  margin-right: calc(-1 * max(var(--layout-gutter), (100vw - var(--layout-max-width)) / 2));
}
.gs-carousel::-webkit-scrollbar { display: none; }
.gs-carousel > * { flex: 0 0 min(420px, 80vw); scroll-snap-align: start; }
.gs-video-card { position: relative; display: flex; flex-direction: column; }
.gs-video-card__thumb { position: relative; margin-bottom: 16px; }
.gs-video-card__thumb img { width: 100%; aspect-ratio: 420 / 240; object-fit: cover; }
.gs-video-card__thumb::after {
  content: ""; position: absolute; left: 24px; bottom: 20px; width: 48px; height: 48px; pointer-events: none;
  background: url("../img/play.svg") no-repeat center / contain;
}
.gs-video-card__duration {
  position: absolute; right: 16px; bottom: 16px; margin: 0 !important;
  padding: 2px 8px; border-radius: 4px; background: rgba(10, 19, 60, .8); color: #fff;
  font-size: var(--fs-small); font-weight: 700;
}
.gs-video-card__title { font-size: var(--fs-h4) !important; line-height: 1.4; font-weight: 400; margin: 8px 0 0; }
.gs-video-card__title a { color: inherit; text-decoration: none; }
.gs-video-card__title a::after { content: ""; position: absolute; inset: 0; }
.gs-video-card__title a:hover { text-decoration: underline; }

/* ------------------------------------------------------------
   Logos, Preise, Gewinner
   ------------------------------------------------------------ */
.gs-logo-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 96px; align-items: center; justify-items: center; }
.gs-logo-row img { width: 160px; height: 80px; object-fit: contain; }
.gs-logo-row--center { display: flex; flex-wrap: wrap; justify-content: center; margin-top: 0; }
@media (max-width: 700px) { .gs-logo-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.gs-prize-card { padding: 32px; }
.gs-prize-card__amount { font-size: var(--fs-h2-s) !important; font-weight: 700; color: var(--color-blue); }
.gs-offer__num {
  display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
  background: var(--color-blue); color: #fff; font-weight: 700; margin-bottom: 24px !important;
}
.gs-winners-compact { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 24px; }
.gs-winners-compact > * { border-left: 2px solid var(--color-border); padding-left: 16px; }
.gs-winners-compact__hub { font-size: var(--fs-small); color: var(--color-text-muted); margin: 0; }
.gs-winners-compact__project { margin: 0; font-weight: 700; }
.gs-winners-compact__project a { color: var(--color-navy); text-decoration: none; }
.gs-winners-compact__project a:hover { text-decoration: underline; }
@media (max-width: 1000px) { .gs-winners-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .gs-winners-compact { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------
   Projektseite
   ------------------------------------------------------------ */
.gs-chips { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 24px 0 0; padding: 0; }
.gs-chip {
  display: inline-block; padding: 4px 12px; border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .4);
  font-size: var(--fs-small); font-weight: 700;
}
.gs-section--facts { padding-block: 40px; }
.gs-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 24px; }
.gs-fact { border-left: 2px solid var(--color-border-dark); padding-left: 16px; }
.gs-fact__label { font-size: var(--fs-small); color: var(--color-text-inverse-muted); margin: 0; }
.gs-fact__value { font-size: var(--fs-h4); font-weight: 700; margin: 2px 0 0; }

.gs-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px; }
.gs-kpi { background: #fff; border-radius: var(--layout-radius); box-shadow: var(--shadow-card); padding: 32px 24px; color: var(--color-navy); }
.gs-kpi__value { display: block; font-size: clamp(2.25rem, 1.8rem + 1.2vw, 3rem); font-weight: 700; line-height: 1.1; color: var(--color-blue); }
.gs-kpi__label { display: block; font-size: var(--fs-body); font-weight: 700; margin-top: 8px; }
.gs-kpi__target { display: block; font-size: var(--fs-small); color: var(--color-text-muted); margin-top: 16px; }
.gs-kpi__bar { height: 6px; border-radius: var(--radius-pill); background: var(--color-border); margin-top: 8px; overflow: hidden; }
.gs-kpi__bar span { display: block; height: 100%; background: var(--color-blue); border-radius: inherit; }

.gs-project-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 80px; align-items: start; }
.gs-fact-card { position: sticky; top: 24px; }
.gs-fact-card .gs-fact-card__title { font-size: var(--fs-h4); margin-bottom: 8px; }
.gs-fact-card .gs-fact { border-left: 0; border-top: 1px solid var(--color-border); padding: 12px 0; }
.gs-fact-card .gs-fact:first-of-type { border-top: 0; }
.gs-fact-card .gs-fact__label { color: var(--color-text-muted); font-size: var(--fs-small); margin: 0; }
.gs-fact-card .gs-fact__value { font-size: var(--fs-base); margin: 2px 0 0; }
.gs-fact-card .wp-block-buttons, .gs-fact-card .wp-block-button, .gs-fact-card .wp-block-button__link { width: 100%; }
.gs-fact-card .wp-block-buttons { margin-top: 24px; }
@media (max-width: 1000px) { .gs-project-layout { grid-template-columns: 1fr; } .gs-fact-card { position: static; } }

.gs-timeline { position: relative; }
.gs-timeline::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 2px; background: var(--color-border); }
.gs-timeline__item { position: relative; padding: 0 0 32px 40px; }
.gs-timeline__item:last-child { padding-bottom: 0; }
.gs-timeline__item::before {
  content: ""; position: absolute; left: 0; top: 6px; width: 16px; height: 16px; border-radius: 50%;
  background: #fff; border: 3px solid var(--color-blue);
}
.gs-timeline__item.is-done::before { background: var(--color-blue); }
.gs-timeline__date { font-size: var(--fs-small); font-weight: 700; color: var(--color-blue); margin: 0; }
.gs-timeline__title { font-size: var(--fs-h4); font-weight: 700; margin: 2px 0 4px; }
.gs-timeline__item p:not([class]) { font-size: var(--fs-body); margin: 0; max-width: 640px; }

.gs-gallery { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-auto-rows: 220px; gap: 12px; }
.gs-gallery > :first-child { grid-row: span 2; }
.gs-gallery img { width: 100%; height: 100%; object-fit: cover; }
.gs-gallery .wp-block-image { height: 100%; }
@media (max-width: 700px) {
  .gs-gallery { grid-template-columns: 1fr 1fr; grid-auto-rows: 160px; }
  .gs-gallery > :first-child { grid-column: span 2; grid-row: span 1; }
}

/* ------------------------------------------------------------
   Fließtext, Artikel
   ------------------------------------------------------------ */
.gs-prose { font-size: var(--fs-lead); line-height: 1.6; max-width: var(--layout-prose-width); }
.gs-prose p, .gs-prose ul, .gs-prose ol { margin-bottom: 24px; }
.gs-prose h2 { font-size: var(--fs-h3); margin-top: 48px; }
.gs-prose h2:first-child { margin-top: 0; }
.gs-prose h3 { font-size: var(--fs-h4); margin-top: 32px; }
.gs-prose li + li { margin-top: 8px; }
.gs-prose .wp-block-image { margin-block: 32px; }
.gs-prose .wp-block-image figcaption { font-size: var(--fs-small); color: var(--color-text-muted); }

.gs-article-head { padding-block: 64px 32px; }
.gs-article-head h1 { font-size: clamp(2.125rem, 1.5rem + 2vw, 3.5rem); max-width: 1040px; margin: 12px 0 24px; }
.gs-article-head__date { font-size: var(--fs-base); font-weight: 700; margin: 0; }
.gs-article-figure { margin-block: 0 64px; }
.gs-article-figure img { display: block; width: 100%; aspect-ratio: 16 / 7; object-fit: cover; }
.gs-article-figure figcaption { font-size: var(--fs-small); color: var(--color-text-muted); margin-top: 12px; max-width: 864px; }
.gs-article-layout { display: grid; grid-template-columns: 264px minmax(0, var(--layout-prose-width)); gap: 80px; align-items: start; }
.gs-article-aside { position: sticky; top: 24px; display: grid; gap: 32px; font-size: var(--fs-small); }
.gs-author { display: flex; gap: 12px; align-items: center; }
.gs-author img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; }
.gs-author__name { display: block; font-size: var(--fs-base); font-weight: 700; }
.gs-author__role { display: block; color: var(--color-text-muted); line-height: 1.4; }
.gs-aside-label { display: block; color: var(--color-text-muted); margin-bottom: 4px; }
.gs-share { display: flex; gap: 12px; list-style: none; margin: 8px 0 0; padding: 0; }
.gs-share a { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--color-border); color: var(--color-navy); }
.gs-share a:hover { border-color: var(--color-navy); }
.gs-share svg { width: 16px; height: 16px; fill: currentColor; }
.gs-key-points { background: var(--color-sand); padding: 32px; margin-bottom: 48px !important; border-radius: var(--layout-radius); }
.gs-key-points .gs-key-points__title { font-size: var(--fs-tag); letter-spacing: .08em; text-transform: uppercase; color: var(--color-blue); margin: 0 0 16px; }
.gs-key-points ul { margin: 0; padding-left: 1.2em; font-size: var(--fs-body); line-height: 1.5; }
.gs-key-points li + li { margin-top: 12px; }
.gs-callout { border-left: 4px solid var(--color-blue); background: var(--color-mist); padding: 24px 32px; margin: 40px 0 !important; font-size: var(--fs-body); }
.gs-callout ul { margin: 0; padding-left: 1.1em; }
.gs-callout a { font-weight: 700; }
.gs-license-note { font-size: var(--fs-small) !important; color: var(--color-text-muted); border-top: 1px solid var(--color-border); padding-top: 24px; margin-top: 48px !important; }
@media (max-width: 1000px) {
  .gs-article-layout { grid-template-columns: 1fr; gap: 40px; }
  .gs-article-aside { position: static; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
}

.gs-breadcrumb ol { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; font-size: var(--fs-small); }
.gs-breadcrumb li + li::before { content: "/"; margin-right: 8px; opacity: .6; }
.gs-breadcrumb a { color: inherit; }
.gs-hero .gs-breadcrumb { margin-bottom: 24px; }

/* ------------------------------------------------------------
   Kopfzeile
   ------------------------------------------------------------ */
.site-header { position: relative; z-index: 20; background: #fff; }
.site-header__inner { display: flex; align-items: center; gap: 40px; min-height: 104px; }
.brand { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; color: var(--color-blue); text-decoration: none; }
.brand:hover { color: var(--color-blue); }
.brand__mark { width: 56px; height: 56px; }
.brand img { height: 64px; width: auto; }
.brand__text { font-size: 8px; line-height: 1.05; letter-spacing: .06em; text-transform: uppercase; color: var(--color-text-muted); }
.brand__text strong { display: block; color: var(--color-blue); font-weight: 700; }
.nav { flex: 1; display: flex; align-items: center; gap: 40px; }
.nav__list { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 40px; list-style: none; margin: 0; padding: 0; }
.nav__list a {
  position: relative; display: inline-block; padding-block: 8px;
  font-size: var(--fs-base); color: var(--color-navy); text-decoration: none; white-space: nowrap;
}
.nav__list a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px; background: var(--color-navy);
  transform: scaleX(0); transition: transform .15s ease;
}
.nav__list a:hover::after, .nav__list a[aria-current]::after { transform: scaleX(1); }
.nav__meta { margin-left: auto; display: flex; align-items: center; gap: 24px; }
.nav__login { font-size: var(--fs-base); color: var(--color-blue); text-decoration: none; white-space: nowrap; }
.nav__login:hover { text-decoration: underline; }
.lang-switch { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.lang-switch a, .lang-switch span { display: inline-block; min-width: 32px; padding: 4px 6px; font-size: var(--fs-small); font-weight: 700; text-align: center; border-radius: 4px; text-decoration: none; }
.lang-switch a { color: var(--color-text-muted); }
.lang-switch a:hover, .lang-switch [aria-current] { color: var(--color-navy); background: var(--color-mist); }
.nav-toggle { display: none; margin-left: auto; }
.nav-toggle summary { display: flex; align-items: center; gap: 8px; list-style: none; cursor: pointer; padding: 8px; font-weight: 700; }
.nav-toggle summary::-webkit-details-marker { display: none; }
.nav-toggle__icon, .nav-toggle__icon::before, .nav-toggle__icon::after { display: block; width: 22px; height: 2px; background: var(--color-navy); position: relative; }
.nav-toggle__icon::before, .nav-toggle__icon::after { content: ""; position: absolute; left: 0; }
.nav-toggle__icon::before { top: -7px; }
.nav-toggle__icon::after { top: 7px; }
@media (max-width: 1240px) {
  .site-header__inner { flex-wrap: wrap; gap: 0; min-height: 80px; }
  .brand__mark { width: 48px; height: 48px; }
  .nav-toggle { display: block; }
  .nav { display: none; flex-basis: 100%; flex-direction: column; align-items: flex-start; gap: 24px; padding: 16px 0 24px; border-top: 1px solid var(--color-border); }
  .nav-toggle[open] + .nav { display: flex; }
  .nav__list { flex-direction: column; align-items: flex-start; gap: 8px; }
  .nav__list a::after { bottom: 2px; }
  .nav__meta { margin-left: 0; }
}
body.admin-bar .site-header { top: 0; }

/* ------------------------------------------------------------
   Fußzeile
   ------------------------------------------------------------ */
.site-footer { background: var(--color-navy); color: #fff; }
.site-footer a { color: #fff; text-decoration: none; }
.site-footer a:hover { text-decoration: underline; }
.site-footer__top { display: flex; justify-content: space-between; gap: 40px; padding-block: 48px; }
.footer-brand { border-left: 2px solid var(--color-sky); padding: 2px 0 2px 12px; font-size: var(--fs-base); font-weight: 700; line-height: 1.5; margin-bottom: 16px; }
.social-list { display: flex; gap: 24px; list-style: none; margin: 0; padding: 0 0 0 4px; }
.social-list svg { width: 20px; height: 20px; fill: currentColor; }
.footer-nav ul { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px 40px; list-style: none; margin: 0; padding: 0; }
.site-footer__bottom { border-top: 1px solid var(--color-border-dark); }
.site-footer__bottom-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 72px; padding-block: 12px; font-size: var(--fs-xs); }
.site-footer__credits { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; color: var(--color-text-inverse-muted); margin: 0; }
.site-footer__wef { font-size: 8px; line-height: 1; letter-spacing: .08em; text-transform: uppercase; text-align: center; color: #fff; }
.site-footer__legal ul { display: flex; flex-wrap: wrap; gap: 16px; list-style: none; margin: 0; padding: 0; }
@media (max-width: 900px) {
  .site-footer__top { flex-direction: column; }
  .footer-nav ul { justify-content: flex-start; }
  .site-footer__bottom-inner { flex-direction: column; align-items: flex-start; }
}

/* ------------------------------------------------------------
   Übersichten (Blog, Archiv, Suche), 404
   ------------------------------------------------------------ */
.gs-pagination { display: flex; gap: 16px; justify-content: center; margin-top: 48px; }
.gs-pagination .page-numbers { padding: 6px 12px; border-radius: 4px; text-decoration: none; }
.gs-pagination .current { background: var(--color-mist); font-weight: 700; }

/* Hinweisband auf Vorlagen-Seiten (Feld „Als Beispiel kennzeichnen“) */
.example-notice { background: var(--color-sand); font-size: var(--fs-small); padding-block: 12px; }
.example-notice p { margin: 0; }