:root {
  color-scheme: dark;
  --ivory: #f1ede4;
  --muted-ivory: rgba(241, 237, 228, 0.68);
  --brass: #b6945d;
}

* { box-sizing: border-box; }

html,
body {
  margin: 0;
  min-height: 100%;
  background: #100e0c;
}

body {
  overflow: hidden;
  color: var(--ivory);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.splash {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(24rem, 43vw) 1fr;
  grid-template-rows: 1fr auto;
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  padding: 0;
  overflow: hidden;
}

.splash::before {
  position: absolute;
  inset: 0 auto 0 0;
  z-index: -1;
  width: min(47vw, 48rem);
  content: "";
  background:
    radial-gradient(circle at 38% 50%, rgba(128, 26, 20, 0.18), transparent 35%),
    linear-gradient(90deg, #080b0d 0%, rgba(8, 11, 13, 0.985) 70%, rgba(8, 11, 13, 0.92) 84%, transparent 100%);
}

.backdrop,
.atmosphere {
  position: absolute;
  inset: 0;
  z-index: -2;
}

.backdrop {
  inset: -3%;
  overflow: hidden;
  background: #100e0c;
}

.backdrop img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 67% center;
  filter: saturate(0.86) contrast(1.07) brightness(0.82);
  transform: scale(1.025);
  animation: cinematic-drift 28s ease-in-out infinite alternate;
}

.atmosphere {
  z-index: -1;
  background:
    radial-gradient(circle at 73% 65%, rgba(208, 139, 61, 0.09), transparent 27%),
    linear-gradient(90deg, rgba(5, 9, 12, 0.42) 0%, rgba(5, 9, 12, 0.25) 42%, rgba(8, 10, 11, 0.03) 70%, rgba(8, 7, 6, 0.2) 100%),
    linear-gradient(180deg, rgba(4, 9, 14, 0.28), transparent 37%, rgba(5, 5, 4, 0.16) 65%, rgba(5, 4, 3, 0.86));
}

.atmosphere::after {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0.055;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.76' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

.identity {
  position: relative;
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: center;
  justify-self: stretch;
  width: 100%;
  padding: clamp(3rem, 6vw, 7.5rem) clamp(2.5rem, 5.2vw, 6.5rem);
  animation: reveal 1.15s cubic-bezier(0.22, 0.75, 0.24, 1) both;
}

.identity::before {
  position: absolute;
  top: 50%;
  right: 0;
  left: clamp(2.5rem, 5.2vw, 6.5rem);
  height: 1px;
  content: "";
  background: linear-gradient(90deg, rgba(182, 148, 93, 0.28), rgba(182, 148, 93, 0));
  transform: translateY(clamp(11rem, 19vw, 18rem));
}

h1 {
  margin: 0;
  line-height: 0;
}

h1 img {
  display: block;
  width: min(100%, 36rem);
  height: auto;
  margin-inline: auto;
  filter: drop-shadow(0 1rem 1.8rem rgba(0, 0, 0, 0.38));
}

.identity p {
  display: flex;
  align-items: center;
  gap: 1rem;
  justify-content: center;
  margin: clamp(0.75rem, 1.4vw, 1.35rem) 0 0;
  color: rgba(241, 237, 228, 0.82);
  font-size: clamp(0.65rem, 0.78vw, 0.82rem);
  font-weight: 600;
  letter-spacing: 0.44em;
  text-transform: uppercase;
}

.identity p::before {
  width: clamp(2.5rem, 4vw, 4.8rem);
  height: 1px;
  background: #bb2d20;
  content: "";
}

footer {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  justify-self: end;
  margin: 0 clamp(1.5rem, 3.2vw, 3.8rem) clamp(1.5rem, 3vw, 3.4rem) 0;
  animation: reveal 1.15s 0.28s cubic-bezier(0.22, 0.75, 0.24, 1) both;
}

.partner {
  display: flex;
  align-items: center;
  gap: 1.1rem;
  text-align: right;
}

.partner__copy {
  display: grid;
  gap: 0.3rem;
  text-transform: uppercase;
}

.partner__copy strong {
  color: var(--brass);
  font-size: 0.61rem;
  letter-spacing: 0.2em;
}

.partner__copy span {
  color: rgba(241, 237, 228, 0.62);
  font-size: 0.65rem;
  letter-spacing: 0.08em;
}

.partner a {
  display: inline-flex;
  text-decoration: none;
  opacity: 0.92;
  transition: opacity 180ms ease, transform 180ms ease;
}

.partner a:hover,
.partner a:focus-visible { opacity: 1; transform: translateY(-2px); }

.partner a:focus-visible {
  outline: 1px solid var(--brass);
  outline-offset: 0.55rem;
}

.partner img { width: auto; height: 3.25rem; }

@keyframes reveal {
  from { opacity: 0; transform: translateY(1.1rem); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes cinematic-drift {
  from { transform: scale(1.025) translate3d(-0.35%, 0, 0); }
  to { transform: scale(1.07) translate3d(0.45%, -0.35%, 0); }
}

@media (max-width: 800px) {
  .splash {
    display: block;
    padding: clamp(1.25rem, 5vw, 2.5rem);
  }
  .splash::before {
    width: 100%;
    height: 60%;
    background:
      radial-gradient(circle at 50% 28%, rgba(128, 26, 20, 0.18), transparent 32%),
      linear-gradient(180deg, #080b0d 0%, rgba(8, 11, 13, 0.98) 65%, transparent 100%);
  }
  .backdrop img { object-position: 68% 54%; }
  .atmosphere {
    background:
      linear-gradient(180deg, rgba(5, 10, 15, 0.44) 0%, rgba(6, 7, 8, 0.08) 46%, rgba(6, 5, 4, 0.1) 62%, rgba(5, 4, 3, 0.9) 100%),
      linear-gradient(90deg, rgba(5, 10, 15, 0.26), rgba(8, 7, 6, 0.04) 74%);
  }
  .identity {
    width: min(34rem, 92vw);
    margin: clamp(0.5rem, 3vh, 2.5rem) auto 0;
    padding: 0;
  }
  .identity::before { display: none; }
  .identity p { justify-content: center; }
  footer {
    position: absolute;
    right: clamp(1.25rem, 5vw, 2.5rem);
    bottom: clamp(1.25rem, 4vw, 2.25rem);
    margin: 0;
  }
}

@media (max-width: 420px) {
  .splash { padding-top: max(0.9rem, env(safe-area-inset-top)); }
  .splash::before { height: 55%; }
  .backdrop img { object-position: 69% 58%; }
  .identity { width: min(31rem, 96vw); margin-top: clamp(0.4rem, 2vh, 1.3rem); }
  .identity p { letter-spacing: 0.34em; }
  .partner { align-items: flex-start; flex-direction: column; gap: 0.45rem; text-align: left; }
  .partner__copy span { max-width: 17rem; font-size: 0.58rem; }
  .partner img { height: 2.65rem; }
  footer { right: auto; left: clamp(1.25rem, 5vw, 2.5rem); }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}