.am-landing-ready { overflow: hidden; }
.am-landing, .am-landing * { box-sizing: border-box; }
.am-landing {
  position: fixed !important;
  z-index: 2147483000;
  inset: 0;
  isolation: isolate;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #e5a46e;
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  transition: opacity .7s ease, visibility .7s ease;
}
.am-landing--closed { opacity: 0; visibility: hidden; pointer-events: none; }
.am-landing__scene {
  position: absolute;
  inset: 0;
  background: #e5a46e url('./sunrise-wave.png') center / cover no-repeat;
  transform: scale(1.04);
  animation: am-scene-in 2s ease-out both;
}
.am-landing__scene::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(9, 50, 57, .48), transparent 48%),
              linear-gradient(90deg, rgba(20, 55, 60, .19), transparent 56%);
}
.am-landing__foreground {
  position: absolute;
  z-index: 1;
  left: -5%;
  bottom: -12%;
  width: 110%;
  height: 24%;
  background: rgba(15, 74, 83, .78);
  border-radius: 50% 50% 0 0;
  mix-blend-mode: multiply;
  animation: am-swell 4s ease-in-out infinite;
}
.am-landing__heading {
  position: relative;
  z-index: 3;
  align-self: start;
  margin-top: clamp(34px, 8vh, 105px);
  padding: 0 18px;
  text-align: center;
  text-shadow: 0 3px 20px rgba(16, 54, 62, .29);
}
.am-landing__heading p {
  margin: 0;
  color: #fff;
  font-size: clamp(11px, 1vw, 14px);
  font-weight: 700;
  letter-spacing: .32em;
  text-transform: uppercase;
}
.am-landing__heading h1 {
  margin: 18px 0 0;
  color: #fff3d5;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(54px, 8vw, 132px);
  font-weight: 700;
  line-height: .9;
  letter-spacing: -.06em;
  text-transform: uppercase;
}
.am-landing__heading h1 span {
  display: block;
  margin-top: 14px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: .29em;
  letter-spacing: .18em;
}
.am-landing__chicken {
  position: absolute;
  z-index: 2;
  right: 9%;
  bottom: 9%;
  width: clamp(230px, 36vw, 530px);
  height: auto;
  max-width: none;
  filter: drop-shadow(0 22px 14px rgba(21, 53, 55, .25));
  pointer-events: none;
  animation: am-surf 3.8s ease-in-out infinite;
}
.am-landing__enter {
  position: relative;
  z-index: 4;
  align-self: end;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 190px;
  min-height: 57px;
  margin-bottom: clamp(32px, 6vh, 80px);
  padding: 0 28px;
  border: 2px solid #24443f;
  border-radius: 100px;
  background: #fff0d6;
  box-shadow: 6px 6px 0 #24443f;
  color: #24443f !important;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .17em;
  text-decoration: none !important;
  text-transform: uppercase;
  transition: transform .2s ease, box-shadow .2s ease;
}
.am-landing__enter:hover { transform: translate(3px, 3px); box-shadow: 3px 3px 0 #24443f; }
.am-landing__enter:focus-visible { outline: 3px solid #fff; outline-offset: 5px; }
@keyframes am-surf {
  0%, 100% { transform: translate(-12px, 6px) rotate(-5deg); }
  50% { transform: translate(18px, -19px) rotate(4deg); }
}
@keyframes am-swell {
  0%, 100% { transform: translateY(4px) rotate(-1deg); }
  50% { transform: translateY(-12px) rotate(1deg); }
}
@keyframes am-scene-in {
  from { transform: scale(1.16); opacity: .7; }
  to { transform: scale(1.04); opacity: 1; }
}
@media (max-width: 650px) {
  .am-landing__scene { background-position: 55% center; }
  .am-landing__heading { margin-top: 9vh; }
  .am-landing__heading h1 { font-size: clamp(52px, 17vw, 96px); }
  .am-landing__chicken { width: 85vw; right: -8%; bottom: 19%; }
  .am-landing__enter { margin-bottom: 7vh; }
}
@media (prefers-reduced-motion: reduce) {
  .am-landing__scene, .am-landing__foreground, .am-landing__chicken { animation: none; }
  .am-landing { transition: none; }
}
