/* ===== ADS EXPLOSIVES – NEWS LIST THEME (Cobalt → Fuchsia + Mint) =====
   HTML stays the same. Footer is kept at the bottom via flex layout.
============================================================================ */

/* ===== VARIABLES & RESET ===== */
:root{
  /* New theme palette */
  --cobalt:   #3d5afe;   /* primary A */
  --fuchsia:  #ff3ea5;   /* primary B */
  --mint:     #10b981;   /* accent */
  --amber:    #fbbf24;   /* optional pop */

  /* Map legacy tokens to the new theme so existing classes keep working */
  --red:        var(--cobalt);
  --red-dark:   var(--fuchsia);
  --accent:     var(--mint);

  --bg-light:   #fafafa;   /* Material-ish white */
  --text-dark:  #0f172a;
  --text-light: #ffffff;
  --muted:      rgba(15,23,42,.7);

  --radius:     14px;
  --shadow:     0 14px 36px rgba(2,6,23,.10);
  --shadow-sm:  0 8px 22px rgba(2,6,23,.08);
  --transition: .26s cubic-bezier(.2,.7,.2,1);
  font-size:    16px;
}

*,
*::before,
*::after{ box-sizing:border-box; margin:0; padding:0; }

body{
  display:flex; flex-direction:column; min-height:100vh;
  background:var(--bg-light); color:var(--text-dark);
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial, sans-serif;
  line-height:1.65;
}
a{ text-decoration:none; }

/* ===== FLEX HELPERS ===== */
.flex{ display:flex; }
.center{ justify-content:center; }
.center-v{ align-items:center; }
.between{ justify-content:space-between; }

/* ===== CONTAINER ===== */
.container{ width:90%; max-width:960px; margin:0 auto; }

/* ===== HEADER (hero-like gradient + icon under-glow hover) ===== */
.site-header{
  background:
    linear-gradient(120deg, rgba(61,90,254,.18), rgba(255,62,165,.18)),
    radial-gradient(900px 320px at 10% -25%, rgba(61,90,254,.42), transparent 60%),
    radial-gradient(900px 320px at 92% -25%, rgba(16,185,129,.32), transparent 60%),
    #1b1630;
  color:var(--text-light);
}
.header-container{ padding:1rem 0; }
.main-nav ul{ list-style:none; gap:1rem; }
.main-nav ul li{ display:inline-block; }
.main-nav a{
  position:relative;
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.56rem .9rem; border-radius:999px; color:#fff;
  font-weight:800; letter-spacing:.1px;
  text-shadow:0 1px 6px rgba(0,0,0,.25);
  transition:transform var(--transition), background var(--transition), box-shadow var(--transition);
}
.main-nav a::before{
  content:""; position:absolute; inset:0; border-radius:999px;
  background:linear-gradient(90deg, var(--cobalt), var(--fuchsia));
  opacity:0; filter:blur(12px); transition:opacity .22s ease;
}
.main-nav a::after{
  content:""; position:absolute; left:.9rem; right:.9rem; bottom:-4px; height:2px; border-radius:2px;
  background:linear-gradient(90deg, var(--cobalt), var(--fuchsia));
  transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
}
.main-nav a:hover{ transform:translateY(-2px); }
.main-nav a:hover::before{ opacity:.35; }
.main-nav a:hover::after{ transform:scaleX(1); }
.main-nav i{ font-size:1.2rem; opacity:.95; }

/* ===== SEARCH HERO (mirrors home hero vibe) ===== */
.search-section{
  position:relative; overflow:hidden; text-align:center; color:var(--text-light);
  padding:3rem 0 4rem;
  background:
    linear-gradient(120deg, rgba(61,90,254,.22), rgba(255,62,165,.22)),
    radial-gradient(1000px 420px at 8% -18%, rgba(61,90,254,.58), transparent 60%),
    radial-gradient(1000px 420px at 92% -18%, rgba(16,185,129,.40), transparent 60%),
    #1b1630;
}
/* dots + sweep */
.search-section::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px) 0 0/24px 24px,
    radial-gradient(rgba(255,255,255,.04) 1px, transparent 1px) 12px 12px/32px 32px;
  animation:moveDots 18s linear infinite;
}
.search-section::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg, transparent 40%, rgba(255,255,255,.18) 50%, transparent 60%);
  transform:translateX(-100%); animation:sweep 9s linear infinite;
}
@keyframes moveDots{ from{background-position:0 0, 12px 12px} to{background-position:480px 0, 492px 12px} }
@keyframes sweep{ to{ transform:translateX(100%);} }

.search-section h2{
  font-size:2.4rem; margin-bottom:.5rem;
  text-shadow:0 2px 4px rgba(0,0,0,.2);
}
.search-section p{ color:rgba(255,255,255,.9); margin-bottom:1.5rem; }

