/* © 2026 Revisited Game Studios. All rights reserved. */
/* Revisited Game Studios: one shared stylesheet. Each page is a cabinet with its own palette (body class). */

:root, .t-home, .t-serpents {
  --bg: #0B0C0E; --panel: #14171B; --line: #22272C; --edge: #262D33; --edge2: #333B41;
  --text: #E8EDE9; --soft: #B9C4BD; --dim: #8D9A92;
  --acc: #7DF7A3; --acc2: #FFB84D; --on: #0B0C0E; --deep: #06070A;
  --scan: rgba(125, 247, 163, 0.045);
  --px: 'Press Start 2P', ui-monospace, monospace;
  --sans: 'Space Grotesk', 'Helvetica Neue', Arial, sans-serif;
  --h1: 62px;
}
.t-furball {
  --bg: #0A0A10; --panel: #15151F; --line: #23232F; --edge: #272736; --edge2: #34344A;
  --text: #ECEAF2; --soft: #BDBACB; --dim: #9A97AD;
  --acc: #FFB84D; --acc2: #8B7BF7; --on: #0A0A10; --deep: #050509;
  --scan: rgba(139, 123, 247, 0.05);
  --h1: 66px;
}
.t-kalliope {
  --bg: #17110F; --panel: #241A15; --line: #3C2C22; --edge: #3C2C22; --edge2: #6A4E36;
  --text: #FFF3DC; --soft: #DCC9B4; --dim: #C9B49F;
  --acc: #FFC24B; --acc2: #FF8AC8; --on: #17110F; --deep: #FFFAF0;
  --cream: #FFF3DC; --paper: #FFFAF0; --tan: #C99A5E; --brick: #B4452B; --brown: #8A6A4E;
  --h1: 80px;
}
/* Rally Revs: night asphalt, kerb red, gauge yellow (taken from its screenshot). */
.t-rally {
  --bg: #0D0F14; --panel: #161A22; --line: #232833; --edge: #2A303D; --edge2: #3A4252;
  --text: #EDEFF3; --soft: #BCC2CF; --dim: #9098A8;
  --acc: #FF5A4E; --acc2: #FFCB47; --on: #0D0F14; --deep: #07080B;
  --scan: rgba(255, 90, 78, 0.05);
  --h1: 66px;
}
/* Melinewen: night violet and day gold (the board's two halves). */
.t-melinewen {
  --bg: #0E0B16; --panel: #181325; --line: #262036; --edge: #2E2742; --edge2: #453B61;
  --text: #EFEAF7; --soft: #C4BCD6; --dim: #9C93B2;
  --acc: #FFD27A; --acc2: #B9A2FF; --on: #0E0B16; --deep: #07050C;
  --scan: rgba(185, 162, 255, 0.05);
  --h1: 70px;
}
/* Knights of Melinewen: dusk slate and the title's gold. */
.t-knights {
  --bg: #0F1318; --panel: #171D24; --line: #242C35; --edge: #2B3440; --edge2: #3D4855;
  --text: #ECEFF2; --soft: #BCC6CF; --dim: #93A0AD;
  --acc: #F5C518; --acc2: #9FC4D8; --on: #0F1318; --deep: #080A0D;
  --scan: rgba(159, 196, 216, 0.05);
  --h1: 64px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font-family: var(--sans); font-size: 16px; line-height: 1.5;
  overflow-wrap: break-word;
}
img { max-width: 100%; }
a { color: var(--acc); }
a:hover { color: var(--acc2); }
:focus-visible { outline: 3px solid var(--acc2); outline-offset: 3px; border-radius: 2px; }
h1, h2, h3, p, figure { margin: 0; }
.px { font-family: var(--px); font-weight: 400; line-height: 1.6; }

.wrap { max-width: 1280px; margin: 0 auto; padding: 0 64px; }

