/* ════════════════════════════════════════════════════
   PULSE — AI News Command Center
   Production Stylesheet
   ════════════════════════════════════════════════════ */

/* ── DESIGN TOKENS ─────────────────────────────── */
:root {
  --bg:         #060611;
  --bg1:        #0a0a1a;
  --bg2:        #111128;
  --bg3:        #191938;
  --bg-glass:   rgba(10,10,26,.7);
  --surface:    rgba(255,255,255,.03);
  --surface2:   rgba(255,255,255,.05);

  --border:     rgba(255,255,255,.06);
  --border2:    rgba(255,255,255,.1);
  --border3:    rgba(255,255,255,.15);

  --dim:        #44446e;
  --mid:        #7878aa;
  --txt:        #c8c8e8;
  --bright:     #eeeeff;
  --white:      #ffffff;

  --accent:     #7c5cfc;
  --accent2:    #a78bfa;
  --accent-s:   rgba(124,92,252,.15);
  --red:        #f43f5e;
  --red-s:      rgba(244,63,94,.12);
  --blue:       #3b82f6;
  --blue-s:     rgba(59,130,246,.12);
  --green:      #10b981;
  --green-s:    rgba(16,185,129,.1);
  --amber:      #f59e0b;
  --amber-s:    rgba(245,158,11,.1);
  --orange:     #f97316;
  --orange-s:   rgba(249,115,22,.12);
  --purple:     #a855f7;
  --purple-s:   rgba(168,85,247,.12);

  --font:       'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --mono:       'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;

  --radius-xl:  20px;
  --radius-lg:  14px;
  --radius-md:  10px;
  --radius-sm:  6px;

  --ease:       cubic-bezier(.4,0,.2,1);
  --spring:     cubic-bezier(.34,1.56,.64,1);
}

/* ── RESET ─────────────────────────────────────── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { font-size:16px; scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--txt);
  min-height: 100vh;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.6;
}

::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:rgba(255,255,255,.08); border-radius:99px; }
::-webkit-scrollbar-thumb:hover { background:rgba(255,255,255,.14); }

a { color:var(--accent2); text-decoration:none; transition:color .2s var(--ease); }
a:hover { color:var(--accent); }

/* ── AMBIENT BACKGROUND ────────────────────────── */
.ambient { position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.orb { position:absolute; border-radius:50%; filter:blur(120px); opacity:.45; }
.orb-1 { width:800px;height:800px;top:-300px;left:-250px; background:radial-gradient(circle,rgba(124,92,252,.1),transparent 70%); animation:orbA 22s ease-in-out infinite; }
.orb-2 { width:600px;height:600px;bottom:-200px;right:-150px; background:radial-gradient(circle,rgba(244,63,94,.07),transparent 70%); animation:orbB 18s ease-in-out infinite; }
.orb-3 { width:500px;height:500px;top:40%;left:45%; background:radial-gradient(circle,rgba(16,185,129,.05),transparent 70%); animation:orbC 26s ease-in-out infinite; }
@keyframes orbA{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(90px,70px) scale(1.12)}}
@keyframes orbB{0%,100%{transform:translate(0,0)}50%{transform:translate(-70px,-55px) scale(1.08)}}
@keyframes orbC{0%,100%{transform:translate(0,0)}33%{transform:translate(55px,-45px)}66%{transform:translate(-45px,45px)}}

/* Grid pattern overlay */
.grid-overlay {
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image: linear-gradient(var(--border) 1px, transparent 1px),
                    linear-gradient(90deg, var(--border) 1px, transparent 1px);
  background-size: 60px 60px;
  opacity:.25;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black 20%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black 20%, transparent 70%);
}

