/* ============================================================
   The bulletin template — newsprint structure, Source Serif 4
   throughout, Flower City green as the interactive ink, heritage
   brick reserved for live and breaking, press yellow only in the
   nameplate's plate treatment. No boxes, no dividers: the
   thick-thin rule pair is the only furniture.
   First user: The Brampton Bulletin. Loaded only when
   chrome.template = "bulletin"; a site's brand.css may re-tune
   the --bb-* tokens.
   ============================================================ */
@import url('/assets/css/fonts.css');  /* self-hosted; was fonts.googleapis.com */

body.t-bulletin{
  --bb-green:  #0B6E4F;   /* every link, kicker, button, beat label */
  --bb-deep:   #095A41;
  --bb-brick:  #B03A2B;   /* live, breaking, corrections — rare     */
  --bb-yellow: #EDBB00;   /* plate treatments only, never as UI     */
  --bb-ink:    #201E1D;   /* all body copy and headlines            */
  --bb-paper:  #F3F2F2;   /* the page, always — no dark surfaces    */
  --bb-muted:  #6E6A64;
  --bb-line:   #DBD9D4;
  --bb-tint:   #E2EEE9;   /* green beat-chip tint                   */
  --bb-serif:  'Source Serif 4', Georgia, serif;

  /* Inner pages read as the brand. */
  --pp-shelterbelt: var(--bb-ink);
  --pp-cloudbank:   var(--bb-paper);
  --pp-board:       var(--bb-line);
  --pp-bigsky:      var(--bb-green);
  --pp-noonsky:     var(--bb-deep);
  --pp-highsky:     var(--bb-tint);
  --pp-straw:       #F4ECCB;
  --pp-binred:      var(--bb-brick);
  --pp-quarter:     var(--bb-deep);
  --pp-fencepost:   var(--bb-green);
  --pp-stubble:     var(--bb-muted);

  background: var(--bb-paper);
  color: var(--bb-ink);
  font-family: var(--bb-serif);
}

body.t-bulletin h1, body.t-bulletin h2, body.t-bulletin h3,
body.t-bulletin .card h3, body.t-bulletin .headwrap h1{
  font-family: var(--bb-serif);
  letter-spacing: 0;
}
body.t-bulletin .bodycopy, body.t-bulletin .bodycopy p{
  font-family: var(--bb-serif);
}
body.t-bulletin .lede, body.t-bulletin .standfirst{
  font-family: var(--bb-serif);
  font-style: italic;
}
body.t-bulletin .bodycopy blockquote{
  border-left: 3px solid var(--bb-green);
  padding-left: 18px;
  font-style: italic;
  font-size: 1.12em;
  color: var(--bb-ink);
}

.bb-kicker{font-family:var(--bb-serif);font-size:11.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--bb-green)}
.bb-rulepair{border-top:4px solid var(--bb-ink);position:relative}
.bb-rulepair::after{content:"";position:absolute;left:0;right:0;top:6px;
  height:1px;background:var(--bb-ink)}