/* ---------- header ---------- */
.top { border-bottom: 1px solid var(--line); }
.top .wrap { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: inline-flex; align-items: center; gap: 14px; color: var(--text); text-decoration: none; min-height: 44px; }
.brand:hover { color: var(--text); }
.brand .px { font-size: 12px; letter-spacing: 0.02em; }
.nav { display: flex; gap: 30px; align-items: center; }
.nav a:not(.btn) { font-size: 15px; color: var(--soft); text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.nav a:not(.btn):hover { color: var(--acc2); }

/* ---------- buttons ---------- */
.btn {
  font-family: var(--px); font-size: 10px; line-height: 1.3; color: var(--on); background: var(--acc);
  padding: 13px 16px; min-height: 44px; text-decoration: none; border-radius: 2px;
  display: inline-flex; align-items: center; justify-content: center; text-align: center;
}
.btn:hover { color: var(--on); filter: brightness(1.08); }
.btn-big { font-size: 13px; padding: 22px 34px; }
.btn-mid { font-size: 11px; padding: 19px 26px; }
.btn-ghost {
  font-family: var(--sans); font-size: 14px; color: var(--soft); border: 1px solid var(--edge2);
  padding: 12px 14px; min-height: 44px; text-decoration: none; border-radius: 2px;
  display: inline-flex; align-items: center;
}
.btn-ghost:hover { color: var(--acc2); border-color: var(--acc2); }

/* ---------- hero ---------- */
.hero {
  background-color: var(--bg);
  background-image: repeating-linear-gradient(to bottom, var(--scan) 0px, var(--scan) 1px, transparent 1px, transparent 4px);
}
.hero .wrap { display: grid; grid-template-columns: 560px minmax(0, 1fr); gap: 52px; padding-top: 64px; padding-bottom: 52px; }
.hero-text { display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
.eyebrow { font-family: var(--px); font-size: 10px; line-height: 1.6; letter-spacing: 0.08em; color: var(--acc2); }
.hero h1 { font-size: clamp(44px, 7vw, var(--h1)); line-height: 1; letter-spacing: -0.03em; font-weight: 700; text-wrap: balance; }
.tagline { font-size: 26px; line-height: 1.35; font-weight: 500; color: var(--acc); text-wrap: pretty; }
.lead { font-size: 18px; line-height: 1.6; color: var(--soft); max-width: 480px; text-wrap: pretty; }
.cta { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; padding-top: 6px; }
.cta-note { font-size: 14px; color: var(--dim); line-height: 1.5; }
.facts { display: flex; flex-wrap: wrap; gap: 14px 32px; border-top: 1px solid var(--line); margin-top: 8px; padding-top: 20px; align-self: stretch; }
.facts div { display: flex; flex-direction: column; gap: 4px; }
.facts .px { font-size: 9px; color: var(--dim); }
.facts span:last-child { font-size: 15px; }

/* home hero */
.t-home .hero .wrap { grid-template-columns: 600px minmax(0, 1fr); gap: 56px; padding-top: 76px; padding-bottom: 44px; }
.t-home .hero-text { gap: 28px; }
.t-home .hero h1 { font-size: clamp(46px, 7.5vw, 78px); line-height: 0.98; }
.t-home .hero h1 span { color: var(--acc); }
.t-home .lead { font-size: 19px; max-width: 520px; }
.t-home .cta { padding-top: 8px; }

/* the cabinet: a lit screen in a frame */
.cab {
  padding: 18px; background: var(--panel); border: 1px solid var(--edge); border-radius: 10px;
  display: flex; flex-direction: column; gap: 14px; min-width: 0;
}
.screen { flex: 1; position: relative; min-height: 420px; border-radius: 6px; overflow: hidden; background: var(--deep); }
.screen img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.cab-cap { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-family: var(--px); font-size: 9px; line-height: 1.6; color: var(--dim); }
.cab-cap span:last-child { color: var(--acc); text-align: right; }

/* ---------- ticker ---------- */
.ticker { background: var(--panel); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ticker ul {
  list-style: none; margin: 0 auto; max-width: 1280px; padding: 12px 24px; min-height: 64px;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 18px;
}
.ticker li { font-family: var(--px); font-size: 10px; line-height: 1.6; color: var(--dim); }
.ticker li.dia { color: var(--acc); font-family: var(--sans); font-size: 16px; }

/* ---------- home: games ---------- */
.games { padding: 64px 0 72px; }
.games .wrap { display: flex; flex-direction: column; gap: 32px; }
.sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px 20px; flex-wrap: wrap; }
.sec-head h2 { font-size: 40px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.1; }
.sec-head span { font-size: 15px; color: var(--dim); }
.grid4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.grid6 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }

.card {
  --c-bg: var(--panel); --c-edge: var(--edge); --c-kick: var(--acc2); --c-h: var(--text); --c-p: var(--soft);
  --c-meta: var(--dim); --c-btn: var(--acc); --c-on: var(--on); --c-ghost: var(--soft); --c-ghost-b: var(--edge2);
  background: var(--c-bg); border: 1px solid var(--c-edge); border-radius: 10px; overflow: hidden;
  display: flex; flex-direction: column; min-width: 0;
}
.card.k {
  --c-bg: #241A15; --c-edge: #3C2C22; --c-kick: #FF8AC8; --c-h: #FFF3DC; --c-p: #DCC9B4;
  --c-meta: #C9B49F; --c-btn: #FFC24B; --c-on: #17110F; --c-ghost: #DCC9B4; --c-ghost-b: #6A4E36;
}
.card.m {
  --c-bg: #181325; --c-edge: #2E2742; --c-kick: #B9A2FF; --c-h: #EFEAF7; --c-p: #C4BCD6;
  --c-meta: #9C93B2; --c-btn: #FFD27A; --c-on: #0E0B16; --c-ghost: #C4BCD6; --c-ghost-b: #453B61;
}
.card.n {
  --c-bg: #171D24; --c-edge: #2B3440; --c-kick: #9FC4D8; --c-h: #ECEFF2; --c-p: #BCC6CF;
  --c-meta: #93A0AD; --c-btn: #F5C518; --c-on: #0F1318; --c-ghost: #BCC6CF; --c-ghost-b: #3D4855;
}
.card-art { aspect-ratio: 3 / 2; border-bottom: 1px solid var(--c-edge); background: var(--deep); overflow: hidden; }
.card-art img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card-body { flex: 1; padding: 24px; display: flex; flex-direction: column; gap: 12px; }
.card .kick { font-family: var(--px); font-size: 9px; line-height: 1.6; color: var(--c-kick); }
.card h3 { font-size: 23px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.2; color: var(--c-h); }
.card p { font-size: 15px; line-height: 1.5; color: var(--c-p); }
.card-foot { margin-top: auto; display: flex; flex-direction: column; gap: 14px; padding-top: 4px; }
.card .meta { font-size: 13px; color: var(--c-meta); }
.card .acts { display: flex; gap: 10px; }
.card .acts .btn { flex: 1; background: var(--c-btn); color: var(--c-on); }
.card .acts .btn-ghost { color: var(--c-ghost); border-color: var(--c-ghost-b); }
.card .acts .btn-ghost:hover { color: var(--c-btn); border-color: var(--c-btn); }

/* Kalliope's card art: the deck's own faces on cream */
.deal { background: #FFF3DC; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
.deal svg.dots { width: 100%; height: 10px; display: block; }
.fan { flex: 1; display: flex; align-items: center; justify-content: center; gap: 10px; }
.fan span {
  width: 62px; height: 84px; background: #FFFAF0; border: 2px solid #C99A5E; border-radius: 7px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.fan span img { width: 38px; height: 38px; display: block; }
.fan span:nth-child(1) { transform: rotate(-9deg); }
.fan span:nth-child(2) { height: 92px; }
.fan span:nth-child(2) img { width: 40px; height: 40px; }
.fan span:nth-child(3) { transform: rotate(9deg); }

/* ---------- home: three promises ---------- */
.promises { background: var(--panel); border-top: 1px solid var(--line); }
.promises .wrap { min-height: 200px; padding-top: 44px; padding-bottom: 44px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 44px; align-items: center; }
.promises div { display: flex; flex-direction: column; gap: 10px; }
.promises h2 { font-family: var(--px); font-weight: 400; font-size: 11px; line-height: 1.6; color: var(--acc); }
.promises p { font-size: 16px; line-height: 1.55; color: var(--soft); }

/* ---------- footer ---------- */
.foot { border-top: 1px solid var(--line); }
.foot .wrap { min-height: 104px; display: flex; align-items: center; justify-content: space-between; gap: 8px 28px; flex-wrap: wrap; padding-top: 16px; padding-bottom: 16px; }
.foot small { font-size: 14px; color: var(--dim); }
.foot nav { display: flex; flex-wrap: wrap; gap: 0 28px; }
.foot nav a { font-size: 14px; color: var(--soft); text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.foot nav a:hover { color: var(--acc2); }

/* ---------- game pages: classic -> revisited ---------- */
.vs { background: var(--panel); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.vs .wrap { min-height: 200px; padding-top: 40px; padding-bottom: 40px; display: flex; align-items: center; gap: 44px; }
.vs .side { flex: 1; display: flex; flex-direction: column; gap: 10px; }
.vs .side .px { font-size: 10px; letter-spacing: 0.08em; color: var(--dim); }
.vs .side:last-child .px { color: var(--acc); }
.vs .side p { font-size: 20px; line-height: 1.5; color: var(--soft); }
.vs .side:last-child p { color: var(--text); }
.vs svg { flex-shrink: 0; }

/* acts / chapters row */
.acts-row .wrap { min-height: 220px; padding-top: 32px; padding-bottom: 32px; display: flex; gap: 40px; align-items: center; }
.acts-intro { width: 210px; flex-shrink: 0; display: flex; flex-direction: column; gap: 8px; }
.acts-intro h2 { font-family: var(--px); font-weight: 400; font-size: 10px; line-height: 1.6; letter-spacing: 0.08em; color: var(--acc2); }
.acts-intro p { font-size: 15px; line-height: 1.5; color: var(--soft); }
.acts-list { flex: 1; min-width: 0; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n, 5), minmax(0, 1fr)); gap: 14px; }

/* Serpents: acts painted in the act palettes */
.act { display: flex; flex-direction: column; gap: 10px; }
.act .sw { height: 76px; padding: 7px; border-radius: 5px; border: 1px solid var(--edge); }
.act .sw div { height: 100%; border-radius: 2px; display: flex; align-items: center; padding-left: 9px; }
.act .sw i { width: 42px; max-width: 80%; height: 9px; border-radius: 5px; display: block; }
.act.on .sw { border-color: var(--acc); }
.act .lbl { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.act .lbl .px { font-size: 12px; color: var(--dim); }
.act .lbl span:last-child { font-size: 13px; color: var(--dim); }
.act.on .lbl .px { color: var(--acc); }
.act.on .lbl span:last-child { color: var(--soft); }

/* Furball / Rally: numbered chapter tiles */
.chap { padding: 16px 0; background: color-mix(in srgb, var(--bg) 60%, var(--panel)); border: 1px solid var(--edge); border-radius: 6px; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.chap .px { font-size: 14px; color: var(--dim); }
.chap span:last-child { font-size: 13px; color: var(--dim); min-height: 1.5em; }
.chap.on { background: var(--panel); border-color: var(--acc); }
.chap.on .px { color: var(--acc); }
.chap.on span:last-child { color: var(--soft); }

/* screens */
.screens { padding-bottom: 48px; }
.screens .wrap { display: flex; flex-direction: column; gap: 20px; }
.screens .sec-head h2 { font-size: 26px; }
.screens .sec-head span { font-size: 14px; }
.shots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.shots.tall { grid-template-columns: repeat(2, minmax(0, 340px)); justify-content: center; }
.shots figure { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.shots .frame { border: 1px solid var(--edge); border-radius: 8px; overflow: hidden; background: var(--deep); aspect-ratio: 16 / 10; }
.shots.tall .frame { aspect-ratio: 3 / 4; }
.shots img { width: 100%; height: 100%; object-fit: cover; display: block; }
.shots figcaption { font-family: var(--px); font-size: 9px; line-height: 1.6; color: var(--dim); }

/* the other games */
.others { background: var(--panel); border-top: 1px solid var(--line); }
.others .wrap { padding-top: 40px; padding-bottom: 40px; display: flex; flex-direction: column; gap: 18px; }
.others h2 { font-family: var(--px); font-weight: 400; font-size: 10px; line-height: 1.6; color: var(--dim); }
.others ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.other {
  height: 100%; padding: 16px 20px; background: var(--bg); border: 1px solid var(--edge); border-radius: 8px;
  text-decoration: none; display: flex; align-items: center; gap: 20px; min-height: 92px;
}
.other:hover { border-color: var(--acc); }
.other.k { border-color: #3C2C22; }
.other.k:hover { border-color: #FFC24B; }
.other .th { flex-shrink: 0; width: 82px; height: 60px; object-fit: cover; border-radius: 5px; display: block; }
.other .th.k { background: #FFF3DC; display: flex; align-items: center; justify-content: center; gap: 4px; }
.other .th.k img { width: 26px; height: 26px; display: block; }
.other .tx { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.other .tx b { font-size: 20px; font-weight: 700; color: var(--text); line-height: 1.2; }
.other .tx span { font-size: 14px; color: var(--dim); }
.other.k .tx span { color: #C9B49F; }

/* ---------- Kalliope ---------- */
.t-kalliope .hero {
  background-image: radial-gradient(rgba(255, 194, 75, 0.12) 2px, transparent 2px);
  background-size: 34px 34px;
}
.t-kalliope .hero .wrap { grid-template-columns: 548px minmax(0, 1fr); padding-top: 60px; }
.t-kalliope .hero h1 { color: var(--acc); }
.t-kalliope .tagline { color: var(--text); }
.t-kalliope .lead { max-width: 470px; }
.cab.cream { background: var(--cream); border-color: #E4D2B4; border-radius: 12px; padding: 16px; gap: 12px; }
.cream-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 0 6px; font-family: var(--px); font-size: 9px; line-height: 1.6; color: var(--brown); }
.cream-row svg { max-width: 60%; height: auto; }
.cream-row .red { color: var(--brick); }
.table { flex: 1; min-height: 360px; background: var(--paper); border: 1px solid #EADCC2; border-radius: 8px; display: flex; align-items: center; justify-content: center; gap: 4px; padding: 20px 8px; }
.table span {
  --w: 86px; width: var(--w); height: calc(var(--w) * 1.46); background: var(--cream); border: 2px solid var(--tan); border-radius: 9px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.table span img { width: 64%; height: auto; display: block; }
.table span:nth-child(1) { transform: rotate(-12deg); height: calc(var(--w) * 1.37); }
.table span:nth-child(2) { transform: rotate(-4deg); }
.table span:nth-child(3) { transform: rotate(4deg); }
.table span:nth-child(4) { transform: rotate(12deg); height: calc(var(--w) * 1.37); }

.best { background: var(--cream); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.best .wrap { min-height: 200px; padding-top: 40px; padding-bottom: 40px; display: flex; align-items: center; gap: 24px 44px; }
.best .lbl { flex-shrink: 0; display: flex; flex-direction: column; gap: 10px; }
.best h2 { font-family: var(--px); font-weight: 400; font-size: 10px; line-height: 1.6; letter-spacing: 0.08em; color: var(--brick); }
.best p { flex: 1; font-size: 24px; line-height: 1.45; color: #2A1A12; text-wrap: pretty; }

.how { padding: 56px 0; }
.how .wrap { display: flex; flex-direction: column; gap: 28px; }
.how h2 { font-size: 34px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.1; }
.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.steps li { padding: 22px; background: var(--panel); border: 1px solid var(--edge); border-radius: 8px; display: flex; flex-direction: column; gap: 10px; }
.steps .px { font-size: 11px; color: var(--acc2); }
.steps h3 { font-family: var(--px); font-weight: 400; font-size: 11px; line-height: 1.6; color: var(--acc2); }
.steps p { font-size: 17px; line-height: 1.5; }
.join { display: flex; align-items: baseline; gap: 10px 16px; padding-top: 4px; flex-wrap: wrap; }
.join h3 { font-family: var(--px); font-weight: 400; font-size: 10px; line-height: 1.6; color: var(--dim); flex-shrink: 0; }
.join p { font-size: 16px; line-height: 1.55; color: var(--soft); max-width: 760px; flex: 1; min-width: 240px; }

.deck { padding-bottom: 48px; }
.deck .wrap { display: flex; flex-direction: column; gap: 20px; }
.deck .sec-head h2 { font-size: 26px; }
.deck .sec-head span { font-size: 14px; }
.deck ul { list-style: none; margin: 0; background: var(--cream); border-radius: 10px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; align-items: center; padding: 48px 28px; }
.deck li { height: 128px; background: var(--paper); border: 2px solid var(--tan); border-radius: 9px; display: flex; align-items: center; justify-content: center; }
.deck li img { width: 56px; height: 56px; display: block; }

/* ---------- Rally ---------- */
.t-rally .hero {
  background-image:
    repeating-linear-gradient(to bottom, var(--scan) 0px, var(--scan) 1px, transparent 1px, transparent 4px);
}
.kerb { height: 6px; background: repeating-linear-gradient(90deg, #FF5A4E 0 22px, #F4F1EA 22px 44px); opacity: 0.9; }
.travels { background: var(--panel); border-bottom: 1px solid var(--line); }
.travels .wrap { min-height: 200px; padding-top: 40px; padding-bottom: 40px; display: flex; align-items: center; gap: 24px 44px; }
.travels .lbl { flex-shrink: 0; width: 210px; display: flex; flex-direction: column; gap: 12px; }
.travels h2 { font-family: var(--px); font-weight: 400; font-size: 10px; line-height: 1.6; letter-spacing: 0.08em; color: var(--acc2); }
.travels .body { flex: 1; display: flex; flex-direction: column; gap: 10px; }
.travels .body p:first-child { font-size: 24px; line-height: 1.45; color: var(--text); text-wrap: pretty; }
.travels .credit { font-size: 14px; color: var(--dim); }
.travels .credit a { color: var(--soft); text-underline-offset: 3px; display: inline-block; padding: 12px 0; margin: -12px 0; }
.t-rally .how { padding: 8px 0 64px; }
.t-rally .how h2 { font-size: 26px; }
.t-rally .steps p { color: var(--soft); }

/* ---------- Melinewen / Knights ---------- */
.steps.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.t-melinewen .how h2, .t-knights .how h2 { font-size: 26px; }
.t-melinewen .steps p, .t-knights .steps p { color: var(--soft); font-size: 16px; }

/* ---------- privacy ---------- */
.policy { padding: 56px 0 64px; }
.policy .wrap { max-width: 848px; }
.policy h1 { font-size: clamp(40px, 7vw, 56px); line-height: 1; letter-spacing: -0.03em; font-weight: 700; margin: 18px 0 12px; }
.policy .date { color: var(--dim); font-size: 15px; margin-bottom: 12px; }
.policy h2 { font-family: var(--px); font-weight: 400; font-size: 11px; line-height: 1.6; color: var(--acc); margin: 36px 0 12px; }
.policy p { color: var(--soft); font-size: 17px; line-height: 1.65; margin: 0 0 14px; }
.policy a { text-underline-offset: 3px; }

/* ---------- responsive ---------- */
@media (max-width: 1180px) {
  .grid4, .grid6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps.four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .card-art { aspect-ratio: 16 / 9; }
}
@media (max-width: 1100px) {
  .hero .wrap, .t-home .hero .wrap, .t-kalliope .hero .wrap { grid-template-columns: minmax(0, 1fr); gap: 40px; padding-top: 48px; padding-bottom: 48px; }
  .screen { min-height: 0; aspect-ratio: 16 / 10; }
  .table { min-height: 0; }
  .others ul { grid-template-columns: minmax(0, 1fr); gap: 14px; max-width: 640px; }
}
@media (max-width: 900px) {
  .wrap { padding: 0 24px; }
  .nav a.g { display: none; }
  .promises .wrap { grid-template-columns: minmax(0, 1fr); }
  .vs .wrap { flex-direction: column; align-items: stretch; gap: 20px; }
  .vs svg { transform: rotate(90deg); align-self: flex-start; }
  .acts-row .wrap, .travels .wrap, .best .wrap { flex-direction: column; align-items: stretch; gap: 20px; }
  .acts-intro, .travels .lbl { width: auto; }
  .steps, .steps.four { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .deck ul { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 24px 20px; gap: 16px; }
}
@media (max-width: 640px) {
  .wrap { padding: 0 16px; }
  .nav { gap: 16px; }
  .grid4, .grid6 { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .sec-head h2 { font-size: 32px; }
  .games { padding: 44px 0 52px; }
  .tagline { font-size: 22px; }
  .lead, .t-home .lead { font-size: 17px; }
  .btn-big { padding: 20px 24px; }
  .ticker li.dia { display: none; }
  .ticker ul { flex-direction: column; gap: 6px; padding: 16px; text-align: center; }
  .vs .side p, .best p, .travels .body p:first-child { font-size: 19px; }
  .acts-list { gap: 8px; }
  .act .sw { height: 56px; padding: 5px; }
  .act .sw div { padding-left: 5px; }
  .act .lbl { flex-direction: column; gap: 2px; }
  .chap { padding: 12px 0; }
  .chap .px { font-size: 12px; }
  .chap span:last-child { font-size: 12px; }
  .t-furball .acts-list, .t-rally .acts-list { gap: 6px; }
  .shots { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .shots.tall { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .table span { --w: 62px; }
  .table { gap: 0; padding: 24px 4px; }
  .deck li { height: 104px; }
  .deck li img { width: 48px; height: 48px; }
  .how { padding: 44px 0; }
  .how h2 { font-size: 28px; }
  .other { padding: 14px; gap: 14px; }
  .other .tx b { font-size: 18px; }
  .foot .wrap { flex-direction: column; align-items: flex-start; justify-content: center; }
}
@media (prefers-reduced-motion: no-preference) {
  .btn, .btn-ghost, .other { transition: filter .15s, border-color .15s, color .15s; }
}

/* logo mark in the page's colours */
.logo { flex-shrink: 0; display: block; }
.logo .o { fill: none; stroke: var(--acc); stroke-width: 2; }
.logo .a { fill: var(--acc); }
.logo .b { fill: var(--acc2); }

/* text for screen readers only */
.vh { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.nav a { white-space: nowrap; }
@media (max-width: 420px) {
  .top .wrap { gap: 12px; }
  .nav { gap: 14px; }
  .brand .px { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (max-width: 1100px) {
  .t-furball .screen { aspect-ratio: 852 / 700; }
  .t-furball .screen img { object-position: 50% 50% !important; }
}