@font-face { font-family: "Playfair Display"; src: url("/assets/playfair-regular.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url("/assets/playfair-italic.ttf") format("truetype"); font-style: italic; font-weight: 400; font-display: swap; }
@font-face { font-family: Geist; src: url("/assets/geist.woff2") format("woff2"); font-style: normal; font-weight: 100 900; font-display: swap; }
:root { color-scheme: light; --paper: #fefefa; --ink: #090f14; --secondary: #5d6163; --rule: #bdbab3; }
* { box-sizing: border-box; }
html { background: var(--paper); }
body { margin: 0; color: var(--ink); font-family: Geist, Arial, sans-serif; background: var(--paper) url("/assets/paper.png") right bottom / cover no-repeat; }
::selection { color: var(--paper); background: var(--ink); }
.launch { min-height: 100svh; max-width: 1800px; margin-inline: auto; padding: clamp(60px, 11.7vh, 120px) 28px 38px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.brand { position: relative; width: min(64vw, 870px); aspect-ratio: 1300 / 180; overflow: hidden; mix-blend-mode: multiply; flex: none; }
.brand img { position: absolute; width: 118.154%; max-width: none; height: auto; left: -10.3077%; top: -225%; }
.announcement { width: 100%; margin-top: clamp(34px, 4.8vh, 50px); }
.eyebrow { margin: 0 0 28px; font-size: 15px; line-height: 1.5; letter-spacing: .49em; text-indent: .49em; text-transform: uppercase; }
h1 { margin: 0 auto; font-family: "Playfair Display", Georgia, serif; font-size: clamp(44px, 5.4vw, 84px); line-height: 1.08; font-weight: 400; letter-spacing: -.035em; text-wrap: balance; }
h1 em { display: block; font-weight: 400; line-height: 1.15; }
.countdown { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: min(860px, 80vw); margin: clamp(64px, 10.8vh, 112px) auto 0; }
.unit { position: relative; display: flex; flex-direction: column; align-items: center; }
.unit + .unit::before { content: ""; position: absolute; top: 18%; left: 0; height: 65%; width: 1px; background: var(--rule); }
.value { display: block; font-family: "Playfair Display", Georgia, serif; font-size: clamp(72px, 7.1vw, 110px); font-variant-numeric: lining-nums tabular-nums; font-weight: 400; letter-spacing: -.035em; line-height: 1.12; }
.label { margin-top: 12px; font-size: 14px; text-transform: uppercase; letter-spacing: .3em; text-indent: .3em; }
.completion { min-height: 1.5em; margin: 28px 0 20px; font-size: 15px; color: var(--secondary); }
footer { margin-top: auto; padding-top: 44px; font-size: 12px; line-height: 1.8; letter-spacing: .08em; color: var(--secondary); }
.timezone { display: block; font-size: 11px; letter-spacing: .04em; }
.noscript { max-width: 48ch; margin: 24px auto; font-size: 14px; line-height: 1.5; }
@media (min-width: 1800px) { body { background-size: 100% auto; } }
@media (max-width: 700px) {
  body { background-size: auto 100%; background-position: 68% bottom; }
  .launch { padding: max(54px, 9svh) 20px 26px; }
  .brand { width: min(92%, 520px); }
  .announcement { margin-top: 55px; }
  .eyebrow { font-size: 11px; margin-bottom: 28px; letter-spacing: .42em; }
  h1 { max-width: 13ch; font-size: clamp(36px, 8.7vw, 56px); line-height: 1.15; letter-spacing: -.035em; }
  h1 em { margin-top: 5px; white-space: nowrap; }
  .countdown { width: 100%; margin-top: 60px; }
  .value { font-size: clamp(44px, 12.2vw, 72px); }
  .label { font-size: 9px; letter-spacing: .17em; margin-top: 13px; }
  .unit + .unit::before { top: 10%; height: 55%; }
  .completion { font-size: 13px; margin-bottom: 0; }
  footer { font-size: 10px; padding-top: 38px; }
  .timezone { font-size: 10px; }
}
@media (max-height: 700px) and (min-width: 701px) {
  .launch { padding-top: 38px; padding-bottom: 20px; }
  .brand { width: min(51vw, 640px); }
  .announcement { margin-top: 24px; }
  .eyebrow { margin-bottom: 18px; font-size: 12px; }
  h1 { font-size: min(5vw, 68px); }
  .countdown { margin-top: 35px; }
  .value { font-size: 80px; }
  .completion { margin-top: 16px; margin-bottom: 0; }
  footer { padding-top: 12px; }
}