/* ---- Utility bar -------------------------------------------- */
.bb-util{background:var(--bb-paper)}
.bb-util .wrap{max-width:1296px;margin:0 auto;padding:12px 24px;
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  font-size:13.5px;color:var(--bb-muted)}
.bb-util .grp{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.bb-util a{color:var(--bb-green);text-decoration:none;font-weight:600}
.bb-util a:hover{text-decoration:underline}
.bb-btn{display:inline-block;font-family:var(--bb-serif);font-size:13.5px;
  font-weight:700;padding:9px 16px;border-radius:3px;text-decoration:none;
  cursor:pointer;border:0;background:var(--bb-green);color:#fff !important}
.bb-btn:hover{background:var(--bb-deep);text-decoration:none !important}

/* ---- Masthead ----------------------------------------------- */
.bb-mast{border-top:4px solid var(--bb-ink)}
.bb-mast .wrap{max-width:1296px;margin:0 auto;padding:22px 24px 16px;
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:24px;
  border-bottom:1px solid var(--bb-ink)}
.bb-mast .brand{display:flex;align-items:center;gap:16px;text-decoration:none}
.bb-mast .brand img{display:block;width:52px;height:auto}
.bb-mast .plate{font-family:var(--bb-serif);font-weight:800;line-height:.95;
  font-size:clamp(30px,3.4vw,44px);letter-spacing:-.01em;color:var(--bb-ink);
  text-shadow:2px 2px 0 var(--bb-yellow), -1px -1px 0 rgba(11,110,79,.55)}
.bb-mast .vol{text-align:right;font-size:12.5px;line-height:1.55;
  color:var(--bb-muted)}

/* ---- Nav + live ticker -------------------------------------- */
.bb-nav{background:var(--bb-paper);border-bottom:1px solid var(--bb-line)}
.bb-nav .wrap{max-width:1296px;margin:0 auto;padding:0 24px;
  display:flex;gap:24px;align-items:center;overflow-x:auto;min-height:46px}
.bb-nav a{white-space:nowrap;font-family:var(--bb-serif);font-size:15px;
  font-weight:600;color:var(--bb-ink);text-decoration:none}
.bb-nav a:hover{color:var(--bb-green)}
.bb-nav a[aria-current="page"]{color:var(--bb-green)}
.bb-nav a.op{font-style:italic;font-weight:500}
.bb-nav .live{margin-left:auto;display:flex;gap:8px;align-items:center;
  white-space:nowrap;text-decoration:none;font-size:14px}
.bb-nav .live .dot{width:8px;height:8px;border-radius:50%;
  background:var(--bb-brick);flex:none}
.bb-nav .live .l{font-size:12px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--bb-brick)}
.bb-nav .live .t{color:var(--bb-ink);font-weight:600}
.bb-nav .live:hover .t{color:var(--bb-brick)}

/* ---- Layout shell ------------------------------------------- */
.bb-main{max-width:1296px;margin:0 auto;padding:26px 24px 0}
body.t-bulletin .adslot{margin:0 0 26px}
body.t-bulletin .adslot .k{font-size:11px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--bb-muted)}

/* ---- Lead package + The Brief ------------------------------- */
.bb-lead{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(300px,1fr);
  gap:52px}
.bb-hero a{text-decoration:none;color:inherit;display:block}
.bb-hero .ph{aspect-ratio:16/9;overflow:hidden;background:#E5E3DF;
  margin-bottom:8px}
.bb-hero .ph img{width:100%;height:100%;object-fit:cover;display:block}
.bb-hero .cap{margin:0 0 18px;font-size:13px;color:var(--bb-muted)}
.bb-hero h1{margin:10px 0 14px;font-size:clamp(34px,3.5vw,48px);
  line-height:1.04;font-weight:600}
.bb-hero:hover h1{color:var(--bb-green)}
.bb-hero .dek{margin:0 0 14px;font-style:italic;font-size:19.5px;
  line-height:1.5;color:#3D3A37}
.bb-by{margin:0;font-size:13.5px;color:var(--bb-muted)}
.bb-by b{color:var(--bb-ink);font-weight:600}

.bb-brief .bh{display:flex;justify-content:space-between;align-items:baseline;
  padding-top:9px;margin-bottom:4px}
.bb-brief .bh .t{font-size:12px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--bb-green)}
.bb-brief .bh .s{font-size:12.5px;color:var(--bb-muted)}
.bb-brief a.it{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;
  padding:15px 0;border-bottom:1px solid var(--bb-line);
  text-decoration:none;color:inherit}
.bb-brief a.it:last-child{border-bottom:0}
.bb-brief .no{font-size:15px;font-weight:700;color:var(--bb-green)}
.bb-brief h3{margin:0 0 5px;font-size:19.5px;line-height:1.18;font-weight:600}
.bb-brief a.it:hover h3{color:var(--bb-green)}
.bb-brief p{margin:0;font-size:14.5px;line-height:1.45;color:var(--bb-muted)}

/* ---- Three-up row ------------------------------------------- */
.bb-row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px;
  margin-top:44px;padding-top:34px;border-top:1px solid var(--bb-line)}
.bb-cell{text-decoration:none;color:inherit;display:block}
.bb-cell .ph{aspect-ratio:16/10;overflow:hidden;background:#E5E3DF;
  margin-bottom:14px}
