/*
Theme Name: GTA & Co. — The Report
Theme URI: https://gtaandco.com
Author: GTA & Company
Description: A broadsheet-newsroom theme for GTA & Company — masthead header, colophon footer, and full newsprint styling. Homepage content lives in a normal WordPress Page (edit it in the block editor); a handful of contact/masthead details are editable under Appearance → Customize.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gta-report
*/

:root{
  --paper:#e9e2cf;
  --surface:#f4efe0;
  --ink:#1d1a14;
  --ink-soft:#5c5646;
  --flag:#a91e2c;
  --verified:#33502f;
  --rule:#1d1a14;
  --rule-soft:#c3b99f;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#15110c;
    --surface:#1c170f;
    --ink:#ece3cd;
    --ink-soft:#b3a892;
    --flag:#e8555f;
    --verified:#5fae5a;
    --rule:#ece3cd;
    --rule-soft:#3c3527;
  }
}
:root[data-theme="dark"]{
  --paper:#15110c;
  --surface:#1c170f;
  --ink:#ece3cd;
  --ink-soft:#b3a892;
  --flag:#e8555f;
  --verified:#5fae5a;
  --rule:#ece3cd;
  --rule-soft:#3c3527;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Libre Caslon Text", Georgia, "Times New Roman", serif;
  font-size:17px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
@media (prefers-reduced-motion: reduce){ *{animation-duration:.001ms !important; transition-duration:.001ms !important;} }
h1,h2,h3{
  font-family:"Libre Caslon Display", Georgia, serif;
  font-weight:400;
  line-height:1;
  text-wrap:balance;
  margin:0;
  letter-spacing:-0.01em;
}
a{color:inherit;}
img{max-width:100%; height:auto;}
.press{font-family:"Courier Prime", ui-monospace, monospace;}
.wrap{max-width:1180px; margin:0 auto; padding:0 26px;}

/* accessibility: skip link */
.skip-link.screen-reader-text{
  position:absolute; left:-9999px; top:0; background:var(--ink); color:var(--paper);
  padding:10px 16px; z-index:999; font-family:"Courier Prime", monospace; font-size:13px;
}
.skip-link.screen-reader-text:focus{ left:12px; top:12px; }
.screen-reader-text{ position:absolute !important; height:1px; width:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); white-space:nowrap; }

/* ---- utility bar ---- */
.utility-bar{
  border-bottom:1px solid var(--rule);
  font-family:"Courier Prime", monospace;
  font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--ink-soft);
}
.utility-bar .wrap{display:flex; justify-content:space-between; padding:9px 26px; flex-wrap:wrap; gap:6px;}

/* ---- masthead ---- */
.masthead{border-bottom:4px double var(--rule); padding:22px 0 14px;}
.masthead-grid{display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap;}
.nameplate{
  font-family:"Libre Caslon Display", serif;
  font-size:clamp(2.6rem, 7vw, 5rem);
  letter-spacing:-0.01em;
  text-align:center;
  flex:1 1 auto;
}
.nameplate .amp{color:var(--flag);}
.price-box, .edition-box{
  border:1px solid var(--rule);
  padding:8px 14px;
  font-family:"Courier Prime", monospace;
  font-size:11px;
  text-align:center;
  line-height:1.4;
  white-space:nowrap;
}
.tagline-row{
  text-align:center; margin-top:10px;
  font-family:"Courier Prime", monospace;
  font-size:12px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--ink-soft);
  border-top:1px solid var(--rule-soft);
  padding-top:10px;
}

/* ---- section label ---- */
.section-flag{
  display:inline-block;
  background:var(--flag); color:var(--surface);
  font-family:"Courier Prime", monospace;
  font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase;
  padding:4px 10px; font-weight:700;
  margin-bottom:14px;
}

