@font-face {
  font-family: "Source Serif 4";
  src: url("assets/fonts/SourceSerif4-VariableFont_opsz,wght.ttf") format("truetype");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto Flex";
  src: url("assets/fonts/RobotoFlex-VariableFont_GRAD,XOPQ,XTRA,YOPQ,YTAS,YTDE,YTFI,YTLC,opsz,slnt,wdth,wght.ttf") format("truetype");
  font-weight: 100 1000;
  font-style: normal;
  font-display: swap;
}

:root {
  --cream: #fcebda;
  --blue: #073570;
  --line-blue: #4d90f4;
  --border-blue: #7d9cbf;
  --coral: #e57a73;
  --sky: #cce8fb;
  --header-height: 122px;
  --page-pad: clamp(24px, 4.7vw, 98px);
  --discover-height: clamp(400px, 39.1vw, 750px);
}

* {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  background: var(--cream);
}

body {
  min-height: 100%;
  margin: 0;
  color: var(--blue);
  background: var(--cream);
  font-family: "Roboto Flex", Arial, sans-serif;
  border: 1px solid #d8d8d8;
}

.site-header {
  position: relative;
  display: grid;
  align-items: center;
  justify-items: center;
  min-height: var(--header-height);
  padding: 20px clamp(28px, 5vw, 100px);
  border-bottom: 2px solid var(--border-blue);
}

.logo-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.logo {
  display: block;
  width: clamp(170px, 13vw, 260px);
  height: auto;
  mix-blend-mode: multiply;
}

.menu-toggle {
  display: none;
}

.header-cta {
  position: absolute;
  right: clamp(28px, 5vw, 100px);
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: clamp(230px, 16.5vw, 338px);
  min-height: 67px;
  padding: 18px 30px;
  color: #fff;
  background: var(--coral);
  font-size: clamp(16px, 1vw, 20px);
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 0 0 rgba(229, 122, 115, 0);
  transition: background-color 220ms ease, box-shadow 220ms ease, filter 220ms ease, transform 220ms ease;
}

.header-cta:hover,
.header-cta:focus-visible {
  background: #ef8880;
  box-shadow: 0 16px 32px rgba(229, 122, 115, 0.28);
  filter: brightness(1.02);
  transform: translateY(-50%) translateY(-3px);
}

.header-cta:focus-visible,
.more-info-cta:focus-visible {
  outline: 3px solid rgba(77, 144, 244, 0.55);
  outline-offset: 4px;
}

.landing {
  overflow: hidden;
}

.scroll-reveal {
  opacity: 0;
  transform: translateY(34px);
  transition:
    opacity 760ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 760ms cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}

.scroll-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .scroll-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .header-cta,
  .more-info-cta {
    transition: none;
  }
}

.hero {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: clamp(68px, 7.1vw, 145px) var(--page-pad) clamp(90px, 8vw, 160px);
}

.shape {
  position: absolute;
  display: block;
  pointer-events: none;
  user-select: none;
  z-index: 2;
}

.shape-top {
  top: clamp(48px, 7vw, 102px);
  left: var(--page-pad);
  width: clamp(155px, 17vw, 325px);
  height: auto;
}

.hero-copy {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(245px, 30%) minmax(0, 1fr);
  column-gap: clamp(48px, 5.5vw, 106px);
  align-items: end;
  padding-left: clamp(260px, 27.4vw, 528px);
}

h1 {
  grid-column: 1 / -1;
  max-width: 1070px;
  margin: 0;
  color: var(--blue);
  font-family: "Source Serif 4", Georgia, serif;
  font-size: clamp(48px, 4.45vw, 86px);
  font-weight: 780;
  line-height: 1.08;
  letter-spacing: 0;
}

.intro-row {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(180px, 270px) minmax(360px, 822px);
  gap: clamp(38px, 3.5vw, 68px);
  align-items: center;
  margin-top: clamp(18px, 2.2vw, 42px);
}

.intro-rule {
  display: block;
  width: 100%;
  height: 4px;
  background: var(--line-blue);
}

.intro-row p {
  margin: 0;
  color: var(--blue);
  font-size: clamp(16px, 1vw, 19px);
  font-weight: 400;
  line-height: 1.21;
  letter-spacing: 0;
}

.video-stage {
  position: relative;
  z-index: 1;
  margin-top: clamp(72px, 5vw, 95px);
}

