:root {
  --ocean: #053e4c;
  --ocean-deep: #022f3a;
  --ocean-dark: #01262f;

  --cream: #f2ede3;
  --cream-soft: #f7f3eb;

  --white: #ffffff;
  --ink: #143844;

  --gold: #c8a36d;
  --gold-soft: #d7bd91;

  --line-light: rgba(255,255,255,.18);
  --line-dark: rgba(5,62,76,.16);

  --max: 1240px;
}

/* THREE CLEAR NEXT STEPS */
.fair-next{padding:clamp(80px,10vw,140px) 24px;background:var(--cream);color:var(--ink)}
.fair-next__intro{width:min(760px,100%);margin:0 auto 52px;text-align:center}.fair-next__intro p{margin-inline:auto}
.fair-next__grid{width:min(var(--max),100%);margin:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--gold)}
.fair-next__grid article{background:var(--cream-soft);padding:clamp(28px,4vw,52px);display:flex;min-height:390px;flex-direction:column;align-items:flex-start}
.fair-next__grid article>span{color:var(--gold);font-size:.75rem;letter-spacing:.18em;margin-bottom:28px}
.fair-next__grid h3{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(1.65rem,2.4vw,2.25rem);line-height:1.15;margin:0 0 20px}
.fair-next__grid p{margin:0 0 30px}.fair-next__grid a{margin-top:auto;font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-decoration:underline;text-underline-offset:6px}
.fair-next__grid a:hover{color:var(--gold)}
@media(max-width:820px){.fair-next__grid{grid-template-columns:1fr}.fair-next__grid article{min-height:auto}}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 90px;
}

body {
  margin: 0;
  background: var(--cream);
  color: var(--ink);
  font-family:
    Inter,
    "Helvetica Neue",
    Arial,
    sans-serif;
  line-height: 1.6;
}

img {
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
}

a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 5px;
}


/* HEADER */

.site-header {
  position: absolute;
  z-index: 20;
  top: 0;
  left: 0;

  width: 100%;
  height: 94px;

  display: flex;
  align-items: center;

  padding: 0 clamp(22px, 5vw, 76px);

  color: var(--white);
}

.brand {
  display: flex;
  align-items: center;
  width: 170px;
  flex-shrink: 0;
}

.brand img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

.language-switch {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  margin-right: 24px;
  color: rgba(255, 255, 255, 0.45);
  font-size: 0.72rem;
  letter-spacing: 0.12em;
}

.lang-button {
  appearance: none;
  background: none;
  border: 0;
  padding: 4px 2px;
  color: rgba(255, 255, 255, 0.55);
  font: inherit;
  letter-spacing: inherit;
  cursor: pointer;
  transition: color 180ms ease;
}

.lang-button:hover {
  color: var(--white);
}

.lang-button.is-active {
  color: var(--gold);
}

.main-nav {
  margin-left: auto;

  display: flex;
  align-items: center;
  gap: clamp(20px, 2.6vw, 42px);

  font-size: .76rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.main-nav a {
  text-decoration: none;
}

.nav-contact {
  padding: 11px 19px;
  border: 1px solid var(--gold);
}

.menu-button {
  display: none;
}


/* HERO */

.hero {
  position: relative;

  min-height: 92vh;

  display: flex;
  align-items: center;

  overflow: hidden;

  background:
    #043b48;
}

.hero-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(1,28,35,.92) 0%,
      rgba(2,43,52,.70) 55%,
      rgba(2,43,52,.45) 100%
    );
}

.hero-content {
  position: relative;
  z-index: 2;

  width: min(880px, 88vw);

  margin-left: clamp(24px, 12vw, 180px);
  padding: 160px 0 100px;

  color: var(--white);
}

.eyebrow,
.section-label {
  margin: 0 0 20px;

  color: var(--gold);

  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
}

.hero h1 {
  max-width: 820px;

  margin: 0;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: clamp(3rem, 6.3vw, 6.9rem);
  font-weight: 400;
  line-height: .93;
  letter-spacing: -.035em;
}

.hero-principles {
  margin: 34px 0 14px;

  color: var(--gold-soft);

  font-size: .75rem;
  letter-spacing: .18em;
}

