/* Shared page shell ------------------------------------------------------ */

.shell-container {
  inline-size: min(calc(100% - (2 * var(--space-5))), 75rem);
  margin-inline: auto;
}

.site-header,
.site-header *,
.site-footer,
.site-footer * {
  box-sizing: border-box;
}

.skip-link {
  z-index: 1100;
  position: fixed;
  inset-block-start: var(--space-2);
  inset-inline-start: var(--space-2);
  padding-block: var(--space-3);
  padding-inline: var(--space-4);
  border-radius: var(--radius-sm);
  background: var(--color-action-primary);
  color: var(--color-action-primary-text);
  transform: translateY(-150%);
}

.skip-link:focus-visible {
  transform: translateY(0);
}

.site-header :where(a, button):focus-visible,
.site-footer a:focus-visible {
  outline: calc(var(--space-1) / 2) solid var(--color-focus-ring);
  outline-offset: calc(var(--space-1) / 2);
}

.site-footer a:focus-visible {
  outline-color: var(--color-text-inverse);
}

.site-header {
  z-index: 1000;
  position: sticky;
  inset-block-start: 0;
  border-block-end: var(--border-width-hairline) solid transparent;
  background: var(--color-surface);
  box-shadow: none;
}

.site-header.is-scrolled {
  border-block-end-color: var(--color-border);
  box-shadow: var(--elevation-1);
}

.site-header__inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
  min-block-size: var(--space-16);
  padding-block: var(--space-2);
}

.site-brand {
  display: inline-flex;
  align-items: center;
  flex: none;
  min-block-size: var(--space-11);
  color: var(--color-text-accent);
  text-decoration: none;
}

.site-header__brands,
.site-header__partner-logos {
  display: flex;
  align-items: center;
}

.site-header__brands {
  flex: none;
  gap: var(--space-3);
}

.site-header__partner-logos {
  gap: var(--space-2);
  padding-inline-start: var(--space-3);
  border-inline-start: var(--border-width-hairline) solid var(--color-border);
}

.site-header__partner-logo {
  display: block;
  block-size: auto;
  object-fit: contain;
}

.site-header__partner-logo--cooperation { inline-size: 7.5rem; }
.site-header__partner-logo--catalyst { inline-size: 6.5rem; }
.site-header__partner-logo--bwf { inline-size: 5.75rem; margin-inline-start: var(--space-3); }

.site-brand__placeholder {
  display: grid;
  place-items: center;
  inline-size: clamp(10rem, 20vw, 13.5rem);
  aspect-ratio: 15 / 4;
  border: var(--border-width-hairline) solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
  font-weight: 700;
  letter-spacing: 0.08em;
}

.site-header__menu-button {
  display: none;
  place-items: center;
  inline-size: var(--space-11);
  block-size: var(--space-11);
  padding-block: var(--space-2);
  padding-inline: var(--space-2);
  border: var(--border-width-hairline) solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  color: var(--color-text-primary);
  cursor: pointer;
}

.site-header__menu-icon {
  display: grid;
  gap: var(--space-1);
  inline-size: var(--space-5);
}

.site-header__menu-icon span {
  display: block;
  block-size: 0.125rem;
  border-radius: var(--radius-sm);
  background: currentColor;
}

.site-nav,
.site-nav__list {
  display: flex;
  align-items: center;
  gap: var(--space-5);
}

.site-nav__list {
  margin-block: 0;
  margin-inline: 0;
  padding-block: 0;
  padding-inline: 0;
  list-style: none;
}

.site-nav a,
.language-switch {
  font-weight: 700;
}

.site-nav a {
  display: inline-flex;
  align-items: center;
  min-block-size: var(--space-11);
  color: var(--color-text-primary);
  text-decoration: none;
}

.site-nav a:hover,
.site-nav a:focus-visible {
  color: var(--color-action-primary-hover);
  text-decoration: underline;
  text-underline-offset: var(--space-2);
}

.language-switch {
  min-block-size: var(--space-11);
  padding-block: var(--space-2);
  padding-inline: var(--space-4);
  border: var(--border-width-hairline) solid var(--color-action-primary);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-action-primary);
  cursor: pointer;
}

.language-switch:hover,
.language-switch:focus-visible {
  background: var(--color-surface-accent);
}

.site-footer {
  padding-block: var(--space-12);
  background: var(--color-surface-inverse);
  color: var(--color-text-inverse);
}

.site-footer__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
  gap: var(--space-10);
}

.site-footer h2,
.site-footer a {
  color: inherit;
}

.site-footer h2 {
  font-size: var(--text-xl);
}

.site-footer a {
  display: inline-flex;
  align-items: center;
  min-block-size: var(--space-11);
}

