/* Rag Syndicate — simple holding page */
:root {
  --ink: #171716;
  --paper: #e9e3d6;
  --gold: #bd9856;
}
* { box-sizing: border-box; }
html { min-height: 100%; background: var(--ink); }
body { margin: 0; min-height: 100vh; color: var(--paper); font-family: "Courier New", Courier, monospace; }
.landing {
  min-height: 100vh;
  min-height: 100svh;
  display: grid;
  place-items: center;
  padding: clamp(55px, 8vw, 100px) 32px;
  text-align: center;
  background: var(--ink) url("background.jpg") center / 100% 100% no-repeat;
}
.content { width: min(100%, 780px); }
.brand { margin: 0 auto 12px; width: min(100%, 680px); }
.brand img { display: block; width: 100%; height: auto; }
.tagline {
  margin: 0;
  color: var(--gold);
  font: 700 clamp(13px, 2vw, 21px)/1.5 Arial, Helvetica, sans-serif;
  letter-spacing: clamp(.16em, .8vw, .4em);
}
.rule { width: 84px; height: 2px; margin: 35px auto 36px; background: var(--gold); }
.countdown {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: min(100%, 650px);
  margin: 0 auto 54px;
}
.unit { display: flex; flex-direction: column; align-items: center; gap: 12px; min-width: 0; }
.unit + .unit { border-left: 1px solid rgba(233,227,214,.55); }
.number { font: 800 clamp(30px, 5vw, 60px)/1 Arial, Helvetica, sans-serif; font-variant-numeric: tabular-nums; }
.unit-label { font-size: clamp(9px, 1.3vw, 13px); letter-spacing: .24em; }
.email {
  color: var(--paper);
  font-size: clamp(11px, 1.7vw, 17px);
  letter-spacing: .14em;
  text-decoration: none;
  border-bottom: 1px solid var(--gold);
  padding-bottom: 5px;
  overflow-wrap: anywhere;
}
.email:hover, .email:focus-visible { color: var(--gold); }
.launch-message { margin: 0 auto 50px; font-size: 25px; font-weight: bold; letter-spacing: .25em; }
[hidden] { display: none !important; }
@media (max-width: 600px) {
  .landing { padding: 65px 24px; background-size: cover; }
  .brand { width: min(100%, 470px); margin-bottom: 18px; }
  .tagline { letter-spacing: .18em; }
  .rule { margin: 30px auto; }
  .countdown { margin-bottom: 45px; }
  .unit { gap: 10px; }
  .unit-label { letter-spacing: .09em; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto; } }
