:root { color-scheme: dark; --ivory: #f7f4ec; }
* { box-sizing: border-box; }
html, body { margin: 0; min-width: 260px; min-height: 100%; }
body { background: #101d2d; color: var(--ivory); font-family: Arial, Helvetica, sans-serif; }
.landscape, .veil { position: fixed; inset: 0; pointer-events: none; }
.landscape { background: url('assets/himalayan-dawn.webp') center center / cover no-repeat; animation: breathe 24s ease-out both; }
.veil { background: rgb(9 21 38 / 62%); }
main { position: relative; display: grid; place-items: center; min-height: 100vh; min-height: 100svh; padding: 64px 24px 88px; }
.identity { display: flex; flex-direction: column; align-items: center; animation: reveal 1.6s ease-out both; }
.brand-lockup { margin: 34px 0 0; width: clamp(282px, 29vw, 370px); line-height: 0; }
.brand-lockup img { display: block; width: 100%; height: auto; }
.brand-icon { display: block; width: clamp(120px, 13vw, 176px); height: auto; object-fit: contain; }
.wordmark { display: flex; align-items: flex-end; margin: 33px 0 0; font-weight: normal; line-height: 1; white-space: nowrap; }
.wordmark img { display: block; width: clamp(172px, 19vw, 238px); height: auto; }
.wordmark span { display: block; font-family: Georgia, 'Times New Roman', serif; font-weight: 400; font-size: clamp(44px, 5vw, 61px); line-height: .94; letter-spacing: -2px; padding-bottom: 4px; margin-left: -1px; }
.tagline { margin: 28px 0 0; font-size: 12px; font-weight: 400; letter-spacing: 2.5px; line-height: 1.7; text-transform: uppercase; opacity: .84; white-space: nowrap; }
.tagline span { padding: 0 6px; font-size: 9px; vertical-align: 1px; opacity: .7; }
.launch-note { margin: 17px 0 0; max-width: 100%; text-align: center; font-size: 13px; line-height: 1.6; letter-spacing: .45px; color: rgb(247 244 236 / 65%); }
.socials { display: flex; gap: 20px; margin-top: 31px; }
.socials a { display: grid; place-items: center; width: 32px; height: 36px; color: var(--ivory); opacity: .76; transition: opacity .25s, color .25s, transform .25s; }
.socials svg { width: 22px; height: 22px; }
.socials a[href] { cursor: pointer; }
.socials a:hover, .socials a:focus-visible { opacity: 1; color: #dfc28a; transform: translateY(-1px); }
.socials a:focus-visible { outline: 1px solid #dfc28a; outline-offset: 5px; border-radius: 3px; }
footer { position: fixed; bottom: max(27px, env(safe-area-inset-bottom)); left: 20px; right: 20px; text-align: center; font-size: 12px; line-height: 1.6; font-weight: 400; letter-spacing: .25px; color: rgb(247 244 236 / 60%); }
@keyframes reveal { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: translateY(0); } }
@keyframes breathe { from { transform: scale(1); } to { transform: scale(1.035); } }
@media (max-width: 600px) {
  main { padding: 50px 20px 80px; }
  .brand-lockup { width: min(290px, 82vw); margin-top: 30px; }
  .brand-icon { width: 130px; }
  .wordmark { margin-top: 29px; }
  .wordmark img { width: 185px; }
  .wordmark span { font-size: 48px; padding-bottom: 3px; }
  .tagline { margin-top: 26px; font-size: 11px; letter-spacing: 1.9px; }
  .tagline span { padding: 0 4px; }
  .launch-note { font-size: 12px; margin-top: 16px; letter-spacing: .3px; }
  .socials { margin-top: 28px; gap: 18px; }
  .socials svg { width: 20px; height: 20px; }
  footer { bottom: max(22px, env(safe-area-inset-bottom)); font-size: 11px; }
}
@media (max-height: 520px) {
  main { min-height: 430px; padding-top: 24px; padding-bottom: 65px; }
  .brand-lockup { width: 250px; margin-top: 20px; }
  .brand-icon { width: 110px; }
  .wordmark { margin-top: 18px; }
  .tagline { margin-top: 18px; }
  .socials { margin-top: 14px; }
  footer { position: absolute; top: max(395px, calc(100svh - 35px)); bottom: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .landscape, .identity { animation: none; }
  .socials a { transition: none; }
}
