/* The inner pages: /press, /gallery and the sponsor page.
   Same two colours, same two typefaces as the homepage. */
:root{
  --ink:#0a0a0a;
  --paper:#f3f2ee;
  --serif:"Times New Roman",Times,"Liberation Serif","Nimbus Roman",serif;
  --mono:"Geist Mono","JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --gut:clamp(1rem,5vw,4.5rem);
  --shell:1240px;
  --measure:58ch;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--serif);
  font-size:clamp(1.05rem,1rem + 0.3vw,1.25rem);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,p,figure,blockquote,ul,ol,dl,dd{margin:0;}
ul,ol{padding:0;list-style:none;}
h1,h2,h3{font-weight:400;letter-spacing:-0.03em;text-wrap:balance;}
a{color:inherit;}
img,video{max-width:100%;display:block;}
::selection{background:var(--paper);color:var(--ink);}
.w ::selection{background:var(--ink);color:var(--paper);}

.b{background:var(--ink);color:var(--paper);}
.w{background:var(--paper);color:var(--ink);}
.wrap{max-width:var(--shell);margin-inline:auto;padding-inline:var(--gut);}
section{padding-block:clamp(3.5rem,9vw,7rem);}

.mono{
  font-family:var(--mono);
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  line-height:1.6;
}
.eyebrow{margin-bottom:1.4rem;display:flex;gap:0.9rem;align-items:center;}
.eyebrow::before{content:"";width:2.2rem;height:1px;background:currentColor;flex:none;}
.display{font-size:clamp(3rem,9vw,8rem);line-height:0.88;letter-spacing:-0.045em;}
.display em,.h2 em{font-style:italic;}
.h2{font-size:clamp(2.2rem,6vw,4.6rem);line-height:0.95;margin-bottom:1.4rem;}
.lede{font-size:clamp(1.2rem,1.05rem + 0.7vw,1.6rem);line-height:1.35;max-width:36ch;text-wrap:balance;}
.body{max-width:var(--measure);}
.body + .body{margin-top:1rem;}
.quiet{opacity:.62;}

/* ---------- top bar ---------- */
.topbar{display:flex;justify-content:space-between;gap:0.6rem 1.5rem;flex-wrap:wrap;padding-block:1rem;border-bottom:1px solid currentColor;}
.topbar nav{display:flex;gap:0.4rem 1.2rem;flex-wrap:wrap;}
.topbar a{text-decoration:none;border-bottom:1px solid transparent;transition:border-color .25s;}
.topbar a:hover,.topbar a:focus-visible,.topbar a[aria-current]{border-bottom-color:currentColor;}

/* small text links get an invisible, bigger hit area for thumbs; nothing moves visually */
.topbar a,footer a,.facts a{position:relative;}
.topbar a::after,footer a::after,.facts a::after{content:"";position:absolute;inset:-0.7rem -0.35rem;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:0.9rem;
  font-family:var(--mono);font-size:0.78rem;letter-spacing:0.14em;text-transform:uppercase;
  text-decoration:none;border:1px solid currentColor;padding:1.05rem 1.4rem;
  transition:background .25s,color .25s;
}
.btn .arr{transition:transform .35s cubic-bezier(.7,0,.2,1);}
.btn:hover .arr{transform:translateX(0.35rem);}
.b .btn-fill{background:var(--paper);color:var(--ink);border-color:var(--paper);}
.b .btn-fill:hover{background:var(--ink);color:var(--paper);}
.w .btn-fill{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.w .btn-fill:hover{background:var(--paper);color:var(--ink);}
.b .btn-line:hover{background:var(--paper);color:var(--ink);}
.w .btn-line:hover{background:var(--ink);color:var(--paper);}
.cta{display:flex;flex-wrap:wrap;gap:1rem 1.5rem;align-items:center;margin-top:2rem;}
a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:4px;}

/* ---------- layout bits ---------- */
.split{display:grid;gap:clamp(2rem,5vw,4.5rem);}
@media (min-width:880px){.split{grid-template-columns:1fr 1fr;align-items:start;}}
.rule{border-top:1px solid currentColor;}

/* facts: label / value rows */
.facts{display:grid;grid-template-columns:auto 1fr;gap:0.55rem 1.4rem;border-top:1px solid currentColor;padding-top:1.2rem;}
.facts dt{padding-top:0.3em;}
.facts dd{line-height:1.35;}

