/* assets/css/main.css — Football Maverick v3.2 */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=DM+Sans:ital,wght@0,300;0,400;0,500;0,600;1,400&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --dark:   #0A0E1A;
  --card:   #111827;
  --card2:  #0F1623;
  --border: #1F2937;
  --muted:  #6B7280;
  --text:   #F9FAFB;
  --text2:  #D1D5DB;
  --green:  #00FF87;
  --green2: #7CCC1E;
  --accent: #F59E0B;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--dark);color:var(--text);font-family:'DM Sans',sans-serif;font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:var(--dark)}
::-webkit-scrollbar-thumb{background:#374151;border-radius:3px}

/* ── Layout ── */
.container{max-width:1240px;margin:0 auto;padding:0 1.5rem}
.page-wrap{display:grid;grid-template-columns:1fr 300px;gap:2.5rem;align-items:start;padding:2.5rem 0 4rem}
@media(max-width:960px){.page-wrap{grid-template-columns:1fr}}
.sidebar{display:flex;flex-direction:column;gap:1.25rem;position:sticky;top:80px}
@media(max-width:960px){.sidebar{display:none}}

/* ── Header bar ── */
.header-bar{background:#0d1117;border-bottom:1px solid var(--border);padding:.55rem 0;font-size:.78rem}
.header-bar-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.header-bar-left{display:flex;align-items:center;gap:.5rem;color:var(--muted)}
.header-bar-aff{display:flex;align-items:center;gap:.75rem}
.header-bar-aff a{color:var(--text2);font-size:.75rem;padding:.25rem .7rem;border:1px solid var(--border);border-radius:5px;transition:all .2s}
.header-bar-aff a:hover{border-color:var(--green);color:var(--green)}

/* ── Main nav ── */
.site-header{background:rgba(10,14,26,.97);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.06);position:sticky;top:0;z-index:200;width:100%}
.site-header::before{content:'';display:block;height:2px;background:linear-gradient(90deg,transparent,var(--green) 30%,var(--green2) 70%,transparent)}
.header-inner{height:64px;display:flex;align-items:center;gap:1.5rem}
.site-logo img{height:44px;width:auto;display:block}
.main-nav{display:flex;align-items:center;gap:.1rem;flex:1}
.nav-link{font-size:.82rem;font-weight:500;color:#9CA3AF;padding:.45rem .8rem;border-radius:7px;transition:all .18s;white-space:nowrap}
.nav-link:hover{color:#fff;background:rgba(255,255,255,.06)}
.nav-link.active{color:var(--green);background:rgba(0,255,135,.08)}
.nav-sep{width:1px;height:16px;background:rgba(255,255,255,.08);margin:0 .3rem;flex-shrink:0}
.btn-newsletter{display:flex;align-items:center;gap:.4rem;background:var(--green);color:#0A0E1A;font-weight:700;font-size:.78rem;padding:.48rem 1.1rem;border-radius:7px;border:none;cursor:pointer;transition:all .2s;white-space:nowrap;flex-shrink:0}
.btn-newsletter:hover{background:#1aff94;transform:translateY(-1px)}
.btn-newsletter svg{width:13px;height:13px;flex-shrink:0}
.nav-toggle{display:none;background:none;border:1px solid rgba(255,255,255,.12);color:#9CA3AF;width:36px;height:36px;border-radius:7px;font-size:1rem;cursor:pointer;align-items:center;justify-content:center;flex-shrink:0}
@media(max-width:900px){
  .nav-toggle{display:flex}
  .main-nav{display:none;position:absolute;top:67px;left:0;right:0;background:#0d1117;border-bottom:1px solid rgba(0,255,135,.1);flex-direction:column;align-items:stretch;padding:.75rem 1rem 1rem;gap:.1rem;z-index:100}
  .main-nav.open{display:flex}
  .nav-sep{display:none}
  .btn-newsletter{width:100%;justify-content:center;margin-top:.5rem}
  .header-inner{position:relative}
}

/* ══════════════════════════════════════════════
   HERO — TRUE FULL VIEWPORT WIDTH
   The key: no container wrapper, margin:-64px on
   top to sit flush under sticky header
══════════════════════════════════════════════ */
.hero-section {
  /* Break out of ANY parent padding/max-width */
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  /* Height */
  min-height: calc(100vh - 66px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  background: #060912;
}

.hero-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 35%;
  opacity: .45;
  z-index: 0;
  /* Prevent img from causing horizontal scroll */
  max-width: none;
}

/* Dark overlays for readability */
.hero-overlay-left {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    105deg,
    rgba(6,9,18,.96) 0%,
    rgba(6,9,18,.88) 35%,
    rgba(6,9,18,.55) 60%,
    rgba(6,9,18,.15) 100%
  );
  z-index: 1;
}
.hero-overlay-bottom {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 180px;
  background: linear-gradient(to top, var(--dark), transparent);
  z-index: 2;
}

/* Content inside hero gets its own container */
.hero-inner {
  position: relative;
  z-index: 3;
  max-width: 1240px;
  margin: 0 auto;
  width: 100%;
  padding: 5rem 1.5rem 5rem;
}

.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--green);
  background: rgba(0,255,135,.08);
  border: 1px solid rgba(0,255,135,.25);
  padding: .3rem .9rem;
  border-radius: 20px;
  margin-bottom: 1.5rem;
}

.hero-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(4rem, 9vw, 8rem);
  letter-spacing: .03em;
  line-height: .92;
  margin-bottom: 1.5rem;
  color: #fff;
  max-width: 720px;
}
.hero-title .green { color: var(--green); }

.hero-subtitle {
  font-size: 1.05rem;
  color: #D1D5DB;
  max-width: 500px;
  line-height: 1.7;
  margin-bottom: .75rem;
  font-weight: 400;
}
.hero-tagline {
  font-size: .875rem;
  color: #9CA3AF;
  max-width: 500px;
  line-height: 1.75;
  margin-bottom: 2.25rem;
}
.hero-btns {
  display: flex;
  gap: .875rem;
  flex-wrap: wrap;
}
.btn-hero-primary {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: var(--green);
  color: #0A0E1A;
  font-weight: 700;
  font-size: .95rem;
  padding: .8rem 2rem;
  border-radius: 9px;
  border: none;
  cursor: pointer;
  transition: all .2s;
}
.btn-hero-primary:hover { background: #1aff94; transform: translateY(-2px); }
.btn-hero-secondary {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-weight: 600;
  font-size: .95rem;
  padding: .78rem 2rem;
  border-radius: 9px;
  border: 1px solid rgba(255,255,255,.28);
  cursor: pointer;
  transition: all .2s;
  backdrop-filter: blur(4px);
}
.btn-hero-secondary:hover { border-color: rgba(255,255,255,.55); background: rgba(255,255,255,.13); }

@media(max-width:640px) {
  .hero-section { min-height: 88vh; }
  .hero-inner { padding: 3.5rem 1.25rem 4rem; }
  .hero-title { font-size: clamp(3.2rem, 14vw, 5rem); }
}

/* ══════════════════════════════════════════════
   TRUST / STATS BAR — with background image
══════════════════════════════════════════════ */
.trust-bar {
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  overflow: hidden;
  background: #0a0f1c;
  border-top: 1px solid rgba(0,255,135,.15);
  border-bottom: 1px solid rgba(0,255,135,.08);
}
.trust-bar-bg {
  position: absolute;
  inset: 0;
  background-image: url('https://images.unsplash.com/photo-1574629810360-7efbbe195018?w=1400&q=70');
  background-size: cover;
  background-position: center 60%;
  opacity: .08;
  z-index: 0;
}
.trust-bar-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,255,135,.05) 0%, transparent 50%, rgba(0,30,15,.3) 100%);
  z-index: 1;
}
.trust-bar-content {
  position: relative;
  z-index: 2;
  padding: 3rem 1.5rem;
  max-width: 1240px;
  margin: 0 auto;
}
.trust-bar-top {
  text-align: center;
  margin-bottom: 2.5rem;
}
.trust-bar-top .section-tag { display: inline-block; margin-bottom: .75rem; }
.trust-bar-headline {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(1.8rem, 4vw, 3rem);
  letter-spacing: .04em;
  color: #fff;
  margin-bottom: .6rem;
}
.trust-bar-headline span { color: var(--green); }
.trust-bar-sub {
  font-size: .9rem;
  color: #9CA3AF;
  max-width: 500px;
  margin: 0 auto;
  line-height: 1.65;
}

/* Stats row */
.trust-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: 2rem;
}
@media(max-width:640px){ .trust-stats { grid-template-columns: repeat(2,1fr); } }
.trust-stat {
  background: rgba(10,14,26,.7);
  padding: 1.5rem 1rem;
  text-align: center;
  backdrop-filter: blur(8px);
  transition: background .2s;
}
.trust-stat:hover { background: rgba(0,255,135,.05); }
.trust-stat-num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2.8rem;
  letter-spacing: .04em;
  color: var(--green);
  line-height: 1;
  margin-bottom: .25rem;
}
.trust-stat-label {
  font-size: .78rem;
  color: #9CA3AF;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .06em;
}

