h1,
h2,
h3,
h4,
h5,
p {
  margin: 0;
}

h1 {
  font-size: 1.5em;
  font-weight: 400;
  line-height: 1.1;
}

h2,
h3 {
  font-size: 1.25em;
  font-weight: inherit;
  line-height: 1.5;
}
@media (width >= 1024px) {
  h2,
  h3 {
    font-size: 1.5em;
  }
}

h4 {
  text-transform: uppercase;
}

.content-text {
  display: grid;
  gap: 0.75em;
}

blockquote {
  margin: 0;
  font-size: 1.75em;
  line-height: 1.25;
}
@media (width >= 1024px) {
  blockquote {
    font-size: 3em;
    font-weight: 200;
    line-height: 1.2;
  }
}

.content-text-small-quote blockquote {
  font-size: 1.5em;
  font-weight: 350;
}
@media (width >= 1024px) {
  .content-text-small-quote blockquote {
    font-size: 2em;
  }
}

strong {
  font-weight: 600;
}

.button {
  background: hsl(0, 0%, 10%);
  border-radius: var(--border-radius);
  box-shadow: inset 0 0 0 0.125em;
  color: hsl(var(--background));
  display: grid;
  height: 3em;
  padding: 0 1.5em;
}
.button span,
.button strong,
.button b {
  margin: auto;
  font-weight: 600;
}
.button:hover {
  background: hsl(0, 0%, 20%);
}
.button:active {
  transform: translateY(1px);
}

:root {
  --text: 0 0% 20%;
  --background: 0 0% 100%;
  --max-width: calc(100vw - 9em);
  --border-radius: .5em;
  --gap: 4.5em;
  --blue: 233 100% 65%;
}

* {
  box-sizing: border-box;
}