.site-footer address {
  display: grid;
  gap: var(--space-2);
  margin-block-end: var(--space-5);
  font-style: normal;
}

.site-footer__contact-list {
  display: grid;
  gap: var(--space-2);
  margin-block: 0;
  margin-inline: 0;
}

.site-footer__contact-list div {
  display: grid;
  grid-template-columns: minmax(7rem, 0.45fr) minmax(0, 1fr);
  gap: var(--space-3);
}

.site-footer__contact-list dt {
  font-weight: 700;
}

.site-footer__contact-list dd {
  margin-block: 0;
  margin-inline: 0;
}

.site-footer__placeholder {
  font-family: var(--font-latin);
  letter-spacing: 0.04em;
}

.partner-logos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
  align-items: end;
}

.partner-logo {
  display: grid;
  gap: var(--space-2);
}

.partner-logo__label {
  font-size: var(--text-xs);
}

.partner-logo__placeholder,
.partner-logo img {
  display: grid;
  place-items: center;
  inline-size: 100%;
  min-block-size: var(--space-12);
  padding-block: var(--space-3);
  padding-inline: var(--space-3);
  border: var(--border-width-hairline) solid var(--color-border-strong);
  border-radius: 0;
  background: var(--color-surface);
  color: var(--color-text-primary);
  font-family: var(--font-latin);
  font-size: var(--text-xs);
  font-weight: 700;
  text-align: center;
}

/* Funder compliance: these declarations must not be replaced with visual effects. */
.partner-logo img {
  block-size: auto;
  padding-block: 0;
  padding-inline: 0;
  border: 0;
  object-fit: contain;
  filter: none;
  mix-blend-mode: normal;
  transform: none;
}

.partner-logo--german :is(.partner-logo__placeholder, img) {
  aspect-ratio: 3 / 1;
}

.partner-logo--giz :is(.partner-logo__placeholder, img) {
  aspect-ratio: 3 / 1;
}

.partner-logo--catalyst :is(.partner-logo__placeholder, img) {
  aspect-ratio: 5 / 2;
}

.partner-logo--bwf :is(.partner-logo__placeholder, img) {
  aspect-ratio: 5 / 2;
}

.site-footer__attribution {
  grid-column: 1 / -1;
  margin-block: 0;
  margin-inline: 0;
  padding-block-start: var(--space-5);
  border-block-start: var(--border-width-hairline) solid var(--color-border-strong);
  font-size: var(--text-sm);
}

