/* ============================================================
   THE PROBE — Liberian Independent News
   Palette: Red #C8102E / Black #111 / White #FFF / Greys
   ============================================================ */
:root{
  --red:#C8102E;
  --red-dark:#8f0a20;
  --black:#0b0b45;
  --ink:#1c1d1f;
  --grey-900:#2b2c2e;
  --grey-700:#4a4b4e;
  --grey-500:#8a8b8f;
  --grey-300:#d7d8da;
  --grey-100:#f1f1f2;
  --white:#ffffff;
  --font-head:'Playfair Display', Georgia, serif;
  --font-body:'Inter', 'Helvetica Neue', Arial, sans-serif;
  --shadow:0 10px 30px rgba(17,18,20,.12);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--white);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;}
a{color:inherit;text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* ---------- African geometric pattern strip ---------- */
.pattern-strip{
  height:10px;
  background:
    repeating-linear-gradient(135deg,
      var(--red) 0 14px,
      var(--black) 14px 28px,
      #5a5b5e 28px 34px,
      var(--black) 34px 48px);
}

/* ---------- Top bar ---------- */
.topbar{background:var(--black);color:var(--grey-300);font-size:.78rem}
.topbar-inner{display:flex;justify-content:space-between;align-items:center;padding:7px 20px;gap:12px;flex-wrap:wrap}
.topbar-tag{letter-spacing:.14em;text-transform:uppercase;color:var(--grey-500)}
.topbar-social{display:flex;gap:14px}
.topbar-social a{
  color:var(--grey-300);font-weight:700;font-size:.72rem;letter-spacing:.08em;
  transition:color .2s;
}
.topbar-social a:hover{color:var(--red)}

/* ---------- Masthead ---------- */
.masthead{background:var(--white);border-bottom:1px solid var(--grey-300)}
.masthead-inner{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;gap:16px}
.brand{text-align:center;flex:1}
.brand-logo{
  font-family:var(--font-head);font-weight:900;font-size:2.6rem;color:var(--black);
  letter-spacing:.02em;line-height:1;
}
.brand-logo span{color:var(--red)}
.brand-logo.light{color:var(--white)}
.brand-tagline{
  font-size:.72rem;letter-spacing:.42em;text-transform:uppercase;color:var(--grey-500);
  margin-top:6px;
}
.masthead-right{display:flex;align-items:center;gap:12px}
.btn-subscribe{
  background:var(--red);color:var(--white);font-weight:700;font-size:.8rem;
  padding:10px 20px;letter-spacing:.08em;text-transform:uppercase;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
  transition:background .2s;
}
.btn-subscribe:hover{background:var(--black)}
.search-btn{
  background:none;border:1px solid var(--grey-300);color:var(--grey-700);
  font:inherit;font-size:.8rem;font-weight:600;padding:9px 16px;cursor:pointer;
  letter-spacing:.06em;text-transform:uppercase;transition:.2s;
}
.search-btn:hover{border-color:var(--red);color:var(--red)}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px}
.nav-toggle span{width:26px;height:3px;background:var(--black)}

/* ---------- Nav ---------- */
.mainnav{background:var(--black);position:sticky;top:0;z-index:50}
.nav-list{
  list-style:none;display:flex;justify-content:center;flex-wrap:wrap;
}
.nav-list a{
  display:block;color:var(--grey-300);font-size:.82rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;padding:15px 18px;
  position:relative;transition:color .2s;
}
.nav-list a::after{
  content:"";position:absolute;left:18px;right:18px;bottom:9px;height:2px;
  background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .25s;
}
.nav-list a:hover,.nav-list a.active{color:var(--white)}
.nav-list a:hover::after,.nav-list a.active::after{transform:scaleX(1)}

