/* ============================================================
   AXELETE — site.css  ·  publication register
   Layout and components ONLY. No hex values live here.
   Every colour, size and space comes from tokens.css.
   ============================================================ */

@font-face{font-family:Archivo;src:url(../fonts/archivo-latin-400-normal.woff2)format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Archivo;src:url(../fonts/archivo-latin-600-normal.woff2)format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Archivo;src:url(../fonts/archivo-latin-700-normal.woff2)format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Archivo;src:url(../fonts/archivo-latin-900-normal.woff2)format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(../fonts/barlow-condensed-latin-600-normal.woff2)format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(../fonts/barlow-condensed-latin-700-normal.woff2)format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Newsreader;src:url(../fonts/newsreader-latin-400-normal.woff2)format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Newsreader;src:url(../fonts/newsreader-latin-400-italic.woff2)format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:Newsreader;src:url(../fonts/newsreader-latin-600-normal.woff2)format("woff2");font-weight:600;font-display:swap}

*,*::before,*::after{box-sizing:border-box}
body,h1,h2,h3,p,ul,ol,figure,dl,dd{margin:0}
ul[class]{list-style:none;padding:0}
img,svg{max-width:100%;display:block}

body{min-height:100vh;display:flex;flex-direction:column}

.wrap{width:100%;max-width:var(--page-max);margin-inline:auto;padding-inline:var(--s-6)}
.col{max-width:var(--measure)}

/* ---------------- masthead ---------------- */
.masthead{border-bottom:1px solid var(--hairline);padding-block:var(--s-6)}
.masthead .wrap{display:flex;align-items:center;gap:var(--s-6);flex-wrap:wrap}
.masthead a.brand{display:block;line-height:0}
.masthead a.brand img{width:168px}
.masthead nav{margin-left:auto;display:flex;gap:var(--s-6);flex-wrap:wrap}
.masthead nav a{
  font-family:var(--font-label);font-weight:700;font-size:var(--t-sm);
  letter-spacing:var(--track-label);text-transform:uppercase;
  color:var(--meta);text-decoration:none;padding-block:2px;
}
.masthead nav a:hover,.masthead nav a[aria-current=page]{
  color:var(--ink);border-bottom:2px solid var(--accent-lt)
}

/* ---------------- type ---------------- */
h1,h2,h3{font-family:var(--font-display);letter-spacing:var(--track-display);line-height:var(--lh-head)}
h1{font-size:var(--t-2xl);font-weight:900;text-transform:uppercase;letter-spacing:.01em}
h2{font-size:var(--t-lg);font-weight:700;margin-top:var(--s-12);margin-bottom:var(--s-3)}
h3{font-size:var(--t-md);font-weight:700;margin-top:var(--s-8);margin-bottom:var(--s-2)}
p{margin-bottom:var(--s-4)}
p.lede{font-size:var(--t-md);line-height:1.5}
strong{font-weight:600}

a{color:var(--accent);text-decoration:underline;text-underline-offset:.18em}
a:hover{color:var(--ink)}

.eyebrow{
  font-family:var(--font-label);font-weight:700;font-size:var(--t-sm);
  letter-spacing:var(--track-label);text-transform:uppercase;color:var(--meta);
  margin-bottom:var(--s-2)
}

/* ---------------- the dateline — the signature ---------------- */
.dateline{
  border-top:2px solid var(--accent-lt);
  padding-top:var(--s-3);margin-block:var(--s-8) var(--s-6);
  font-family:var(--font-label);font-weight:700;font-size:var(--t-sm);
  letter-spacing:var(--track-label);text-transform:uppercase
}
.dateline .place{color:var(--accent)}
.dateline .sep{color:var(--meta);padding-inline:.5em}
.dateline .date{color:var(--ink)}

/* ---------------- sections ---------------- */
main{flex:1;padding-block:var(--s-12) var(--s-24)}
.rule{border:0;border-top:1px solid var(--hairline);margin-block:var(--s-12)}