@media (max-width: 69.999rem) {
  .site-header__menu-button {
    display: grid;
  }

  .site-header__brands { gap: var(--space-2); }
  .site-header__partner-logos {
    gap: var(--space-1);
    padding-inline-start: var(--space-2);
  }
  .site-header__partner-logo { inline-size: auto; block-size: clamp(1.5rem, 6.8vw, 2.6rem); }
  .site-header__partner-logo--cooperation { block-size: clamp(1.65rem, 7.4vw, 2.85rem); max-inline-size: 4.8rem; }
  .site-header__partner-logo--catalyst { max-inline-size: 4.87rem; }
  .site-header__partner-logo--bwf { max-inline-size: 3.68rem; margin-inline-start: clamp(0.25rem, 1.4vw, 0.75rem); }

  .site-nav {
    position: absolute;
    inset-block-start: 100%;
    inset-inline: 0;
    display: grid;
    gap: var(--space-5);
    padding-block: var(--space-5);
    padding-inline: var(--space-5);
    border-block-start: var(--border-width-hairline) solid var(--color-border);
    background: var(--color-surface);
    box-shadow: var(--elevation-2);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  .site-nav.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .site-nav__list {
    display: grid;
    align-items: stretch;
    gap: 0;
  }

  .site-nav a {
    display: flex;
    padding-block: var(--space-3);
  }

  .language-switch {
    justify-self: start;
  }

  .site-nav-open {
    overflow: hidden;
  }

  .site-footer__inner {
    grid-template-columns: 1fr;
  }

  .site-footer__attribution {
    grid-column: auto;
  }
}

@media (max-width: 47.999rem) {
  .site-header__inner { min-block-size: calc(var(--space-16) + var(--space-2)); }
}

@media (max-width: 30rem) {
  .site-brand__placeholder {
    inline-size: 9rem;
  }

  .partner-logos {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 23.5rem) {
  .site-header__inner { gap: var(--space-3); }
  .site-brand__logo { inline-size: 6rem; }
  .site-header__brands { gap: calc(var(--space-1) * 1.5); }
  .site-header__partner-logos {
    padding-inline-start: var(--space-1);
    gap: var(--space-1);
  }
  .site-header__partner-logo { block-size: clamp(1.25rem, 6.2vw, 1.6rem); }
  .site-header__partner-logo--cooperation { block-size: clamp(1.3rem, 6.8vw, 1.7rem); max-inline-size: 2.9rem; }
  .site-header__partner-logo--catalyst { max-inline-size: 3rem; }
  .site-header__partner-logo--bwf { max-inline-size: 2.27rem; }
}

@media (prefers-reduced-motion: no-preference) {
  .skip-link,
  .site-header,
  .site-nav,
  .language-switch {
    transition:
      background-color 160ms ease,
      border-color 160ms ease,
      box-shadow 160ms ease,
      opacity 160ms ease,
      transform 160ms ease;
  }
}

/* Fixed page-navigation buttons: jump to top / jump to bottom. Present on every
   page, always visible while scrolling. Logical inset properties so the corner
   flips correctly between LTR and RTL without a direction-specific override. */
.page-nav {
  position: fixed;
  z-index: 900;
  inset-block-end: var(--space-6);
  inset-inline-end: var(--space-5);
  display: grid;
  gap: var(--space-2);
}

.page-nav__button {
  display: grid;
  place-items: center;
  inline-size: var(--space-11);
  block-size: var(--space-11);
  border: var(--border-width-hairline) solid var(--color-border-strong);
  border-radius: 50%;
  background: var(--color-surface);
  color: var(--color-text-secondary);
  box-shadow: var(--elevation-1);
  cursor: pointer;
}

.page-nav__button .icon {
  inline-size: var(--space-5);
  block-size: var(--space-5);
}

.page-nav__button:is(:hover, .is-hovered) {
  border-color: var(--color-action-primary);
  background: var(--color-surface-lavender);
  color: var(--color-action-primary);
}

.page-nav__button:is(:active, .is-active) {
  background: var(--color-surface-muted);
}

.page-nav__button:focus-visible {
  outline: calc(var(--space-1) / 2) solid var(--color-focus-ring);
  outline-offset: calc(var(--space-1) / 2);
}

@media (max-width: 47.999rem) {
  .page-nav {
    /* env() falls back to 0 on browsers without safe-area support; clears the
       home-indicator area on notched phones without a new layout pattern. */
    inset-block-end: calc(var(--space-5) + env(safe-area-inset-bottom, 0px));
    inset-inline-end: var(--space-4);
    gap: var(--space-2);
  }

  .page-nav__button {
    inline-size: var(--space-10);
    block-size: var(--space-10);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .page-nav__button {
    transition:
      background-color 160ms ease,
      border-color 160ms ease,
      color 160ms ease;
  }
}

/* Website Images: replaced photos keep the design's 3:2 frame; added partner logos match the header row. */
.hero-illustration > img,
.partnership-visual img,
.route-hero__image img { aspect-ratio: 3 / 2; object-fit: cover; }
.site-header__partner-logo-link { display: block; flex: none; }
.site-header__partner-logo--extra { inline-size: auto; block-size: 2rem; max-inline-size: 4.4rem; }
@media (min-width: 70rem) {
  /* With extra logos, the partner row is slightly smaller so the full menu stays on one line. */
  .site-header__partner-logos:has(.site-header__partner-logo--extra) .site-header__partner-logo--cooperation { inline-size: 5.25rem; }
  .site-header__partner-logos:has(.site-header__partner-logo--extra) .site-header__partner-logo--catalyst { inline-size: 4.6rem; }
  .site-header__partner-logos:has(.site-header__partner-logo--extra) .site-header__partner-logo--bwf { inline-size: 4rem; margin-inline-start: var(--space-2); }
  /* The partner row moves under the INSPIRE WOMEN logo so the menu keeps its own full row. */
  .site-header__brands:has(.site-header__partner-logo--extra) { flex: 0 1 auto; flex-wrap: wrap; min-inline-size: 0; row-gap: var(--space-2); padding-block: var(--space-2); }
  .site-header__partner-logos:has(.site-header__partner-logo--extra) { flex-basis: 100%; padding-inline-start: 0; border-inline-start: 0; }
}
@media (max-width: 69.999rem) {
  .site-header__partner-logo--extra { block-size: clamp(1.5rem, 6.8vw, 2.6rem); max-inline-size: 4.8rem; }
  /* Extra logos move to a second row on narrow screens instead of widening the page. */
  .site-header__brands:has(.site-header__partner-logo--extra),
  .site-header__partner-logos:has(.site-header__partner-logo--extra) { flex: 1 1 auto; flex-wrap: wrap; min-inline-size: 0; row-gap: var(--space-2); }
}
@media (max-width: 23.5rem) {
  .site-header__partner-logo--extra { block-size: clamp(1.25rem, 6.2vw, 1.6rem); max-inline-size: 2.9rem; }
}