/* ---------- Breaking ticker ---------- */
.ticker-wrap{background:var(--red);color:var(--white)}
.ticker-inner{display:flex;align-items:center;gap:14px;padding:8px 20px}
.ticker-label{
  background:var(--black);font-weight:800;font-size:.72rem;letter-spacing:.18em;
  padding:4px 12px;white-space:nowrap;
  clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%);
}
.ticker-viewport{overflow:hidden;flex:1}
.ticker-track{display:flex;gap:56px;white-space:nowrap;animation:ticker 32s linear infinite}
.ticker-track span{font-size:.86rem;font-weight:500}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- Search overlay ---------- */
.search-overlay{
  position:fixed;inset:0;background:rgba(17,18,20,.96);z-index:100;
  display:flex;align-items:flex-start;justify-content:center;padding:14vh 20px 0;
  opacity:0;pointer-events:none;transition:opacity .25s;
}
.search-overlay.open{opacity:1;pointer-events:auto}
.search-close{
  position:absolute;top:24px;right:32px;background:none;border:none;color:var(--white);
  font-size:2.4rem;cursor:pointer;line-height:1;
}
.search-box{width:min(680px,100%)}
.search-box input{
  width:100%;background:none;border:none;border-bottom:2px solid var(--red);
  color:var(--white);font-family:var(--font-head);font-size:2rem;padding:10px 4px;
  outline:none;
}
.search-box input::placeholder{color:var(--grey-500)}
.search-results{margin-top:26px;max-height:55vh;overflow:auto}
.search-results a{
  display:block;color:var(--grey-300);padding:12px 4px;border-bottom:1px solid var(--grey-900);
  font-size:.95rem;transition:.2s;
}
.search-results a:hover{color:var(--white);padding-left:12px}
.search-results small{color:var(--red);text-transform:uppercase;letter-spacing:.12em;font-size:.68rem;margin-right:10px}

/* ---------- Hero ---------- */
.hero{display:grid;grid-template-columns:1.9fr 1fr;gap:26px;padding-top:34px;padding-bottom:34px}
.hero-lead{position:relative;min-height:480px;display:flex;align-items:flex-end;
  background:linear-gradient(180deg,rgba(17,18,20,0) 30%,rgba(17,18,20,.92) 100%),
             linear-gradient(135deg,#3a3b3e,#191a1c);
  overflow:hidden;
}
.hero-lead-link{display:block;width:100%;padding:38px;color:var(--white);position:relative;z-index:2}
.hero-lead h1{
  font-family:var(--font-head);font-weight:800;font-size:clamp(1.7rem,3.2vw,2.7rem);
  line-height:1.15;margin:14px 0 12px;
}
.hero-excerpt{color:var(--grey-300);max-width:640px;font-size:.98rem}
.byline{display:flex;gap:16px;margin-top:16px;font-size:.78rem;color:var(--grey-500);
  text-transform:uppercase;letter-spacing:.1em}
.byline .author{color:var(--red);font-weight:700}
.cat-chip{
  display:inline-block;background:var(--red);color:var(--white);font-size:.68rem;
  font-weight:800;letter-spacing:.16em;text-transform:uppercase;padding:5px 12px;
  clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%);
}
.hero-side{display:flex;flex-direction:column;gap:18px}
.hero-side article{
  background:var(--grey-100);border-left:4px solid var(--red);padding:16px 18px;
  display:flex;flex-direction:column;gap:8px;transition:.2s;
}
.hero-side article:hover{background:var(--black);color:var(--white)}
.hero-side h3{font-family:var(--font-head);font-size:1.05rem;line-height:1.3;font-weight:700}
.hero-side .meta{font-size:.72rem;color:var(--grey-500);text-transform:uppercase;letter-spacing:.1em}
.hero-side .cat-chip{align-self:flex-start;font-size:.62rem;padding:3px 9px}

/* ---------- Sections ---------- */
.section{padding:34px 0}
.section-head{display:flex;align-items:center;gap:16px;margin-bottom:24px}
.section-title{
  font-family:var(--font-head);font-weight:800;font-size:1.5rem;white-space:nowrap;
  display:flex;align-items:center;gap:12px;color:var(--black);
}
.section-title.light{color:var(--white)}
.section-title .tick{width:12px;height:26px;background:var(--red);flex:none;
  clip-path:polygon(0 0,100% 0,100% 100%,50% 78%,0 100%);}
.section-rule{flex:1;height:1px;background:var(--grey-300)}

