/* ===== Spacing and tablet layer · 6 November 2026 =====
   Loaded last on every public page. Spacing and grid only: no copy, colour or type changes.
   Pages carry no body class, so page-specific rules are scoped by page ID or section class.

   Band scale (top and bottom padding of every full-width .block section):
     desktop  1181px and up   96px
     iPad     901 to 1180px   80px
     tablet   641 to 900px    72px
     phone    640px and down  56px
   Footer: 64 / 56 / 48 / 40px top, 24px bottom.
   Page header (gap between nav and the framed title): 48 / 32 / 32 / 20px.
   Compact bands stay as designed: the Edition II question bars (.block-arc), the Take part
   lead (.access-lead-block), the form pages (.form-page), the essay body (inline 36px top)
   and the dark lead bands on Edition I and II (inline clamp). */

:root{--sp-band:96px;--sp-foot:64px;--sp-head:48px}
@media(max-width:1180px){:root{--sp-band:80px;--sp-foot:56px;--sp-head:32px}}
@media(max-width:900px){:root{--sp-band:72px;--sp-foot:48px}}
@media(max-width:640px){:root{--sp-band:56px;--sp-foot:40px;--sp-head:20px}}
/* home uses the v3 token directly */
:root{--band:var(--sp-band)}

/* ---------- Shared: section bands ---------- */
.block:not(.block-arc):not(.access-lead-block):not(.form-page){padding-top:var(--sp-band);padding-bottom:var(--sp-band)}
.block.simple-voice.simple-voice.simple-voice.simple-voice{padding-bottom:56px}
.block.form-page.form-page{padding-bottom:var(--sp-band)}
/* Partnership: the relationship sections had a 96 to 140px top against a 60 to 80px bottom */
#page-partner .block:has(.partner-tiers),#page-partner .block.block-ratecard{padding-top:var(--sp-band)}

/* ---------- Shared: header and footer ---------- */
.page-header:not(.hero-after){padding-top:var(--sp-head)}
footer{padding-top:var(--sp-foot);padding-bottom:24px}

/* ---------- Shared: headings ----------
   Balanced line breaks so display and section titles do not leave one word on the last line
   (Edition I "recorded." at 820px). Size and face unchanged. */
:is(.page-header h1,.hero-title,.section-title,.sess-title){text-wrap:balance}

/* ---------- Shared: closing card ----------
   The paragraph's bottom rule stopped at the text measure when the text was short (home),
   leaving a floating line. The rule now runs the full card width. */
.apply-card>p{max-width:none}

/* ---------- Shared: three-item joined grids at tablet ----------
   style.css drops .grid-3 to two columns from 601 to 980px and spans the odd one out.
   With exactly three items a single row of three reads better and keeps every rule joined. */
@media(min-width:761px) and (max-width:980px){
 .grid-3:has(>:nth-child(3):last-child){grid-template-columns:repeat(3,1fr)}
 .grid-3:has(>:nth-child(3):last-child)>*:last-child{grid-column:auto}
}
/* Routes (research briefs, contact): one column from 900px down; keep the row on tablets */
@media(min-width:701px) and (max-width:900px){
 .routes{grid-template-columns:repeat(3,1fr)}
 .routes.routes-two{grid-template-columns:repeat(2,1fr)}
}

/* ---------- Home ---------- */
/* Edition I figures: four across left "Term sheet" breaking over two lines at iPad portrait */
@media(min-width:721px) and (max-width:900px){
 .simple-figures{grid-template-columns:repeat(2,1fr)}
 .simple-figures>div:nth-child(n){border-right:1px solid var(--ink)!important;padding-left:24px!important;padding-right:24px!important}
 .simple-figures>div:nth-child(2n+1){padding-left:0!important}
 .simple-figures>div:nth-child(2n){border-right:0!important;padding-right:0!important}
}
/* Footer legal line (all pages): items justified across wrapped into a ragged second row
   on tablets. They now run left with an even gap; on home the copyright takes its own line. */
@media(max-width:1180px){
 footer .footer-meta:not(:has(>span:nth-child(4))){justify-content:flex-start;column-gap:28px}
 footer .footer-meta:not(:has(>span:nth-child(4)))>span:first-child{flex-basis:100%}
}
@media(max-width:900px){footer .footer-meta{justify-content:flex-start;column-gap:28px}}

/* ---------- Edition II ---------- */
/* How the day works: Capital Floor lost its label, so its heading sat a line above the
   other two. A blank line of the same label height keeps the three headings level. */
@media(min-width:821px){
 .e2-day-row>.e2-day-cell:not(:has(.e2-day-t))::before{content:"\00a0";display:block;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;margin-bottom:8px}
}

/* ---------- Edition I ---------- */
/* Numbers: from 901 to 1024px the grid is two by two but only the first cell lost its
   left padding, so the second row started 24px further in */
