/*
Theme Name: Quorum
Theme URI: https://stfederation.org/
Description: Institutional bulletin theme for a games review body. Articles are filed as numbered records in a ruled register rather than shown as cards, with a security-print masthead, an issuing seal and document-set serif body copy. Built text-first for archives where most entries carry no image.
Author: stfederation.org
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: quorum
*/

/* ---------------------------------------------------------------- fonts */
@font-face{font-family:'Schibsted Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/SchibstedGrotesk-700.woff2') format('woff2');}
@font-face{font-family:'Schibsted Grotesk';font-style:normal;font-weight:800;font-display:swap;src:url('assets/fonts/SchibstedGrotesk-800.woff2') format('woff2');}
@font-face{font-family:'Spectral';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/Spectral-400.woff2') format('woff2');}
@font-face{font-family:'Spectral';font-style:italic;font-weight:400;font-display:swap;src:url('assets/fonts/Spectral-400i.woff2') format('woff2');}
@font-face{font-family:'Spectral';font-style:normal;font-weight:600;font-display:swap;src:url('assets/fonts/Spectral-600.woff2') format('woff2');}
@font-face{font-family:'Sometype Mono';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/SometypeMono-400.woff2') format('woff2');}
@font-face{font-family:'Sometype Mono';font-style:normal;font-weight:500;font-display:swap;src:url('assets/fonts/SometypeMono-500.woff2') format('woff2');}

/* --------------------------------------------------------------- tokens */
:root{
  --paper:#EFECE3; --paper-2:#E5E1D5; --sheet:#FBFAF6;
  --ink:#141A22; --ink-2:#39414D; --dim:#6C6759;
  --navy:#152B45; --navy-2:#1F3F66; --navy-3:#2C5386;
  --seal:#B4321F; --seal-2:#8E2716;
  --rule:#C9C2B0; --rule-2:#DCD7C9; --rule-3:#EAE6DA;

  --f-disp:'Schibsted Grotesk',system-ui,'Segoe UI',Roboto,sans-serif;
  --f-body:'Spectral',Georgia,'Times New Roman',serif;
  --f-mono:'Sometype Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  --wrap:1120px; --measure:66ch;
  --s1:6px; --s2:12px; --s3:18px; --s4:28px; --s5:42px; --s6:64px; --s7:96px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--f-body);font-size:17px;line-height:1.62;
  -webkit-font-smoothing:antialiased;
  /* faint laid-paper tint, not a texture image */
  background-image:linear-gradient(180deg,#F2EFE7 0,var(--paper) 420px);
  background-repeat:no-repeat;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy-2);text-decoration:none}
a:hover{color:var(--seal)}
:focus-visible{outline:2px solid var(--seal);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:10px 16px;z-index:99}
.skip:focus{left:8px;top:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* the security-print band: the one decorative device, reused as a seam */
.guilloche{
  height:9px;
  background:
    repeating-linear-gradient(90deg,var(--navy) 0 1px,transparent 1px 5px),
    repeating-linear-gradient(78deg,rgba(21,43,69,.35) 0 1px,transparent 1px 9px);
  opacity:.5;
}

/* ------------------------------------------------------------- masthead */
.mast{background:var(--navy);color:#EDEBE3}
.mast__in{display:flex;align-items:center;gap:var(--s4);padding:14px 24px;max-width:var(--wrap);margin:0 auto}
.brand{display:flex;align-items:center;gap:12px;color:#fff}
.brand:hover{color:#fff}
.brand__seal{flex:none;width:38px;height:38px}
.brand__txt{display:flex;flex-direction:column;line-height:1}
.brand__name{font-family:var(--f-disp);font-weight:800;font-size:20px;letter-spacing:.055em;text-transform:uppercase}
.brand__sub{font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#9FB4CF;margin-top:5px}
.mast__nav{margin-left:auto}
.mast__nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s3);margin:0;padding:0}
.mast__nav a{
  font-family:var(--f-mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
  color:#C3D2E4;padding:6px 0;display:block;border-bottom:1px solid transparent;
}
.mast__nav a:hover,.mast__nav .current-menu-item>a{color:#fff;border-bottom-color:var(--seal)}
.mast__toggle{display:none}

/* issue line: the bulletin's own dateline */
.issue{background:var(--paper-2);border-bottom:1px solid var(--rule)}
.issue__in{
  display:flex;flex-wrap:wrap;gap:var(--s3) var(--s4);align-items:baseline;
  max-width:var(--wrap);margin:0 auto;padding:9px 24px;
  font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);
}
.issue__in b{color:var(--ink);font-weight:500}
.issue__search{margin-left:auto}

/* ----------------------------------------------------------- searchform */
.sform{display:flex;align-items:center;gap:6px}
.sform input[type=search]{
  font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;color:var(--ink);
  background:transparent;border:0;border-bottom:1px solid var(--rule);
  padding:3px 2px;width:118px;
}
.sform input[type=search]:focus{border-bottom-color:var(--seal);outline:none}
.sform button{
  font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  background:none;border:0;color:var(--navy-2);cursor:pointer;padding:3px 0;
}
.sform button:hover{color:var(--seal)}

/* ---------------------------------------------------------- lead record */
.lead{padding:var(--s6) 0 var(--s5)}
.lead__grid{display:grid;grid-template-columns:1fr 168px;gap:var(--s5);align-items:start}
.lead__eyebrow{
  font-family:var(--f-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--seal);margin:0 0 var(--s3);
}
.lead__eyebrow span{color:var(--dim)}
.lead__title{
  font-family:var(--f-disp);font-weight:800;
  font-size:clamp(2.1rem,5.4vw,3.5rem);line-height:1.03;letter-spacing:-.022em;
  margin:0 0 var(--s3);color:var(--ink);text-wrap:balance;
}
.lead__title a{color:inherit}
.lead__title a:hover{color:var(--navy-2)}
.lead__stand{font-size:1.16rem;line-height:1.55;color:var(--ink-2);margin:0 0 var(--s4);max-width:56ch}
.lead__seal{width:168px;height:168px;opacity:.92}
.lead__plate{margin-top:var(--s4);border:1px solid var(--rule);padding:5px;background:var(--sheet)}
.lead__plate img{width:100%}

/* meta line — the register's fixed vocabulary */
.meta{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  font-family:var(--f-mono);font-size:11.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dim);
}
.meta__sep{color:var(--rule)}
.meta b{color:var(--ink-2);font-weight:400}
.chip{
  --cc:var(--dim);
  display:inline-block;border:1px solid var(--cc);color:var(--cc);
  padding:2px 7px 1px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
}
a.chip:hover{background:var(--cc);color:var(--paper)}

/* -------------------------------------------------------------- section */
.shead{
  display:flex;align-items:center;gap:var(--s3);margin:0 0 var(--s4);
  border-bottom:2px solid var(--navy);padding-bottom:8px;
}
.shead h2{
  font-family:var(--f-disp);font-weight:800;font-size:15px;letter-spacing:.18em;text-transform:uppercase;
  margin:0;color:var(--navy);
}
.shead__count{margin-left:auto;font-family:var(--f-mono);font-size:11px;letter-spacing:.13em;color:var(--dim)}

/* sections index */
.sections{padding:0 0 var(--s5)}
.sections__list{display:flex;flex-wrap:wrap;gap:8px}
.sect{
  --cc:var(--dim);
  display:flex;align-items:baseline;gap:8px;
  border:1px solid var(--rule);background:var(--sheet);padding:7px 12px;
  font-family:var(--f-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);
  transition:border-color .18s ease,color .18s ease;
}
.sect::before{content:"";width:7px;height:7px;background:var(--cc);flex:none;transform:translateY(-1px)}
.sect b{color:var(--dim);font-weight:400}
.sect:hover{border-color:var(--cc);color:var(--ink)}

/* --------------------------------------------------------- the register */
.register{padding:0 0 var(--s6)}
.rec{
  display:grid;grid-template-columns:96px 1fr;gap:var(--s4);
  padding:var(--s4) 0;border-top:1px solid var(--rule-2);
  position:relative;
}
.rec:first-of-type{border-top:1px solid var(--rule)}
.rec--img{grid-template-columns:96px 1fr 132px}
.rec__no{
  font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;color:var(--dim);
  padding-top:4px;transition:color .18s ease;
}
.rec__no b{display:block;font-weight:500;font-size:19px;color:var(--ink-2);letter-spacing:.02em;margin-top:3px;transition:color .18s ease}
.rec__title{
  font-family:var(--f-disp);font-weight:700;font-size:1.42rem;line-height:1.2;letter-spacing:-.012em;
  margin:0 0 9px;text-wrap:balance;
}
.rec__title a{color:var(--ink);background-image:linear-gradient(var(--seal),var(--seal));background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .25s ease}
.rec__title a:hover{color:var(--navy-2);background-size:100% 1px}
.rec__stand{color:var(--ink-2);margin:0 0 11px;font-size:1rem;line-height:1.55;max-width:62ch}
.rec__plate{border:1px solid var(--rule);padding:4px;background:var(--sheet);align-self:start}
.rec:hover .rec__no,.rec:hover .rec__no b{color:var(--seal)}

/* ------------------------------------------------------------ pagination */
.pagination{padding:var(--s5) 0;border-top:2px solid var(--navy)}
.pagination .nav-links{display:flex;flex-wrap:wrap;gap:7px;align-items:center;font-family:var(--f-mono);font-size:12px;letter-spacing:.1em}
.pagination .page-numbers{
  display:inline-block;padding:7px 12px;border:1px solid var(--rule);color:var(--ink-2);background:var(--sheet);
}
.pagination .page-numbers:hover{border-color:var(--navy);color:var(--navy)}
.pagination .page-numbers.current{background:var(--navy);border-color:var(--navy);color:#fff}
.pagination .page-numbers.dots{border-color:transparent;background:none}

/* ---------------------------------------------------------------- entry */
.entry{padding:var(--s6) 0 var(--s5)}
.entry__head{max-width:78ch;margin:0 auto var(--s5)}
.entry__eyebrow{
  font-family:var(--f-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--seal);
  margin:0 0 var(--s3);
}
.entry__eyebrow span{color:var(--dim)}
.entry__title{
  font-family:var(--f-disp);font-weight:800;font-size:clamp(1.95rem,4.6vw,3rem);line-height:1.06;letter-spacing:-.02em;
  margin:0 0 var(--s3);text-wrap:balance;
}
.entry__stand{font-size:1.16rem;line-height:1.56;color:var(--ink-2);margin:0 0 var(--s4);font-style:italic}
.entry__rule{border:0;border-top:2px solid var(--navy);margin:var(--s4) 0 0}
.entry__plate{max-width:900px;margin:0 auto var(--s5);border:1px solid var(--rule);padding:6px;background:var(--sheet)}

.prose{max-width:var(--measure);margin:0 auto;font-size:1.09rem;line-height:1.72}
.prose p{margin:0 0 1.25em}
.prose>*:first-child{margin-top:0}
.prose h1,.prose h2,.prose h3,.prose h4{font-family:var(--f-disp);color:var(--ink);letter-spacing:-.01em;line-height:1.2}
.prose h2{
  font-size:1.5rem;font-weight:800;margin:2.1em 0 .6em;padding-left:14px;
  border-left:4px solid var(--navy);
}
.prose h3{font-size:1.2rem;font-weight:700;margin:1.9em 0 .5em;color:var(--navy)}
.prose h4{font-size:1.04rem;font-weight:700;margin:1.7em 0 .4em}
.prose a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--rule)}
.prose a:hover{text-decoration-color:var(--seal)}
.prose ul,.prose ol{margin:0 0 1.25em;padding-left:1.35em}
.prose li{margin:0 0 .45em}
.prose li::marker{color:var(--seal)}
.prose blockquote{
  margin:1.6em 0;padding:2px 0 2px 20px;border-left:4px solid var(--seal);
  font-style:italic;color:var(--ink-2);
}
.prose blockquote p:last-child{margin-bottom:0}
.prose img{margin:1.6em 0;border:1px solid var(--rule);padding:5px;background:var(--sheet)}
.prose figure{margin:1.6em 0}
.prose figcaption{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.08em;color:var(--dim);margin-top:8px;text-transform:uppercase}
.prose code{font-family:var(--f-mono);font-size:.9em;background:var(--paper-2);padding:1px 5px}
.prose pre{background:var(--navy);color:#DCE6F2;padding:18px;overflow:auto;font-family:var(--f-mono);font-size:.86rem;line-height:1.55}
.prose pre code{background:none;padding:0;color:inherit}
.prose table{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:.96rem}
.prose th,.prose td{border:1px solid var(--rule);padding:9px 11px;text-align:left}
.prose th{background:var(--paper-2);font-family:var(--f-disp);font-weight:700;font-size:.86rem;letter-spacing:.05em;text-transform:uppercase}
.prose hr{border:0;border-top:1px solid var(--rule);margin:2.2em 0}

/* filing block under an article */
.filing{
  max-width:var(--measure);margin:var(--s6) auto 0;border-top:2px solid var(--navy);padding-top:var(--s3);
  display:flex;flex-wrap:wrap;gap:10px;align-items:center;
}
.filing__label{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}

/* prev / next records */
.adjacent{max-width:var(--wrap);margin:var(--s6) auto 0;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--rule)}
.adjacent__a{background:var(--sheet);padding:var(--s4);display:block}
.adjacent__a:hover{background:var(--paper-2)}
.adjacent__k{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--seal);display:block;margin-bottom:9px}
.adjacent__t{font-family:var(--f-disp);font-weight:700;font-size:1.06rem;line-height:1.28;color:var(--ink)}
.adjacent__a--next{text-align:right}

/* related */
.related{padding:var(--s6) 0 0}
.related__list{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule-2)}
.related__i{background:var(--paper);padding:var(--s3) var(--s3) var(--s3) 0}
.related__no{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;color:var(--dim);display:block;margin-bottom:7px}
.related__t{font-family:var(--f-disp);font-weight:700;font-size:1.02rem;line-height:1.3;color:var(--ink)}
.related__i:hover .related__t{color:var(--navy-2)}

/* ------------------------------------------------------------ page/misc */
.pagehead{padding:var(--s6) 0 var(--s4)}
.pagehead__t{font-family:var(--f-disp);font-weight:800;font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.08;letter-spacing:-.02em;margin:0}
.pagehead__d{color:var(--ink-2);margin:var(--s2) 0 0;max-width:60ch}
.notice{
  border:1px solid var(--rule);background:var(--sheet);padding:var(--s5);text-align:center;margin:var(--s5) 0 var(--s6);
}
.notice h2{font-family:var(--f-disp);font-weight:800;font-size:1.4rem;margin:0 0 10px}
.notice p{color:var(--ink-2);margin:0 auto var(--s3);max-width:48ch}

/* --------------------------------------------------------------- widget */
.widget{border:1px solid var(--rule);background:var(--sheet);padding:var(--s3);margin:0 0 var(--s3)}
.widget-title{font-family:var(--f-disp);font-weight:800;font-size:13px;letter-spacing:.14em;text-transform:uppercase;margin:0 0 10px;color:var(--navy)}
.widget ul{list-style:none;margin:0;padding:0;font-size:.96rem}
.widget li{padding:5px 0;border-bottom:1px solid var(--rule-3)}
.widget li:last-child{border-bottom:0}

/* --------------------------------------------------------------- footer */
.foot{background:var(--navy);color:#C8D4E3;margin-top:var(--s6)}
.foot__in{max-width:var(--wrap);margin:0 auto;padding:var(--s6) 24px var(--s5);display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:var(--s5)}
.foot h3{font-family:var(--f-disp);font-weight:800;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#8FA8C6;margin:0 0 var(--s3)}
.foot p{margin:0 0 1em;font-size:.98rem;line-height:1.6;color:#B9C7D8;max-width:44ch}
.foot ul{list-style:none;margin:0;padding:0}
.foot li{margin:0 0 8px}
.foot a{color:#DCE5F0;font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.foot a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.foot__brand{display:flex;align-items:center;gap:12px;margin-bottom:var(--s3)}
.foot__brand svg{width:44px;height:44px;flex:none;opacity:.9}
.foot__name{font-family:var(--f-disp);font-weight:800;font-size:17px;letter-spacing:.06em;text-transform:uppercase;color:#fff}
.colophon{
  border-top:1px solid rgba(255,255,255,.14);max-width:var(--wrap);margin:0 auto;padding:var(--s3) 24px var(--s5);
  font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#8FA8C6;
  display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);
}

/* -------------------------------------------------------------- responsive */
@media (max-width:900px){
  .lead__grid{grid-template-columns:1fr}
  .lead__seal{width:112px;height:112px;order:-1}
  .related__list{grid-template-columns:1fr;background:none}
  .related__i{padding:var(--s3) 0;border-top:1px solid var(--rule-2)}
  .foot__in{grid-template-columns:1fr 1fr}
  .foot__about{grid-column:1/-1}
}
@media (max-width:680px){
  body{font-size:16.5px}
  .mast__in{flex-wrap:wrap;gap:var(--s2) var(--s3);padding:12px 20px}
  .mast__toggle{
    display:block;margin-left:auto;background:none;border:1px solid rgba(255,255,255,.3);color:#DCE5F0;
    font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:7px 11px;cursor:pointer;
  }
  .mast__nav{flex-basis:100%;margin-left:0;display:none}
  .mast__nav.is-open{display:block}
  .mast__nav ul{flex-direction:column;gap:0}
  .mast__nav li{border-top:1px solid rgba(255,255,255,.12)}
  .mast__nav a{padding:11px 0}
  .wrap{padding:0 20px}
  .issue__in{padding:9px 20px;font-size:10.5px;gap:8px var(--s3)}
  .issue__search{margin-left:0;flex-basis:100%}
  .sform input[type=search]{width:100%}
  .lead{padding:var(--s5) 0 var(--s4)}
  .rec{grid-template-columns:1fr;gap:var(--s2)}
  .rec--img{grid-template-columns:1fr}
  .rec__no{display:flex;align-items:baseline;gap:9px;padding-top:0}
  .rec__no b{margin-top:0;font-size:15px}
  .rec__plate{order:3;max-width:180px}
  .adjacent{grid-template-columns:1fr}
  .adjacent__a--next{text-align:left}
  .foot__in{grid-template-columns:1fr;padding:var(--s5) 20px var(--s4)}
  .colophon{padding:var(--s3) 20px var(--s4)}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  .rec__title a{transition:none}
}
@media print{
  .mast,.issue,.foot,.pagination,.adjacent,.related,.colophon{display:none}
  body{background:#fff}
}