.video-mask {
  position: relative;
  width: 100%;
  aspect-ratio: 1746 / 565;
  overflow: hidden;
  background: #000;
  -webkit-mask-image: url("assets/images/Video-shape.svg");
  mask-image: url("assets/images/Video-shape.svg");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  clip-path: polygon(
    0 0,
    91.255% 0,
    100% 28.977%,
    100% 100%,
    5.383% 100%,
    5.383% 83.893%,
    0 83.893%
  );
}

.video-mask video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.video-corner-square {
  position: absolute;
  left: 5.383%;
  bottom: 16.107%;
  width: 5.383%;
  height: auto;
  z-index: 3;
  pointer-events: none;
  user-select: none;
}

.shape-bottom {
  right: 0;
  bottom: -0.25%;
  width: 15.292%;
}

.discover {
  display: grid;
  grid-template-columns: minmax(0, 58.5fr) minmax(0, 41.5fr);
  gap: clamp(20px, 2vw, 38px);
  align-items: start;
  width: 100%;
  min-height: 100vh;
  margin: 0;
  padding: clamp(48px, 5.85vw, 112px) clamp(46px, 4.5vw, 86px) clamp(50px, 4.9vw, 94px);
  overflow: hidden;
  color: var(--blue);
  background: #fff;
}

.discover-copy {
  display: flex;
  flex-direction: column;
  height: var(--discover-height);
  min-height: 0;
  padding-top: clamp(22px, 2.15vw, 42px);
}

.discover h2 {
  max-width: 12.8em;
  margin: 0;
  color: var(--blue);
  font-family: "Source Serif 4", Georgia, serif;
  font-size: clamp(35px, 3.06vw, 58.8px);
  font-weight: 780;
  line-height: 0.99;
  letter-spacing: 0;
}

.discover-intro {
  display: grid;
  grid-template-columns: minmax(98px, 9.8vw) minmax(0, 1fr);
  gap: clamp(20px, 2.05vw, 39px);
  align-items: center;
  max-width: 50.6vw;
  margin-top: clamp(22px, 2.2vw, 42px);
}

.discover-intro span {
  display: block;
  height: 3px;
  background: var(--blue);
  opacity: 0.82;
}

.discover-intro p {
  margin: 0;
  color: #285889;
  font-size: clamp(11.44px, 0.858vw, 16.5px);
  font-weight: 560;
  line-height: 1.22;
}

.discover h3 {
  margin: clamp(14px, 1.42vw, 27px) 0 clamp(15px, 1.27vw, 24px);
  color: #f2776e;
  font-family: "Source Serif 4", Georgia, serif;
  font-size: clamp(14.7px, 1.35vw, 25.8px);
  font-weight: 820;
  line-height: 1.1;
  letter-spacing: 0.2px;
}

.discover-body {
  max-width: 45.73vw;
  margin: 0;
  color: #285889;
  font-size: clamp(16.32px, 1.2vw, 23.04px);
  font-weight: 500;
  line-height: 1.22;
}

.discover-statement {
  display: flex;
  align-items: center;
  gap: clamp(17px, 1.75vw, 34px);
  margin-top: clamp(20px, 2.15vw, 41px);
}

.discover-statement img {
  width: clamp(48px, 4.2vw, 80px);
  height: auto;
  flex: 0 0 auto;
}

.discover-statement p {
  margin: 0;
  color: var(--blue);
  font-family: "Source Serif 4", Georgia, serif;
  font-size: clamp(15.8px, 1.42vw, 27.2px);
  font-weight: 500;
  line-height: 1.15;
}

.discover-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(40px, 3.95vw, 76px);
  margin-top: auto;
  padding: clamp(10px, 1.1vw, 21px) clamp(20px, 2.1vw, 40px);
  color: rgba(255, 255, 255, 0.78);
  background: #123d7d;
  font-family: "Source Serif 4", Georgia, serif;
  font-size: clamp(13px, 1.08vw, 20.7px);
  font-weight: 520;
  line-height: 1.16;
  text-align: center;
}

.discover-media {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(39px, 3.82vw, 73px);
  gap: clamp(21px, 2.05vw, 39px);
  justify-content: end;
  align-items: stretch;
  height: var(--discover-height);
}

.discover-image,
.discover-bar {
  display: block;
  height: 100%;
  min-height: 0;
  width: 100%;
  object-fit: cover;
}

.discover-image {
  aspect-ratio: 564 / 750;
}

.discover-bar {
  width: 100%;
}