.hero-question {
  margin: 0;

  max-width: 600px;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: clamp(1.35rem, 2vw, 2rem);
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;

  margin-top: 40px;
}


/* BUTTONS */

.button {
  min-height: 48px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 14px 22px;

  border: 1px solid transparent;

  text-decoration: none;

  font-size: .67rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;

  transition:
    background-color 220ms ease,
    color 220ms ease,
    border-color 220ms ease;
}

.button-primary {
  background: var(--cream);
  color: var(--ocean-deep);
}

.button-secondary {
  border-color: rgba(255,255,255,.62);
  color: var(--white);
}

.button-dark {
  background: var(--ocean-deep);
  color: var(--white);
}

.button-outline {
  border-color: var(--gold);
  color: var(--white);
}

.button-gold {
  background: var(--gold);
  color: var(--ocean-dark);
}

.button:hover {
  opacity: .88;
}


/* INTRO */

.section-cream {
  background: var(--cream);
}

.intro {
  padding:
    clamp(90px, 11vw, 160px)
    24px;
}

.narrow {
  width: min(800px, 100%);
  margin: 0 auto;
  text-align: center;
}

.intro h2 {
  margin: 0;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: clamp(2.3rem, 4vw, 4.6rem);
  font-weight: 400;
  line-height: 1.05;
}

.intro p:last-child {
  width: min(620px, 100%);
  margin: 28px auto 0;

  color: #66767a;

  font-size: 1.05rem;
}


/* OFFERS */

.offer {
  position: relative;
  overflow: hidden;

  padding:
    clamp(90px, 10vw, 160px)
    clamp(24px, 6vw, 96px);
}

.offer-dark {
  background: var(--ocean-deep);
  color: var(--white);
}

.offer-inner {
  position: relative;
  z-index: 2;

  width: min(var(--max), 100%);
  margin: 0 auto;

  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .9fr);
  align-items: center;
  gap: clamp(50px, 8vw, 130px);
}

.offer-reverse .offer-copy {
  order: 2;
}

.offer-reverse .offer-visual {
  order: 1;
}

.offer-copy {
  max-width: 600px;
}

.offer h2 {
  margin: 0;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: clamp(2.7rem, 4.5vw, 5.2rem);
  font-weight: 400;
  line-height: .98;
}

.offer h3 {
  margin: 24px 0 14px;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: clamp(1.45rem, 2vw, 2rem);
  font-weight: 400;
}

.offer-copy > p:not(.section-label):not(.offer-points) {
  max-width: 520px;
  color: inherit;
  opacity: .78;
}

.offer-points {
  margin: 28px 0 34px;

  color: var(--gold);

  font-size: .8rem;
  letter-spacing: .08em;
}

.offer-number {
  position: absolute;

  right: 3vw;
  top: -40px;

  color: rgba(5,62,76,.05);

  font-family:
    Georgia,
    serif;

  font-size: clamp(11rem, 25vw, 26rem);
  line-height: 1;
}

.offer-dark .offer-number {
  color: rgba(255,255,255,.025);
}

.section-label-gold {
  color: var(--gold);
}


/* OFFER IMAGERY AND ROUTES */

.offer-visual {
  min-height: 560px;
  border-top: 1px solid var(--gold);
  background: rgba(5,62,76,.08);
  overflow: hidden;
}

.offer-dark .offer-visual {
  background: rgba(255,255,255,.035);
}

.offer-visual img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 560px;
  object-fit: cover;
}

.offer-paths {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin: 8px 0 24px;
}

.offer-detail-link {
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-decoration: underline;
  text-underline-offset: 5px;
}

.offer-detail-link:hover {
  color: var(--gold);
}


/* MESSE SPECIAL */

.messe-special {
  background: var(--ocean-dark);
  color: var(--white);

  padding:
    clamp(90px, 11vw, 150px)
    24px;
}

.special-inner {
  width: min(920px, 100%);
  margin: 0 auto;

  padding:
    clamp(40px, 5vw, 70px);

  border-top: 1px solid var(--gold);
  border-bottom: 1px solid var(--gold);

  text-align: center;
}