.search-card{
  background:#fff; max-width:640px; margin:0 auto; padding:1.8rem;
  border-radius:var(--radius); box-shadow:var(--shadow); border:1px solid #ececec;
}
.search-form{ display:flex; gap:.5rem; }
.search-form input{
  flex:1; padding:.9rem 1rem; border-radius:12px; border:1px solid #e6e6e9; background:#fff;
  transition:border var(--transition), box-shadow var(--transition);
}
.search-form input::placeholder{ color:#9aa1b1; }
.search-form input:focus{
  outline:none; border-color:var(--red);
  box-shadow:0 0 0 4px rgba(61,90,254,.12);
}

/* Primary button → pill gradient + arrow nudge */
.btn-primary{
  position:relative;
  display:inline-flex; align-items:center; gap:.55rem;
  background:linear-gradient(90deg, var(--cobalt), var(--fuchsia));
  color:#fff; border:none; padding:.9rem 1.3rem; border-radius:999px;
  font-weight:900; letter-spacing:.2px;
  box-shadow:0 18px 36px rgba(61,90,254,.20);
  transition:transform var(--transition), filter var(--transition), box-shadow var(--transition);
}
.btn-primary::after{
  content:"↗"; transform:translateX(0); transition:transform .22s ease;
}
.btn-primary:hover{
  transform:translateY(-2px); filter:brightness(1.03);
  box-shadow:0 22px 46px rgba(61,90,254,.25);
}
.btn-primary:hover::after{ transform:translateX(4px); }

/* ===== NEWS FEATURES ===== */
.news-listing{ padding:4rem 0; flex:1; } /* flex:1 ensures footer sits at bottom */
.news-list{
  list-style:none; margin:0; padding:0; display:grid; gap:2rem;
}
.news-feature{
  background:#fff; border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow);
  transition:transform var(--transition), box-shadow var(--transition), border-color var(--transition);
  border:1px solid #ececec; position:relative;
}
.news-feature:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 28px rgba(2,6,23,.18);
}
.news-feature a{ display:block; color:inherit; }

/* Feature header with gradient + shimmer */
.feature-header{
  position:relative; overflow:hidden; color:#fff; padding:2rem 1.5rem;
  font-size:1.8rem; font-weight:900; text-shadow:1px 1px 2px rgba(0,0,0,.3);
  background:linear-gradient(90deg, var(--cobalt), var(--fuchsia));
}
.feature-header::after{
  content:""; position:absolute; top:0; left:-100%; width:60%; height:100%;
  background:linear-gradient(120deg, rgba(255,255,255,.0) 35%, rgba(255,255,255,.28) 50%, rgba(255,255,255,.0) 65%);
  transform:skewX(-25deg); animation:shimmer 2.5s infinite;
}
@keyframes shimmer{ 0%{ left:-60%; } 100%{ left:160%; } }

.feature-body{ padding:1.5rem; }
.feature-body p{ color:var(--muted); margin-bottom:1rem; }
.read-more{
  font-weight:800;
  background-image:linear-gradient(90deg, var(--cobalt), var(--fuchsia));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  position:relative;
}
.read-more::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px; border-radius:2px;
  background:linear-gradient(90deg, var(--cobalt), var(--fuchsia));
  transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
}
.read-more:hover::after{ transform:scaleX(1); }

/* ===== PAGINATION ===== */
.pagination{
  display:flex; gap:.6rem; justify-content:center; margin-top:2rem;
  list-style:none; padding:0;
}
.page-btn{
  padding:.68rem 1rem; border-radius:999px; font-weight:800;
  border:1px solid #e7e7ed; background:#fff; color:var(--cobalt);
  transition:transform var(--transition), background var(--transition), color var(--transition), box-shadow var(--transition), border-color var(--transition);
  box-shadow:var(--shadow-sm);
}
.page-btn:hover:not(.disabled):not(.active){
  transform:translateY(-2px);
  background:linear-gradient(90deg, var(--cobalt), var(--fuchsia));
  color:#fff; border-color:transparent;
}
.page-btn.active{
  background:linear-gradient(90deg, var(--cobalt), var(--fuchsia));
  color:#fff; border-color:transparent; cursor:default;
  box-shadow:0 12px 28px rgba(61,90,254,.20);
}
.page-btn.disabled{ opacity:.5; cursor:default; }

/* ===== FOOTER (sticks to bottom thanks to body flex + margin-top:auto) ===== */
.site-footer{
  margin-top:auto; /* ensures footer pushes to bottom when content is short */
  background:linear-gradient(90deg, var(--cobalt), var(--fuchsia));
  color:var(--text-light); text-align:center; padding:1rem 0; font-size:.92rem;
  border-top:1px solid rgba(255,255,255,.22);
}
.site-footer a{ color:#fffbe8; }
.site-footer a:hover{ text-decoration:underline; opacity:.95; }

/* ===== RESPONSIVE ===== */
@media (max-width:768px){
  .news-list{ display:flex; flex-direction:column; gap:1.2rem; }
  .btn-primary{ width:100%; justify-content:center; }
}

/* ===== ACCESSIBILITY: Reduced Motion ===== */
@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
}