@media (min-width: 1201px) {
  .discover {
    grid-template-columns: minmax(0, 58.5fr) minmax(0, 41.5fr);
    gap: clamp(22px, 2vw, 38px);
  }

  .discover-copy {
    height: var(--discover-height);
  }

  .discover h2 {
    max-width: 12.8em;
    font-size: clamp(43px, 3.06vw, 58.8px);
    font-weight: 780;
    line-height: 0.99;
  }

  .discover-intro {
    grid-template-columns: minmax(120px, 9.8vw) minmax(0, 1fr);
    gap: clamp(24px, 2.05vw, 39px);
    max-width: 50.6vw;
    margin-top: clamp(28px, 2.2vw, 42px);
  }

  .discover-intro span {
    height: 3px;
  }

  .discover-intro p {
    font-size: clamp(13.2px, 0.858vw, 16.5px);
    font-weight: 560;
    line-height: 1.22;
  }

  .discover h3 {
    margin: clamp(18px, 1.42vw, 27px) 0 clamp(18px, 1.27vw, 24px);
    font-size: clamp(18px, 1.35vw, 25.8px);
    font-weight: 820;
    line-height: 1.1;
    letter-spacing: 0.2px;
  }

  .discover-body {
    max-width: 45.73vw;
    font-size: clamp(19.2px, 1.2vw, 23.04px);
    font-weight: 500;
    line-height: 1.22;
  }

  .discover-statement {
    gap: clamp(24px, 1.75vw, 34px);
    margin-top: clamp(26px, 2.15vw, 41px);
  }

  .discover-statement img {
    width: clamp(58px, 4.2vw, 80px);
  }

  .discover-statement p {
    font-size: clamp(19px, 1.42vw, 27.2px);
    font-weight: 500;
    line-height: 1.15;
  }

  .discover-banner {
    min-height: clamp(54px, 3.95vw, 76px);
    padding: clamp(14px, 1.1vw, 21px) clamp(28px, 2.1vw, 40px);
    font-size: clamp(15px, 1.08vw, 20.7px);
    font-weight: 520;
    line-height: 1.16;
  }

  .discover-media {
    grid-template-columns: minmax(0, 1fr) clamp(46px, 3.82vw, 73px);
    gap: clamp(24px, 2.05vw, 39px);
    height: var(--discover-height);
  }

  .discover-image,
  .discover-bar {
    height: 100%;
  }

  .discover-image {
    width: 100%;
  }

  .discover-bar {
    width: 100%;
  }
}

.story-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: clamp(420px, 47.5vw, 912px);
  padding: clamp(44px, 4.55vw, 88px) clamp(26px, 4.7vw, 90px) clamp(52px, 5.2vw, 100px);
  color: var(--blue);
  background: var(--sky);
}

.story-info h2 {
  margin: 0;
  color: var(--blue);
  font-family: "Source Serif 4", Georgia, serif;
  font-size: clamp(25px, 2.55vw, 49px);
  font-weight: 760;
  line-height: 1.08;
  text-align: center;
}

.story-info-items {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(100%, 1715px);
  margin-top: clamp(28px, 3.05vw, 58px);
}

.story-info-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, auto) clamp(46px, 4.1vw, 79px);
  align-items: center;
  justify-content: center;
  gap: clamp(22px, 2.1vw, 40px);
  min-width: 0;
  aspect-ratio: 1;
  margin-right: calc(clamp(0px, 2.05vw, 39px) * -1);
  border: 2px solid rgba(60, 161, 213, 0.42);
  border-radius: 50%;
}

.story-info-card:last-child {
  margin-right: 0;
}

.story-info-text {
  transform: translate(clamp(-8px, -0.45vw, 0px), clamp(-9px, -0.46vw, -5px));
}

.story-info-text p,
.story-info-text strong {
  display: block;
  margin: 0;
}

.story-info-text p {
  color: #265d8e;
  font-size: clamp(13px, 1.02vw, 19.5px);
  font-weight: 650;
  line-height: 1.1;
}

.story-info-text strong {
  margin-top: clamp(7px, 0.58vw, 11px);
  color: #e57a73;
  font-family: "Source Serif 4", Georgia, serif;
  font-size: clamp(19px, 1.72vw, 33px);
  font-weight: 760;
  line-height: 1.06;
}

.story-info-mark {
  position: relative;
  display: block;
  width: clamp(42px, 3.75vw, 72px);
  aspect-ratio: 1;
  transform: translateY(clamp(-60px, -3.7vw, -38px));
}

.story-info-mark::before,
.story-info-mark::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  background: #164b7b;
}

.story-info-mark::before {
  width: 2px;
  height: 100%;
}

.story-info-mark::after {
  width: 100%;
  height: 2px;
}

