/*
Theme Name: Hilltop ReSporter
Theme URI: https://hilltopresporter.com
Author: Custom Build
Description: Custom theme for The Hilltop ReSporter — Canyon Lake Hawks sports news. No page builders, no Gutenberg FSE. Ninja Forms for forms, NextGEN Gallery for galleries.
Version: 1.0.1
Text Domain: hilltop-resporter
*/

/* =====================================================
   DESIGN TOKENS
   ===================================================== */
:root{
  /* Colors — Canyon Lake Hawks green & grey */
  --clr-green-900:#12332A;
  --clr-green-700:#1F5B44;
  --clr-green-600:#2C7A54;
  --clr-grey-900:#26292B;
  --clr-grey-600:#5B6266;
  --clr-grey-300:#C7CCC9;
  --clr-grey-100:#EDEFEC;
  --clr-cream:#F6F5F1;
  --clr-white:#FFFFFF;
  --clr-gold:#C9A24B;

  /* Type */
  --font-display:'Barlow Condensed', sans-serif;
  --font-body:'Inter', sans-serif;
  --font-mono:'IBM Plex Mono', monospace;

  /* Layout */
  --radius-sm:2px;
  --radius-md:4px;
  --header-height:76px;
  --content-max:1180px;
}

*{box-sizing:border-box;}
body{margin:0;font-family:var(--font-body);color:var(--clr-grey-900);background:var(--clr-cream);}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
h1,h2,h3{font-family:var(--font-display);margin:0;text-transform:uppercase;letter-spacing:.02em;}
.container{max-width:var(--content-max);margin:0 auto;padding:0 24px;}

/* =====================================================
   UTILITY BAR
   ===================================================== */
.utility-bar{background:var(--clr-green-900);color:var(--clr-grey-300);font-family:var(--font-mono);font-size:12px;}
.utility-bar__inner{max-width:var(--content-max);margin:0 auto;padding:6px 24px;display:flex;justify-content:space-between;align-items:center;gap:14px;}
.utility-bar__tagline{color:var(--clr-gold);letter-spacing:.06em;}
.utility-bar__social{display:flex;gap:14px;}
.utility-bar__social a{color:var(--clr-grey-300);opacity:.85;display:flex;align-items:center;}
.utility-bar__social a:hover{opacity:1;color:var(--clr-white);}
.utility-bar__social svg{width:14px;height:14px;fill:currentColor;}

/* =====================================================
   SITE HEADER (sticky)
   ===================================================== */
.site-header{position:sticky;top:0;z-index:50;background:var(--clr-grey-900);border-bottom:1px solid var(--clr-grey-300);}
.site-header__inner{max-width:var(--content-max);margin:0 auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;height:var(--header-height);}
.site-header__brand{display:flex;align-items:center;min-width:0;}
.site-header__logo{height:52px;width:auto;display:block;}

/* Primary nav (desktop) */
.nav{display:flex;align-items:center;gap:28px;list-style:none;margin:0;padding:0;}
.nav__item{position:relative;}
.nav__item > a{font-family:var(--font-display);font-weight:600;font-size:16px;letter-spacing:.03em;text-transform:uppercase;color:var(--clr-white);padding:8px 0;display:inline-block;}
.nav__item > a:hover{color:var(--clr-gold);}
.nav__item--has-drop > a:after{content:"▾";font-size:11px;margin-left:4px;color:var(--clr-grey-300);}
.nav__item--cta > a{font-family:var(--font-body);font-weight:600;font-size:13px;text-transform:none;letter-spacing:0;background:var(--clr-green-700);color:var(--clr-white);padding:9px 18px;border-radius:var(--radius-sm);}
.nav__item--cta > a:hover{background:var(--clr-green-900);}

.nav__dropdown{position:absolute;top:100%;left:0;background:var(--clr-white);border:1px solid var(--clr-grey-300);border-radius:var(--radius-md);min-width:180px;padding:6px 0;margin:0;list-style:none;box-shadow:0 8px 20px rgba(18,51,42,.12);opacity:0;pointer-events:none;transform:translateY(4px);transition:opacity .15s ease, transform .15s ease;}
.nav__item--has-drop:hover .nav__dropdown{opacity:1;pointer-events:auto;transform:translateY(0);}
.nav__dropdown a{display:block;padding:8px 16px;font-family:var(--font-body);font-weight:500;font-size:14px;text-transform:none;letter-spacing:0;color:var(--clr-grey-900);}
.nav__dropdown a:hover{background:var(--clr-grey-100);color:var(--clr-green-700);}

.nav-toggle{display:none;flex-direction:column;gap:4px;background:none;border:none;cursor:pointer;padding:8px;}
.nav-toggle span{width:22px;height:2px;background:var(--clr-white);display:block;}