/* ---- front page: hero ---- */
.frontpage{padding:40px 0 56px; border-bottom:1px solid var(--rule);}
.frontpage-grid{display:grid; grid-template-columns:2fr 1px 1fr; gap:36px;}
.col-rule{background:var(--rule-soft);}
.headline{
  font-size:clamp(2rem, 4.4vw, 3.1rem);
  margin-top:6px;
}
.byline{
  font-family:"Courier Prime", monospace; font-size:12.5px;
  color:var(--ink-soft); margin-top:12px; letter-spacing:0.02em;
}
.lead p{margin:16px 0 0; max-width:60ch;}
.lead p:first-of-type::first-letter{
  font-family:"Libre Caslon Display", serif;
  font-size:64px; float:left; line-height:0.8;
  padding:6px 8px 0 0; color:var(--flag);
}
.hero-actions{display:flex; gap:14px; margin-top:26px; flex-wrap:wrap; align-items:center;}
.btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:"Courier Prime", monospace; font-weight:700; font-size:13px;
  letter-spacing:0.04em; text-transform:uppercase;
  padding:13px 20px; text-decoration:none; cursor:pointer;
  border:1px solid var(--ink);
}
.btn-primary{background:var(--flag); color:var(--surface); border-color:var(--flag);}
.btn-primary:hover{filter:brightness(1.08);}
.btn-ghost{background:transparent; color:var(--ink);}
.btn-ghost:hover{background:var(--rule-soft);}
.btn:focus-visible{outline:2px solid var(--flag); outline-offset:2px;}

.clip{
  border:1px solid var(--rule);
  background:var(--surface);
  padding:18px;
}
.clip .cap{
  font-family:"Courier Prime", monospace; font-size:11px; color:var(--ink-soft);
  margin-top:10px; border-top:1px dashed var(--rule-soft); padding-top:8px;
}
.clip-stats{display:flex; flex-direction:column; gap:14px;}
.clip-stat{display:flex; justify-content:space-between; align-items:baseline; border-bottom:1px dotted var(--rule-soft); padding-bottom:10px;}
.clip-stat:last-child{border-bottom:none;}
.clip-stat .v{font-family:"Libre Caslon Display",serif; font-size:26px; color:var(--verified);}
.clip-stat .k{font-family:"Courier Prime", monospace; font-size:11.5px; color:var(--ink-soft); max-width:16ch; text-align:right;}

.briefs{padding-left:36px;}
.briefs h3{font-size:15px; font-family:"Courier Prime", monospace; letter-spacing:0.08em; text-transform:uppercase; border-bottom:2px solid var(--rule); padding-bottom:8px; margin:0;}
.brief-item{padding:14px 0; border-bottom:1px dotted var(--rule-soft); font-size:14.5px;}
.brief-item b{display:block; font-family:"Courier Prime", monospace; font-size:13px; color:var(--flag); margin-bottom:2px;}
@media (max-width:900px){ .frontpage-grid{grid-template-columns:1fr;} .col-rule{display:none;} .briefs{padding-left:0;} }

/* ---- generic block ---- */
section.block{padding:64px 0; border-bottom:1px solid var(--rule);}
.block-head{margin-bottom:36px;}
.block-head h2{font-size:clamp(1.7rem, 3vw, 2.4rem); max-width:24ch;}
.block-head p{color:var(--ink-soft); max-width:56ch; margin-top:12px; font-size:15.5px;}

/* ---- reported results ---- */
.story-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:0;}
.story{border-left:1px solid var(--rule-soft); padding:0 26px;}
.story:first-child{border-left:none; padding-left:0;}
.story .dateline{font-family:"Courier Prime", monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft);}
.story h3{font-size:21px; margin-top:8px;}
.story .byline2{font-family:"Courier Prime", monospace; font-size:11.5px; color:var(--ink-soft); margin-top:8px; font-style:italic;}
.pull-quote{
  font-family:"Libre Caslon Display", serif; font-size:34px; color:var(--verified);
  margin-top:18px; line-height:1;
}
.pull-quote + .pull-quote{margin-top:4px;}
.pull-label{font-family:"Courier Prime", monospace; font-size:11px; color:var(--ink-soft); margin-top:2px;}
.editors-note{
  margin-top:18px; font-size:12px; color:var(--ink-soft); border:1px solid var(--rule-soft);
  padding:8px 10px; font-family:"Courier Prime", monospace;
}
.editors-note b{color:var(--flag);}
@media (max-width:860px){ .story-grid{grid-template-columns:1fr; gap:30px;} .story{border-left:none; padding:0; border-top:1px solid var(--rule-soft); padding-top:26px;} .story:first-child{border-top:none; padding-top:0;} }

/* ---- classifieds ---- */
.classi-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.classi{
  border:1px dashed var(--rule);
  padding:18px;
  position:relative;
}
.classi.featured{border-style:solid; border-color:var(--flag);}
.classi .tag{
  font-family:"Courier Prime", monospace; font-size:10.5px; letter-spacing:0.08em; color:var(--flag);
  position:absolute; top:-9px; left:14px; background:var(--paper); padding:0 6px;
}
.classi h3{font-size:16.5px; text-transform:uppercase; letter-spacing:0.01em; margin-top:6px;}
.classi p{font-size:13.5px; color:var(--ink-soft); margin:10px 0 0;}
@media (max-width:860px){ .classi-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .classi-grid{grid-template-columns:1fr;} }