.story-info-mark {
  background: linear-gradient(135deg, transparent 49%, #164b7b 49% 52%, transparent 52%);
}

.more-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: clamp(278px, 26.95vw, 518px);
  padding: clamp(48px, 5vw, 96px) clamp(42px, 4.2vw, 80px) clamp(32px, 3vw, 58px);
  color: var(--blue);
  background: #fff;
  text-align: center;
}

.more-info-heading h2,
.more-info-heading p,
.more-info-body {
  margin: 0;
}

.more-info-heading h2 {
  color: var(--blue);
  font-family: "Source Serif 4", Georgia, serif;
  font-size: clamp(28px, 2.95vw, 56px);
  font-weight: 760;
  line-height: 1.05;
}

.more-info-heading p {
  margin-top: clamp(5px, 0.42vw, 8px);
  color: #e57a73;
  font-size: clamp(16px, 1.58vw, 30px);
  font-weight: 500;
  line-height: 1.1;
}

.more-info-rule {
  display: block;
  width: 100%;
  height: 3px;
  margin-top: clamp(24px, 2.25vw, 43px);
  background: #0f416d;
}

.more-info-body {
  margin-top: clamp(27px, 2.6vw, 50px);
  color: #163d66;
  font-size: clamp(13px, 1vw, 19px);
  font-weight: 560;
  line-height: 1.16;
}

.more-info-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: clamp(170px, 16.7vw, 320px);
  min-height: clamp(40px, 3.95vw, 76px);
  margin-top: clamp(21px, 2vw, 39px);
  padding: 12px 28px;
  color: rgba(255, 255, 255, 0.86);
  background: #009cf6;
  font-size: clamp(11px, 0.86vw, 16.5px);
  font-weight: 640;
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 0 0 rgba(0, 156, 246, 0);
  transition: background-color 220ms ease, box-shadow 220ms ease, filter 220ms ease, transform 220ms ease;
}

.more-info-cta:hover,
.more-info-cta:focus-visible {
  background: #12a8ff;
  box-shadow: 0 16px 30px rgba(0, 156, 246, 0.28);
  filter: brightness(1.02);
  transform: translateY(-3px);
}

.site-footer {
  color: #d8e0eb;
  background: #0b2b50;
  font-family: "Roboto Flex", Arial, sans-serif;
}

.footer-funders {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr 1fr 1.55fr;
  align-items: center;
  gap: clamp(40px, 6vw, 112px);
  min-height: 128px;
  padding: 22px clamp(48px, 6.2vw, 128px) 18px;
  color: #24447f;
  background: #fff;
}

.funder {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  min-width: 0;
}

.funder p {
  margin: 0;
}

.funder-ministry {
  flex-direction: column;
  gap: 10px;
  text-align: center;
}

.emblem {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  color: #24447f;
  border: 1px solid #24447f;
  border-radius: 50%;
  font-size: 17px;
  line-height: 1;
}

.funder-ministry p {
  font-size: 10px;
  font-weight: 430;
  letter-spacing: 1.5px;
  line-height: 1.28;
}

.funder-ministry span {
  display: block;
}

.funder-society {
  flex-direction: column;
  gap: 8px;
  color: #4b9eb6;
  text-align: center;
}

.society-mark {
  width: 37px;
  height: 37px;
  background:
    radial-gradient(circle, currentColor 37%, transparent 39%) 0 0 / 9px 9px,
    radial-gradient(circle, currentColor 37%, transparent 39%) 4.5px 4.5px / 9px 9px;
  clip-path: polygon(0 0, 92% 0, 92% 78%, 65% 78%, 65% 100%, 0 100%);
}

.funder-society p {
  font-size: 8px;
  font-weight: 650;
  line-height: 0.95;
  letter-spacing: 0.5px;
}

.funder-greece p {
  text-align: center;
}

.funder-greece strong {
  display: block;
  color: #254883;
  font-size: 24px;
  font-weight: 720;
  line-height: 0.9;
  letter-spacing: 0;
}

.funder-greece strong span {
  color: #9fbd4f;
}

.funder-greece small {
  display: block;
  margin-top: 3px;
  color: #254883;
  font-size: 5px;
  font-weight: 650;
  line-height: 0.95;
}

.funder-eu {
  justify-content: flex-start;
  gap: 14px;
}

.eu-flag {
  position: relative;
  flex: 0 0 auto;
  width: 68px;
  height: 46px;
  background: #244f9e;
  border: 1px solid #e3e3e3;
}

.eu-flag span {
  position: absolute;
  left: 50%;
  top: 50%;
  color: #ffe100;
  font-size: 5px;
  transform-origin: 0 0;
}