.special-inner h2 {
  margin: 0;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: clamp(2.2rem, 4vw, 4.4rem);
  font-weight: 400;
  line-height: 1.04;
}

.special-secondary {
  margin: 25px 0 0;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: clamp(1.3rem, 2vw, 1.8rem);
}

.special-note {
  width: min(650px, 100%);
  margin: 30px auto 34px;

  color: rgba(255,255,255,.65);

  font-size: .88rem;
}


/* FINAL */

.final-section {
  position: relative;

  min-height: 720px;

  display: flex;
  align-items: center;

  overflow: hidden;

  background: #244d52;
}

.final-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(2,39,47,.90),
      rgba(2,39,47,.55)
    );
}

.final-content {
  position: relative;
  z-index: 2;

  width: min(760px, 86vw);
  margin-left: clamp(24px, 12vw, 180px);

  color: var(--white);
}

.final-content h2 {
  margin: 0;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: clamp(3rem, 6vw, 6.5rem);
  font-weight: 400;
  line-height: .93;
}

.final-content p {
  max-width: 620px;

  margin: 28px 0 36px;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: clamp(1.3rem, 2vw, 1.8rem);
}


/* FOOTER */

.site-footer {
  padding:
    80px
    clamp(24px, 6vw, 90px);

  background: var(--ocean-dark);
  color: var(--white);
}

.footer-inner {
  width: min(var(--max), 100%);
  margin: 0 auto;
}

.footer-logo {
  display: block;

  width: 170px;
  margin-bottom: 40px;
}

.footer-contact,
.footer-legal {
  display: flex;
  flex-wrap: wrap;

  gap: 15px 28px;
}

.footer-contact a,
.footer-legal a {
  color: rgba(255,255,255,.78);
  text-decoration: none;

  font-size: .85rem;
}

.footer-legal {
  margin-top: 25px;
}

.footer-disclaimer {
  max-width: 820px;

  margin: 45px 0 0;
  padding-top: 30px;

  border-top: 1px solid var(--line-light);

  color: rgba(255,255,255,.5);

  font-size: .76rem;
}


/* MOBILE */

@media (max-width: 760px) {

  html {
    scroll-padding-top: 76px;
  }

  .site-header {
    height: 76px;
    padding: 0 20px;
  }

  .brand {
    width: 130px;
  }

  .menu-button {
    position: relative;
    z-index: 30;

    width: 48px;
    height: 48px;

    margin-left: auto;

    display: grid;
    place-items: center;

    border: 0;
    background: transparent;

    cursor: pointer;
  }

  .menu-button span {
    position: absolute;

    width: 24px;
    height: 1px;

    background: var(--white);
  }

  .menu-button span:first-child {
    transform: translateY(-5px);
  }

  .menu-button span:last-child {
    transform: translateY(5px);
  }

  .main-nav {
    position: fixed;
    inset: 0;

    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    gap: 28px;

    margin: 0;

    background: var(--ocean-dark);

    font-size: 1rem;
  }

  .main-nav.is-open {
    display: flex;
  }

  .hero {
    min-height: 100svh;
  }

  .hero-content {
    width: auto;

    margin: 0;
    padding:
      150px
      22px
      70px;
  }

  .hero h1 {
    font-size: clamp(2.7rem, 12vw, 4.2rem);
  }

  .hero-actions {
    flex-direction: column;
  }

  .button {
    width: 100%;
  }

  .offer {
    padding:
      90px
      22px;
  }

  .offer-inner {
    grid-template-columns: 1fr;
    gap: 45px;
  }

  .offer-reverse .offer-copy,
  .offer-reverse .offer-visual {
    order: initial;
  }

  .offer-visual {
    min-height: 420px;
  }

  .offer-visual img {
    min-height: 420px;
  }

  .final-section {
    min-height: 660px;
  }

  .final-content {
    width: auto;

    margin: 0;

    padding: 80px 22px;
  }

  .footer-contact,
  .footer-legal {
    flex-direction: column;
  }
}


@media (prefers-reduced-motion: reduce) {

  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}