/* Pillars row */
.trust-pillars {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .5rem 1.5rem;
}
.trust-pillar {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-size: .82rem;
  color: #D1D5DB;
  font-weight: 500;
}
.trust-pillar-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--green);
  flex-shrink: 0;
}
.trust-tagline {
  text-align: center;
  font-size: .78rem;
  color: #4B5563;
  margin-top: .875rem;
}

/* ── Section headings ── */
.section-header{margin-bottom:1.75rem}
.section-tag{display:inline-block;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--green);background:rgba(0,255,135,.08);border:1px solid rgba(0,255,135,.15);padding:.25rem .75rem;border-radius:20px;margin-bottom:.6rem}
.section-title{font-family:'Bebas Neue',sans-serif;font-size:2rem;letter-spacing:.04em;color:#fff;margin-bottom:.4rem}
.section-desc{font-size:.875rem;color:var(--muted);max-width:560px}

/* ── Post cards ── */
.posts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
@media(max-width:900px){.posts-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:580px){.posts-grid{grid-template-columns:1fr}}
.post-card{background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden;transition:all .25s;display:flex;flex-direction:column}
.post-card:hover{border-color:rgba(0,255,135,.3);transform:translateY(-3px)}
.post-card-img{width:100%;height:200px;object-fit:cover;background:var(--card2)}
.post-card-img-placeholder{width:100%;height:200px;background:linear-gradient(135deg,#0d1f12,#0a1628);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.post-card-img-placeholder::after{content:'FM';font-family:'Bebas Neue',sans-serif;font-size:5rem;color:var(--green);opacity:.07;position:absolute;bottom:-10px;right:10px;letter-spacing:.1em}
.post-card-body{padding:1.1rem;flex:1;display:flex;flex-direction:column}
.post-card-cat{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:.2rem .6rem;border-radius:4px;margin-bottom:.65rem;display:inline-block}
.cat-tactical{background:rgba(59,130,246,.15);color:#60A5FA}
.cat-opinion{background:rgba(139,92,246,.15);color:#A78BFA}
.cat-analysis{background:rgba(0,255,135,.1);color:var(--green)}
.cat-default{background:rgba(245,158,11,.1);color:#FCD34D}
.post-card-title{font-size:.95rem;font-weight:700;color:#fff;line-height:1.35;margin-bottom:.5rem;flex:1}
.post-card:hover .post-card-title{color:var(--green)}
.post-card-meta{display:flex;align-items:center;gap:.5rem;font-size:.72rem;color:var(--muted);margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border)}
.post-card-readmore{display:flex;align-items:center;gap:.3rem;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--green);margin-top:.75rem;transition:gap .2s}
.post-card:hover .post-card-readmore{gap:.6rem}
.post-card-featured{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr}
@media(max-width:700px){.post-card-featured{grid-column:span 1;grid-template-columns:1fr}}
.post-card-featured .post-card-img,.post-card-featured .post-card-img-placeholder{height:100%;min-height:260px}
.post-card-featured .post-card-title{font-size:1.2rem}
.post-list-item{display:flex;align-items:flex-start;gap:1rem;padding:1rem;background:var(--card);border:1px solid var(--border);border-radius:12px;transition:all .2s}
.post-list-item:hover{border-color:rgba(0,255,135,.25)}
.post-list-thumb{width:80px;height:80px;border-radius:8px;object-fit:cover;flex-shrink:0;background:var(--card2)}
.post-list-body{flex:1;min-width:0}
.post-list-title{font-size:.9rem;font-weight:600;color:#fff;line-height:1.35;margin-bottom:.25rem}
.post-list-item:hover .post-list-title{color:var(--green)}
.post-list-meta{font-size:.72rem;color:var(--muted)}

/* ── Affiliate cards ── */
.aff-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1rem;transition:border-color .2s}
.aff-card:hover{border-color:rgba(0,255,135,.3)}
.aff-img{width:100%;height:100px;object-fit:cover;border-radius:8px;margin-bottom:.75rem}
.aff-sponsor{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--green);margin-bottom:.2rem}
.aff-title{font-weight:600;font-size:.85rem;color:#fff;margin-bottom:.3rem;line-height:1.3}
.aff-desc{font-size:.75rem;color:var(--muted);margin-bottom:.75rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.btn-cta{width:100%;background:var(--green);color:#0A0E1A;font-weight:700;font-size:.8rem;padding:.55rem;border-radius:8px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.35rem;transition:opacity .2s}
.btn-cta:hover{opacity:.88}
.btn-cta-sm{background:rgba(0,255,135,.1);color:var(--green);border:1px solid rgba(0,255,135,.25);font-size:.75rem;font-weight:600;padding:.38rem .85rem;border-radius:7px;cursor:pointer;transition:background .2s;white-space:nowrap}
.btn-cta-sm:hover{background:rgba(0,255,135,.2)}

/* ── Article content ── */
.article-content{color:var(--text2);line-height:1.85;font-size:.9375rem}
.article-content h2{font-size:1.3rem;color:#fff;margin:2rem 0 .75rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}
.article-content h3{font-size:1.05rem;color:#fff;margin:1.5rem 0 .5rem}
.article-content p{margin-bottom:1.1rem}
.article-content ul,.article-content ol{margin:0 0 1.1rem 1.5rem}
.article-content li{margin-bottom:.35rem}
.article-content blockquote{border-left:3px solid var(--green);padding:.5rem 1rem;margin:1.25rem 0;color:var(--muted);font-style:italic;background:rgba(0,255,135,.03);border-radius:0 8px 8px 0}
.article-content strong{color:#fff;font-weight:600}

/* ── Sidebar ── */
.widget-title{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:.9rem;padding-bottom:.6rem;border-bottom:1px solid var(--border)}

/* ── Subscribe modal ── */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.8);backdrop-filter:blur(6px);z-index:999;align-items:center;justify-content:center;padding:1rem}
.modal-overlay.open{display:flex}
.modal-box{background:#111827;border:1px solid rgba(0,255,135,.2);border-radius:20px;width:100%;max-width:480px;overflow:hidden;animation:modalIn .3s cubic-bezier(.34,1.56,.64,1);position:relative}
@keyframes modalIn{from{opacity:0;transform:scale(.88) translateY(16px)}to{opacity:1;transform:scale(1) translateY(0)}}
.modal-hero{background:linear-gradient(135deg,#0d2218,#0a1628);padding:2.25rem 2rem 1.75rem;text-align:center;border-bottom:1px solid rgba(0,255,135,.1);position:relative;overflow:hidden}
.modal-hero::before{content:'⚽';position:absolute;font-size:9rem;opacity:.05;top:-20px;right:-20px;transform:rotate(15deg)}
.modal-badge{display:inline-flex;align-items:center;gap:.35rem;background:rgba(0,255,135,.1);border:1px solid rgba(0,255,135,.2);color:var(--green);font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.3rem .75rem;border-radius:20px;margin-bottom:1rem}
.modal-title{font-family:'Bebas Neue',sans-serif;font-size:2.2rem;letter-spacing:.06em;color:#fff;line-height:1.1;margin-bottom:.75rem}
.modal-title span{color:var(--green)}
.modal-tagline{font-size:.875rem;color:#9CA3AF;line-height:1.65;max-width:320px;margin:0 auto;font-style:italic}
.modal-body{padding:1.75rem 2rem 2rem}
.modal-perks{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem}
.perk-item{display:flex;align-items:center;gap:.6rem;font-size:.8rem;color:#D1D5DB}
.perk-dot{width:6px;height:6px;border-radius:50%;background:var(--green);flex-shrink:0}
.modal-form{display:flex;flex-direction:column;gap:.75rem}
.modal-input-wrap{position:relative}
.input-icon{position:absolute;left:.875rem;top:50%;transform:translateY(-50%);font-size:.9rem;pointer-events:none}
.modal-input{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:.7rem 1rem .7rem 2.5rem;color:#fff;font-size:.875rem;font-family:'DM Sans',sans-serif;outline:none;transition:border-color .2s}
.modal-input:focus{border-color:var(--green);background:rgba(0,255,135,.04)}
.modal-input::placeholder{color:#4B5563}
.btn-sub-submit{width:100%;background:var(--green);color:#0A0E1A;font-weight:700;font-size:.9rem;padding:.8rem;border-radius:10px;border:none;cursor:pointer;transition:all .2s;margin-top:.25rem}
.btn-sub-submit:hover{background:#1aff94;transform:translateY(-1px)}
.modal-fine-print{text-align:center;font-size:.72rem;color:#4B5563;margin-top:.75rem}
.modal-close{position:absolute;top:.875rem;right:.875rem;background:rgba(255,255,255,.08);border:none;color:#9CA3AF;width:30px;height:30px;border-radius:50%;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.modal-close:hover{background:rgba(255,255,255,.15);color:#fff}
.sub-success{text-align:center;padding:1.5rem 0 .5rem;display:none}
.sub-success-icon{font-size:2.5rem;margin-bottom:.75rem}
.sub-success h3{font-size:1.1rem;font-weight:600;color:var(--green);margin-bottom:.4rem}
.sub-success p{font-size:.85rem;color:#9CA3AF;line-height:1.6}

/* ── Footer ── */
.site-footer{background:#070B15;border-top:1px solid var(--border);padding:0}
.footer-aff-bar{background:#0d1117;border-bottom:1px solid var(--border);padding:1.25rem 0}
.footer-aff-grid{display:flex;flex-direction:column;gap:0}
.footer-aff-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem 0;border-bottom:1px solid rgba(31,41,55,.5)}
.footer-aff-item:last-child{border-bottom:none}
.footer-main{padding:3rem 0 1.5rem}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem;margin-bottom:2.5rem}
@media(max-width:768px){.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.footer-grid{grid-template-columns:1fr}}
.footer-brand-logo{height:38px;width:auto;margin-bottom:1rem}
.footer-brand-desc{font-size:.82rem;color:#6B7280;line-height:1.65;max-width:260px;margin-bottom:1.25rem}
.footer-social{display:flex;gap:.5rem;flex-wrap:wrap}
.social-link{width:36px;height:36px;border-radius:8px;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:#6B7280;transition:all .2s;flex-shrink:0}
.social-link:hover{border-color:var(--green);color:var(--green);background:rgba(0,255,135,.06)}
.social-link svg{width:16px;height:16px;fill:currentColor}
.footer-col-title{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#9CA3AF;margin-bottom:.9rem}
.footer-links{display:flex;flex-direction:column;gap:.4rem}
.footer-links a{font-size:.82rem;color:#6B7280;transition:color .2s}
.footer-links a:hover{color:var(--green)}
.footer-bottom{border-top:1px solid var(--border);padding:1.25rem 0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem}
.footer-bottom p{font-size:.75rem;color:#4B5563}

/* ── Misc ── */
.badge{display:inline-flex;align-items:center;padding:.2rem .6rem;border-radius:20px;font-size:.7rem;font-weight:600}
.badge-green{background:rgba(0,255,135,.1);color:var(--green);border:1px solid rgba(0,255,135,.2)}
.badge-yellow{background:rgba(245,158,11,.1);color:var(--accent);border:1px solid rgba(245,158,11,.2)}
.badge-blue{background:rgba(59,130,246,.1);color:#60A5FA;border:1px solid rgba(59,130,246,.2)}
.badge-gray{background:var(--border);color:var(--muted)}
.section-label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:.75rem}
.pagination{display:flex;align-items:center;gap:.4rem;justify-content:center;padding:2rem 0}
.page-btn{background:var(--card);border:1px solid var(--border);color:var(--text);padding:.45rem .95rem;border-radius:8px;font-size:.8rem;cursor:pointer;transition:all .2s}
.page-btn:hover,.page-btn.active{background:rgba(0,255,135,.08);border-color:var(--green);color:var(--green)}
.alert{padding:.7rem 1rem;border-radius:8px;font-size:.85rem;margin-bottom:1rem}
.alert-success{background:rgba(0,255,135,.08);border:1px solid rgba(0,255,135,.2);color:var(--green)}
.alert-error{background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.2);color:#F87171}
.spinner{width:24px;height:24px;border:2px solid var(--border);border-top-color:var(--green);border-radius:50%;animation:spin .7s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:480px){.modal-hero{padding:1.75rem 1.25rem 1.5rem}.modal-body{padding:1.25rem}.modal-title{font-size:1.75rem}}