.eu-flag span:nth-child(1) { transform: rotate(0deg) translate(0, -15px); }
.eu-flag span:nth-child(2) { transform: rotate(30deg) translate(0, -15px); }
.eu-flag span:nth-child(3) { transform: rotate(60deg) translate(0, -15px); }
.eu-flag span:nth-child(4) { transform: rotate(90deg) translate(0, -15px); }
.eu-flag span:nth-child(5) { transform: rotate(120deg) translate(0, -15px); }
.eu-flag span:nth-child(6) { transform: rotate(150deg) translate(0, -15px); }
.eu-flag span:nth-child(7) { transform: rotate(180deg) translate(0, -15px); }
.eu-flag span:nth-child(8) { transform: rotate(210deg) translate(0, -15px); }
.eu-flag span:nth-child(9) { transform: rotate(240deg) translate(0, -15px); }
.eu-flag span:nth-child(10) { transform: rotate(270deg) translate(0, -15px); }
.eu-flag span:nth-child(11) { transform: rotate(300deg) translate(0, -15px); }
.eu-flag span:nth-child(12) { transform: rotate(330deg) translate(0, -15px); }

.funder-eu p {
  color: #24447f;
  line-height: 1.02;
}

.funder-eu strong {
  display: block;
  font-size: 14px;
  font-weight: 680;
}

.funder-eu p span {
  display: block;
  margin-top: 4px;
  color: #4d4d4d;
  font-size: 12px;
  font-weight: 360;
}

.footer-main {
  padding: 82px clamp(48px, 4.7vw, 96px) 28px;
  background: #0b2b50;
}

.footer-content {
  display: grid;
  grid-template-columns: minmax(360px, 580px) minmax(260px, 1fr);
  gap: clamp(80px, 17vw, 340px);
  align-items: start;
}

.footer-about-toggle {
  display: none;
}

.footer-about h2 {
  margin: 0 0 16px;
  color: #edf3fb;
  font-family: "Source Serif 4", Georgia, serif;
  font-size: 26px;
  font-weight: 430;
  line-height: 1.1;
}

.footer-about p {
  max-width: 590px;
  margin: 0;
  color: rgba(216, 224, 235, 0.68);
  font-size: 17px;
  font-weight: 330;
  line-height: 1.55;
}

.footer-about strong {
  display: block;
  margin-top: 28px;
  color: #edf3fb;
  font-size: 15px;
  font-weight: 520;
}

.social-links {
  display: flex;
  gap: 28px;
  align-items: center;
  margin: 48px 0 0;
  padding: 0;
  list-style: none;
}

.social-links a {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  color: #fff;
  text-decoration: none;
  transition: color 180ms ease, transform 180ms ease;
}

.social-links a:hover,
.social-links a:focus-visible {
  color: #edf3fb;
  transform: translateY(-2px);
}

.social-links svg {
  display: block;
  width: 24px;
  height: 24px;
  fill: currentColor;
}

.footer-nav {
  display: grid;
  gap: 16px;
  justify-self: end;
  padding-top: 46px;
  min-width: 292px;
}

.footer-nav-toggle {
  display: none;
}

.footer-nav a,
.legal-links a {
  color: rgba(216, 224, 235, 0.62);
  font-size: 16px;
  font-weight: 330;
  line-height: 1.2;
  text-decoration: none;
}

.footer-nav a:hover,
.legal-links a:hover {
  color: #fff;
}

.footer-bottom {
  margin-top: 46px;
  padding-top: 38px;
  border-top: 1px solid rgba(216, 224, 235, 0.2);
}

.footer-logos {
  display: flex;
  align-items: center;
  gap: 28px;
  margin-bottom: 20px;
}

.footer-logo-strip {
  display: block;
  width: min(100%, 690px);
  height: auto;
}

.footer-craft-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-family: "Source Serif 4", Georgia, serif;
  font-size: 17px;
  font-weight: 520;
  line-height: 0.95;
}

.craft-mark {
  width: 42px;
  height: 42px;
  background:
    linear-gradient(45deg, transparent 42%, currentColor 43% 48%, transparent 49% 51%, currentColor 52% 57%, transparent 58%),
    linear-gradient(-45deg, transparent 42%, currentColor 43% 48%, transparent 49% 51%, currentColor 52% 57%, transparent 58%);
}

.mini-ministry {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0.4px;
}

.mini-emblem {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 22px;
}

.footer-legal {
  display: grid;
  grid-template-columns: minmax(360px, 1fr) auto;
  gap: 32px;
  align-items: end;
}