/* ---------- Story cards ---------- */
.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.story-card{
  background:var(--white);border:1px solid var(--grey-300);display:flex;flex-direction:column;
  transition:.25s;
}
.story-card:hover{box-shadow:var(--shadow);transform:translateY(-4px);border-color:var(--black)}
.story-thumb{
  aspect-ratio:16/9;background:
    linear-gradient(135deg,rgba(200,16,46,.16),rgba(17,18,20,.55)),
    repeating-linear-gradient(45deg,#2b2c2e 0 12px,#222326 12px 24px);
  position:relative;overflow:hidden;
}
.story-thumb img{width:100%;height:100%;object-fit:cover}
.story-body{padding:18px;display:flex;flex-direction:column;gap:10px;flex:1}
.story-body h3{
  font-family:var(--font-head);font-size:1.12rem;font-weight:700;line-height:1.3;
}
.story-body h3 a:hover{color:var(--red)}
.story-body p{font-size:.86rem;color:var(--grey-700);flex:1}
.story-meta{font-size:.72rem;color:var(--grey-500);text-transform:uppercase;letter-spacing:.1em;
  display:flex;gap:12px}
.story-grid.compact{grid-template-columns:repeat(4,1fr)}
.story-grid.compact .story-body p{display:none}

/* ---------- Two column category lists ---------- */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:44px}
.mini-list{display:flex;flex-direction:column}
.mini-item{
  display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--grey-300);
  align-items:flex-start;transition:.2s;
}
.mini-item:hover{padding-left:8px}
.mini-num{
  font-family:var(--font-head);font-weight:900;font-size:1.9rem;color:var(--grey-300);
  line-height:1;min-width:40px;
}
.mini-item:hover .mini-num{color:var(--red)}
.mini-item h3{font-family:var(--font-head);font-size:1rem;font-weight:700;line-height:1.35}
.mini-item .meta{font-size:.72rem;color:var(--grey-500);text-transform:uppercase;letter-spacing:.1em;margin-top:6px}

/* ---------- Feature band ---------- */
.feature-band{
  background: #0b0b45;
  color:var(--white);margin:40px 0;
  border-top:4px solid var(--red);border-bottom:4px solid var(--red);
}
.feature-band-inner{padding:74px 20px;max-width:720px}
.feature-band h2{
  font-family:var(--font-head);font-weight:800;font-size:clamp(1.7rem,3vw,2.5rem);
  line-height:1.2;margin-bottom:18px;
}
.feature-band p{color:var(--grey-300);margin-bottom:28px;font-size:1.02rem}
.btn-light{
  display:inline-block;background:var(--white);color:var(--black);font-weight:700;
  font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;padding:12px 26px;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);transition:.2s;
}
.btn-light:hover{background:var(--red);color:var(--white)}
.btn-red{
  display:inline-block;background:var(--red);color:var(--white);font-weight:700;
  font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;padding:12px 26px;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);transition:.2s;
}
.btn-red:hover{background:var(--black)}

/* ---------- Tabs ---------- */
.tab-bar{display:flex;gap:8px;margin-bottom:24px;flex-wrap:wrap}
.tab{
  background:var(--grey-100);border:none;font:inherit;font-size:.78rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;padding:10px 22px;cursor:pointer;color:var(--grey-700);
  transition:.2s;
}
.tab:hover{background:var(--grey-300)}
.tab.active{background:var(--black);color:var(--white);box-shadow:inset 0 -3px 0 var(--red)}

