/* Tratok whitepaper v2: the printed A4 edition (used for the PDF).
   Loaded with media="print". The screen styles in wp2.css are scoped to screen, so everything here starts clean.
   Running headers come from named pages; build.py adds one @page rule per section. */

:root {
  --navy: #0c1220; --ink: #172036; --body: #343d53; --soft: #4b556e; --muted: #6b7690; --faint: #98a1b4;
  --rule: #dde1ea; --rule2: #c9cfdb;
  --gold: #b8892f; --goldD: #8a6418; --goldL: #e3be6a; --goldT: #faf5ea; --goldR: #ead8ad;
  --teal: #1d8478; --tealT: #edf6f4;
}

@page {
  size: A4;
  margin: 22mm 17mm 20mm 17mm;
  @top-left { content: "TRATOK  \00B7  WHITEPAPER 2.0"; font: 600 6.4pt "DM Sans", sans-serif; letter-spacing: .22em; color: #98a1b4; vertical-align: bottom; padding-bottom: 6mm; }
  @top-right { content: ""; font: 600 6.6pt "DM Sans", sans-serif; letter-spacing: .06em; color: #8a6418; vertical-align: bottom; padding-bottom: 6mm; }
  @bottom-left { content: "tratok.com/whitepaper"; font: 400 6.6pt "DM Sans", sans-serif; letter-spacing: .04em; color: #98a1b4; vertical-align: top; padding-top: 6mm; }
  @bottom-right { content: counter(page); font: 600 8.5pt "Playfair Display", serif; color: #0c1220; vertical-align: top; padding-top: 5.4mm; }
}
@page cover { margin: 0; @top-left { content: none; } @top-right { content: none; } @bottom-left { content: none; } @bottom-right { content: none; } }
@page part { margin: 0; @top-left { content: none; } @top-right { content: none; } @bottom-left { content: none; } @bottom-right { content: none; } }
@page statement { margin: 0; @top-left { content: none; } @top-right { content: none; } @bottom-left { content: none; } @bottom-right { content: none; } }
@page back { margin: 0; @top-left { content: none; } @top-right { content: none; } @bottom-left { content: none; } @bottom-right { content: none; } }
@page toc { @top-right { content: none; } }

/* ---------- Base ---------- */
html, body { background: #fff; }
html { font-variant-numeric: lining-nums; }
body { margin: 0; font-family: var(--sans); font-size: 9.3pt; line-height: 1.55; color: var(--body); -webkit-print-color-adjust: exact; print-color-adjust: exact; text-rendering: optimizeLegibility; }
html[lang="ar"] body, html[lang="hi"] body, html[lang="th"] body { line-height: 1.75; }
html[lang="ja"] body, html[lang="zh"] body, html[lang="ko"] body { line-height: 1.75; }
a { color: inherit; text-decoration: none; }
p { margin: 0 0 3mm; }
img { max-width: 100%; }
.topbar, .progress, .side, .skip, .hero, .ctas, .no-print, .copy, footer.foot, .steps, .panel, .journey + .cancel,
.calc .rows, .calc .res, .note-screen, .toc-btn, .closing .ctas { display: none !important; }
.layout, main { display: block; margin: 0; padding: 0; max-width: none; }
.print-only { display: block; }
.screen-only { display: none !important; }

/* ---------- Cover ---------- */
.pcover { page: cover; height: 297mm; box-sizing: border-box; background: var(--navy); color: #eef0f5; position: relative; overflow: hidden; display: flex; flex-direction: column; padding: 17mm 19mm 15mm; }
.pcover .art { position: absolute; width: 196mm; height: 196mm; right: -66mm; top: -34mm; }
.pc-top { position: relative; display: flex; align-items: center; gap: 3.2mm; font: 700 8.4pt var(--sans); letter-spacing: .3em; text-transform: uppercase; color: #eef0f5; }
.pc-top img { width: 10mm; height: 10mm; }
.pc-top small { margin-inline-start: auto; font: 500 7.4pt var(--sans); letter-spacing: .14em; color: #a3aec6; }
.pc-main { position: relative; margin-top: auto; }
.pc-kicker { display: flex; align-items: center; gap: 4mm; font: 700 7.6pt var(--sans); letter-spacing: .32em; text-transform: uppercase; color: var(--goldL); }
.pc-kicker::before { content: ""; width: 12mm; height: .8pt; background: var(--goldL); }
.pc-title { font: 600 54pt/1.02 var(--serif); letter-spacing: -.012em; color: #fff; margin: 7mm 0 8mm; }
.pc-title em { display: block; font-style: normal; color: var(--goldL); }
.pc-lead { font-size: 11.4pt; line-height: 1.62; color: #c3cbdc; max-width: 142mm; margin: 0; }
.pc-stats { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 15mm; border-top: .6pt solid rgba(255,255,255,.2); padding-top: 6mm; }
.pc-stats div { padding: 0 4mm; border-inline-start: .6pt solid rgba(255,255,255,.14); }
.pc-stats div:first-child { padding-inline-start: 0; border: 0; }
.pc-stats b { display: block; font: 600 22pt/1 var(--serif); color: var(--goldL); }
.pc-stats span { display: block; font-size: 7.6pt; line-height: 1.4; color: #a3aec6; margin-top: 2.2mm; }
.pc-foot { position: relative; display: flex; justify-content: space-between; gap: 6mm; margin-top: 11mm; font-size: 7.2pt; letter-spacing: .05em; color: #8f9bb3; }

/* ---------- Contents ---------- */
.ptoc { page: toc; break-before: page; }
.ptoc > h2 { font: 600 30pt/1.1 var(--serif); color: var(--navy); margin: 0 0 2.4mm; }
.ptoc .toc-sub { font-size: 9.6pt; color: var(--soft); margin: 0 0 8mm; max-width: 140mm; }
.tp { margin-bottom: 5.4mm; break-inside: avoid; }
.tp-h { display: flex; align-items: baseline; gap: 4mm; border-bottom: 1.2pt solid var(--navy); padding-bottom: 1.8mm; margin-bottom: .6mm; }
.tp-h span { font: 700 6.8pt var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--goldD); white-space: nowrap; }
.tp-h b { font: 600 13pt var(--serif); color: var(--navy); }
.tp-h .pg { margin-inline-start: auto; font: 600 10pt var(--serif); letter-spacing: 0; text-transform: none; color: var(--navy); }
.ptoc ol { list-style: none; margin: 0; padding: 0; }
.ptoc li a { display: flex; align-items: baseline; gap: 3mm; padding: 1.55mm 0; font-size: 10pt; color: var(--ink); }
.ptoc .n { font: 600 9pt var(--serif); color: var(--gold); width: 7mm; flex: none; }
.ptoc .dots { flex: 1; border-bottom: .9pt dotted var(--rule2); position: relative; top: -1mm; }
.ptoc .pg { font: 600 10pt var(--serif); color: var(--navy); min-width: 6mm; text-align: end; }
.ptoc .tail a { display: flex; align-items: baseline; gap: 3mm; padding: 1.8mm 0; font-size: 10pt; color: var(--ink); border-top: 1.2pt solid var(--navy); }
.ptoc .print-note { margin-top: 8mm; font-size: 8pt; color: var(--muted); border-top: .5pt solid var(--rule); padding-top: 3mm; max-width: 150mm; }

/* ---------- Part dividers ---------- */
.ppart { page: part; break-before: page; height: 297mm; box-sizing: border-box; background: var(--navy); color: #eef0f5; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; padding: 0 24mm; }
.ppart .art { position: absolute; width: 170mm; height: 170mm; left: -70mm; bottom: -70mm; opacity: .8; }
.ppart .pp-num { position: absolute; top: 12mm; inset-inline-end: 18mm; font: 400 150pt/1 var(--serif); color: rgba(227,190,106,.13); }
.ppart .pp-word { position: relative; display: flex; align-items: center; gap: 4mm; font: 700 7.8pt var(--sans); letter-spacing: .32em; text-transform: uppercase; color: var(--goldL); }
.ppart .pp-word::before { content: ""; width: 12mm; height: .8pt; background: var(--goldL); }
.ppart h2 { position: relative; font: 600 40pt/1.06 var(--serif); color: #fff; margin: 7mm 0 6mm; max-width: 150mm; }
.ppart p { position: relative; font-size: 12pt; line-height: 1.6; color: #c3cbdc; max-width: 128mm; margin: 0 0 15mm; }
.ppart ol { position: relative; list-style: none; margin: 0; padding: 0; max-width: 132mm; border-top: .6pt solid rgba(255,255,255,.2); }
.ppart li { display: flex; align-items: baseline; gap: 4mm; padding: 2.8mm 0; border-bottom: .6pt solid rgba(255,255,255,.12); font-size: 10.6pt; color: #eef0f5; }
.ppart li .n { font: 600 9pt var(--serif); color: var(--goldL); width: 8mm; flex: none; }
.ppart li .pg { margin-inline-start: auto; font: 600 9.5pt var(--serif); color: #a3aec6; }

/* ---------- Section openers ---------- */
section.sec { break-before: page; }
.sec > .num { display: flex; align-items: center; gap: 5mm; font: 400 30pt/1 var(--serif); color: var(--gold); margin: 0 0 5mm; }
.sec > .num::after { content: ""; flex: 1; height: .7pt; background: var(--goldR); }
.sec > h2 { font: 600 25pt/1.12 var(--serif); letter-spacing: -.005em; color: var(--navy); margin: 0 0 4.5mm; }
.sec > .intro { font-size: 11pt; line-height: 1.6; color: var(--soft); margin: 0 0 8mm; max-width: 160mm; }
.sec h3 { font: 700 7pt/1.3 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--goldD); margin: 7mm 0 3.4mm; break-inside: avoid; break-after: avoid; }
.sec h3::before { content: ""; display: block; width: 8mm; height: 1.2pt; background: var(--gold); margin-bottom: 2.2mm; }
/* Keep a subheading with what follows: reserve 40mm under it, so it moves to the next page rather than sit alone */
.sec h3::after { content: ""; display: block; height: 28mm; margin-bottom: -28mm; }
h4 { font-family: var(--sans); }
h1, h2, .pc-title, .why h4, .pillar h4 { text-wrap: balance; }
sup.ref { line-height: 0; }
sup.ref a { font-size: 6.2pt; font-weight: 700; color: var(--gold); padding: 0 .4mm; }

/* ---------- Generic blocks (editorial, no boxes) ---------- */
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 5.5mm 9mm; }
.grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5.5mm 7mm; }
.card { background: none; border: 0; border-top: .6pt solid var(--rule2); border-radius: 0; padding: 2.8mm 0 0; break-inside: avoid; }
.card h4 { font: 700 9.8pt/1.32 var(--sans); color: var(--navy); margin: 0 0 1.3mm; }
.card p { font-size: 8.9pt; line-height: 1.52; color: var(--soft); margin: 0; }
.card.facts { border-top: 1.4pt solid var(--gold); }
.card.facts h4 { font: 600 11.5pt/1.25 var(--serif); }
#summary > p { font-size: 10.2pt; line-height: 1.62; color: var(--body); max-width: 162mm; }
#summary > p:first-of-type::first-letter { font: 600 30pt/0.9 var(--serif); float: left; color: var(--gold); padding: 1.2mm 2mm 0 0; }
.outro { margin: 8mm 0 0; padding: .5mm 0 .5mm 5mm; border-inline-start: 1.8pt solid var(--gold); font: italic 500 12.5pt/1.5 var(--serif); color: var(--navy); max-width: 160mm; break-inside: avoid; }

/* ---------- The difference ---------- */
.pillars { list-style: none; margin: 0; padding: 0; border-top: .6pt solid var(--rule2); }
.pillar { display: grid; grid-template-columns: 15mm 1fr; gap: 3mm; padding: 2.9mm 0 2.7mm; border-bottom: .6pt solid var(--rule); break-inside: avoid; }
.pillar .pn { font: 400 21pt/1 var(--serif); color: var(--gold); padding-top: .4mm; }
.pillar h4 { font: 600 12.6pt/1.25 var(--serif); color: var(--navy); margin: 0 0 1.4mm; }
.pillar p { font-size: 8.8pt; line-height: 1.47; color: var(--soft); margin: 0 0 1.1mm; }
.pillar .pp { margin: 0; font-size: 8.7pt; font-weight: 600; color: var(--goldD); }
.cmp-wrap { overflow: visible; border: 0; }
.cmp { width: 100%; border-collapse: collapse; font-size: 8.5pt; line-height: 1.4; }
.cmp thead th { background: var(--navy); color: #c9d1e2; font: 700 6.6pt/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; padding: 2.6mm 3mm; text-align: start; }
.cmp thead th.us { color: var(--goldL); }
.cmp tbody th { width: 25%; text-align: start; font-weight: 700; color: var(--navy); padding: 1.7mm 3mm; border-bottom: .5pt solid var(--rule); vertical-align: top; }
.cmp td { padding: 1.7mm 3mm; border-bottom: .5pt solid var(--rule); color: var(--muted); vertical-align: top; }
.cmp td.us { background: var(--tealT); color: var(--ink); font-weight: 600; }
.cmp td.us::before { content: ""; display: inline-block; width: 1.6mm; height: 1.6mm; border-radius: 50%; background: var(--teal); margin-inline-end: 1.8mm; vertical-align: .25mm; }
.cmp tr { break-inside: avoid; }
.why { margin: 5mm 0 0; background: var(--goldT); border-inline-start: 2pt solid var(--gold); padding: 4mm 5.6mm; break-inside: avoid; }
.why h4 { font: 600 12.6pt/1.3 var(--serif); color: var(--navy); margin: 0 0 1.6mm; }
.why p { margin: 0; font-size: 9.3pt; color: var(--soft); }
.ram { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7mm; }
.ram div { border-top: 1.4pt solid var(--gold); padding-top: 2.8mm; break-inside: avoid; }
.ram strong { display: block; font: 600 12.4pt var(--serif); color: var(--navy); margin-bottom: 1mm; }
.ram span { font-size: 8.9pt; color: var(--soft); }

/* ---------- Ecosystem ---------- */
.eco { display: grid; grid-template-columns: 48mm 1fr; gap: 8mm; align-items: start; }
.hub { width: 40mm; height: 40mm; margin: 6mm 0 0 4mm; border-radius: 50%; background: var(--navy); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; box-shadow: 0 0 0 2.6mm #f2e7cc, 0 0 0 5.4mm #faf5ea; }
.hub b { font: 600 19pt/1 var(--serif); color: var(--goldL); }
.hub span { display: block; font-size: 6.4pt; line-height: 1.35; color: #a3aec6; margin-top: 1.6mm; padding: 0 5mm; }
.plats { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 7mm; }
.plats li { border-top: .5pt solid var(--rule2); padding: 2.3mm 0 2.6mm; break-inside: avoid; }
.plats a { display: block; }
.plats .pw { display: block; font: 700 6pt/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--teal); }
.plats strong { display: block; font-size: 9.6pt; color: var(--navy); margin: .7mm 0 .4mm; }
.plats .pd { display: block; font-size: 8.3pt; line-height: 1.45; color: var(--soft); }
.plats .pu { display: block; font-size: 7.5pt; color: var(--goldD); margin-top: .7mm; }
.proof .card { display: block; background: var(--tealT); border: 0; border-inline-start: 2pt solid var(--teal); padding: 3.4mm 4.4mm; }
.badge { display: flex; align-items: center; gap: 1.6mm; font: 700 6.2pt var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--teal); margin-bottom: 1.2mm; }
.badge::before { content: ""; width: 1.8mm; height: 1.8mm; border-radius: 50%; background: var(--teal); }
.proof .pu { color: var(--goldD); font-size: 7.8pt; margin-top: 1.2mm; }
.live-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 6mm 9mm; }
.lg { border-top: 1.4pt solid var(--navy); padding-top: 2.4mm; break-inside: avoid; }
.lg.lg2 { border-top-color: var(--gold); }
.lg h4 { font: 700 6.8pt/1.3 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--navy); margin: 0 0 1.4mm; }
.lg.lg2 h4 { color: var(--goldD); }
ul.live { list-style: none; margin: 0; padding: 0; }
ul.live li { position: relative; padding: 1.2mm 0 1.4mm; padding-inline-start: 4.2mm; border-bottom: .5pt dotted var(--rule2); }
ul.live li:last-child { border-bottom: 0; }
ul.live li::before { content: ""; position: absolute; inset-inline-start: 0; top: 2.6mm; width: 1.6mm; height: 1.6mm; border-radius: 50%; background: var(--teal); }
.lg.lg2 ul.live li::before { background: var(--gold); }
ul.live b { display: block; font-size: 8.9pt; color: var(--navy); }
ul.live span { display: block; font-size: 8.1pt; line-height: 1.42; color: var(--muted); }
.timeline { list-style: none; margin: 0; padding: 0; border-top: 1.2pt solid var(--navy); break-inside: avoid; }
.timeline li { display: grid; grid-template-columns: 38mm 1fr; gap: 4mm; padding: 2.2mm 0; border-bottom: .5pt solid var(--rule); break-inside: avoid; }
.timeline b { font: 600 9.2pt var(--serif); color: var(--goldD); }
.timeline span { font-size: 8.8pt; color: var(--soft); }

/* ---------- How a booking works ---------- */
.journey { display: block; background: none; border: 0; padding: 0; }
.journey-print { display: grid !important; grid-template-columns: 1fr 1fr; gap: 0 9mm; list-style: none; margin: 0; padding: 0; counter-reset: j; }
.journey-print li { counter-increment: j; display: grid; grid-template-columns: 8.5mm 1fr; gap: 2.5mm; padding: 1.9mm 0 2.1mm; border-top: .6pt solid var(--rule2); break-inside: avoid; }
.journey-print li::before { content: counter(j); width: 6.6mm; height: 6.6mm; border-radius: 50%; background: var(--navy); color: var(--goldL); font: 700 8pt/6.6mm var(--sans); text-align: center; }
.journey-print b { display: block; font: 600 11pt/1.2 var(--serif); color: var(--navy); margin-bottom: .7mm; }
.journey-print span { display: block; font-size: 8.5pt; line-height: 1.42; color: var(--soft); }
.journey-print span.u { margin-top: 1.1mm; background: var(--goldT); padding: 1.3mm 2.2mm; font-size: 7.8pt; line-height: 1.38; color: #5a4518; }
.journey-print span.u i { display: block; font-style: normal; font: 700 6pt var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--goldD); margin-bottom: .6mm; }
.journey-print li.jp-cancel { counter-increment: none; grid-template-columns: 1fr; align-self: start; margin-top: 2mm; background: var(--tealT); border-top: 2pt solid var(--teal); padding: 2.8mm 4mm; }
.journey-print li.jp-cancel::before { display: none; }
.journey-print li.jp-cancel b { color: var(--teal); }

/* ---------- Travellers and providers ---------- */
.sub { margin-top: 2mm; }
.sub + .sub { margin-top: 9mm; }
.sub-h { break-after: avoid; }
.sub-h { display: flex; align-items: center; gap: 4mm; border-bottom: 1.2pt solid var(--navy); padding-bottom: 2.4mm; margin-bottom: 3.4mm; }
.sub-k { font: 700 6.4pt var(--sans); letter-spacing: .2em; text-transform: uppercase; color: #fff; background: var(--gold); padding: 1.3mm 2.4mm; border-radius: 1mm; }
.sub-corporate .sub-k { background: var(--teal); }
.sec h3.sub-t { font: 600 16pt/1.2 var(--serif); letter-spacing: 0; text-transform: none; color: var(--navy); margin: 0; }
.sec h3.sub-t::before { display: none; }
.sub-l { margin-inline-start: auto; font-size: 8pt; font-weight: 600; color: var(--goldD); }
.sub-intro { font-size: 10pt; line-height: 1.58; color: var(--soft); margin: 0 0 5mm; max-width: 160mm; }
.points { list-style: none; margin: 0 0 4mm; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 4mm 9mm; }
.points li { position: relative; padding-inline-start: 6.2mm; break-inside: avoid; }
.points li::before { content: ""; position: absolute; inset-inline-start: 0; top: .9mm; width: 3.8mm; height: 3.8mm; border-radius: 50%; background: #f3e8cc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8'%3E%3Cpath d='M1 4l3 3 5-6' stroke='%238a6418' fill='none' stroke-width='1.8'/%3E%3C/svg%3E") no-repeat center / 2.2mm auto; }
.sub-corporate .points li::before { background-color: #dcefeb; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8'%3E%3Cpath d='M1 4l3 3 5-6' stroke='%231d8478' fill='none' stroke-width='1.8'/%3E%3C/svg%3E"); }
.points b { display: block; font-size: 9.6pt; line-height: 1.3; color: var(--navy); margin-bottom: .6mm; }
.points span { display: block; font-size: 8.8pt; line-height: 1.5; color: var(--soft); }
blockquote.q { position: relative; margin: 6mm 0 0; padding: 0; padding-inline-start: 10mm; border: 0; background: none; break-inside: avoid; }
blockquote.q::before { content: "\201C"; position: absolute; inset-inline-start: 0; top: -1.6mm; font: 700 32pt/1 var(--serif); color: var(--gold); }
blockquote.q p { font: italic 500 12.4pt/1.5 var(--serif); color: var(--navy); margin: 0 0 1.6mm; max-width: 150mm; }
blockquote.q cite { font: 700 6.6pt var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--goldD); font-style: normal; }
.calc { display: flex; flex-direction: column; margin: 6mm 0; padding: 4.4mm 5.4mm 4mm; border: .6pt solid var(--rule2); border-top: 2pt solid var(--navy); background: none; break-inside: avoid; }
.calc h3 { margin-top: 0; }
.calc .fee { order: 3; font-size: 7.4pt; color: var(--faint); margin: 2.4mm 0 0; }
.calc-static { display: block !important; order: 2; }
.calc-static .note { font-size: 8.4pt; color: var(--muted); margin: 0 0 2.4mm; }
.calc-static table { width: 100%; border-collapse: collapse; }
.calc-static td { padding: 2mm 0; border-bottom: .5pt solid var(--rule); font-size: 9.2pt; color: var(--body); }
.calc-static td.n { text-align: end; font: 600 11pt var(--serif); color: var(--navy); }
.calc-static tr:nth-child(2) td { color: var(--teal); font-weight: 700; }
.calc-static tr:nth-child(2) td.n { color: var(--teal); }
.calc-static tr:last-child td { border-bottom: 0; }

/* ---------- Technology ---------- */
.stack { display: grid; gap: 1.6mm; margin: 0; break-inside: avoid; }
.layer { display: grid; grid-template-columns: 27mm 1fr; border: 0; border-radius: 0; padding: 0; background: none; }
.layer b { display: flex; align-items: center; padding: 0 3mm; background: var(--navy); color: var(--goldL); font: 700 6.6pt var(--sans); letter-spacing: .16em; text-transform: uppercase; }
.layer ul { list-style: none; margin: 0; padding: 2.4mm 3mm; display: flex; flex-wrap: wrap; gap: 1.4mm; }
.layer li { background: #fff; border: .5pt solid var(--rule2); border-radius: 4mm; padding: .8mm 2.6mm; font-size: 7.7pt; color: var(--ink); }
.layer.l0 ul { background: #eef1f8; } .layer.l1 ul { background: var(--tealT); } .layer.l2 ul { background: var(--goldT); } .layer.l3 ul { background: #f8eeeb; }
.layer.l1 b { background: #17213a; } .layer.l2 b { background: #1f2b47; } .layer.l3 b { background: #283654; }
.stack-note { text-align: end; font-size: 7.2pt; color: var(--faint); margin: 1.4mm 0 7mm; }
.bench { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--navy); padding: 5.4mm 6mm; break-inside: avoid; }
.bench div { padding: 0 4mm; border-inline-start: .5pt solid rgba(255,255,255,.16); }
.bench div:first-child { padding-inline-start: 0; border: 0; }
.bench b { display: block; font: 600 18pt/1.1 var(--serif); color: var(--goldL); }
.bench strong { display: block; font-size: 8pt; line-height: 1.3; color: #eef0f5; margin-top: 1.8mm; }
.bench span { display: block; font-size: 7.1pt; line-height: 1.4; color: #a3aec6; margin-top: .7mm; }
.bench-note { font-size: 7.2pt; color: var(--faint); margin: 1.8mm 0 0; }

/* ---------- Security ---------- */
.layers { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 9mm; }
.layers li { display: grid; grid-template-columns: 9mm 1fr; gap: 2.6mm; padding: 3.2mm 0; border-top: .6pt solid var(--rule2); background: none; border-radius: 0; break-inside: avoid; }
.layers .ln { width: 7mm; height: 7mm; border-radius: 1.4mm; background: var(--navy); color: var(--goldL); font: 600 9pt/7mm var(--serif); text-align: center; }
.layers h4 { font: 700 9.8pt/1.3 var(--sans); color: var(--navy); margin: .3mm 0 1mm; }
.layers p { font-size: 8.7pt; line-height: 1.48; color: var(--soft); margin: 0; }

/* ---------- Token ---------- */
.spec { width: 100%; border-collapse: collapse; font-size: 9pt; border-top: 1.2pt solid var(--navy); }
.spec th, .spec td { padding: 2.2mm 0; border-bottom: .5pt solid var(--rule); text-align: start; vertical-align: top; }
.spec th { width: 34%; color: var(--muted); font-weight: 500; }
.spec td { color: var(--navy); font-weight: 600; }
.spec td code { font: 500 8pt ui-monospace, Consolas, "Courier New", monospace; color: var(--goldD); word-break: break-all; }
.uses { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1.6mm 9mm; }
.uses li { position: relative; padding-inline-start: 4.4mm; font-size: 8.9pt; color: var(--body); }
.uses li::before { content: ""; position: absolute; inset-inline-start: 0; top: 1.9mm; width: 1.6mm; height: 1.6mm; background: var(--gold); }
.dist { display: grid; grid-template-columns: 54mm 1fr; gap: 9mm; align-items: center; break-inside: avoid; }
.dist svg { width: 54mm; height: auto; color: var(--navy); }
.legend { list-style: none; margin: 0; padding: 0; display: grid; gap: 2.2mm; }
.legend li { display: grid; grid-template-columns: 3mm 12mm 1fr; gap: 2.6mm; align-items: start; break-inside: avoid; }
.legend i { width: 3mm; height: 3mm; border-radius: .6mm; margin-top: 1.2mm; }
.legend b { font: 600 10.4pt var(--serif); color: var(--navy); }
.legend span { font-size: 8.3pt; line-height: 1.45; color: var(--muted); }
.legend span strong { display: block; font-size: 9pt; color: var(--navy); }
.lock { margin: 6mm 0; background: var(--goldT); border-inline-start: 2pt solid var(--gold); padding: 3.8mm 5mm; font-size: 9.1pt; color: var(--soft); break-inside: avoid; }
.lock::before { content: "*"; color: var(--gold); font-weight: 700; margin-inline-end: 1.6mm; }

/* ---------- Impact ---------- */
.illus { background: var(--navy); color: #eef0f5; padding: 6.4mm 7mm 5.6mm; margin: 0 0 8mm; break-inside: avoid; }
.illus h4 { font: 600 14.5pt/1.2 var(--serif); color: var(--goldL); margin: 0 0 1.8mm; }
.illus p { font-size: 9.2pt; color: #c3cbdc; margin: 0 0 4.4mm; max-width: 150mm; }
.illus-row { display: grid; grid-template-columns: repeat(3, 1fr); border-top: .5pt solid rgba(255,255,255,.18); padding-top: 4.4mm; }
.illus-row div { padding: 0 4mm; border-inline-start: .5pt solid rgba(255,255,255,.14); }
.illus-row div:first-child { padding-inline-start: 0; border: 0; }
.illus-row b { display: block; font: 600 20pt/1.05 var(--serif); color: #eef0f5; }
.illus-row .win b { color: #74d2c6; }
.illus-row span { display: block; font-size: 7.6pt; line-height: 1.4; color: #a3aec6; margin-top: 1.4mm; }
.illus .note { font-size: 7pt; color: #8f9bb3; margin: 3.6mm 0 0; }

/* ---------- Roadmap, team, risks ---------- */
.road { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7mm; }
.road .card { border-top: 2pt solid var(--teal); padding-top: 3mm; }
.road .card:nth-child(2) { border-top-color: var(--gold); }
.road .card:nth-child(3) { border-top-color: #a3aec6; }
.chip { font: 700 6.6pt var(--sans); letter-spacing: .18em; text-transform: uppercase; padding: 0; background: none; }
.chip.st-done { color: var(--teal); } .chip.st-progress { color: var(--goldD); } .chip.st-planned { color: var(--muted); }
.road ul { margin: 2.4mm 0 0; padding-inline-start: 4mm; font-size: 8.8pt; color: var(--body); }
.road li { margin-bottom: 1.6mm; padding-inline-start: .5mm; }
.road li::marker { color: var(--faint); }
.team { display: grid; grid-template-columns: 1fr 1fr; gap: 6mm 9mm; }
.person { display: grid; grid-template-columns: 19mm 1fr; gap: 4.4mm; border-top: .6pt solid var(--rule2); padding: 3.8mm 0 0; background: none; break-inside: avoid; }
.person .ph, .person .ini { width: 19mm; height: 19mm; border-radius: 50%; object-fit: cover; filter: grayscale(1); border: 0; }
.person .ini { display: flex; align-items: center; justify-content: center; background: var(--navy); color: var(--goldL); font: 600 13pt var(--serif); }
.person h4 { font: 600 11.4pt/1.2 var(--serif); color: var(--navy); margin: 0; }
.person .role { font: 700 6.4pt var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--goldD); margin: 1mm 0 1.8mm; }
.person p { font-size: 8.3pt; line-height: 1.5; color: var(--soft); margin: 0; }
.risks { border-top: 1.2pt solid var(--navy); }
.risk { display: grid; grid-template-columns: 32mm 1fr; gap: 6mm; padding: 3.4mm 0; border-bottom: .5pt solid var(--rule); background: none; border-radius: 0; break-inside: avoid; }
.risk > div { display: grid; grid-template-columns: 1fr 1.3fr; gap: 6mm; }
.risk h4 { font: 600 11pt/1.25 var(--serif); color: var(--navy); margin: 0; }
.risk p { margin: 0; font-size: 8.8pt; line-height: 1.5; color: var(--soft); }
.risk .m { color: var(--body); }
.risk .m b { display: block; font: 700 6.2pt var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--teal); margin-bottom: .8mm; }

/* ---------- Closing statement ---------- */
.closing { page: statement; break-before: page; height: 297mm; box-sizing: border-box; margin: 0; padding: 0 26mm; border: 0; border-radius: 0; background: var(--navy); color: #eef0f5; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; break-inside: avoid; }
.closing .art { position: absolute; width: 230mm; height: 230mm; right: -95mm; bottom: -95mm; }
.closing::before { content: ""; position: relative; display: block; width: 14mm; height: 1.2pt; background: var(--goldL); margin-bottom: 10mm; }
.closing h2 { position: relative; font: 600 36pt/1.1 var(--serif); color: #fff; margin: 0 0 9mm; max-width: 150mm; }
.closing p { position: relative; font-size: 12.4pt; line-height: 1.7; color: #c3cbdc; max-width: 145mm; margin: 0; }
.closing p.print-only { margin-top: 13mm; font: 700 7.6pt var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--goldL); }

/* ---------- Appendix ---------- */
.links { list-style: none; margin: 0; padding: 0; columns: 3; column-gap: 8mm; }
.links li { break-inside: avoid; padding: 1.6mm 0; border-bottom: .5pt solid var(--rule); }
.links a { font-size: 8.8pt; font-weight: 600; color: var(--navy); }
dl.gloss { display: grid; grid-template-columns: 36mm 1fr; margin: 0; border-top: 1.2pt solid var(--navy); }
dl.gloss dt, dl.gloss dd { margin: 0; padding: 1.8mm 0; border-bottom: .5pt solid var(--rule); break-inside: avoid; }
dl.gloss dt { font-size: 8.9pt; font-weight: 700; color: var(--navy); }
dl.gloss dd { font-size: 8.6pt; color: var(--soft); }
ol.sources { list-style: none; margin: 0; padding: 0; font-size: 7.8pt; line-height: 1.45; color: var(--soft); }
ol.sources li { display: grid; grid-template-columns: 6mm 1fr; margin: 0; padding: 1.4mm 0; border-bottom: .5pt solid var(--rule); break-inside: avoid; }
ol.sources .sn { font: 600 8pt var(--serif); color: var(--gold); }
ol.sources a { color: var(--goldD); word-break: break-all; }
.legal { font-size: 7.6pt; line-height: 1.55; color: var(--muted); }

/* ---------- Back cover ---------- */
.pback { page: back; break-before: page; height: 297mm; box-sizing: border-box; background: var(--navy); color: #eef0f5; position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 20mm; }
.pback .art { position: absolute; width: 260mm; height: 260mm; left: 50%; top: 50%; transform: translate(-50%, -50%); opacity: .55; }
.pb-in { position: relative; display: flex; flex-direction: column; align-items: center; }
.pb-in img.logo { width: 20mm; height: 20mm; }
.pb-word { font: 700 11pt var(--sans); letter-spacing: .4em; text-transform: uppercase; margin: 5mm 0 0; padding-inline-start: .4em; }
.pb-tag { font: italic 500 15pt/1.4 var(--serif); color: var(--goldL); margin: 6mm 0 14mm; }
.pb-qr { background: #fff; padding: 4mm; border-radius: 3mm; width: 38mm; }
.pb-qr svg { width: 30mm; height: 30mm; display: block; }
.pb-cta { font: 700 7.6pt var(--sans); letter-spacing: .22em; text-transform: uppercase; color: #a3aec6; margin: 5mm 0 1.2mm; }
.pb-url { font: 600 13pt var(--serif); color: #fff; }
.pb-foot { position: absolute; bottom: 14mm; left: 0; right: 0; font-size: 7pt; letter-spacing: .06em; color: #8f9bb3; }

/* Corporate: up and running in an afternoon */
.csteps { margin: 0 0 6mm; border-top: 1.2pt solid var(--teal); padding-top: 2.6mm; break-inside: avoid; }
.csteps h4 { font: 700 6.6pt var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--teal); margin: 0 0 2.6mm; }
.csteps ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 5mm; counter-reset: cs; }
.csteps li { counter-increment: cs; }
.csteps li::before { content: counter(cs, decimal-leading-zero); display: block; font: 400 17pt/1 var(--serif); color: var(--teal); margin-bottom: 1.6mm; }
.csteps b { display: block; font-size: 9.2pt; line-height: 1.3; color: var(--navy); margin-bottom: .8mm; }
.csteps span { display: block; font-size: 8.2pt; line-height: 1.45; color: var(--soft); }

/* ---------- Diagrams ---------- */
.ic { display: block; width: 1em; height: 1em; }
.fig { margin: 7mm 0 0; padding: 0; break-inside: avoid; }
.fig-t { display: block; font: 700 6.6pt/1.3 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--navy); margin: 0 0 3.2mm; padding-top: 2.4mm; border-top: 1.2pt solid var(--navy); }
.fig-note { font-size: 7pt; line-height: 1.4; color: var(--faint); margin: 2.4mm 0 0; }
.figs2 { display: grid; grid-template-columns: 1fr 1fr; gap: 9mm; margin: 0 0 8mm; break-inside: avoid; }
.figs2 .fig { margin: 0; }
.figs-flow { display: grid; grid-template-columns: 1.25fr 1fr; gap: 9mm; margin: 0 0 2mm; break-inside: avoid; }
.figs-flow .fig { margin: 7mm 0 0; }

/* Icons in the summary and the pillars */
.card.facts .fi { display: grid; place-items: center; width: 7.6mm; height: 7.6mm; border-radius: 1.6mm; background: var(--navy); color: var(--goldL); margin-bottom: 2.2mm; }
.card.facts .fi .ic { width: 4.2mm; height: 4.2mm; }
.pillar h4 { display: flex; align-items: center; gap: 2.4mm; }
.pillar .pi { color: var(--gold); flex: none; }
.pillar .pi .ic { width: 4.6mm; height: 4.6mm; }

/* Where a booking goes */
.sb-row + .sb-row { margin-top: 3.6mm; }
.sb-l { font-size: 8.6pt; font-weight: 700; color: var(--navy); margin-bottom: 1.4mm; }
.sb-bar { display: flex; gap: .5mm; height: 8mm; border-radius: 1mm; overflow: hidden; }
.seg { display: flex; align-items: center; padding: 0 2mm; min-width: .8mm; }
.seg b { font: 700 7.6pt var(--sans); color: #fff; white-space: nowrap; }
.s-keep { background: #1d8478; } .s-comm { background: #cf5a42; } .s-card { background: #5b78c4; } .s-fee { background: #b8892f; }
.sb-cap { display: flex; flex-wrap: wrap; gap: .8mm 3.4mm; margin-top: 1.6mm; font-size: 7.2pt; color: var(--muted); }
.sb-cap i { display: inline-block; width: 2mm; height: 2mm; border-radius: .4mm; margin-inline-end: 1.2mm; }
.sb-cap b { color: var(--navy); font-weight: 700; }

/* Bars on an axis */
.wb-row + .wb-row, .sp-row + .sp-row { margin-top: 2.8mm; }
.wb-h, .sp-h { display: flex; justify-content: space-between; align-items: baseline; gap: 3mm; font-size: 7.4pt; margin-bottom: 1.2mm; }
.wb-l, .sp-h > span:first-child { font-weight: 700; color: var(--navy); }
.wb-v, .sp-v { color: var(--muted); text-align: end; }
.wb-track, .sp-track { position: relative; height: 3.4mm; border-radius: 1.7mm; background: #eef0f5; }
.wb-bar, .sp-bar { position: absolute; top: 0; bottom: 0; border-radius: 1.4mm; }
.wb-bar { inset-inline-start: 0; background: #cf5a42; }
.sp-bar { background: #5b78c4; }
.wb-row.us .wb-bar, .sp-row.us .sp-bar { background: #1d8478; }
.wb-axis { position: relative; height: 4mm; margin-top: 2mm; border-top: .5pt solid var(--rule2); font-size: 6.4pt; color: var(--faint); }
.wb-axis span { position: absolute; top: .8mm; transform: translateX(-50%); white-space: nowrap; }
.wb-axis span.tf { transform: none; }
.wb-axis span.tl { transform: translateX(-100%); }
html[dir="rtl"] .wb-axis span { transform: translateX(50%); }
html[dir="rtl"] .wb-axis span.tf { transform: none; }
html[dir="rtl"] .wb-axis span.tl { transform: translateX(100%); }

/* Refund: two chains of hands */
.frefund { margin-top: 6mm; }
.rf + .rf { margin-top: 3.6mm; }
.rf-h { display: flex; justify-content: space-between; align-items: center; gap: 3mm; margin-bottom: 2mm; }
.rf-h b { font-size: 8.8pt; color: var(--navy); }
.rf-time { font-size: 7.4pt; font-weight: 700; padding: .8mm 2.4mm; border-radius: 3mm; white-space: nowrap; }
.rf.old .rf-time { color: #b4462f; background: #fbece8; }
.rf.new .rf-time { color: #1d8478; background: var(--tealT); }
.rf-chain { list-style: none; margin: 0; padding: 0; display: flex; align-items: stretch; }
.rf-chain li { position: relative; flex: 1 1 0; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 7.3pt; line-height: 1.3; padding: 1.8mm 2mm; border-radius: 1.4mm; background: #f4f5f8; border: .5pt solid var(--rule2); color: var(--soft); }
.rf-chain li + li { margin-inline-start: 6mm; }
.rf-chain li + li::before { content: ""; position: absolute; inset-inline-start: -5mm; top: 50%; width: 3.4mm; height: .7pt; background: var(--faint); }
.rf-chain li + li::after { content: ""; position: absolute; inset-inline-start: -2.2mm; top: calc(50% - 1mm); border-top: 1mm solid transparent; border-bottom: 1mm solid transparent; border-inline-start: 1.4mm solid var(--faint); }
.rf.new .rf-chain li { background: var(--tealT); border-color: #9fd2ca; color: var(--navy); font-weight: 700; }
.rf.new .rf-chain li + li::before { background: #1d8478; }
.rf.new .rf-chain li + li::after { border-inline-start-color: #1d8478; }

/* Ecosystem map */
.eco { display: block; }
.radial { position: relative; width: 124mm; height: 124mm; margin: 2mm auto 7mm; break-inside: avoid; }
.r-lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.r-lines line { stroke: #e2cf9e; stroke-width: .22; }
.r-ring { fill: none; stroke: #d9bf80; stroke-width: .26; stroke-dasharray: .8 1.2; }
.r-ring2 { fill: none; stroke: #ede1c2; stroke-width: .22; }
.r-hub { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 37mm; height: 37mm; border-radius: 50%; background: var(--navy); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; box-shadow: 0 0 0 2.4mm #f2e7cc, 0 0 0 5mm #faf5ea; }
.r-hub b { font: 600 19pt/1 var(--serif); color: var(--goldL); }
.r-hub span { font-size: 6.2pt; line-height: 1.35; color: #a3aec6; margin-top: 1.4mm; padding: 0 5mm; }
.r-node { position: absolute; width: 27mm; transform: translateX(-50%); margin-top: -5.2mm; display: flex; flex-direction: column; align-items: center; gap: 1.2mm; text-align: center; }
.r-ic { width: 10.4mm; height: 10.4mm; border-radius: 50%; display: grid; place-items: center; background: #fff; border: .8pt solid var(--gold); color: var(--goldD); }
.r-ic .ic { width: 4.8mm; height: 4.8mm; }
.r-t { font-size: 7.4pt; font-weight: 700; line-height: 1.2; color: var(--navy); background: #fff; padding: 0 1mm; }

/* Journey: icon strip */
.jstrip { display: flex !important; list-style: none; margin: 0 0 6mm; padding: 0; break-inside: avoid; }
.jstrip li { flex: 1; position: relative; display: flex; flex-direction: column; align-items: center; gap: 1.6mm; text-align: center; }
.jstrip li + li::before { content: ""; position: absolute; top: 4.6mm; inset-inline-end: calc(50% + 5.4mm); width: calc(100% - 10.8mm); height: .8pt; background: var(--goldR); }
.js-ic { width: 9.2mm; height: 9.2mm; border-radius: 50%; display: grid; place-items: center; background: var(--navy); color: var(--goldL); }
.js-ic .ic { width: 4.4mm; height: 4.4mm; }
.jstrip b { font-size: 7.8pt; color: var(--navy); }
.journey-print li::before { background: var(--goldT); color: var(--goldD); border: .8pt solid var(--goldR); }

/* Two chains, one balance */
.fchains { margin-top: 7mm; }
.chg { display: grid; grid-template-columns: 1fr 8mm 1fr 8mm 1fr; align-items: center; }
.ch-in, .ch-out { display: grid; gap: 2mm; }
.ch-in small { font: 700 6.2pt var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); text-align: center; }
.ch-chain { padding: 2.2mm; border-radius: 1.6mm; font-size: 8.4pt; font-weight: 700; text-align: center; color: var(--navy); border: .6pt solid; }
.ch-chain.eth { background: #eef1f9; border-color: #b9c6e6; }
.ch-chain.bsc { background: var(--goldT); border-color: var(--goldR); }
.ch-bridge { display: flex; align-items: center; justify-content: center; gap: 1.4mm; font-size: 7pt; font-weight: 700; color: var(--goldD); }
.ch-bridge .ic { width: 3.6mm; height: 3.6mm; }
.ch-bal { display: flex; flex-direction: column; align-items: center; gap: 1.2mm; text-align: center; padding: 4mm 3mm; border-radius: 3mm; background: var(--navy); color: #eef0f5; }
.ch-coin { width: 10mm; height: 10mm; border-radius: 50%; display: grid; place-items: center; background: var(--goldL); color: var(--navy); font: 800 6.6pt var(--sans); letter-spacing: .06em; }
.ch-bal b { font-size: 9pt; color: #fff; }
.ch-bal span:last-child { font-size: 7.2pt; color: #a3aec6; line-height: 1.4; }
.ch-o { padding: 2.2mm 2.8mm; border-radius: 1.6mm; background: var(--tealT); border: .6pt solid #9fd2ca; }
.ch-o b { display: block; font-size: 8pt; line-height: 1.3; color: var(--navy); }
.ch-o span { display: block; font-size: 7.2pt; color: var(--soft); margin-top: .4mm; }
.ch-ar, .tf-ar { position: relative; height: .9pt; margin: 0 1.2mm; background: var(--faint); }
.ch-ar::after, .tf-ar::after { content: ""; position: absolute; inset-inline-end: -.6mm; top: -1.1mm; border-top: 1.2mm solid transparent; border-bottom: 1.2mm solid transparent; border-inline-start: 1.8mm solid var(--faint); }

/* Step flows */
.flow { list-style: none; margin: 0; padding: 0; display: grid; gap: 4mm; }
.flow.n3 { grid-template-columns: repeat(3, 1fr); }
.flow.n4 { grid-template-columns: repeat(4, 1fr); }
.flow li { position: relative; text-align: center; }
.flow li + li::before { content: ""; position: absolute; top: 4.6mm; inset-inline-end: calc(50% + 5.2mm); width: calc(100% - 6.4mm); height: .8pt; background: var(--goldR); }
.f-ic { position: relative; z-index: 1; width: 9.2mm; height: 9.2mm; margin: 0 auto 2mm; border-radius: 50%; display: grid; place-items: center; background: var(--navy); color: var(--goldL); }
.f-ic .ic { width: 4.4mm; height: 4.4mm; }
.ftara .f-ic { background: #1d8478; color: #fff; }
.flow b { display: block; font-size: 8.8pt; color: var(--navy); margin-bottom: .6mm; }
.flow li > span:last-child { display: block; font-size: 7.6pt; line-height: 1.42; color: var(--soft); }
.fspeed { margin: 0 0 5mm; }

/* Defence in depth */
.sec-layers { display: block; }
.sec-layers .rings { display: grid; grid-template-columns: 46mm 1fr; gap: 7mm; align-items: center; margin: 0 0 5mm; padding: 3mm 0; border-top: .6pt solid var(--rule2); border-bottom: .6pt solid var(--rule2); }
.rings { margin: 2mm 0 0; break-inside: avoid; }
.rings-d { position: relative; }
.rings svg { display: block; width: 46mm; height: 46mm; }
.rings .rg0 { fill: #e6f2ef; stroke: #9fd2ca; stroke-width: .5; }
.rings .rg1 { fill: #d3e9e4; stroke: #9fd2ca; stroke-width: .5; }
.rings .rc { fill: var(--navy); stroke: var(--gold); stroke-width: .8; }
.rings .rb { fill: #fff; stroke: #1d8478; stroke-width: .7; }
.rings text { font: 700 6.4px var(--sans); fill: #1d8478; text-anchor: middle; }
.rings-c { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 13mm; display: flex; flex-direction: column; align-items: center; gap: .6mm; text-align: center; }
.rings-c .ic { width: 4.4mm; height: 4.4mm; color: var(--goldL); }
.rings-c b { font-size: 5.6pt; line-height: 1.2; color: #fff; }
.rings figcaption { font: italic 500 12pt/1.45 var(--serif); color: var(--navy); text-align: start; margin: 0; }

/* How TRAT moves through a booking */
.ftflow { margin-top: 7mm; }
.tf { display: grid; grid-template-columns: 1fr 8mm 1fr 8mm 1.1fr; align-items: center; }
.tf-n { display: flex; flex-direction: column; align-items: center; gap: 1mm; text-align: center; padding: 3mm 2.6mm; border-radius: 2mm; background: #f6f7fa; border: .6pt solid var(--rule2); }
.tf-n .ic { width: 4.8mm; height: 4.8mm; color: var(--goldD); }
.tf-n b { font-size: 8.6pt; color: var(--navy); line-height: 1.25; }
.tf-n span { font-size: 7.2pt; line-height: 1.4; color: var(--soft); }
.tf-esc { background: var(--navy); border-color: var(--navy); }
.tf-esc .ic { color: var(--goldL); } .tf-esc b { color: #fff; } .tf-esc span { color: #a3aec6; }
.tf-split { display: grid; gap: 2mm; }
.tf-prov { background: var(--tealT); border-color: #9fd2ca; }
.tf-prov .ic { color: #1d8478; }
.tf-back { display: flex; align-items: stretch; gap: 3mm; margin-top: 3.4mm; padding-top: 3mm; border-top: .6pt dashed var(--rule2); }
.tf-bl { display: flex; align-items: center; gap: 1.4mm; font: 700 6.2pt var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.tf-bl .ic { width: 3.6mm; height: 3.6mm; }
.tf-n.sm { flex: 1; display: grid; grid-template-columns: 5mm 1fr; column-gap: 2.4mm; align-items: center; text-align: start; padding: 2.2mm 3mm; background: #fff; }
.tf-n.sm .ic { grid-row: span 2; color: #1d8478; }

/* Impact: ten-year bars (inside the navy band) */
.ib { display: grid; gap: 2.6mm; margin: 0 0 1mm; }
.ib-row { display: grid; grid-template-columns: 52mm 1fr 22mm; gap: 3.4mm; align-items: center; }
.ib-l { font-size: 7.6pt; line-height: 1.35; color: #a3aec6; }
.ib-bw { display: block; height: 3.6mm; border-radius: .8mm; background: rgba(255,255,255,.08); }
.ib-bar { display: block; height: 100%; border-radius: .8mm; background: #e07a63; }
.ib-row.k1 .ib-bar { background: #74d2c6; }
.ib-row b { font: 600 13pt var(--serif); color: #fff; text-align: end; white-space: nowrap; }
.ib-win { display: flex; align-items: baseline; gap: 3.4mm; margin-top: 1.4mm; padding-top: 3mm; border-top: .5pt solid rgba(255,255,255,.18); }
.ib-win b { font: 600 20pt var(--serif); color: #74d2c6; }
.ib-win span { font-size: 8.4pt; color: #c3cbdc; }

/* The problem chapter closes on a statement band */
#problem .outro { max-width: none; margin: 9mm 0 0; padding: 9mm 11mm 9mm 13mm; border: 0; background: var(--navy); color: #fff; font: italic 500 15pt/1.5 var(--serif); position: relative; }
#problem .outro::before { content: ""; position: absolute; inset-inline-start: 0; top: 0; bottom: 0; width: 2.4mm; background: var(--goldL); }

/* Other scripts */
html[lang="ar"] #summary > p:first-of-type::first-letter, html[lang="hi"] #summary > p:first-of-type::first-letter, html[lang="th"] #summary > p:first-of-type::first-letter,
html[lang="ja"] #summary > p:first-of-type::first-letter, html[lang="zh"] #summary > p:first-of-type::first-letter, html[lang="ko"] #summary > p:first-of-type::first-letter { font: inherit; float: none; color: inherit; padding: 0; }
html[lang="ja"] .pc-title, html[lang="zh"] .pc-title, html[lang="ko"] .pc-title, html[lang="ar"] .pc-title, html[lang="hi"] .pc-title, html[lang="th"] .pc-title { font-weight: 700; font-size: 44pt; line-height: 1.15; }

/* Chapters compacted by the build so a few spilled lines do not take a page of their own */
section.sec.z1 { zoom: .955; }
section.sec.z2 { zoom: .92; }
section.sec.z3 { zoom: .89; }