.footer-legal p {
  margin: 0;
  color: rgba(216, 224, 235, 0.62);
  font-size: 14px;
  font-weight: 330;
}

.legal-links {
  display: flex;
  gap: 26px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.legal-links a {
  font-size: 14px;
}

@media (max-width: 1100px) {
  :root {
    --header-height: 106px;
    --page-pad: clamp(28px, 5vw, 56px);
  }

  .site-header {
    justify-items: start;
  }

  .logo {
    width: 185px;
  }

  .header-cta {
    min-width: 210px;
    min-height: 58px;
    padding: 15px 22px;
  }

  .hero-copy {
    grid-template-columns: 1fr;
    padding-left: clamp(180px, 27vw, 290px);
  }

  h1 {
    max-width: 820px;
    font-size: clamp(58px, 7.4vw, 78px);
  }

  .intro-row {
    grid-template-columns: minmax(120px, 180px) minmax(0, 1fr);
    max-width: 760px;
  }

  .discover {
    grid-template-columns: 1fr;
    gap: 54px;
    min-height: auto;
    overflow: visible;
  }

  .discover-copy {
    padding-top: 0;
    height: auto;
  }

  .discover h2 {
    max-width: 820px;
    font-size: clamp(32.5px, 4.55vw, 49.4px);
  }

  .discover-media {
    grid-template-columns: minmax(0, 1fr) 64px;
    justify-content: stretch;
    height: auto;
  }

  .discover-image,
  .discover-bar {
    height: auto;
    min-height: 0;
  }

  .discover-image {
    width: 100%;
  }

  .discover-bar {
    width: 64px;
  }

  .footer-funders {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 42px 56px;
  }

  .footer-content {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .footer-nav {
    justify-self: start;
    padding-top: 0;
  }

  .footer-legal {
    grid-template-columns: 1fr;
  }

  .legal-links {
    justify-content: flex-start;
  }
}

@media (min-width: 900px) and (max-width: 1200px) {
  .discover {
    grid-template-columns: minmax(0, 58.5fr) minmax(0, 41.5fr);
    gap: clamp(20px, 2vw, 24px);
  }

  .discover-copy {
    height: var(--discover-height);
    padding-top: clamp(20px, 2.15vw, 26px);
  }

  .discover h2 {
    max-width: 12.8em;
    font-size: clamp(34px, 3.6vw, 39px);
    line-height: 0.99;
  }

  .discover-intro {
    grid-template-columns: minmax(98px, 9.8vw) minmax(0, 1fr);
    gap: clamp(18px, 2.05vw, 24px);
    max-width: none;
    margin-top: clamp(22px, 2.2vw, 27px);
  }

  .discover h3 {
    margin: clamp(14px, 1.42vw, 17px) 0 clamp(15px, 1.27vw, 18px);
    font-size: clamp(14.7px, 1.6vw, 17px);
  }

  .discover-body {
    max-width: none;
  }

  .discover-statement {
    margin-top: clamp(20px, 2.15vw, 26px);
  }

  .discover-statement img {
    width: clamp(48px, 4.2vw, 54px);
  }

  .discover-statement p {
    font-size: clamp(15.8px, 1.65vw, 18px);
  }

  .discover-banner {
    min-height: clamp(40px, 3.95vw, 48px);
  }

  .discover-media {
    grid-template-columns: minmax(0, 1fr) clamp(38px, 3.82vw, 46px);
    gap: clamp(18px, 2.05vw, 24px);
    height: var(--discover-height);
    justify-content: end;
  }

  .discover-image,
  .discover-bar {
    height: 100%;
  }

  .discover-bar {
    width: 100%;
  }

  .story-info-card {
    border-width: 1.5px;
    gap: clamp(16px, 1.8vw, 22px);
  }
}

@media (max-width: 760px) {
  :root {
    --page-pad: 20px;
  }

  body {
    border: 0;
  }

  .site-header {
    grid-template-columns: 44px 1fr 44px;
    justify-items: center;
    gap: 10px;
    min-height: 86px;
    padding: 16px 20px;
  }

  .logo-link {
    grid-column: 2;
  }

  .menu-toggle {
    grid-column: 3;
    display: inline-grid;
    align-content: center;
    justify-content: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    color: var(--blue);
    background: transparent;
    border: 0;
    cursor: pointer;
  }

  .menu-toggle span {
    display: block;
    width: 25px;
    height: 2px;
    background: currentColor;
    transition: opacity 180ms ease, transform 180ms ease;
  }

  .site-header.is-menu-open .menu-toggle span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }

  .site-header.is-menu-open .menu-toggle span:nth-child(2) {
    opacity: 0;
  }

  .site-header.is-menu-open .menu-toggle span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  .header-cta {
    position: absolute;
    left: 20px;
    right: 20px;
    top: calc(100% + 10px);
    transform: none;
    z-index: 20;
    display: none;
    width: auto;
    min-height: 50px;
    min-width: 0;
    font-size: 15px;
    box-shadow: 0 16px 32px rgba(7, 53, 112, 0.18);
    transition: background-color 220ms ease, box-shadow 220ms ease, filter 220ms ease, transform 180ms ease;
  }

  .site-header.is-menu-open .header-cta {
    display: inline-flex;
    transform: translateY(0);
  }

  .header-cta:hover,
  .header-cta:focus-visible {
    transform: translateY(-2px);
  }

  .hero {
    padding: 42px var(--page-pad) 86px;
  }

  .shape-top {
    position: relative;
    top: auto;
    left: auto;
    width: min(214px, 58vw);
    margin: 0 auto 28px;
  }

  .hero-copy {
    padding-left: 0;
    justify-items: center;
    text-align: center;
  }

  h1 {
    max-width: min(100%, 12.8ch);
    font-size: clamp(38px, 10.8vw, 52px);
    line-height: 1.06;
  }

  .intro-row {
    grid-template-columns: minmax(96px, 145px) 1fr;
    gap: 20px;
    margin-top: 24px;
  }

  .intro-row p {
    font-size: 17.25px;
    line-height: 1.24;
  }

  .video-stage {
    margin-top: 44px;
    width: min(100%, 360px);
    margin-left: auto;
    margin-right: auto;
  }

  .video-mask {
    aspect-ratio: 4 / 5;
    -webkit-mask-image: none;
    mask-image: none;
    clip-path: polygon(
      0 0,
      84% 0,
      100% 12%,
      100% 100%,
      9% 100%,
      9% 90%,
      0 90%
    );
  }

  .video-corner-square {
    left: 9%;
    bottom: 10%;
    width: 9%;
  }

  .shape-bottom {
    width: 24%;
  }

  .discover {
    gap: 36px;
    padding: 48px 20px 58px;
  }

  .discover h2 {
    font-size: clamp(23.4px, 5.85vw, 33.8px);
    line-height: 1.08;
    text-align: center;
  }

  .discover-intro {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 16px;
    width: 100%;
    max-width: 100%;
    margin-top: 32px;
    text-align: center;
  }

  .discover-intro p,
  .discover-body {
    line-height: 1.28;
  }

  .discover-intro p {
    width: 100%;
    font-size: 14.47px;
  }

  .discover-body {
    max-width: 100%;
    font-size: clamp(16.8px, 4.55vw, 19.14px);
  }

  .discover h3 {
    margin: 26px 0 22px;
    font-size: 17.16px;
  }

  .discover-statement {
    gap: 16px;
  }

  .discover-statement p {
    font-size: 17.55px;
  }

  .discover-banner {
    min-height: 70px;
    margin-top: 34px;
    font-size: 14.3px;
  }

  .discover-media {
    --discover-mobile-gap: 18px;
    --discover-mobile-bar: 42px;
    grid-template-columns: minmax(0, 1fr) 42px;
    gap: var(--discover-mobile-gap);
    align-items: stretch;
    width: min(100%, 340px);
    height: calc((min(100vw - 40px, 340px) - var(--discover-mobile-gap) - var(--discover-mobile-bar)) * 750 / 564);
    margin-inline: auto;
  }

  .discover-image {
    height: 100%;
    align-self: stretch;
    object-fit: cover;
  }

  .discover-bar {
    width: 42px;
    height: 100%;
    align-self: stretch;
    object-fit: fill;
  }

  .story-info {
    min-height: 0;
    padding: 46px 20px 58px;
  }

  .story-info h2 {
    max-width: 13em;
    font-size: clamp(24px, 7vw, 36px);
  }

  .story-info-items {
    grid-template-columns: 1fr;
    justify-items: center;
    width: 100%;
    margin-top: 34px;
  }

  .story-info-card {
    grid-template-columns: minmax(0, auto) 52px;
    gap: 22px;
    width: min(100%, 320px);
    margin-right: 0;
    margin-bottom: -28px;
  }

  .story-info-card:last-child {
    margin-bottom: 0;
  }

  .story-info-text p {
    font-size: 15px;
  }

  .story-info-text strong {
    font-size: 24px;
  }

  .story-info-mark {
    width: 52px;
    transform: none;
  }

  .more-info {
    min-height: 0;
    padding: 44px 20px 48px;
  }

  .more-info-heading h2 {
    font-size: clamp(27px, 8vw, 38px);
  }

  .more-info-heading p {
    font-size: clamp(17px, 5.2vw, 24px);
  }

  .more-info-rule {
    margin-top: 24px;
  }

  .more-info-body {
    margin-top: 26px;
    font-size: 14px;
    line-height: 1.3;
  }

  .more-info-body br {
    display: none;
  }

  .more-info-cta {
    min-width: min(100%, 230px);
    min-height: 46px;
    font-size: 13px;
  }

  .footer-funders {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 20px;
    min-height: auto;
    padding: 34px 20px;
  }

  .funder {
    min-width: 0;
  }

  .funder-eu {
    justify-content: center;
  }

  .footer-main {
    padding: 52px 24px 28px;
  }

  .footer-content {
    gap: 38px;
  }

  .footer-about {
    display: grid;
    justify-items: center;
    text-align: center;
  }

  .footer-about-toggle,
  .footer-nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    justify-self: center;
    margin: 0;
    padding: 0;
    color: #edf3fb;
    background: transparent;
    border: 0;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
  }

  .footer-about-toggle span,
  .footer-nav-toggle span {
    width: 9px;
    height: 9px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
    transition: transform 180ms ease;
  }

  .site-footer.is-footer-about-open .footer-about-toggle span,
  .site-footer.is-footer-nav-open .footer-nav-toggle span {
    transform: translateY(2px) rotate(225deg);
  }

  .footer-about h2 {
    display: none;
  }

  .footer-about-panel {
    display: none;
    justify-items: center;
    text-align: center;
  }

  .site-footer.is-footer-about-open .footer-about-panel {
    display: grid;
  }

  .footer-about p {
    max-width: 100%;
    font-size: 15px;
    line-height: 1.5;
  }

  .footer-about strong {
    margin-top: 24px;
  }

  .social-links {
    justify-content: center;
    margin-top: 34px;
  }

  .footer-nav {
    display: none;
    justify-self: center;
    justify-items: center;
    min-width: 0;
    padding-top: 0;
    text-align: center;
  }

  .site-footer.is-footer-nav-open .footer-nav {
    display: grid;
  }

  .footer-nav a {
    font-size: 15px;
  }

  .footer-logos {
    justify-content: center;
    flex-wrap: wrap;
    text-align: center;
  }

  .footer-craft-logo,
  .mini-ministry {
    justify-content: center;
    text-align: center;
  }

  .footer-legal {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 20px;
    text-align: center;
  }

  .legal-links {
    justify-content: center;
    gap: 14px 20px;
    text-align: center;
  }
}