/* ---------- About ---------- */
.about-section{background:var(--black);color:var(--grey-300);padding:70px 0;position:relative;overflow:hidden}
.about-section::before{
  content:"";position:absolute;inset:0;opacity:.05;
  background:repeating-linear-gradient(45deg,var(--white) 0 2px,transparent 2px 26px),
             repeating-linear-gradient(-45deg,var(--white) 0 2px,transparent 2px 26px);
  pointer-events:none;
}
.about-inner{display:grid;grid-template-columns:1.7fr 1fr;gap:56px;position:relative}
.about-text>p{margin-bottom:16px;font-size:.98rem}
.about-cards{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:26px}
.about-card{background:var(--grey-700);padding:22px;border-top:3px solid var(--red)} 
.about-card h3{font-family:var(--font-head);color:var(--white);margin-bottom:10px;font-size:1.15rem}
.about-card p{font-size:.86rem;color:var(--grey-300)}
.about-contact{background:var(--grey-700);padding:30px;border:1px solid #fff}
.about-contact h3{font-family:var(--font-head);color:var(--white);font-size:1.3rem;margin-bottom:18px}
.about-contact p{margin-bottom:16px;font-size:.9rem}
.about-contact strong{color:var(--red);text-transform:uppercase;font-size:.72rem;letter-spacing:.14em}
.about-contact a:hover{color:var(--red)}

/* ---------- Newsletter ---------- */
.newsletter{background:var(--grey-100);border-top:1px solid var(--grey-300)}
.newsletter-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:48px 20px;flex-wrap:wrap}
.newsletter h2{font-family:var(--font-head);font-size:1.8rem;font-weight:800}
.newsletter p{color:var(--grey-700);font-size:.92rem}
.newsletter-form{display:flex;gap:0;flex-wrap:wrap}
.newsletter-form input{
  font:inherit;padding:13px 18px;border:1px solid var(--grey-300);border-right:none;
  min-width:280px;outline:none;background:var(--white);
}
.newsletter-form input:focus{border-color:var(--black)}

/* ---------- Footer ---------- */
.footer{background:var(--black);color:var(--grey-300);padding-top:56px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:44px}
.footer-grid h4{
  color:var(--white);font-family:var(--font-head);font-size:1.05rem;margin-bottom:16px;
  padding-bottom:8px;position:relative;
}
.footer-grid h4::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:2px;background:var(--red)}
.footer-grid a{display:block;font-size:.86rem;margin-bottom:10px;transition:.2s}
.footer-grid a:hover{color:var(--red);padding-left:6px}
.footer-grid span{font-size:.86rem;display:block;margin-bottom:10px}
.footer-grid p{color:var(--grey-500);font-size:.85rem;margin-top:12px}
.footer-bottom{border-top:1px solid var(--grey-900);padding:16px 0;font-size:.78rem;color:var(--grey-500)}
.footer-bottom-inner{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}

/* ---------- To top ---------- */
.to-top{
  position:fixed;right:24px;bottom:24px;width:46px;height:46px;background:var(--red);
  color:var(--white);border:none;font-size:1.2rem;cursor:pointer;z-index:60;
  opacity:0;pointer-events:none;transition:.25s;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
}
.to-top.show{opacity:1;pointer-events:auto}
.to-top:hover{background:var(--black)}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .hero{grid-template-columns:1fr}
  .hero-lead{min-height:380px}
  .story-grid,.story-grid.compact{grid-template-columns:repeat(2,1fr)}
  .two-col{grid-template-columns:1fr}
  .about-inner{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .brand-logo{font-size:2rem}
  .topbar-inner{justify-content:center}
  .masthead-right .btn-subscribe{display:none}
  .nav-toggle{display:flex}
  .mainnav{display:none}
  .mainnav.open{display:block}
  .nav-list{flex-direction:column}
  .nav-list a{padding:14px 6px;border-bottom:1px solid var(--grey-900)}
  .story-grid,.story-grid.compact{grid-template-columns:1fr}
  .about-cards{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .newsletter-form input{min-width:0;flex:1;border-right:1px solid var(--grey-300);margin-bottom:10px}
  .newsletter-form{width:100%}
}

/* ============================================================
   THE PROBE — Page templates (article / category / about / contact)
   ============================================================ */

/* Hamburger -> X animation */
.nav-toggle span{transition:transform .25s ease,opacity .2s ease}
.nav-toggle.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* Reading progress bar */
.progress-bar{position:fixed;top:0;left:0;height:4px;background:var(--red);width:0;z-index:200}

/* Breadcrumbs */
.breadcrumb{display:flex;gap:10px;align-items:center;font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--grey-500);padding:26px 0 0;flex-wrap:wrap}
.breadcrumb a:hover{color:var(--red)}
.breadcrumb .current{color:var(--grey-700);font-weight:600}
.breadcrumb.light{color:var(--grey-300);padding:0}
.breadcrumb.light .current{color:var(--white)}