/* Mobile nav drawer */
.nav-drawer{position:fixed;top:0;right:-100%;width:80%;max-width:340px;height:100%;background:var(--clr-grey-900);z-index:100;padding:24px;overflow-y:auto;transition:right .25s ease;}
.nav-drawer.is-open{right:0;}
.nav-drawer__close{background:none;border:none;color:var(--clr-white);font-size:22px;cursor:pointer;margin-bottom:20px;}
.nav-drawer__list{list-style:none;margin:0;padding:0;}
.nav-drawer__item > a{display:block;padding:12px 0;font-family:var(--font-display);font-weight:600;font-size:18px;text-transform:uppercase;color:var(--clr-white);border-bottom:1px solid rgba(255,255,255,.1);}
.nav-drawer__item--has-drop > .nav-drawer__accordion-toggle{width:100%;display:flex;justify-content:space-between;align-items:center;background:none;border:none;border-bottom:1px solid rgba(255,255,255,.1);padding:12px 0;font-family:var(--font-display);font-weight:600;font-size:18px;text-transform:uppercase;color:var(--clr-white);cursor:pointer;}
.nav-drawer__submenu{list-style:none;margin:0;padding:0 0 8px 12px;max-height:0;overflow:hidden;transition:max-height .25s ease;}
.nav-drawer__item--open .nav-drawer__submenu{max-height:500px;}
.nav-drawer__submenu a{display:block;padding:8px 0;font-family:var(--font-body);font-size:15px;color:var(--clr-grey-300);}
.nav-drawer__overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:99;opacity:0;pointer-events:none;transition:opacity .25s ease;}
.nav-drawer__overlay.is-open{opacity:1;pointer-events:auto;}

@media (max-width: 860px){
  .nav{display:none;}
  .nav-toggle{display:flex;}
}

/* =====================================================
   HERO
   ===================================================== */
.hero{max-width:var(--content-max);margin:32px auto 0;padding:0 24px;}
.hero__grid{display:grid;grid-template-columns:1.6fr 1fr;gap:20px;}
.hero__feature{position:relative;border-radius:var(--radius-md);overflow:hidden;background:var(--clr-grey-900);min-height:380px;display:flex;align-items:flex-end;}
.hero__feature img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;}
.hero__feature-content{position:relative;padding:28px;color:var(--clr-white);}
.hero__eyebrow{font-family:var(--font-mono);font-size:12px;background:var(--clr-gold);color:var(--clr-grey-900);display:inline-block;padding:3px 10px;border-radius:var(--radius-sm);margin-bottom:12px;letter-spacing:.06em;}
.hero__feature-content h2{font-size:34px;line-height:1.05;margin-bottom:10px;max-width:22ch;}
.hero__feature-content p{font-family:var(--font-body);font-size:14px;color:var(--clr-grey-300);max-width:46ch;margin:0;}

.hero__side{display:flex;flex-direction:column;gap:16px;}
.hero__side-card{background:var(--clr-white);border:1px solid var(--clr-grey-300);border-radius:var(--radius-md);padding:16px;display:flex;gap:12px;}
.hero__side-thumb{width:64px;height:64px;border-radius:var(--radius-sm);background:var(--clr-grey-300);flex-shrink:0;object-fit:cover;}
.hero__side-meta{font-family:var(--font-mono);font-size:11px;color:var(--clr-green-700);letter-spacing:.04em;margin-bottom:4px;}
.hero__side-card h3{font-size:17px;line-height:1.15;}

@media (max-width: 860px){
  .hero__grid{grid-template-columns:1fr;}
}

/* =====================================================
   SPONSOR BAND
   ===================================================== */
.sponsor-band{max-width:var(--content-max);margin:30px auto;padding:0 20px;}
.sponsor-band__box{background:rgba(221, 221, 221, 0.68);border:1px solid var(--clr-grey-300);border-radius:var(--radius-md);padding:12px;}
.sponsor-band__title{font-size:12px;color:rgba(45, 58, 45, 0.54);text-align:left;letter-spacing:.06em;margin-bottom:7px;text-transform:uppercase;}
.sponsor-band__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;align-items:center;list-style:none;margin:0;padding:0;}
.sponsor-band__grid img{width:100%;height:auto;display:block;}
@media (max-width:600px){
  .sponsor-band__grid{grid-template-columns:repeat(2,1fr);}
}

/* =====================================================
   SCOREBOARD STRIP
   ===================================================== */
.scoreboard{max-width:var(--content-max);margin:28px auto 0;padding:0 24px;}
.scoreboard__inner{background:var(--clr-green-900);border-radius:var(--radius-md);padding:14px 20px;display:flex;gap:28px;overflow-x:auto;font-family:var(--font-mono);color:var(--clr-white);font-size:13px;list-style:none;margin:0;}
.scoreboard__item{white-space:nowrap;padding-right:28px;border-right:1px solid rgba(255,255,255,.15);}
.scoreboard__item:last-child{border-right:none;}
.scoreboard__item b{color:var(--clr-gold);}

/* =====================================================
   MAIN LAYOUT
   ===================================================== */