/* ── NAVBAR ────────────────────────────────────── */
.navbar {
  position:sticky; top:0; z-index:800;
  height:64px; display:flex; align-items:center;
  padding:0 32px; gap:20px;
  background:rgba(6,6,17,.8);
  backdrop-filter:blur(28px) saturate(1.5);
  -webkit-backdrop-filter:blur(28px) saturate(1.5);
  border-bottom:1px solid var(--border);
}
.brand { display:flex; align-items:center; gap:11px; text-decoration:none!important; flex-shrink:0; }
.brand-icon {
  width:38px;height:38px;border-radius:12px;flex-shrink:0;
  background:linear-gradient(135deg,#f43f5e,#e11d48);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 30px rgba(244,63,94,.35), inset 0 1px 0 rgba(255,255,255,.2);
  position:relative; overflow:hidden;
  transition:transform .25s var(--spring);
}
.brand:hover .brand-icon { transform:scale(1.08) rotate(-3deg); }
.brand-icon::after { content:'';position:absolute;inset:0; background:linear-gradient(135deg,rgba(255,255,255,.2),transparent 50%); }
.brand-icon span { font-family:var(--font);font-weight:900;font-size:17px;color:#fff;z-index:1;letter-spacing:-0.5px; }
.brand-name { font-weight:800;font-size:18px;color:var(--bright);letter-spacing:.4px; }
.brand-sub { font-family:var(--mono);font-size:9px;color:var(--dim);letter-spacing:2.5px;text-transform:uppercase;margin-top:1px; }

/* Ticker */
.ticker-wrap { flex:1;overflow:hidden;position:relative;height:24px;border-left:1px solid var(--border);padding-left:20px;margin-left:4px; }
.ticker-wrap::after { content:'';position:absolute;right:0;top:0;bottom:0;width:100px; background:linear-gradient(to right,transparent,rgba(6,6,17,.8));pointer-events:none; }
.ticker-track { display:flex;white-space:nowrap; animation:tickScroll 65s linear infinite; }
.ticker-track:hover { animation-play-state:paused; }
.tick-item { display:inline-flex;align-items:center;gap:8px;padding-right:50px; font-family:var(--mono);font-size:11px;color:var(--mid); }
.tick-dot { font-size:5px;color:var(--red); }
.tick-item strong { color:var(--txt);font-weight:500; }
@keyframes tickScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

.live-pill {
  flex-shrink:0; display:flex; align-items:center; gap:7px;
  border:1px solid rgba(244,63,94,.2); border-radius:99px;
  padding:6px 14px; background:rgba(244,63,94,.05);
  font-family:var(--mono); font-size:10px; color:var(--red);
  letter-spacing:2px; font-weight:600;
}
.live-dot { width:6px;height:6px;border-radius:50%;background:var(--red); box-shadow:0 0 8px rgba(244,63,94,.6); animation:livePulse 1.4s ease infinite; }
@keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(244,63,94,.5)}70%{box-shadow:0 0 0 7px rgba(244,63,94,0)}100%{box-shadow:0 0 0 0 rgba(244,63,94,0)}}

/* ── HERO SECTION ──────────────────────────────── */
.hero {
  padding:48px 0 0;
  position:relative;
}
.hero-inner {
  max-width:1200px; margin:0 auto; padding:0 32px;
  display:flex; justify-content:space-between; align-items:flex-end; gap:32px;
  flex-wrap:wrap;
}
.hero-text { flex:1; min-width:280px; }
.hero-title {
  font-weight:900; font-size:clamp(32px, 5vw, 52px);
  letter-spacing:-1.5px; line-height:1.1;
  color:var(--white);
  margin-bottom:10px;
}
.hero-title .emoji { font-style:normal; }
.hero-desc {
  font-size:15px; color:var(--mid); line-height:1.7;
  max-width:540px;
}
.hero-stats {
  display:flex; align-items:center; gap:28px;
  flex-shrink:0;
}
.hero-stat { text-align:center; }
.hero-stat-val {
  display:block; font-weight:900; font-size:36px;
  color:var(--white); letter-spacing:-1.5px; line-height:1;
}
.hero-stat-lbl {
  display:block; font-family:var(--mono); font-size:9px;
  color:var(--dim); letter-spacing:2px; text-transform:uppercase; margin-top:5px;
}
.hero-stat-div { width:1px; height:44px; background:linear-gradient(180deg,transparent,var(--border2),transparent); }

/* ── SECTION WRAPPER ───────────────────────────── */
.section {
  max-width:1200px; margin:0 auto;
  padding:32px 32px 48px;
  position:relative; z-index:1;
}

