/* Phase 2: an editorial register on a three-column frame. */
.register-heading { margin-bottom: clamp(36px, 5vw, 72px); }
.register-kicker, .nation-label, .nation-domain dt, .nation-metadata,
.plate-placeholder, .unratified-stamp {
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: 1.7;
  letter-spacing: .1em;
}
.register-kicker { margin: 0 0 20px; color: var(--jade); text-transform: uppercase; }
.register-intro {
  max-width: 43ch;
  margin: 24px 0 0 auto;
  font-family: var(--font-editorial);
  font-size: clamp(24px, 2.4vw, 32px);
  line-height: 1.4;
}
.nation-register {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(24px, 3vw, 44px);
  align-items: start;
}
.nation-entry { min-width: 0; }
.nation-entry--wake { grid-row: span 2; }
.nation-entry--flame { margin-top: 64px; }
.nation-entry--unsaid { grid-column: 2 / 4; }
.nation-card {
  background: linear-gradient(125deg, #211e1c, var(--amp-black));
  border-top: 1px solid var(--bone);
  border-bottom: 1px solid var(--asphalt);
  transition: transform 260ms var(--ease-micro);
}
.nation-plate { overflow: hidden; aspect-ratio: 4 / 3; background: var(--asphalt); }
.nation-plate img, .plate-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 260ms var(--ease-micro);
}
.nation-entry--wake .nation-plate { aspect-ratio: 2 / 3; }
.nation-entry--unsaid .nation-card { display: grid; grid-template-columns: 1fr 1.25fr; }
.nation-entry--unsaid .nation-plate { aspect-ratio: auto; min-height: 100%; }
.nation-entry--unsaid img { object-position: 60% center; }
.plate-placeholder {
  display: grid;
  place-items: end start;
  padding: 20px;
  background: repeating-linear-gradient(0deg, transparent 0 23px, #e8ddc80c 23px 24px),
    linear-gradient(120deg, #38332e, #191c20);
}
.nation-plate--light .plate-placeholder {
  background: repeating-linear-gradient(90deg, transparent 0 47px, #e8ddc812 47px 48px),
    linear-gradient(125deg, #65554a, #302627 65%, #19191c);
}
.plate-placeholder span { max-width: 24ch; padding: 6px 8px; background: var(--amp-black); }
.nation-content { padding: clamp(20px, 2.1vw, 30px); }
.nation-label { margin: 0 0 12px; color: var(--jade); transition: color 260ms var(--ease-micro); }
.nation-card h2 {
  margin: 0 0 20px;
  font-family: var(--font-display);
  font-size: clamp(32px, 3.3vw, 52px);
  font-weight: 400;
  line-height: 1.1;
  text-transform: uppercase;
}
.nation-domain { margin: 0 0 20px; padding-bottom: 20px; border-bottom: 1px solid var(--asphalt); }
.nation-domain dt { margin-bottom: 6px; text-transform: uppercase; }
.nation-domain dd { margin: 0; font-family: var(--font-editorial); font-size: 22px; line-height: 1.3; }
.nation-description { margin: 0; font-size: 16px; line-height: 1.75; }
.nation-metadata { margin: 24px 0 0; opacity: 0; transition: opacity 260ms var(--ease-micro); }
.nation-card:focus-visible .nation-metadata { opacity: 1; }
.nation-card:focus-visible .nation-label { color: var(--feedback-blue); }
@media (hover: hover) and (pointer: fine) {
  .nation-card:hover { transform: rotate(1deg); }
  .nation-entry:nth-child(even) .nation-card:hover { transform: rotate(-1deg); }
  .nation-card:hover :is(img, .plate-placeholder) { transform: scale(1.04); }
  .nation-card:hover .nation-label { color: var(--feedback-blue); }
  .nation-card:hover .nation-metadata { opacity: 1; }
}
.unratified-notice {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(24px, 4vw, 64px);
  align-items: center;
  margin-top: clamp(48px, 7vw, 100px);
  padding: clamp(24px, 4vw, 56px);
  border: 1px solid var(--oxide-red);
  border-left-width: 6px;
  background: repeating-linear-gradient(135deg, #9d2e2e0a 0 1px, transparent 1px 8px), #21191b;
}
.unratified-count { font-family: var(--font-display); font-size: clamp(80px, 10vw, 144px); line-height: 1; pointer-events: none; }
.unratified-notice h2 { margin: 0; font-family: var(--font-editorial); font-size: clamp(28px, 3vw, 40px); font-weight: 400; line-height: 1.2; }
.unratified-notice p { max-width: 65ch; margin: 16px 0 0; }
.unratified-stamp { display: inline-block; padding: 8px 12px; border: 1px solid var(--oxide-red); }
@keyframes register-reveal {
  from { opacity: 0; transform: translateY(32px); }
  to { opacity: 1; transform: translateY(0); }
}
/* Animation is opt-in after observation. Without JS, every entry remains readable. */
.nation-entry.is-revealing { animation: register-reveal 900ms var(--ease-out) both; }
.nation-entry:nth-child(1) { --reveal-delay: 0ms; }
.nation-entry:nth-child(2) { --reveal-delay: 90ms; }
.nation-entry:nth-child(3) { --reveal-delay: 180ms; }
.nation-entry:nth-child(4) { --reveal-delay: 270ms; }
.nation-entry.is-revealing { animation-delay: var(--reveal-delay); }
@media (max-width: 1000px) {
  .nation-register { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nation-entry--wake { grid-row: auto; }
  .nation-entry--telling { margin-top: 64px; }
  .nation-entry--flame { margin-top: 0; }
  .nation-entry--unsaid { grid-column: auto; margin-top: 48px; }
  .nation-entry--unsaid .nation-card { display: block; }
  .nation-entry--unsaid .nation-plate { aspect-ratio: 4 / 3; min-height: 0; }
}
@media (max-width: 600px) {
  .nation-register { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .nation-entry { margin-top: 0; }
  .nation-entry--wake .nation-plate { aspect-ratio: 4 / 5; }
  .register-intro { margin-left: 0; }
  .unratified-notice { grid-template-columns: 1fr; gap: 16px; }
}
@media (hover: none), (pointer: coarse) {
  .nation-metadata { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .nation-entry.is-revealing { animation: none; opacity: 1; transform: none; }
  .nation-card, .nation-plate img, .plate-placeholder, .nation-label, .nation-metadata { transition: none; }
  .nation-register .nation-card:hover, .nation-card:hover :is(img, .plate-placeholder) { transform: none; }
  .nation-metadata { opacity: 1; }
}

/* ---------- RESIDENTS ---------- */
.districts-section-head{
  font-family:var(--font-mono);
  font-size:10px;letter-spacing:.24em;text-transform:uppercase;
  opacity:.42;
  margin:clamp(48px,9vh,100px) 0 22px;
  padding-bottom:10px;border-bottom:1px solid rgba(232,221,200,.12);
}
.residents{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:clamp(14px,2vw,26px);
}
.res-nation{
  border:1px solid rgba(232,221,200,.12);
  padding:clamp(16px,2vw,24px);
  background:#0b0b0e;
}
.res-nation__name{
  font-family:var(--font-display);
  font-size:clamp(1.1rem,2vw,1.6rem);
  text-transform:uppercase;margin:0 0 12px;
}
.res-nation ul{list-style:none;margin:0 0 12px;padding:0;}
.res-nation li{
  font-family:var(--font-body);font-weight:300;
  font-size:.88rem;line-height:1.9;opacity:.8;
  display:flex;gap:10px;align-items:baseline;
}
.res-id{
  font-family:var(--font-mono);
  font-size:9px;letter-spacing:.14em;
  color:var(--jade);opacity:.9;flex:none;min-width:44px;
}
.res-note{
  font-family:var(--font-editorial);font-style:italic;
  font-size:.86rem;line-height:1.55;opacity:.62;margin:0;
}