/* ---- inside this issue (process) ---- */
.toc{display:flex; flex-direction:column; max-width:760px;}
.toc-row{display:flex; align-items:baseline; gap:10px; padding:16px 0 0; border-bottom:0;}
.toc-row .label{font-family:"Libre Caslon Display", serif; font-size:19px; white-space:nowrap;}
.toc-row .leader{flex:1; border-bottom:1px dotted var(--ink-soft); transform:translateY(-5px);}
.toc-row .page{font-family:"Courier Prime", monospace; font-size:13px; color:var(--flag); white-space:nowrap;}
.toc-desc{font-size:14px; color:var(--ink-soft); margin:6px 0 0; max-width:64ch;}
.toc-block{padding-bottom:16px; border-bottom:1px dotted var(--rule-soft); margin-bottom:0;}

/* ---- subscription rates ---- */
.rates{border:1px solid var(--rule);}
.rates-head{
  background:var(--ink); color:var(--paper);
  font-family:"Courier Prime", monospace; text-transform:uppercase; letter-spacing:0.08em;
  font-size:12.5px; text-align:center; padding:12px; border-bottom:4px double var(--paper);
}
.rates-grid{display:grid; grid-template-columns:repeat(3,1fr);}
.rate-col{padding:24px; border-left:1px solid var(--rule-soft);}
.rate-col:first-child{border-left:none;}
.rate-col .edition{font-family:"Courier Prime", monospace; font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--flag);}
.rate-col h3{font-size:22px; margin-top:8px;}
.rate-col .amt{font-family:"Libre Caslon Display", serif; font-size:32px; margin-top:10px;}
.rate-col .amt span{font-family:"Courier Prime", monospace; font-size:13px; color:var(--ink-soft);}
.rate-col .fit{font-size:12.5px; color:var(--ink-soft); margin-top:8px; font-style:italic;}
.rate-col ul{margin:16px 0 0; padding-left:16px; font-size:13.5px; color:var(--ink-soft); display:flex; flex-direction:column; gap:6px;}
@media (max-width:860px){ .rates-grid{grid-template-columns:1fr;} .rate-col{border-left:none; border-top:1px solid var(--rule-soft);} .rate-col:first-child{border-top:none;} }

/* ---- letters to the editor ---- */
.letters{max-width:760px; display:flex; flex-direction:column;}
.letter{border-top:1px solid var(--rule-soft); padding:20px 0;}
.letter:last-child{border-bottom:1px solid var(--rule-soft);}
.letter .q{font-style:italic; font-size:16px; margin:0;}
.letter .q::before{content:"\201C"; color:var(--flag); font-family:"Libre Caslon Display",serif; font-size:22px;}
.letter .a{margin-top:12px; font-size:14.5px; color:var(--ink-soft); display:flex; gap:10px;}
.letter .a b{font-family:"Courier Prime", monospace; color:var(--verified); white-space:nowrap; font-size:12px; text-transform:uppercase; letter-spacing:0.04em;}

/* ---- want ad final cta ---- */
.want-ad{padding:56px 0;}
.want-ad-box{
  border:3px solid var(--ink); padding:44px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:16px;
}
.want-ad-box .section-flag{margin-bottom:0;}
.want-ad-box h2{font-size:clamp(1.8rem,3.6vw,2.6rem); max-width:22ch;}
.want-ad-box p{color:var(--ink-soft); max-width:52ch; font-size:15.5px; margin:0;}
.want-row{display:flex; gap:14px; flex-wrap:wrap; justify-content:center; margin-top:8px;}

/* ---- colophon footer ---- */
footer{padding:28px 0; font-family:"Courier Prime", monospace; font-size:12px; color:var(--ink-soft);}
.foot-grid{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;}
footer a{text-decoration:none;}
footer a:hover{color:var(--ink);}

/* ---- reveal ---- */
.reveal{opacity:0; transform:translateY(10px); transition:opacity .5s ease, transform .5s ease;}
.reveal.in{opacity:1; transform:none;}

/* ---- generic page fallback (page.php) ---- */
.plain-page{padding:60px 0; max-width:760px; margin:0 auto;}
.plain-page h1{font-size:clamp(2rem,4vw,2.8rem);}
.plain-page .entry-content{margin-top:20px; font-size:16px;}
.plain-page .entry-content p{margin:0 0 18px;}