.bb-cell .ph img{width:100%;height:100%;object-fit:cover;display:block}
.bb-cell h3{margin:8px 0 10px;font-size:23.5px;line-height:1.12;font-weight:600}
.bb-cell:hover h3{color:var(--bb-green)}
.bb-cell p{margin:0 0 10px;font-size:15px;line-height:1.5}
.bb-cell.op h3{font-style:italic}

/* ---- Around the GTA ----------------------------------------- */
.bb-gta{margin-top:48px;padding:26px 0 40px;border-top:1px solid var(--bb-line)}
.bb-gta .gh{font-size:12px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--bb-muted);margin:0 0 18px}
.bb-gta .grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:36px}
.bb-gta a{text-decoration:none;color:inherit;display:block}
.bb-gta .city{display:block;margin-bottom:7px;font-size:11.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--bb-green)}
.bb-gta h3{margin:0;font-size:19px;line-height:1.2;font-weight:600}
.bb-gta a:hover h3{color:var(--bb-green)}

/* ---- Newsletter close --------------------------------------- */
.bb-news{margin-top:8px;padding:30px 0 38px;border-top:4px solid var(--bb-ink);
  position:relative}
.bb-news::after{content:"";position:absolute;left:0;right:0;top:6px;height:1px;
  background:var(--bb-ink)}
.bb-news .inner{display:grid;grid-template-columns:minmax(0,1fr) 420px;
  gap:44px;align-items:center}
.bb-news h2{margin:6px 0 8px;font-size:31px;font-weight:600}
.bb-news p{margin:0;font-size:15.5px;line-height:1.5;color:var(--bb-muted);
  max-width:560px}
.bb-news form{display:flex;gap:10px}
.bb-news input[type="email"]{flex:1;padding:12px 14px;
  border:1px solid var(--bb-line);border-radius:3px;
  font-family:var(--bb-serif);font-size:14.5px;background:#fff;
  color:var(--bb-ink)}
.bb-news input[type="email"]:focus{outline:2px solid var(--bb-green);outline-offset:1px}
.bb-news .done{font-size:16px;color:var(--bb-deep)}

/* ---- Footer ------------------------------------------------- */
.bb-foot{margin-top:0;border-top:4px solid var(--bb-ink);position:relative;
  background:var(--bb-paper)}
.bb-foot::after{content:"";position:absolute;left:0;right:0;top:6px;height:1px;
  background:var(--bb-ink)}
.bb-foot .cols{max-width:1296px;margin:0 auto;padding:38px 24px 26px;
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px}
.bb-foot .brand{display:flex;align-items:center;gap:12px;
  text-decoration:none;margin-bottom:12px}
.bb-foot .brand img{display:block;width:36px;height:auto}
.bb-foot .brand .t{font-family:var(--bb-serif);font-size:23px;font-weight:800;
  color:var(--bb-ink)}
.bb-foot .about{margin:0;font-size:14px;line-height:1.6;color:var(--bb-muted);
  max-width:320px}
.bb-foot .fh{margin:0 0 12px;font-size:11.5px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--bb-green)}
.bb-foot .lnks{display:flex;flex-direction:column;gap:8px}
.bb-foot .lnks a{color:var(--bb-ink);text-decoration:none;font-size:14.5px}
.bb-foot .lnks a:hover{color:var(--bb-green);text-decoration:underline}
.bb-foot .legal{border-top:1px solid var(--bb-line)}
.bb-foot .legal .wrap{max-width:1296px;margin:0 auto;padding:14px 24px;
  font-size:12.5px;color:var(--bb-muted);display:flex;
  justify-content:space-between;gap:12px;flex-wrap:wrap}

/* ---- Small screens ------------------------------------------ */
@media (max-width: 980px){
  .bb-lead{grid-template-columns:minmax(0,1fr)}
  .bb-row3{grid-template-columns:minmax(0,1fr)}
  .bb-gta .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bb-news .inner{grid-template-columns:minmax(0,1fr)}
  .bb-foot .cols{grid-template-columns:1fr 1fr}
  .bb-mast .vol{display:none}
}
@media (max-width: 620px){
  .bb-gta .grid{grid-template-columns:minmax(0,1fr)}
  .bb-nav .live .t{display:none}
  .bb-news form{flex-direction:column}
  .bb-foot .cols{grid-template-columns:1fr}
}