/* ── FILTERS ───────────────────────────────────── */
.filters {
  display:flex; align-items:center; gap:8px;
  margin-bottom:28px; flex-wrap:wrap;
}
.filter-btn {
  background:var(--surface2); border:1px solid var(--border);
  color:var(--dim); font-family:var(--font); font-size:13px; font-weight:600;
  padding:9px 20px; border-radius:99px; cursor:pointer;
  transition:all .22s var(--ease); letter-spacing:.2px;
  display:flex; align-items:center; gap:7px;
}
.filter-btn:hover { border-color:var(--border2); color:var(--mid); background:var(--bg3); }
.filter-btn.active { color:#fff; border-color:transparent; }
.filter-btn[data-cat="india"].active   { background:linear-gradient(135deg,#ea580c,var(--orange)); box-shadow:0 4px 28px var(--orange-s); }
.filter-btn[data-cat="tech"].active    { background:linear-gradient(135deg,#2563eb,var(--blue));   box-shadow:0 4px 28px var(--blue-s); }
.filter-btn[data-cat="social"].active  { background:linear-gradient(135deg,#7c3aed,var(--purple)); box-shadow:0 4px 28px var(--purple-s); }
.filter-btn[data-cat="world"].active   { background:linear-gradient(135deg,#059669,var(--green));  box-shadow:0 4px 28px var(--green-s); }
.filter-btn[data-cat="all"].active     { background:linear-gradient(135deg,#dc2626,var(--red));    box-shadow:0 4px 28px var(--red-s); }

.refresh-btn {
  margin-left:auto;
  background:var(--surface2); border:1px solid var(--border);
  color:var(--dim); font-family:var(--mono); font-size:11px;
  padding:9px 16px; border-radius:var(--radius-md); cursor:pointer;
  transition:all .22s var(--ease); display:flex; align-items:center; gap:7px;
}
.refresh-btn:hover { border-color:var(--red); color:var(--red); background:rgba(244,63,94,.04); }
.refresh-btn.spinning .refresh-icon { display:inline-block; animation:spin .5s linear infinite; }
@keyframes spin{to{transform:rotate(360deg)}}

/* ── NEWS GRID ─────────────────────────────────── */
.news-grid {
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr));
  gap:16px;
}

/* ── CARD ──────────────────────────────────────── */
.card {
  background:var(--bg1);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:22px 24px 20px;
  transition:all .25s var(--ease);
  position:relative; overflow:hidden;
  animation:cardFadeIn .5s var(--ease) both;
}
@keyframes cardFadeIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

.card::before {
  content:''; position:absolute; left:0; top:20px; bottom:20px;
  width:3px; border-radius:0 3px 3px 0;
  transition:height .2s var(--ease);
}
.card.c-india::before   { background:linear-gradient(180deg,#f97316,#fb923c); }
.card.c-tech::before    { background:linear-gradient(180deg,#3b82f6,#60a5fa); }
.card.c-social::before  { background:linear-gradient(180deg,#a855f7,#c084fc); }
.card.c-world::before   { background:linear-gradient(180deg,#10b981,#34d399); }

/* Hover glow */
.card::after {
  content:''; position:absolute; inset:-1px;
  border-radius:inherit; opacity:0;
  transition:opacity .3s var(--ease);
  pointer-events:none;
}
.card.c-india::after  { background:linear-gradient(135deg, rgba(249,115,22,.06), transparent 60%); }
.card.c-tech::after   { background:linear-gradient(135deg, rgba(59,130,246,.06), transparent 60%); }
.card.c-social::after { background:linear-gradient(135deg, rgba(168,85,247,.06), transparent 60%); }
.card.c-world::after  { background:linear-gradient(135deg, rgba(16,185,129,.06), transparent 60%); }

.card:hover {
  border-color:var(--border2);
  transform:translateY(-3px);
  box-shadow:0 16px 48px rgba(0,0,0,.4);
}
.card:hover::after { opacity:1; }

.card-head { display:flex; align-items:center; gap:8px; margin-bottom:12px; flex-wrap:wrap; }
.card-tag {
  font-family:var(--mono); font-size:9.5px; font-weight:600;
  letter-spacing:1.2px; text-transform:uppercase;
  padding:3px 10px; border-radius:var(--radius-sm);
}
.tag-india  { background:var(--orange-s); color:#fb923c; }
.tag-tech   { background:var(--blue-s);   color:#60a5fa; }
.tag-social { background:var(--purple-s); color:#c084fc; }
.tag-world  { background:var(--green-s);  color:#34d399; }

.card-time { font-family:var(--mono); font-size:10px; color:var(--dim); }
.card-src  { font-family:var(--mono); font-size:10px; color:var(--dim); margin-left:auto; }

.card-title {
  font-weight:700; font-size:15.5px; line-height:1.5;
  color:var(--bright); margin-bottom:8px; letter-spacing:-.2px;
}
.card-desc {
  font-size:13px; color:var(--mid); line-height:1.7;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  line-clamp:2; overflow:hidden;
}
.card-link {
  display:inline-flex; align-items:center; gap:6px;
  margin-top:14px; font-family:var(--mono); font-size:11px;
  color:var(--accent2); font-weight:500;
  transition:gap .2s var(--ease), color .2s var(--ease);
}
.card-link:hover { gap:10px; color:var(--accent); text-decoration:none; }

/* ── SKELETON LOADER ───────────────────────────── */
.skel-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr)); gap:16px; }
.skel-card { background:var(--bg1); border:1px solid var(--border); border-radius:var(--radius-lg); padding:22px 24px; }
.skel-bar {
  border-radius:var(--radius-sm);
  background:linear-gradient(90deg,var(--bg1) 0%,var(--bg2) 40%,var(--bg3) 60%,var(--bg1) 100%);
  background-size:300% 100%; animation:shimmer 1.8s ease infinite;
}
@keyframes shimmer{0%{background-position:100% 0}100%{background-position:-100% 0}}

/* ── EMPTY STATE ───────────────────────────────── */
.empty-state {
  text-align:center; padding:80px 24px;
  font-family:var(--mono); font-size:13px; color:var(--dim); line-height:2.2;
}
.empty-icon { font-size:44px; display:block; margin-bottom:16px; }

/* ═══════════════════════════════════════════════════
   FLOATING CHAT
   ═══════════════════════════════════════════════════ */
.chat-fab {
  position:fixed; bottom:32px; right:32px; z-index:900;
  width:62px; height:62px; border-radius:50%;
  background:linear-gradient(135deg,#7c5cfc,#a855f7);
  border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 36px rgba(124,92,252,.4);
  transition:all .25s var(--spring);
  animation:fabBreath 4s ease-in-out infinite;
}
.chat-fab:hover { transform:scale(1.12); box-shadow:0 12px 44px rgba(124,92,252,.55); }
.chat-fab:active { transform:scale(.95); }
.chat-fab.hidden { display:none; }
.chat-fab svg { width:26px;height:26px;color:#fff;transition:transform .2s var(--ease); }
.chat-fab:hover svg { transform:rotate(-6deg) scale(1.05); }
.chat-fab-dot {
  position:absolute; top:5px; right:5px;
  width:12px; height:12px; border-radius:50%;
  background:var(--green); border:2.5px solid var(--bg);
}
.chat-fab.no-dot .chat-fab-dot { display:none; }
@keyframes fabBreath{0%,100%{box-shadow:0 8px 36px rgba(124,92,252,.4),0 0 0 0 rgba(124,92,252,.15)}50%{box-shadow:0 8px 36px rgba(124,92,252,.4),0 0 0 14px rgba(124,92,252,0)}}

/* Chat backdrop */
.chat-backdrop {
  position:fixed; inset:0; z-index:950;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  opacity:0; visibility:hidden;
  transition:opacity .3s var(--ease), visibility .3s var(--ease);
}
.chat-backdrop.open { opacity:1; visibility:visible; }

/* Chat drawer */
.chat-drawer {
  position:fixed; bottom:32px; right:32px; z-index:960;
  width:430px; max-width:calc(100vw - 24px);
  height:620px; max-height:calc(100vh - 80px);
  border-radius:var(--radius-xl);
  background:var(--bg1);
  border:1px solid var(--border2);
  box-shadow:0 32px 100px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.04);
  display:flex; flex-direction:column; overflow:hidden;
  transform:translateY(20px) scale(.96); opacity:0; visibility:hidden;
  transition:transform .35s var(--spring), opacity .25s var(--ease), visibility .25s var(--ease);
}
.chat-drawer.open { transform:translateY(0) scale(1); opacity:1; visibility:visible; }

/* Chat header */
.chat-head {
  padding:18px 22px 14px;
  border-bottom:1px solid var(--border);
  background:linear-gradient(180deg,var(--bg2),var(--bg1));
  flex-shrink:0;
}
.chat-head-row { display:flex; align-items:center; gap:12px; }
.chat-avatar {
  width:38px;height:38px;border-radius:12px;flex-shrink:0;
  background:linear-gradient(135deg,#7c5cfc,#a855f7);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 22px rgba(124,92,252,.3),inset 0 1px 0 rgba(255,255,255,.15);
  font-size:17px; color:#fff;
}
.chat-name { font-weight:700;font-size:16px;color:var(--bright);letter-spacing:-.2px; }
.chat-model { font-family:var(--mono);font-size:9px;color:var(--dim);letter-spacing:1.5px;margin-top:2px; }
.chat-close {
  width:34px;height:34px;border-radius:8px;border:none;
  background:transparent;cursor:pointer;margin-left:auto;
  display:flex;align-items:center;justify-content:center;
  color:var(--dim); transition:all .2s var(--ease);
}
.chat-close:hover { background:var(--bg3); color:var(--bright); }

.chat-meta { display:flex; align-items:center; gap:8px; margin-top:10px; flex-wrap:wrap; }
.chat-ctx {
  display:flex;align-items:center;gap:5px;
  background:rgba(16,185,129,.06);border:1px solid rgba(16,185,129,.15);
  border-radius:99px;padding:4px 11px;
  font-family:var(--mono);font-size:9px;color:var(--green);letter-spacing:.8px;
}

/* Messages */
.chat-messages {
  flex:1; overflow-y:auto; padding:18px 20px;
  display:flex; flex-direction:column; gap:12px;
}
.msg { max-width:88%; animation:msgIn .25s var(--ease); }
@keyframes msgIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.msg.user { align-self:flex-end; }
.msg.bot  { align-self:flex-start; }
.msg-bubble { padding:12px 16px; border-radius:16px; font-size:13px; line-height:1.72; }
.msg.user .msg-bubble {
  background:linear-gradient(135deg,#7c5cfc,#a855f7);
  color:#fff; border-bottom-right-radius:4px;
  box-shadow:0 4px 20px rgba(124,92,252,.3);
}
.msg.bot .msg-bubble {
  background:var(--bg2); border:1px solid var(--border);
  color:var(--txt); border-bottom-left-radius:4px;
}
.msg-bubble code { font-family:var(--mono);font-size:11px;background:rgba(255,255,255,.06);padding:1px 6px;border-radius:4px; }
.msg-bubble strong { color:var(--bright); }
.msg-time { font-family:var(--mono);font-size:9px;color:var(--dim);margin-top:4px;padding:0 4px; }
.msg.user .msg-time { text-align:right; }

/* Typing */
.typing { display:flex;gap:5px;padding:8px 14px;align-items:center; }
.typing-dot { width:7px;height:7px;border-radius:50%;background:var(--dim); animation:typeDot 1.3s ease infinite; }
.typing-dot:nth-child(2){animation-delay:.17s}
.typing-dot:nth-child(3){animation-delay:.34s}
@keyframes typeDot{0%,100%{transform:translateY(0);opacity:.3}50%{transform:translateY(-5px);opacity:1}}

/* Quick chips */
.chat-chips { padding:12px 20px;display:flex;gap:8px;overflow-x:auto; border-top:1px solid var(--border);flex-shrink:0; background:rgba(0,0,0,.2); }
.chat-chips::-webkit-scrollbar{display:none}
.chat-chip {
  background:var(--surface2);border:1px solid var(--border);
  color:var(--txt);font-family:var(--font);font-size:11.5px;font-weight:600;
  padding:8px 16px;border-radius:99px;cursor:pointer;white-space:nowrap;
  transition:all .2s var(--spring); box-shadow:0 2px 8px rgba(0,0,0,.2);
}
.chat-chip:hover { background:linear-gradient(135deg,#7c5cfc,#a855f7);color:#fff;border-color:transparent;transform:translateY(-2px);box-shadow:0 6px 16px rgba(124,92,252,.3); }

/* Chat input */
.chat-input-wrap { padding:16px 20px 20px; border-top:1px solid var(--border); flex-shrink:0; background:var(--bg1); }
.chat-input-box {
  display:flex;gap:12px;align-items:flex-end;
  background:var(--bg2);border:1px solid var(--border2);
  border-radius:20px;padding:12px 14px 12px 20px;
  transition:all .25s var(--ease);
  box-shadow:inset 0 2px 10px rgba(0,0,0,.2);
}
.chat-input-box:focus-within { border-color:var(--accent); box-shadow:0 0 0 4px var(--accent-s), inset 0 2px 10px rgba(0,0,0,.2); background:rgba(124,92,252,.04); }
.chat-textarea {
  flex:1;background:transparent;border:none;outline:none;
  color:var(--bright);font-family:var(--font);font-size:14px;
  resize:none;max-height:120px;min-height:22px;line-height:1.6;
}
.chat-textarea::placeholder { color:var(--mid); }

/* Improved Send Button */
.chat-send-btn {
  width:36px;height:36px;flex-shrink:0;border-radius:10px;border:none;
  background:linear-gradient(135deg,#7c5cfc,#a855f7);
  color:#fff; cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all .25s var(--spring);
  box-shadow:0 4px 14px rgba(124,92,252,.4), inset 0 1px 1px rgba(255,255,255,.3);
  position:relative; overflow:hidden;
}
.chat-send-btn::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.2),transparent);
  opacity:0; transition:opacity .2s var(--ease);
}
.chat-send-btn:hover { transform:scale(1.08) rotate(-4deg); box-shadow:0 6px 20px rgba(124,92,252,.5), inset 0 1px 1px rgba(255,255,255,.3); }
.chat-send-btn:hover::after { opacity:1; }
.chat-send-btn:active { transform:scale(.92); }
.chat-send-btn:disabled { background:var(--bg3); box-shadow:none; color:var(--dim); cursor:not-allowed; transform:none; }
.chat-send-btn svg { width:15px; height:15px; z-index:1; position:relative; transition:transform .25s var(--spring); }
.chat-send-btn:hover svg { transform:translate(2px,-2px); }

/* ── FOOTER ────────────────────────────────────── */
.footer {
  text-align:center; padding:36px 24px;
  font-family:var(--mono); font-size:10px;
  color:var(--dim); letter-spacing:.5px;
  border-top:1px solid var(--border);
  position:relative; z-index:1;
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════ */
@media(max-width:768px) {
  .navbar { padding:0 16px; gap:10px; height:56px; }
  .brand-name { font-size:16px; }
  .ticker-wrap { display:none; }
  .hero { padding:32px 0 0; }
  .hero-inner { padding:0 16px; }
  .hero-title { font-size:28px; }
  .hero-stats { gap:18px; }
  .hero-stat-val { font-size:28px; }
  .section { padding:24px 16px 48px; }
  .filters { gap:6px; }
  .filter-btn { font-size:12px; padding:7px 14px; }
  .news-grid { grid-template-columns:1fr; }
  .chat-drawer { bottom:0;right:0;left:0; width:100%;max-width:100%; height:88vh; border-radius:var(--radius-xl) var(--radius-xl) 0 0; }
  .chat-fab { bottom:20px;right:20px;width:56px;height:56px; }
  .grid-overlay { display:none; }
}

@media(max-width:480px) {
  .hero-stats { display:none; }
  .hero-desc { font-size:13px; }
  .card { padding:18px 18px 16px; }
  .card-title { font-size:14.5px; }
}