.doors{display:grid;gap:var(--s-4);margin-block:var(--s-8);
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
/* a single live section is one card at reading width, not a half-empty row */
.doors-one{grid-template-columns:1fr;max-width:var(--measure)}
.door{
  display:block;color:inherit;
  border:1px solid var(--hairline);border-radius:var(--radius);
  padding:var(--s-6);background:var(--surface);
  transition:border-color var(--dur) var(--ease)
}
/* out-specifies the Test-001 underline rule in tokens.css, which is [attr] scoped */
[data-surface="publication"] a.door,
[data-surface="publication"] a.door:hover{text-decoration:none}
.door:hover{border-color:var(--accent-lt)}
.door:hover .t{color:var(--accent)}
.door .t{display:block;font-family:var(--font-display);font-weight:900;
  font-size:var(--t-lg);text-transform:uppercase;letter-spacing:.02em;color:var(--ink)}
.door .d{display:block;margin-top:var(--s-3);font-size:var(--t-sm);
  line-height:1.5;color:var(--ink-2)}

.standard{margin-bottom:var(--s-4)}
.standard b{font-weight:600}

.note{
  border-left:3px solid var(--accent-lt);background:var(--surface);
  padding:var(--s-4) var(--s-6);margin-block:var(--s-6);
  border-radius:0 var(--radius) var(--radius) 0
}
.note p:last-child{margin-bottom:0}

.correction{border-top:1px solid var(--hairline);padding-top:var(--s-6);margin-top:var(--s-6)}
.correction .when{
  font-family:var(--font-label);font-weight:700;font-size:var(--t-sm);
  letter-spacing:var(--track-label);text-transform:uppercase;color:var(--meta);
  margin-bottom:var(--s-2)
}

.endmark{width:15px;height:15px;display:inline-block;vertical-align:-2px;margin-left:.35em}

/* ---------------- footer ---------------- */
footer{
  border-top:1px solid var(--hairline);padding-block:var(--s-8);
  font-family:var(--font-label);font-size:var(--t-sm);
  letter-spacing:.06em;text-transform:uppercase;color:var(--meta)
}
footer .wrap{display:flex;gap:var(--s-6);flex-wrap:wrap;align-items:center}
footer a{color:var(--meta)}
footer a:hover{color:var(--ink)}
footer .mark{margin-left:auto;width:26px;height:26px}

@media (max-width:560px){
  h1{font-size:var(--t-xl)}
  .masthead a.brand img{width:132px}
  .masthead nav{margin-left:0;width:100%;gap:var(--s-4)}
}

/* ---------------- articles ---------------- */
.entry{border-top:1px solid var(--hairline);padding-top:var(--s-6);margin-top:var(--s-6)}
.entry .dateline{border:0;margin:0 0 var(--s-2);padding:0}
.entry h2{margin:0 0 var(--s-2);font-size:var(--t-xl);font-weight:900;
  text-transform:uppercase;letter-spacing:.01em}
.entry h2 a{color:var(--ink);text-decoration:none}
.entry h2 a:hover{color:var(--accent);text-decoration:underline}
.entry .standfirst{color:var(--ink-2);margin:0}

.standfirst-lg{font-size:var(--t-md);line-height:1.45;color:var(--ink-2);
  margin-top:var(--s-3)}
.byline{font-family:var(--font-label);font-weight:700;font-size:var(--t-sm);
  letter-spacing:var(--track-label);text-transform:uppercase;color:var(--meta);
  margin-top:var(--s-4)}
.closer{margin-top:var(--s-8)}

/* the conflict disclosure — part of the template, not a thing to remember */
.conflict{
  border-top:1px solid var(--hairline);margin-top:var(--s-8);padding-top:var(--s-4);
  font-size:var(--t-sm);line-height:1.5;color:var(--meta)
}

/* draft banner. Deliberately loud. */
.draftbar{
  background:var(--ink);color:var(--paper);
  font-family:var(--font-label);font-weight:700;font-size:var(--t-sm);
  letter-spacing:var(--track-label);text-transform:uppercase;
  padding:var(--s-3) var(--s-4);margin-bottom:var(--s-8);border-radius:var(--radius)
}
h1.lockup{margin:0;line-height:0}
h1.lockup img{width:340px;max-width:100%}
@media (max-width:560px){h1.lockup img{width:250px}}

/* ------------------------------------------------------- ARTICLE MEDIA
   Added 2026-08-17 for the first published article: figures, photo credits,
   results tables and the reporting note. Nothing above this line changed. */
figure{margin-block:var(--s-8)}
figure img{width:100%;height:auto;border-radius:var(--radius)}
figure.wide{margin-inline:0}
figcaption{
  font-family:var(--font-label);font-size:var(--t-xs);line-height:1.5;
  color:var(--meta);padding-top:var(--s-2);padding-bottom:var(--s-3);
  border-bottom:1px solid var(--hairline)
}
figcaption .credit{
  display:block;margin-top:var(--s-1);letter-spacing:var(--track-label);
  text-transform:uppercase;color:var(--meta)
}
table.results{
  width:100%;border-collapse:collapse;margin:var(--s-8) 0 var(--s-2);
  font-family:var(--font-data);font-size:var(--t-sm)
}
table.results th{
  text-align:left;font-family:var(--font-label);font-size:var(--t-xs);
  font-weight:var(--w-semi);letter-spacing:var(--track-label);
  text-transform:uppercase;color:var(--accent);
  border-bottom:2px solid var(--ink);padding:var(--s-2) var(--s-3)
}
table.results td{
  border-bottom:1px solid var(--hairline);padding:var(--s-2) var(--s-3)
}
table.results tr:last-child td{border-bottom:2px solid var(--ink)}
table.results .n{text-align:right;white-space:nowrap}
p.tblnote{
  font-family:var(--font-label);font-size:var(--t-xs);
  line-height:1.5;color:var(--meta)
}
p.disclosure{
  border-left:3px solid var(--accent-lt);background:var(--surface);
  padding:var(--s-4) var(--s-6);margin-block:var(--s-6);
  border-radius:0 var(--radius) var(--radius) 0;font-size:var(--t-sm)
}
@media(max-width:640px){
  table.results{font-size:var(--t-xs)}
  table.results th,table.results td{padding:var(--s-2)}
}
