/* ═══════════════════════════════════════════════════════
   CONECTA NEWS CAMAQUA - CSS Principal
   ═══════════════════════════════════════════════════════ */

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

:root {
  --red:    #CC0000;
  --red2:   #FF1A1A;
  --black:  #0a0a0a;
  --dark:   #111111;
  --card:   #1a1a1a;
  --card2:  #222222;
  --border: #2a2a2a;
  --white:  #ffffff;
  --light:  #aaaaaa;
  --muted:  #666666;
  --sans:   'Inter', sans-serif;
}

html { scroll-behavior: smooth; }
body { font-family: var(--sans); background: var(--black); color: var(--white); overflow-x: hidden; }

@keyframes blink  { 0%,100%{opacity:1} 50%{opacity:.3} }
@keyframes scroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
@keyframes puls   { 0%,100%{box-shadow:0 4px 32px rgba(204,0,0,.6)} 50%{box-shadow:0 4px 56px rgba(204,0,0,.9)} }
@keyframes fadeOv { to{opacity:0;pointer-events:none} }

/* TOP BAR */
.topbar {
  position:fixed;top:0;left:0;right:0;z-index:200;
  height:62px;background:#0d0d0d;border-bottom:2px solid var(--red);
  display:flex;align-items:center;padding:0 1.5rem;gap:1.25rem;
  box-shadow:0 2px 20px rgba(0,0,0,0.7);
}
.tb-logo { display:flex;align-items:center;gap:.6rem;text-decoration:none;flex-shrink:0; }
.tb-logo img { width:40px;height:40px;border-radius:6px;object-fit:contain; }
.tb-logo-name { font-size:.88rem;font-weight:800;color:#fff;white-space:nowrap;letter-spacing:-.01em; }
.tb-logo-name span { color:var(--red); }
.tb-sep { width:1px;height:26px;background:var(--border);flex-shrink:0; }
.tb-now { flex:1;display:flex;align-items:center;gap:.65rem;min-width:0;overflow:hidden; }
.tb-live { background:var(--red);color:#fff;font-size:.55rem;font-weight:800;letter-spacing:.15em;padding:.2rem .45rem;border-radius:3px;display:flex;align-items:center;gap:.3rem;flex-shrink:0; }
.tb-dot { width:5px;height:5px;background:#fff;border-radius:50%;animation:blink 1.2s infinite; }
.tb-track { min-width:0;overflow:hidden;display:flex;flex-direction:column;gap:2px; }
.tb-title { font-size:.85rem;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.tb-sub   { font-size:.7rem;color:#888; }
.tb-ctrl { display:flex;align-items:center;gap:.65rem;flex-shrink:0; }
.tb-play-btn { width:34px;height:34px;border-radius:50%;background:var(--red);border:none;cursor:pointer;color:#fff;font-size:.85rem;display:flex;align-items:center;justify-content:center;transition:all .15s;box-shadow:0 2px 12px rgba(204,0,0,.4); }
.tb-play-btn:hover { background:var(--red2);transform:scale(1.08); }
.tb-vol { display:flex;align-items:center;gap:.4rem; }
.tb-vol span { font-size:.75rem;color:var(--muted); }
.tb-vol input { width:72px;-webkit-appearance:none;height:3px;background:var(--border);border-radius:2px;outline:none;cursor:pointer; }
.tb-vol input::-webkit-slider-thumb { -webkit-appearance:none;width:11px;height:11px;border-radius:50%;background:var(--red);cursor:pointer; }
.tb-lst { font-size:.68rem;color:var(--muted);display:flex;align-items:center;gap:.3rem; }
.tb-lst strong { color:#fff;font-weight:600; }
.tb-nav { display:flex;align-items:center;gap:.15rem; }
.tb-nav a { font-size:.7rem;font-weight:600;color:var(--muted);text-decoration:none;padding:.3rem .6rem;border-radius:5px;transition:all .15s; }
.tb-nav a:hover { color:#fff;background:rgba(255,255,255,.06); }
.tb-panel-btn { font-size:.68rem;font-weight:700;color:var(--muted);border:1px solid var(--border);border-radius:5px;padding:.28rem .6rem;cursor:pointer;background:none;transition:all .15s; }
.tb-panel-btn:hover { color:#fff;border-color:var(--muted); }

/* TICKER */
.ticker { position:fixed;top:62px;left:0;right:0;z-index:199;height:28px;background:var(--red);display:flex;align-items:center;overflow:hidden; }
.ticker-tag { background:rgba(0,0,0,.35);color:#fff;font-size:.58rem;font-weight:800;letter-spacing:.18em;padding:0 .85rem;height:100%;display:flex;align-items:center;white-space:nowrap;flex-shrink:0; }
.ticker-scroll { display:flex;white-space:nowrap;animation:scroll 32s linear infinite; }
.ticker-scroll span { font-size:.7rem;font-weight:500;color:#fff;padding:0 2.5rem; }
.ticker-scroll span::before { content:"► ";opacity:.75; }

/* MAIN */
main { padding-top:90px; }

/* HERO */
.hero { display:grid;grid-template-columns:1fr 420px;min-height:500px;background:var(--dark);border-bottom:1px solid var(--border); }
.hero-left { position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:3.5rem 3rem 3.5rem 4rem; }
.hero-bg { position:absolute;inset:0;background-image:url(/logo4.jpeg);background-size:55%;background-position:center right;background-repeat:no-repeat;opacity:.08; }
.hero-cnt { position:relative;z-index:1; }
.hero-tag { display:inline-flex;align-items:center;gap:.45rem;background:rgba(204,0,0,.12);border:1px solid rgba(204,0,0,.3);border-radius:20px;padding:.28rem .75rem;font-size:.65rem;font-weight:700;letter-spacing:.1em;color:#FF4444;margin-bottom:1.5rem;width:fit-content; }
.hero-tag-dot { width:6px;height:6px;background:#FF4444;border-radius:50%;animation:blink 1.2s infinite; }
.hero-h1 { font-size:clamp(2.4rem,4vw,3.8rem);font-weight:900;line-height:1.04;letter-spacing:-.03em;margin-bottom:1.1rem; }
.hero-h1 .ac { color:var(--red); }
.hero-p { font-size:.92rem;color:var(--light);line-height:1.7;max-width:400px;margin-bottom:2.25rem; }
.hero-cta { display:flex;gap:.85rem;flex-wrap:wrap; }

.btn-red { background:var(--red);color:#fff;border:none;border-radius:7px;padding:.75rem 1.5rem;font-size:.85rem;font-weight:700;cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:.4rem;box-shadow:0 4px 18px rgba(204,0,0,.4);font-family:var(--sans);text-decoration:none; }
.btn-red:hover { background:var(--red2);transform:translateY(-1px); }
.btn-ghost { background:transparent;color:var(--light);border:1px solid var(--border);border-radius:7px;padding:.75rem 1.5rem;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .15s;font-family:var(--sans);text-decoration:none;display:flex;align-items:center;gap:.4rem; }
.btn-ghost:hover { border-color:var(--light);color:#fff; }

/* HERO RIGHT */
.hero-right { border-left:1px solid var(--border);display:flex;flex-direction:column;background:#0d0d0d; }
.hr-header { background:var(--card);padding:.9rem 1.25rem;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between; }
.hr-label { font-size:.65rem;font-weight:700;letter-spacing:.12em;color:var(--muted);text-transform:uppercase; }
.live-badge { display:flex;align-items:center;gap:.3rem;font-size:.58rem;font-weight:800;letter-spacing:.12em;color:#FF4444; }
.live-badge-dot { width:5px;height:5px;background:#FF4444;border-radius:50%;animation:blink 1.2s infinite; }
.video-wrap { flex:1;background:#000;position:relative;min-height:300px; }
.video-wrap video { width:100%;height:100%;object-fit:contain;display:block;min-height:300px; }
.v-offline { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem; }
.v-offline .vi { font-size:2.5rem;opacity:.15; }
.v-offline p { font-size:.72rem;font-weight:700;letter-spacing:.12em;color:var(--muted);text-transform:uppercase; }
.v-offline small { font-size:.63rem;color:#333;text-align:center;padding:0 2rem;line-height:1.5; }

/* STATS */
.stats { background:var(--red);padding:1.75rem 4rem;display:grid;grid-template-columns:repeat(4,1fr);border-bottom:3px solid rgba(0,0,0,.2); }
.stat { text-align:center; }
.stat-n { font-size:2rem;font-weight:900;color:#fff;letter-spacing:-.03em;line-height:1; }
.stat-l { font-size:.6rem;font-weight:600;letter-spacing:.15em;color:rgba(255,255,255,.65);margin-top:.35rem;text-transform:uppercase; }

/* SECTIONS */
.sec { padding:2.75rem 4rem; }
.sec-dark { background:var(--dark); }
.sec-head { display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid var(--border);padding-bottom:.9rem;margin-bottom:1.75rem; }
.sec-head h2 { font-size:1rem;font-weight:800;display:flex;align-items:center;gap:.55rem; }
.sec-head h2::before { content:'';display:block;width:3px;height:18px;background:var(--red);border-radius:2px; }
.sec-head a { font-size:.72rem;font-weight:600;color:var(--red);text-decoration:none; }
.sec-head a:hover { opacity:.75; }

/* DESTAQUES */
.hl-grid { display:grid;grid-template-columns:2fr 1fr 1fr;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:10px;overflow:hidden; }
.hl { background:var(--card);padding:1.5rem;cursor:pointer;transition:background .15s;display:flex;flex-direction:column;gap:.55rem; }
.hl:hover { background:var(--card2); }
.hl.main { padding:2rem; }
.hl-cat   { font-size:.58rem;font-weight:800;letter-spacing:.18em;color:var(--red);text-transform:uppercase; }
.hl-title { font-size:.92rem;font-weight:700;line-height:1.35;color:#fff; }
.hl.main .hl-title { font-size:1.3rem; }
.hl-desc  { font-size:.75rem;color:var(--light);line-height:1.6; }
.hl-time  { font-size:.64rem;color:var(--muted);margin-top:auto; }

/* PROGRAMACAO */
.sched-list { display:flex;flex-direction:column;gap:1px; }
.sched-row { background:var(--card);display:grid;grid-template-columns:82px 1fr auto;align-items:center;gap:1.25rem;padding:1rem 1.5rem;transition:background .15s; }
.sched-row:first-child { border-radius:10px 10px 0 0; }
.sched-row:last-child  { border-radius:0 0 10px 10px; }
.sched-row:hover       { background:var(--card2); }
.sched-row.now         { background:rgba(204,0,0,.07);border-left:3px solid var(--red); }
.sched-t    { font-size:1.15rem;font-weight:800;color:var(--red);letter-spacing:-.02em; }
.sched-show { font-size:.88rem;font-weight:700;color:#fff;margin-bottom:.15rem; }
.sched-sub  { font-size:.7rem;color:var(--muted);line-height:1.4; }
.badge { font-size:.56rem;font-weight:800;letter-spacing:.1em;padding:.2rem .5rem;border-radius:3px;text-transform:uppercase;white-space:nowrap; }
.badge.ao { background:var(--red);color:#fff; }
.badge.mu { background:rgba(255,255,255,.07);color:var(--muted); }
.badge.no { background:rgba(59,130,246,.15);color:#60a5fa; }
.badge.au { background:rgba(255,255,255,.04);color:#444; }

/* CONTATO */
.contact-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem; }
.contact-item {
  background:var(--card);border:1px solid var(--border);border-radius:10px;
  padding:1.25rem;display:flex;flex-direction:column;gap:.4rem;
  transition:all .15s;text-decoration:none;
}
.contact-item:hover { border-color:var(--red);background:rgba(204,0,0,.05); }
.ci-top   { display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem; }
.ci-icon  { font-size:1.35rem;flex-shrink:0; }
.ci-label { font-size:.6rem;font-weight:800;letter-spacing:.15em;color:var(--red);text-transform:uppercase; }
.ci-val   { font-size:.88rem;font-weight:600;color:#fff;word-break:break-word;line-height:1.3; }
.ci-hint  { font-size:.73rem;color:#888;line-height:1.4; }

/* FOOTER */
footer { background:#090909;border-top:3px solid var(--red); }

.footer-top { display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid #1a1a1a; }
.footer-col { padding:2rem;border-right:1px solid #1a1a1a; }
.footer-col:last-child { border-right:none; }

.footer-brand-name { font-size:1rem;font-weight:900;letter-spacing:-.01em;margin-bottom:.4rem; }
.footer-brand-name span { color:var(--red); }
.footer-tagline { font-size:.75rem;color:#666;line-height:1.6;margin-bottom:1.25rem; }

.footer-social-icons { display:flex;gap:.5rem; }
.footer-social-icons a { width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;text-decoration:none;transition:opacity .15s; }
.footer-social-icons a:hover { opacity:.8; }
.footer-social-icons a.fb { background:#1877f2; }
.footer-social-icons a.ig { background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); }
.footer-social-icons a.yt { background:#ff0000; }
.footer-social-icons a.wa { background:#25d366; }

.footer-col-title { font-size:.68rem;font-weight:800;letter-spacing:.2em;color:var(--red);text-transform:uppercase;margin-bottom:1rem; }

.footer-nav { display:flex;flex-direction:column;gap:.6rem; }
.footer-nav a { font-size:.82rem;color:#888;text-decoration:none;transition:color .15s; }
.footer-nav a:hover { color:#fff; }

.footer-contact-list { display:flex;flex-direction:column;gap:.85rem; }
.footer-contact-list a { display:flex;align-items:center;gap:.6rem;font-size:.8rem;color:#888;text-decoration:none;transition:color .15s; }
.footer-contact-list a:hover { color:#fff; }
.footer-contact-list a.whatsapp:hover { color:#25d366; }

.footer-broadcast { display:flex;flex-direction:column;gap:.5rem; }
.footer-broadcast-item { font-size:.8rem;color:#888;display:flex;align-items:center;gap:.6rem; }
.footer-broadcast-item .dot { width:8px;height:8px;background:var(--red);border-radius:50%;flex-shrink:0;animation:blink 1.2s infinite; }
.footer-broadcast-sub { font-size:.72rem;color:#444;margin-left:1.1rem; }

.footer-bottom { padding:1rem 2rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem; }
.footer-copy    { font-size:.7rem;color:#444; }
.footer-credits { font-size:.7rem;color:#333; }

/* OVERLAY */
#overlay { position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.95);backdrop-filter:blur(14px);display:flex;align-items:center;justify-content:center; }
.overlay-box { text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.1rem; }
.overlay-logo { width:140px;height:140px;border-radius:18px;object-fit:contain;box-shadow:0 10px 48px rgba(204,0,0,.55); }
.overlay-name { font-size:1.35rem;font-weight:900;color:#fff;letter-spacing:-.02em;margin-top:.15rem; }
.overlay-sub  { font-size:.82rem;color:#555; }
.overlay-btn  { background:var(--red);color:#fff;border:none;border-radius:50px;padding:1rem 2.75rem;font-size:1.05rem;font-weight:700;cursor:pointer;font-family:var(--sans);box-shadow:0 4px 32px rgba(204,0,0,.6);transition:all .15s;animation:puls 2s ease-in-out infinite; }
.overlay-btn:hover { background:var(--red2);transform:scale(1.03); }
.overlay-url  { font-size:.68rem;color:#3a3a3a; }

/* RESPONSIVE */
@media (max-width:1200px) {
  .footer-top { grid-template-columns:repeat(2,1fr); }
  .footer-col { border-right:none;border-bottom:1px solid #1a1a1a; }
}
@media (max-width:1100px) {
  .hero { grid-template-columns:1fr;min-height:auto; }
  .hero-right { border-left:none;border-top:1px solid var(--border); }
  .hero-left { padding:2.5rem 1.5rem; }
  .hero-bg { background-size:70%;background-position:center;opacity:.06; }
  .tb-nav { display:none; }
  .tb-vol { display:none; }
  .stats { padding:1.5rem 1rem;grid-template-columns:repeat(2,1fr);gap:1.5rem; }
  .sec { padding:2rem 1.5rem; }
  .hl-grid { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .topbar { padding:0 .85rem;gap:.6rem; }
  .tb-lst { display:none; }
  .hero-h1 { font-size:2.1rem; }
  .sched-row { grid-template-columns:64px 1fr; }
  .badge { display:none; }
  .stats { grid-template-columns:repeat(2,1fr); }
  .footer-top { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column;align-items:flex-start; }
}

/* ── PATROCINADORES ─────────────────────────────────── */
.sec-patrocinadores { padding:1.5rem 2rem; }
.patr-header { text-align:center;margin-bottom:1rem; }
.patr-title { font-size:.6rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);padding:.25rem .75rem;border:1px solid #222;border-radius:20px; }
.patr-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:1rem; }
.patr-card { background:#111;border:1px solid #222;border-radius:10px;overflow:hidden;transition:border-color .2s,transform .2s;text-decoration:none;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;gap:.6rem;height:120px; }
.patr-card:hover { border-color:var(--red);transform:translateY(-3px); }
.patr-card img { width:100%;height:80px;max-height:80px;object-fit:contain;filter:grayscale(20%); }
.patr-card span { font-size:.65rem;font-weight:600;color:var(--muted);text-align:center;letter-spacing:.05em; }
@media(max-width:768px){ .patr-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:480px){ .patr-grid{ grid-template-columns:repeat(2,1fr); } }

/* ── BANNER PRINCIPAL ───────────────────────────────── */
.sec-banner-principal { padding:0 2rem; }
#banner-principal a { display:block;border-radius:12px;overflow:hidden;transition:transform .2s,box-shadow .2s; }
#banner-principal a:hover { transform:translateY(-2px);box-shadow:0 8px 32px rgba(204,0,0,.3); }
#banner-principal img { width:100%;max-height:150px;object-fit:cover;display:block; }