html:not(.no-snap),
body:not(.no-snap) {
  height: 100%;
  scroll-snap-type: y mandatory;
  overflow: overlay;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

nav,
section {
  scroll-snap-align: center;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-tap-highlight-color: transparent;
}

body {
  background-color: hsl(var(--background));
  color: hsl(var(--text));
  font: 4.8vw/1.5 "Open Sans", sans-serif, system-ui;
  margin: 0;
  scroll-behavior: smooth;
}
body::-webkit-scrollbar {
  display: none;
}
@media (width >= 1024px) {
  body {
    font-size: 1.5625vw;
    font-size: calc(0.78125vw + 0.5em);
  }
}

figure {
  margin: 0;
}
figure img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

img {
  max-width: 100%;
}

img,
svg {
  display: block;
  margin: 0;
}

a {
  color: currentColor;
  text-decoration: none;
}

section {
  display: grid;
}

.navigation {
  position: relative;
  z-index: 999;
}
@media (width < 1024px) {
  .navigation:has(input:checked) .menu {
    opacity: 1;
    visibility: visible;
    z-index: 100;
  }
  .navigation:has(input:checked) .menu-toggle svg:nth-child(1),
  .navigation:has(input:checked) .menu-toggle img:nth-child(1) {
    display: none;
  }
  .navigation:has(input:checked) .menu-toggle svg:nth-child(2),
  .navigation:has(input:checked) .menu-toggle img:nth-child(2) {
    display: block;
  }
}
.navigation ul {
  display: flex;
  gap: 1.5em;
  list-style: none;
  margin: 0;
  padding: 0;
}
.navigation ul a {
  color: hsl(var(--blue));
  display: block;
  font-weight: 500;
  line-height: 1.4 !important;
}
.navigation .lang {
  justify-self: end;
  flex: 0 0 3em;
  z-index: 111;
}
.navigation .lang li:not(.active) {
  display: none;
}
.navigation .lang a {
  background: hsl(0, 0%, 96%);
  border-radius: var(--border-radius);
  display: grid;
  line-height: 3em;
  text-align: center;
  width: 3em;
}
.navigation .menu-toggle {
  background: hsl(0, 0%, 96%);
  border-radius: var(--border-radius);
  color: hsl(var(--blue));
  display: grid;
  flex: 0 0 3em;
  font-weight: 500;
  line-height: 1.6;
  height: 3em;
  z-index: 111;
}
.navigation .menu-toggle input {
  display: none;
}
.navigation .menu-toggle label {
  display: grid;
}
.navigation .menu-toggle label svg,
.navigation .menu-toggle label img {
  grid-column: 1;
  grid-row: 1;
}
.navigation .menu-toggle label svg:nth-child(2),
.navigation .menu-toggle label img:nth-child(2) {
  display: none;
}
.navigation .menu-toggle svg,
.navigation .menu-toggle img {
  fill: currentColor;
  margin: auto;
  height: 1.5em;
  pointer-events: none;
  width: 1.5em;
}
@media (width < 1024px) {
  .navigation {
    align-items: center;
    display: flex;
    gap: 0.25em;
    padding: 0.5em 0.5em 0.5em 0.5em;
    position: sticky;
    top: 0;
  }
  .navigation .logo {
    align-content: center;
    background-color: hsl(var(--blue));
    border-radius: var(--border-radius);
    padding-left: 0.75em;
    height: 3em;
    flex: auto;
    margin-right: auto;
    z-index: 111;
  }
  .navigation .logo img {
    aspect-ratio: 300/66;
    height: 1.5em;
  }
  .navigation .logo .square {
    display: none;
  }
  .navigation .menu {
    align-items: end;
    align-content: end;
    background: white;
    display: grid;
    gap: 0;
    opacity: 0;
    padding: 1.5em;
    position: fixed;
    top: 0;
    left: 0;
    height: 100dvh;
    visibility: hidden;
    transition: all 300ms;
    width: 100%;
    z-index: -100;
  }
  .navigation .menu a {
    font-size: 1.5em;
    line-height: 2;
  }
}
@media (width >= 1024px) {
  .navigation {
    align-items: start;
    display: grid;
    grid-template-columns: var(--gap) 1fr var(--gap) 1fr var(--gap) 1fr var(--gap);
    grid-template-areas: "logo logo . menu menu menu lang";
    padding: 0 var(--gap);
  }
  .navigation .logo {
    background-color: hsl(var(--blue));
    display: grid;
    grid-area: logo;
    padding: 3.5em 3.5em 0;
  }
  .navigation .logo .stripe {
    display: none;
  }
  .navigation ul {
    padding-top: 3.5em;
  }
  .navigation .menu {
    grid-area: menu;
  }
  .navigation .lang {
    grid-area: lang;
  }
  .navigation .menu-toggle {
    display: none;
  }
}

.page {
  display: grid;
}
@media (width >= 1024px) {
  .page {
    row-gap: 3em;
  }
}

.article-body .block,
.page-body .block {
  padding: 1em;
}
@media (width >= 1024px) {
  .article-body .block,
  .page-body .block {
    gap: 0 var(--gap);
    grid-template-columns: repeat(6, 1fr);
    padding: 0 var(--gap);
  }
  .article-body .block > *,
  .page-body .block > * {
    grid-column: 2/span 4;
  }
}
.article-body .publication-info,
.page-body .publication-info {
  display: grid;
  row-gap: 0.25em;
}
.article-body .publication-info input,
.page-body .publication-info input {
  apperance: none;
  background: #eee;
  border: 0;
  display: block;
  font: inherit;
  line-height: 3;
  padding: 0 1em;
}
.article-body .publication-info input:focus-visible,
.page-body .publication-info input:focus-visible {
  background: white;
}

.section-light .block {
  align-items: end;
  padding: 1.5em;
}
.section-light .block-background {
  background-color: hsl(0, 0%, 96%);
}
.section-light .icon {
  margin-bottom: calc(var(--gap) / 4);
}
@media (width < 1024px) {
  .section-light {
    min-height: 100dvh;
    padding: 4em 0 0.5em;
  }
  .section-light .block {
    align-content: end;
    gap: 1.5em 0;
  }
}
@media (width >= 1024px) {
  .section-light .block {
    padding: var(--gap);
  }
  .section-light .icon {
    margin-bottom: calc(var(--gap) / 2);
  }
}
.section-summary h2 {
  background: linear-gradient(45deg, #8e4dff, #4d8eff);
  font-weight: 400;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.section-summary .block {
  align-items: end;
  gap: 1em;
  padding: calc(var(--gap) / 2) var(--gap);
}
@media (width < 1024px) {
  .section-summary {
    min-height: 100dvh;
    padding: 4.5em 0 1.5em;
  }
  .section-summary .block {
    align-content: end;
    padding: 0 1em;
    min-height: calc(100dvh - 8em);
  }
}
@media (width >= 1024px) {
  .section-summary .block {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: calc(var(--gap) / 2) var(--gap);
  }
  .section-summary .block-header {
    grid-column: 1/span 3;
  }
  .section-summary .block-content {
    grid-column: 1/span 2;
    grid-row: 2;
  }
  .section-summary h2 {
    font-size: 3em;
    font-weight: 200;
    line-height: 1.2;
  }
}
.section-intro {
  scroll-snap-align: end;
}
.section-intro .slogan {
  align-self: stretch;
}
@media (width < 1024px) {
  .section-intro {
    min-height: calc(100dvh - 4.5em);
  }
  .section-intro .block {
    align-content: space-between;
    gap: 1em;
    padding: 1em;
  }
  .section-intro .slogan h1 {
    font-size: 0.875em;
    font-weight: 600;
    text-transform: uppercase;
  }
  .section-intro .content-text h1 {
    background: linear-gradient(45deg, #8e4dff, #4d8eff);
    font-weight: 400;
    font-size: 1.75em;
    line-height: 1.25;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .section-intro .content-text p {
    font-size: 1.125em;
  }
}
@media (width >= 1024px) {
  .section-intro .block {
    align-content: end;
    align-items: end;
    display: grid;
    grid-template-columns: var(--gap) 1fr var(--gap) 1fr var(--gap) 1fr var(--gap);
    grid-template-areas: "slogan slogan . text text text .";
  }
  .section-intro .block .slogan {
    align-items: end;
    background-color: hsl(var(--blue));
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    color: white;
    display: grid;
    grid-area: slogan;
    padding: 3em 0;
  }
  .section-intro .block .slogan h1 {
    text-align: center;
  }
  .section-intro .block .content-text {
    grid-area: text;
    margin-top: -3.5em;
  }
  .section-intro .block .content-text h1 {
    font-size: 3em;
    font-weight: 200;
    line-height: 1.2;
  }
  .section-intro .block .content-text p {
    font-size: 1.25em;
  }
}
.section-footer .block {
  padding: var(--gap);
}
.section-footer h4 {
  font-size: 0.875em;
  font-weight: 400;
  color: hsl(var(--blue));
}
.section-footer .social .links {
  display: flex;
  gap: 0.5em;
}
.section-footer .social svg {
  aspect-ratio: 1;
  display: block;
  flex: 0 0 2.5em;
  fill: currentColor;
  height: 2.5em;
  width: 2.5em;
}
@media (width < 1024px) {
  .section-footer .block {
    display: flex;
    gap: 1.5em;
    flex-direction: column;
    padding: 1em;
  }
  .section-footer .content-text {
    gap: 0.25em;
  }
}
@media (width >= 1024px) {
  .section-footer .block {
    display: flex;
  }
  .section-footer .block > * {
    flex: 1;
  }
}
.section-goals h3 {
  color: hsl(var(--blue));
  padding-right: 1em;
}
@media (width < 1024px) {
  .section-goals {
    min-height: calc(100dvh - 0em);
    padding: 4.5em 0 0.5em;
  }
}
.section-goals .block {
  gap: calc(var(--gap) / 3);
  grid-template-rows: auto 1fr;
}
.section-goals .block-header {
  padding: 0 var(--gap);
}
.section-goals .block-items {
  display: flex;
  gap: 1em;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.section-goals .block-items::-webkit-scrollbar {
  display: none;
}
.section-goals .block-item {
  align-content: start;
  gap: calc(var(--gap) / 2);
  flex: 1;
  display: grid;
  padding: 1em;
  position: relative;
}
.section-goals .block-item > * {
  position: relative;
  z-index: 1;
}
.section-goals .block-item-background {
  background: hsl(0, 0%, 96%);
  border-radius: var(--border-radius);
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
}
@media (width < 1024px) {
  .section-goals .block {
    min-height: calc(100dvh - 12em);
    gap: 1em;
  }
  .section-goals .block-header {
    padding: 0 1em;
  }
  .section-goals .block-items {
    gap: 0.5em;
    overflow: hidden;
    overflow-x: scroll;
    margin: 0 -0.5em;
    padding: 0 0.5em;
    scroll-snap-type: x mandatory;
  }
  .section-goals .block-item {
    --width: 75vw;
    min-width: var(--width);
    flex: 0 0 var(--width);
    scroll-snap-align: center;
  }
}
@media (width >= 1024px) {
  .section-goals .block-items {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }
  .section-goals .block-item {
    padding: calc(var(--gap) / 2);
  }
}
.section-quote {
  color: white;
}
@media (width < 1024px) {
  .section-quote {
    min-height: 100dvh;
    padding: 4em 0 0.5em;
  }
}
.section-quote .block {
  padding: 1em;
}
.section-quote .block-content {
  align-content: space-between;
  display: grid;
  gap: var(--gap);
}
.section-quote .block-background::before {
  background-image: radial-gradient(circle, hsla(0, 0%, 0%, 0), hsl(233, 100%, 45%));
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  transform: scale(1.5);
  transform-origin: left bottom;
  width: 100%;
  z-index: 1;
}
.section-quote .block-background img {
  transform: scale(1.5);
  transform-origin: left top;
}
.section-quote .block-background.no-scale img {
  transform: scale(1);
}
@media (width < 1024px) {
  .section-quote .block h2 {
    padding-right: 20%;
  }
  .section-quote .block-content {
    gap: calc(var(--gap) / 2);
  }
}
@media (width >= 1024px) {
  .section-quote .block {
    align-content: end;
    min-height: 34em;
    padding: var(--gap);
  }
  .section-quote .block-background::before {
    background-image: radial-gradient(circle, hsla(0, 0%, 0%, 0), hsl(233, 100%, 55%));
  }
}

@media (width >= 1024px) {
  .grid-3 {
    display: grid;
    column-gap: var(--gap);
    grid-template-columns: repeat(3, 1fr);
  }
}

.col-2 {
  grid-column-end: span 2;
}

.icon-eas {
  --size: 4.5em;
  flex-basis: var(--size);
  height: var(--size);
  width: var(--size);
}
.icon-eas svg {
  fill: none;
  stroke: hsl(var(--blue));
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.media-items {
  display: grid;
  gap: 1em;
}
.media-item {
  display: grid;
}
.media-item h2,
.media-item h3 {
  color: hsl(var(--blue));
}
.media-item .info {
  display: flex;
  gap: 0.25em;
}
.media-item--small {
  gap: 0.25em;
}
.media-item--small h3 {
  font-weight: bold;
  font-size: 1em;
  line-height: 1.25;
  max-width: 30em;
}
.media-item--large {
  gap: 0.5em 0;
  margin-bottom: 3em;
}
.media-item--large img {
  aspect-ratio: 2/1;
  object-fit: cover;
  filter: brightness(0.95);
}
@media (width >= 1024px) {
  .media-item--large {
    grid-template-columns: 2fr 1fr;
    gap: 0.5em 2.25em;
  }
  .media-item--large h2 {
    grid-column: 1;
    grid-row: 1;
  }
  .media-item--large .info {
    grid-column: 1;
    grid-row: 2;
  }
  .media-item--large img {
    aspect-ratio: 3/2;
    grid-column: 2;
    grid-row: 1/span 2;
  }
}

.block {
  display: grid;
  justify-self: center;
  max-width: calc(100vw - 1em);
  position: relative;
  width: 100%;
}
@media (width >= 1024px) {
  .block {
    max-width: calc(100vw - var(--gap) * 2);
  }
}
.block > * {
  position: relative;
  z-index: 1;
}
.block-background {
  border-radius: var(--border-radius);
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
}
.block-background img {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.faq > h4 {
  color: hsl(var(--blue));
  margin-bottom: 1.5em;
}
.faq > h4:not(:first-of-type) {
  margin-top: 1em;
}
.faq-item {
  display: grid;
  gap: 0.75em;
  margin-bottom: 1.5em;
}
.faq-item-header {
  align-items: center;
  display: flex;
  gap: 1.5em;
}
.faq-item-header h2 {
  flex: 1 1 0%;
}
.faq-item .icon {
  color: hsl(var(--blue));
  flex: 0 0 1em;
  font-size: 2.25em;
  transform: rotate(90deg);
}
.faq-item .icon svg {
  fill: currentColor;
  display: block;
  height: 1em;
  width: 1em;
}
.faq-item-body {
  display: none;
  gap: 0.75em;
}
.faq-item-body > * {
  margin-top: 0;
  margin-bottom: 0;
}
.faq-item.is-expanded .icon {
  transform: rotate(-90deg);
}
.faq-item.is-expanded .faq-item-body {
  display: grid;
}
@media (width < 1024px) {
  .faq-item-header {
    margin-right: -0.75em;
    gap: 0.75em;
  }
  .faq-item-header h2 {
    font-size: 1em;
    font-weight: 600;
  }
  .faq-item-header .icon {
    font-size: 1.5em;
  }
}

.editmode .faq-item-header .icon {
  transform: rotate(-90deg);
}
.editmode .faq-item-body {
  display: grid;
}

.public .faq-item-header {
  cursor: pointer;
  user-select: none;
}

.navigation ul a {
  line-height: 1.4 !important;
}