@media(max-width:1024px){body.e1-lu .stat-grid-4 .stat-cell:nth-child(2n+1){padding-left:0}}
/* Two layers: keep name and text side by side on tablets instead of one long column */
@media(min-width:701px) and (max-width:900px){
 #page-format .layer{grid-template-columns:minmax(180px,1fr) 2fr!important;grid-template-rows:auto 1fr;align-items:start;column-gap:32px!important;row-gap:10px!important}
 #page-format .layer>.layer-num{grid-column:1;grid-row:1}
 #page-format .layer>div:nth-child(2){grid-column:1;grid-row:2}
 #page-format .layer>div:nth-child(3){grid-column:2;grid-row:1/span 2}
}

/* ---------- Before Capital Flows ---------- */
/* Single column from 900px down: hold the reading measure near 70 characters */
@media(max-width:900px){
 #page-conclusions .session :is(.context p,.hl-b,.ns-b){max-width:68ch}
}

/* ---------- Request ---------- */
/* Seven role cards in a two-column grid left an empty cell with no rules beside "Other" */
.tf-roles>.tf-path:last-child:nth-child(odd){grid-column:1/-1}
/* (three columns from 1024px up: 3, 3 and 1, so the full-width last row holds there too) */

/* Edition II market headlines (6 Nov 2026): always two lines, statement then italic, at one size */
.e2-two{font-size:clamp(34px,4.2vw,56px)!important;line-height:1.02!important;text-wrap:initial!important}
.e2-two em{display:block;white-space:nowrap;line-height:1.02!important;margin-top:.04em}
@media(max-width:600px){.e2-two{font-size:clamp(28px,8.4vw,38px)!important}.e2-two em{white-space:normal}}

/* Form pages (6 Nov 2026): a dark opening band (title and how it works), then the form on paper. */
body:has(.form-page) .page-header{background:#0a0a0a;color:#fafafa;border-color:#fafafa}
body:has(.form-page) .page-header *{border-color:#fafafa}
body:has(.form-page) .page-header h1,body:has(.form-page) .page-header .page-num{color:#fafafa}
body:has(.form-page) .page-header h1 em{color:#ff5a47}
body:has(.form-page) main,body:has(.form-page) .page{background:transparent}
.form-page .tf-intro-block{position:relative;background:#0a0a0a;color:#fafafa;box-shadow:0 0 0 100vmax #0a0a0a;clip-path:inset(0 -100vmax);padding:8px 0 64px;margin-bottom:64px}
.form-page .tf-intro-block p,.form-page .tf-intro-block a{color:#fafafa}
.form-page .tf-intro-block .tf-date,.form-page .tf-intro-block .proof-note{color:#fafafa}
.form-page .tf-intro-block .tf-lead{font-size:22px;letter-spacing:-.01em}
.form-page{padding-top:0!important}
@media(max-width:720px){.form-page .tf-intro-block{padding-bottom:44px;margin-bottom:40px}}
body:has(.form-page) .page-header .container{background:#0a0a0a;border-color:#fafafa}
body:has(.form-page) .page-header .container *{border-color:#fafafa}
.form-page .tf-intro-block .tf-date{display:none}
.form-page .tf-intro-block{padding-top:36px}
@media(max-width:720px){.form-page .tf-intro-block{padding-top:24px}}
.form-page form a{color:var(--ink,#0a0a0a);text-decoration:underline;text-underline-offset:3px}

/* About · The Decision Room in brief, colophon layout (6 Nov 2026, concept D) */
.brief-col{margin-top:72px}
.brief-col-k{margin-bottom:18px}
.brief-col-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:0 64px;align-items:start}
.brief-col-lead{font-size:clamp(24px,2.3vw,30px);line-height:1.3;letter-spacing:-.015em;margin:0;border-top:1px solid var(--ink);padding-top:22px;color:var(--ink);max-width:none}
.brief-col-list{margin:0;border-top:1px solid var(--ink)}
.brief-col-list>div{display:flex;justify-content:space-between;gap:24px;padding:13px 0;border-bottom:1px solid var(--ink);align-items:baseline}
.brief-col-list dt{font:500 11px/1.5 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;flex:none;color:var(--ink)}
.brief-col-list dd{margin:0;font-size:16px;line-height:1.45;text-align:right;color:var(--ink)}
.brief-col-list a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
@media(max-width:900px){.brief-col-grid{grid-template-columns:1fr}.brief-col-lead{margin-bottom:32px}}
@media(max-width:720px){.brief-col{margin-top:56px}.brief-col-list>div{flex-direction:column;gap:4px}.brief-col-list dd{text-align:left}}
.brief-col-lead em{font-family:'Fraunces',serif;font-style:italic;font-weight:400;font-size:1.08em;line-height:0}
.brief-col{background:#0a0a0a;color:#fafafa;box-shadow:0 0 0 100vmax #0a0a0a;clip-path:inset(0 -100vmax);padding:72px 0}
.brief-col .brief-col-k,.brief-col dt,.brief-col dd,.brief-col a{color:#fafafa}
.brief-col .brief-col-lead em{color:#ff5a47}
.brief-col .brief-col-lead,.brief-col .brief-col-list,.brief-col .brief-col-list>div{border-color:#fafafa}
.brief-col p.brief-col-lead{color:#fafafa!important}

/* programme update, related pages */
.tf-choice .tf-dev{display:block;margin-top:4px;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