/* the hour, as a ruler */
.ruler{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid currentColor;margin-top:2rem;}
.ruler li{padding:0.8rem 0.5rem 0 0;border-left:1px solid currentColor;padding-left:0.6rem;}
.ruler li:first-child{border-left:0;padding-left:0;}
.ruler time{display:block;font-family:var(--mono);font-size:0.72rem;letter-spacing:0.1em;}
.ruler b{font-weight:400;font-size:clamp(1.1rem,2.2vw,1.6rem);}
.ruler .dark{background:currentColor;}
.ruler .dark time,.ruler .dark b{color:var(--ink);}
.w .ruler .dark time,.w .ruler .dark b{color:var(--paper);}

/* quotes */
.quotes{display:grid;gap:clamp(2rem,4vw,3rem);}
@media (min-width:880px){.quotes{grid-template-columns:1fr 1fr;}}
.quote blockquote{font-size:clamp(1.35rem,1.1rem + 1vw,2rem);line-height:1.2;letter-spacing:-0.02em;text-wrap:pretty;}
.quote blockquote::before{content:"\201C";}
.quote blockquote::after{content:"\201D";}
.quote figcaption{margin-top:0.9rem;}

/* outlets */
.outlets{display:grid;gap:0;border-top:1px solid currentColor;}
.outlets li{display:grid;grid-template-columns:1fr auto;gap:0.3rem 1.5rem;align-items:baseline;padding-block:1.1rem;border-bottom:1px solid currentColor;}
.outlets .name{font-size:clamp(1.5rem,3.4vw,2.6rem);letter-spacing:-0.03em;line-height:1;}
.outlets .what{grid-column:1/-1;max-width:var(--measure);}
.outlets a{text-decoration:none;}
.outlets .name{display:flex;align-items:center;}
.outlets .name img{width:auto;}
.outlets li{align-items:center;}
.outlets a{transition:opacity .25s;}
.outlets a:hover{opacity:.62;}

/* press logos: single colour, black files flipped to paper on the dark sections */
.logos{display:flex;flex-wrap:wrap;align-items:center;gap:1.4rem clamp(2rem,5vw,4rem);}
.logos img{width:auto;}
.logos .globe,.outlets .globe{height:clamp(1.15rem,2.2vw,1.6rem);}
.logos .nbc,.outlets .nbc{height:clamp(2.1rem,4vw,2.9rem);}
.logos .wbz,.outlets .wbz{height:clamp(2.3rem,4.4vw,3.2rem);}
.logos .gbh,.outlets .gbh{height:clamp(1.6rem,3vw,2.2rem);}
.logos .bbj,.outlets .bbj{height:clamp(1.7rem,3.2vw,2.4rem);}
.b .logos img{filter:invert(1);}
@media print{.b .logos img{filter:none;}}

/* photos */
.strip{display:grid;gap:0.6rem;grid-template-columns:repeat(2,1fr);}
@media (min-width:880px){.strip{grid-template-columns:repeat(4,1fr);}}
.strip img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;}

.gallery{columns:2 14rem;column-gap:0.6rem;}
.gallery a{display:block;margin-bottom:0.6rem;break-inside:avoid;cursor:zoom-in;}
.gallery img{width:100%;height:auto;}

/* full-size viewer */
dialog.view{border:0;padding:0;margin:0;max-width:none;max-height:none;width:100vw;height:100svh;background:rgba(10,10,10,.96);color:var(--paper);}
dialog.view::backdrop{background:transparent;}
dialog.view img{width:100%;height:100%;object-fit:contain;padding:clamp(0.5rem,3vw,2.5rem);padding-top:3.5rem;}
.view-bar{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:0.9rem var(--gut);}
.view-bar button{font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0.4rem;}

/* tiers */
.tiers{display:grid;gap:0;border-top:1px solid currentColor;}
.tiers li{display:grid;gap:0.5rem 2rem;padding-block:1.6rem;border-bottom:1px solid currentColor;}
@media (min-width:880px){.tiers li{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);}}
.tiers h3{font-size:clamp(1.6rem,3.4vw,2.6rem);line-height:1;}
.tiers .tag{display:block;margin-top:0.7rem;}
.tiers ul{display:grid;gap:0.35rem;}
.tiers ul li{display:block;padding:0;border:0;}
.tiers ul li::before{content:"";display:inline-block;width:0.7em;height:1px;background:currentColor;vertical-align:0.32em;margin-right:0.55em;}

.redact{background:currentColor;border-radius:1px;}

footer{padding-block:2rem 2.5rem;}
footer .wrap{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-top:1rem;
  background:linear-gradient(currentColor,currentColor) var(--gut) 0/calc(100% - 2*var(--gut)) 1px no-repeat;}

@media (prefers-reduced-motion:reduce){
  .btn .arr,.btn:hover .arr{transition:none;transform:none;}
}