/* Article header */
.article-header{max-width:860px;text-align:center;padding:26px 20px 30px;display:flex;flex-direction:column;align-items:center;gap:16px}
.article-header h1{font-family:var(--font-head);font-weight:800;font-size:clamp(1.8rem,4vw,3rem);line-height:1.15;color:var(--black)}
.article-standfirst{font-size:1.08rem;color:var(--grey-700);max-width:720px;font-style:italic}
.article-byline{display:flex;align-items:center;gap:12px;border-top:1px solid var(--grey-300);border-bottom:1px solid var(--grey-300);padding:14px 0;width:100%;max-width:720px}
.byline-text{display:flex;flex-direction:column;text-align:left;line-height:1.35}
.byline-text strong{font-size:.92rem}
.byline-text span{font-size:.76rem;color:var(--grey-500);text-transform:uppercase;letter-spacing:.08em}
.read-time{margin-left:auto;font-size:.74rem;color:var(--red);font-weight:700;text-transform:uppercase;letter-spacing:.1em}
.avatar{width:42px;height:42px;border-radius:50%;background:var(--black);color:var(--white);display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-family:var(--font-head);flex:none;border:2px solid var(--red)}
.avatar.large{width:64px;height:64px;font-size:1.5rem}

/* Share buttons */
.share-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center}
.share-label{font-size:.72rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--grey-500)}
.share-btn{font-size:.76rem;font-weight:700;letter-spacing:.06em;padding:8px 16px;border:1px solid var(--grey-300);background:var(--white);color:var(--grey-700);cursor:pointer;transition:.2s;font-family:var(--font-body)}
.share-btn.wa:hover{background:#25D366;border-color:#25D366;color:#fff}
.share-btn.fb:hover{background:#1877F2;border-color:#1877F2;color:#fff}
.share-btn.x:hover{background:var(--black);border-color:var(--black);color:#fff}
.share-btn.copy:hover{background:var(--red);border-color:var(--red);color:#fff}

/* Article hero + body */
.article-hero{max-width:1100px;margin:0 auto;padding:0 20px}
.article-hero img{width:100%;max-height:560px;object-fit:cover}
.article-hero figcaption{font-size:.76rem;color:var(--grey-500);padding:8px 2px;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid var(--grey-300)}
.article-body{max-width:720px;padding:30px 20px 10px;font-size:1.03rem}
.article-body p{margin-bottom:22px}
.article-body>p:first-child::first-letter{font-family:var(--font-head);font-weight:900;font-size:3.2em;float:left;line-height:.82;padding:6px 12px 0 0;color:var(--red)}
.article-body h2{font-family:var(--font-head);font-size:1.5rem;margin:34px 0 14px}
.article-body h3{font-family:var(--font-head);font-size:1.2rem;margin:28px 0 12px}
.article-body blockquote{font-family:var(--font-head);font-style:italic;font-size:1.3rem;line-height:1.45;border-left:4px solid var(--red);padding:6px 0 6px 24px;margin:30px 0;color:var(--black)}
.article-body a{color:var(--red)}
.article-body img{border:1px solid var(--grey-300);margin:10px 0;max-width:100%}
.article-body ul,.article-body ol{margin:0 0 22px 24px}

/* Tags / author / prev-next / comments */
.article-tags{max-width:720px;padding:6px 20px 30px;display:flex;gap:10px;flex-wrap:wrap}
.tag{font-size:.76rem;font-weight:700;color:var(--grey-700);border:1px solid var(--grey-300);padding:6px 14px;transition:.2s}
.tag:hover{background:var(--black);color:var(--white);border-color:var(--black)}
.author-box{max-width:860px;margin:0 auto 40px;background:var(--grey-100);border-left:4px solid var(--red);padding:24px;display:flex;gap:18px;align-items:flex-start}
.author-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.16em;color:var(--red);font-weight:800}
.author-box h3{font-family:var(--font-head);margin:4px 0 8px}
.author-box p{font-size:.88rem;color:var(--grey-700)}
.prev-next{max-width:860px;margin:0 auto 50px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pn{border:1px solid var(--grey-300);padding:18px;display:flex;flex-direction:column;gap:8px;transition:.2s}
.pn span{font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;color:var(--grey-500);font-weight:700}
.pn strong{font-family:var(--font-head);font-size:.98rem;line-height:1.3}
.pn.next{text-align:right}
.pn:hover{border-color:var(--black);background:var(--black);color:var(--white)}
.pn:hover span{color:var(--red)}
.comments-note{max-width:860px;margin:0 auto 60px}
.comments-note>div{border:1px dashed var(--grey-300);padding:26px;text-align:center}
.comments-note h3{font-family:var(--font-head);margin-bottom:8px}
.comments-note p{font-size:.88rem;color:var(--grey-500)}

/* Category header band */
.cat-header{background:var(--black); color:var(--white);border-bottom:4px solid var(--red)}
.cat-header .container{padding:44px 20px 40px}
.cat-header h1{font-family:var(--font-head);font-weight:900;font-size:clamp(2rem,4.5vw,3.2rem);margin:8px 0 10px}
.cat-header p{color:var(--grey-300);max-width:640px}

/* Archive layout */
.archive-layout{display:grid;grid-template-columns:1fr 320px;gap:44px;padding:36px 20px 60px}
.cat-featured-card{display:grid;grid-template-columns:1.4fr 1fr;border:1px solid var(--grey-300);margin-bottom:26px;background:var(--white)}
.cf-thumb{display:block;min-height:280px;background:var(--grey-100)}
.cf-thumb img{width:100%;height:100%;object-fit:cover}
.cf-body{padding:24px;display:flex;flex-direction:column;gap:12px;justify-content:center}
.cf-body h2{font-family:var(--font-head);font-size:1.4rem;line-height:1.25}
.cf-body h2 a:hover{color:var(--red)}
.cf-body p{font-size:.9rem;color:var(--grey-700)}
.thumb-fallback{display:block;width:100%;height:100%;min-height:180px;background:repeating-linear-gradient(45deg,#2b2c2e 0 12px,#222326 12px 24px)}
.archive-item{display:grid;grid-template-columns:240px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid var(--grey-300)}
.archive-thumb img{width:100%;aspect-ratio:16/10;object-fit:cover}
.archive-item-body{display:flex;flex-direction:column;gap:10px}
.archive-item-body h2{font-family:var(--font-head);font-size:1.2rem;line-height:1.3}
.archive-item-body h2 a:hover{color:var(--red)}
.archive-item-body p{font-size:.88rem;color:var(--grey-700)}
.pagination{display:flex;justify-content:center;align-items:center;gap:18px;padding:30px 0}
.page-btn{font:inherit;font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:10px 20px;border:1px solid var(--grey-300);background:var(--white);cursor:pointer;transition:.2s}
.page-btn:hover:not(:disabled){background:var(--black);color:var(--white);border-color:var(--black)}
.page-btn:disabled{opacity:.35;cursor:default}
.page-info{font-size:.8rem;color:var(--grey-500);text-transform:uppercase;letter-spacing:.12em}

/* Sidebar cards */
.archive-sidebar{display:flex;flex-direction:column;gap:20px;align-self:start;position:sticky;top:70px}
.side-card{border: 4px solid #0b0b45;padding:22px}
.side-card h3{font-family:var(--font-head);font-size:1.1rem;margin-bottom:14px;padding-bottom:8px;position:relative}
.side-card h3::after{content:"";position:absolute;left:0;bottom:0;width:30px;height:2px;background:var(--red)}
.side-card a{display:block;font-size:.88rem;padding:7px 10px;color:var(--grey-700);transition:.15s}
.side-card a:hover{color:var(--red);padding-left:6px}
.side-card p{font-size:.88rem;color:var(--grey-700);margin-bottom:14px}
.side-card.dark{background:var(--black);color:var(--grey-300);border-color: 4px solid var(--red)}
.side-card.dark h3{color:var(--white)}
.side-card.dark a{color:var(--grey-300)}
.side-card .btn-red{margin-top:6px;display:inline-block}
.side-card .btn-outline{display:inline-block;border:1px solid var(--grey-300);padding:10px 20px;font-weight:700;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase}
.side-card .btn-outline:hover{background:var(--black);color:var(--white);border-color:var(--black);padding-left:20px}

/* About page */
.about-page-grid{display:grid;grid-template-columns:1.7fr 1fr;gap:48px}
.about-page-text .section-title{margin-bottom:20px}
.about-page-text p{margin-bottom:18px}
.about-page-text p.big{font-size:1.12rem;font-weight:500;color:var(--black)}
.mission-quote{font-family:var(--font-head);font-style:italic;font-size:1.35rem;line-height:1.5;border-left:4px solid var(--red);padding:8px 0 8px 24px;margin:30px 0;color:var(--black)}
.about-page-side{display:flex;flex-direction:column;gap:20px;align-self:start;position:sticky;top:70px}
.values-band{background:var(--black);color:var(--grey-300);padding:64px 0;border-top:4px solid var(--red)}
.values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:30px}
.value-card{background:var(--grey-900);padding:26px;border-top:3px solid var(--red)}
.value-glyph{color:var(--red);font-size:1.2rem;margin-bottom:14px}
.value-card h3{font-family:var(--font-head);color:var(--white);margin-bottom:10px;font-size:1.15rem}
.value-card p{font-size:.86rem}
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.team-card{border:1px solid var(--grey-300);padding:26px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;transition:.2s}
.team-card:hover{border-color:var(--black);box-shadow:var(--shadow)}
.team-card h3{font-family:var(--font-head);font-size:1.02rem}
.team-card p{font-size:.8rem;color:var(--grey-500);text-transform:uppercase;letter-spacing:.08em}

/* Contact page */
.contact-grid{display:grid;grid-template-columns:1fr 1.4fr;grid-template-areas:"info form" "map map";gap:36px;padding:40px 20px 60px}
.contact-info{grid-area:info;display:flex;flex-direction:column;gap:18px}
.contact-form-card{grid-area:form;border:1px solid var(--grey-300);padding:34px}
.contact-form-card h2{font-family:var(--font-head);font-size:1.6rem;margin-bottom:8px}
.form-note{font-size:.88rem;color:var(--grey-500);margin-bottom:24px}
#contact-form label{display:block;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--grey-700);margin-bottom:16px}
#contact-form input,#contact-form select,#contact-form textarea{display:block;width:100%;margin-top:8px;font:inherit;font-size:.95rem;padding:12px 14px;border:1px solid var(--grey-300);background:var(--white);outline:none;transition:.2s}
#contact-form input:focus,#contact-form select:focus,#contact-form textarea:focus{border-color:var(--red)}
#contact-form textarea{resize:vertical}
.form-status{display:block;margin-top:14px;font-size:.84rem;color:var(--red);font-weight:600}
.contact-map{grid-area:map}
.contact-map .section-title{margin-bottom:18px}
.contact-map iframe{width:100%;height:380px;border:1px solid var(--grey-300);filter:grayscale(1) contrast(1.05)}

/* Responsive for templates */
@media (max-width:980px){
  .archive-layout{grid-template-columns:1fr}
  .archive-sidebar{position:static;display:grid;grid-template-columns:repeat(3,1fr)}
  .about-page-grid{grid-template-columns:1fr}
  .about-page-side{position:static;display:grid;grid-template-columns:1fr 1fr}
  .values-grid,.team-grid{grid-template-columns:repeat(2,1fr)}
  .contact-grid{grid-template-columns:1fr;grid-template-areas:"info" "form" "map"}
}
@media (max-width:640px){
  .cat-featured-card{grid-template-columns:1fr}
  .archive-item{grid-template-columns:1fr}
  .archive-thumb img{aspect-ratio:16/9}
  .archive-sidebar{grid-template-columns:1fr}
  .about-page-side{grid-template-columns:1fr}
  .values-grid,.team-grid{grid-template-columns:1fr}
  .prev-next{grid-template-columns:1fr}
  .pn.next{text-align:left}
  .article-byline{flex-wrap:wrap}
  .read-time{margin-left:0;width:100%}
}
.topbar-social a {
  font-size: 1.2rem; /* Increase this value (e.g., 1.4rem, 24px) to make them larger */
}