:root {
  color-scheme: light dark;
  --navy: #061a40;
  --deep-navy: #041126;
  --ivory: #fbfaf6;
  --gold: #c88a12;
}

* { box-sizing: border-box; }

html, body { margin: 0; min-height: 100%; background: var(--deep-navy); }
body { overflow: hidden; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }

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

.scene, .atmosphere { position: absolute; inset: 0; z-index: -3; }
.scene { inset: -3%; overflow: hidden; background: var(--deep-navy); }
.scene img {
  width: 100%; height: 100%; object-fit: cover; object-position: 68% center;
  filter: saturate(0.84) contrast(1.04) brightness(0.9);
  transform: scale(1.03);
  animation: drift 32s ease-in-out infinite alternate;
}

.atmosphere {
  z-index: -2;
  background: linear-gradient(90deg, rgba(3, 15, 35, 0.15) 40%, transparent 70%),
    linear-gradient(180deg, rgba(3, 10, 22, 0.08), transparent 52%, rgba(2, 8, 18, 0.7));
}

.atmosphere::after {
  position: absolute; inset: 0; content: ""; opacity: 0.045; pointer-events: none;
  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='.8' 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;
  display: grid;
  place-content: center;
  padding: clamp(3rem, 6vw, 7rem) clamp(2.5rem, 5vw, 6rem);
  background: radial-gradient(circle at 78% 22%, rgba(213, 174, 88, 0.09), transparent 31%),
    linear-gradient(90deg, #fff 0%, var(--ivory) 82%, rgba(251, 250, 246, 0.96) 91%, rgba(251, 250, 246, 0) 100%);
  animation: reveal 1.05s cubic-bezier(0.22, 0.75, 0.24, 1) both;
}

.identity::after {
  width: min(8rem, 25%); height: 1px; margin: clamp(2rem, 4vh, 3.5rem) auto 0;
  background: linear-gradient(90deg, transparent, rgba(200, 138, 18, 0.78), transparent);
  content: "";
}

h1 { margin: 0; line-height: 0; }
h1 img {
  display: block; width: min(100%, 47rem); height: auto; margin-inline: auto;
  background: #fff; filter: contrast(1.17) saturate(1.02); mix-blend-mode: multiply;
}

.identity p {
  margin: clamp(1.2rem, 2.2vw, 2rem) 0 0;
  color: rgba(6, 26, 64, 0.78);
  font-size: clamp(0.67rem, 0.75vw, 0.82rem);
  font-weight: 650;
  letter-spacing: 0.48em;
  text-align: center;
  text-transform: uppercase;
}

.partner {
  grid-column: 2; grid-row: 2; align-self: end; justify-self: end;
  display: flex; align-items: center; gap: 1rem;
  margin: 0 clamp(1.5rem, 3vw, 3.75rem) clamp(1.5rem, 3vw, 3.4rem) 0;
  color: rgba(255, 255, 255, 0.7); text-align: right;
  animation: reveal 1.05s 0.22s cubic-bezier(0.22, 0.75, 0.24, 1) both;
}

.partner__copy { display: grid; gap: 0.28rem; text-transform: uppercase; }
.partner__copy strong { color: #efc15d; font-size: 0.61rem; letter-spacing: 0.2em; }
.partner__copy span { font-size: 0.62rem; letter-spacing: 0.08em; }
.partner a { display: inline-flex; opacity: 0.95; 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 #efc15d; outline-offset: 0.5rem; }
.partner img { width: auto; height: 3.1rem; }

@keyframes reveal { from { opacity: 0; transform: translateY(1rem); } to { opacity: 1; transform: translateY(0); } }
@keyframes drift { from { transform: scale(1.03) translate3d(-0.3%, 0, 0); } to { transform: scale(1.075) translate3d(0.35%, -0.3%, 0); } }

@media (max-width: 820px) {
  .splash { display: block; padding: clamp(1.25rem, 5vw, 2.5rem); }
  .scene img { object-position: 68% 62%; }
  .atmosphere { background: linear-gradient(180deg, rgba(4, 17, 38, 0.04) 45%, rgba(2, 8, 18, 0.86) 100%); }
  .identity {
    width: calc(100% + clamp(2.5rem, 10vw, 5rem)); height: min(52vh, 31rem);
    margin: calc(clamp(1.25rem, 5vw, 2.5rem) * -1) 0 0 calc(clamp(1.25rem, 5vw, 2.5rem) * -1);
    padding: clamp(2rem, 6vw, 4rem) clamp(1.6rem, 7vw, 4rem) clamp(4rem, 10vh, 6rem);
    background: radial-gradient(circle at 50% 10%, rgba(213, 174, 88, 0.08), transparent 35%),
      linear-gradient(180deg, #fff 0%, var(--ivory) 76%, rgba(251, 250, 246, 0) 100%);
  }
  h1 img { width: min(100%, 39rem); }
  .partner { position: absolute; right: clamp(1.25rem, 5vw, 2.5rem); bottom: clamp(1.25rem, 4vw, 2.25rem); margin: 0; }
}

@media (max-width: 440px) {
  .identity { height: min(47vh, 24rem); padding-bottom: 3.5rem; }
  .identity p { margin-top: 0.8rem; letter-spacing: 0.36em; }
  .identity::after { margin-top: 1.4rem; }
  .scene img { object-position: 66% 66%; }
  .partner { right: auto; left: clamp(1.25rem, 5vw, 2.5rem); align-items: flex-start; flex-direction: column; gap: 0.4rem; text-align: left; }
  .partner__copy span { max-width: 17rem; font-size: 0.57rem; }
  .partner img { height: 2.6rem; }
}

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