@media (max-width: 520px) {
  .logo {
    width: 168px;
  }

  .intro-row {
    grid-template-columns: 1fr;
  }

  .intro-rule {
    width: 132px;
  }

  .video-stage {
    width: min(100%, 330px);
    margin-left: auto;
    margin-right: auto;
  }

  .discover-intro {
    grid-template-columns: 1fr;
  }

  .discover-intro span {
    width: 132px;
  }

  .discover-statement {
    align-items: flex-start;
  }

  .discover-banner {
    justify-content: flex-start;
    text-align: left;
  }

  .discover-media {
    --discover-mobile-gap: 12px;
    --discover-mobile-bar: 28px;
    grid-template-columns: minmax(0, 1fr) var(--discover-mobile-bar);
    gap: var(--discover-mobile-gap);
    width: min(100%, 320px);
    height: calc((min(100vw - 40px, 320px) - var(--discover-mobile-gap) - var(--discover-mobile-bar)) * 750 / 564);
  }

  .discover-bar {
    display: block;
    width: 28px;
    height: 100%;
    align-self: stretch;
    object-fit: fill;
  }

  .story-info-card {
    width: min(100%, 292px);
    margin-bottom: -24px;
  }

  .story-info-text {
    transform: none;
  }

  .story-info-text strong {
    font-size: 21px;
  }

  .story-info-mark {
    width: 44px;
  }

  .funder-eu {
    flex-direction: column;
    text-align: center;
  }

  .funder-eu strong {
    font-size: 16px;
  }

  .funder-eu p span {
    font-size: 14px;
  }

  .footer-legal p,
  .legal-links a {
    font-size: 14px;
  }
}

@media (max-width: 390px) {
  .shape-top {
    width: min(190px, 56vw);
  }

  h1 {
    font-size: clamp(34px, 10.4vw, 40px);
  }

  .intro-row p {
    font-size: 16.1px;
  }
}