.layout{max-width:var(--content-max);margin:36px auto;padding:0 24px;display:grid;grid-template-columns:2fr 1fr;gap:32px;}
.section__heading{font-size:22px;color:var(--clr-green-900);border-bottom:3px solid var(--clr-green-700);padding-bottom:8px;margin-bottom:20px;display:flex;align-items:center;justify-content:space-between;}
.section__heading span{font-family:var(--font-mono);font-size:12px;color:var(--clr-grey-600);text-transform:none;letter-spacing:0;}

.post-card{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid var(--clr-grey-300);}
.post-card__thumb{width:120px;height:90px;border-radius:var(--radius-sm);object-fit:cover;background:var(--clr-grey-300);flex-shrink:0;}
.post-card__meta{font-family:var(--font-mono);font-size:11px;color:var(--clr-green-700);letter-spacing:.03em;margin-bottom:6px;}
.post-card__meta .cat{background:var(--clr-grey-100);color:var(--clr-grey-600);padding:2px 7px;border-radius:var(--radius-sm);margin-right:6px;}
.post-card h3{font-size:19px;margin-bottom:6px;line-height:1.15;text-transform:none;}
.post-card p{margin:0;font-size:13.5px;color:var(--clr-grey-600);line-height:1.5;}
.post-card__more{font-family:var(--font-display);font-size:13px;font-weight:600;color:var(--clr-green-700);text-transform:uppercase;letter-spacing:.03em;}

/* Pagination (t-blog.php) */
.pagination{display:flex;gap:8px;justify-content:center;margin-top:28px;font-family:var(--font-mono);font-size:13px;}
.pagination a,.pagination span{padding:8px 12px;border:1px solid var(--clr-grey-300);border-radius:var(--radius-sm);background:var(--clr-white);}
.pagination .current{background:var(--clr-green-700);color:var(--clr-white);border-color:var(--clr-green-700);}

/* =====================================================
   SIDEBAR
   ===================================================== */
.sidebar__block{background:var(--clr-white);border:1px solid var(--clr-grey-300);border-radius:var(--radius-md);padding:20px;margin-bottom:24px;}
.sidebar__block h3{font-size:16px;color:var(--clr-green-900);margin-bottom:12px;}

.ad-cta{background:var(--clr-green-700);color:var(--clr-white);border-radius:var(--radius-md);padding:24px;text-align:left;}
.ad-cta h3{color:var(--clr-white);font-size:20px;margin-bottom:8px;}
.ad-cta p{font-size:13.5px;color:rgba(255,255,255,.85);line-height:1.5;margin:0 0 16px;}
.ad-cta__btn{display:inline-block;background:var(--clr-gold);color:var(--clr-grey-900);font-family:var(--font-display);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:14px;padding:10px 20px;border-radius:var(--radius-sm);}
.ad-cta__btn:hover{background:var(--clr-white);}

.schedule-item{display:flex;justify-content:space-between;font-size:13px;padding:8px 0;border-bottom:1px dashed var(--clr-grey-300);}
.schedule-item:last-child{border-bottom:none;}
.schedule-item__day{font-family:var(--font-mono);color:var(--clr-green-700);}

/* =====================================================
   SINGLE POST / PAGE
   ===================================================== */
.entry{max-width:820px;margin:36px auto;padding:0 24px;}
.entry__meta{font-family:var(--font-mono);font-size:12px;color:var(--clr-green-700);margin-bottom:10px;}
.entry__title{font-size:36px;line-height:1.1;margin-bottom:16px;}
.entry__thumb{width:100%;border-radius:var(--radius-md);margin-bottom:20px;}
.entry__content{font-size:16px;line-height:1.7;}
.entry__content p{margin:0 0 1.2em;}

/* =====================================================
   NINJA FORMS / GENERIC FORM WRAPPER
   ===================================================== */
.form-block{background:var(--clr-white);border:1px solid var(--clr-grey-300);border-radius:var(--radius-md);padding:24px;}
.form-block h3{color:var(--clr-green-900);font-size:18px;margin-bottom:14px;}

/* =====================================================
   FOOTER
   ===================================================== */
.site-footer{background:var(--clr-grey-900);color:var(--clr-grey-300);margin-top:40px;}
.site-footer__logo{height:44px;width:auto;display:block;}
.site-footer__inner{max-width:var(--content-max);margin:0 auto;padding:36px 24px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px;font-size:13.5px;}
.site-footer h4{font-family:var(--font-display);color:var(--clr-white);font-size:15px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:14px;}
.site-footer ul{list-style:none;margin:0;padding:0;}
.site-footer li{margin-bottom:8px;}
.site-footer a:hover{color:var(--clr-white);}
.site-footer__bottom{border-top:1px solid rgba(255,255,255,.1);text-align:center;padding:14px;font-size:12px;color:var(--clr-grey-600);}

@media (max-width: 860px){
  .layout{grid-template-columns:1fr;}
  .site-footer__inner{grid-template-columns:1fr;}
  .site-header__logo{max-width:70%;width:auto;height:auto;}
  .utility-bar__inner{gap:10px;}
  .utility-bar__tagline{font-size:10.5px;line-height:1.4;letter-spacing:.02em;}
  .utility-bar__social{gap:10px;flex-shrink:0;}
}