/*
Theme Name: El Sotano del Conductor
Theme URI: https://elsotanodelconductor.com
Author: El Sotano del Conductor
Description: Tema WordPress adaptado del diseño original de Blogger "El sótano del conductor". Incluye menú con desplegables, hero con animación de carretera en canvas, barra de estadísticas, tarjetas de navegación rápida, grid de entradas estilo tarjeta, vista de entrada individual y un widget de chat con respuestas predefinidas.
Version: 1.0
Requires PHP: 7.4
Text Domain: sotano
*/

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: #090b0e;
  color: #d8dde8;
  font-family: 'Barlow', Arial, sans-serif;
  font-weight: 300;
  line-height: 1.7;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
ul { list-style: none; }

/* ══════════════════════════ NAV ══════════════════════════ */
#sc-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 9999;
  background: rgba(9,11,14,0.92); backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px); border-bottom: 1px solid #1a2030; height: 64px;
}
.sc-nav-inner {
  max-width: 1100px; margin: 0 auto; padding: 0 28px; height: 64px;
  display: flex; align-items: center; justify-content: space-between;
}
.sc-logo { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.sc-logo-icon {
  width: 36px; height: 36px; background: #f5c400; border-radius: 8px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  transition: transform .22s cubic-bezier(.34,1.56,.64,1);
}
.sc-logo:hover .sc-logo-icon { transform: rotate(-8deg) scale(1.1); }
.sc-logo-icon span { font-family: 'Bebas Neue', sans-serif; font-size: 18px; color: #090b0e; line-height: 1; letter-spacing: 1px; }
.sc-logo-text { display: flex; flex-direction: column; gap: 1px; }
.sc-logo-main { font-family: 'Bebas Neue', sans-serif; font-size: 15px; color: #fff; letter-spacing: 2px; line-height: 1; }
.sc-logo-sub { font-family: 'Barlow Condensed', sans-serif; font-size: 13px; color: #f5c400; letter-spacing: 3px; text-transform: uppercase; }

.sc-desktop-nav { display: flex; align-items: center; gap: 2px; }
.sc-desktop-nav ul { display: flex; align-items: center; gap: 2px; }
.sc-desktop-nav > ul > li { position: relative; }
.sc-desktop-nav a, .sc-desktop-nav > ul > li > .sc-nav-btn {
  display: flex; align-items: center; gap: 6px;
  font-family: 'Barlow Condensed', sans-serif; font-size: 14px; letter-spacing: 2px; text-transform: uppercase;
  color: #d8dde8; background: transparent; border: none; cursor: pointer;
  padding: 10px 14px; border-radius: 8px; transition: color .2s, background .2s;
  text-decoration: none; white-space: nowrap;
}
.sc-desktop-nav a:hover, .sc-desktop-nav > ul > li:hover > a { color: #f5c400; background: rgba(245,196,0,0.08); }

.sc-desktop-nav li.menu-item-has-children { position: relative; }
.sc-desktop-nav li.menu-item-has-children > a::after {
  content: ''; display: inline-block; width: 7px; height: 7px; margin-left: 6px;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
}
.sc-dropdown {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%) translateY(-10px);
  background: #0d1117; border: 1px solid #1e2636; border-radius: 16px;
  min-width: 230px; padding: 8px;
  opacity: 0; pointer-events: none; list-style: none;
  transition: opacity .2s, transform .22s cubic-bezier(.34,1.2,.64,1);
  box-shadow: 0 24px 64px rgba(0,0,0,0.8);
}
.sc-dropdown::before {
  content: ''; position: absolute; top: -6px; left: 50%; transform: translateX(-50%);
  border-left: 6px solid transparent; border-right: 6px solid transparent;
  border-bottom: 6px solid #1e2636;
}
li.menu-item-has-children:hover > .sc-dropdown,
li.menu-item-has-children:focus-within > .sc-dropdown {
  opacity: 1; pointer-events: auto; transform: translateX(-50%) translateY(0);
}
.sc-dropdown li a {
  display: flex; align-items: center; gap: 11px;
  padding: 10px 11px; border-radius: 10px;
  font-family: 'Barlow', sans-serif; font-size: 14px; color: #c8cedd;
  text-decoration: none; transition: background .15s, color .15s; text-transform: none; letter-spacing: 0;
}
.sc-dropdown li a:hover { background: rgba(245,196,0,0.07); color: #f5c400; }

/* Hamburguesa */
.sc-hamburger {
  display: none; background: transparent; border: 1px solid #1e2636;
  width: 40px; height: 40px; border-radius: 9px; cursor: pointer;
  align-items: center; justify-content: center; flex-direction: column; gap: 5px; padding: 9px;
  transition: border-color .2s, background .2s;
}
.sc-hamburger:hover { background: rgba(245,196,0,0.07); border-color: rgba(245,196,0,0.3); }
.sc-hamburger span {
  display: block; height: 2px; border-radius: 2px; background: #c8cedd;
  transition: transform .28s cubic-bezier(.645,.045,.355,1), opacity .18s, width .2s;
}
.sc-hamburger span:nth-child(1) { width: 20px; }
.sc-hamburger span:nth-child(2) { width: 14px; }
.sc-hamburger span:nth-child(3) { width: 17px; }
.sc-hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); width: 20px; }
.sc-hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.sc-hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); width: 20px; }

.sc-overlay {
  display: none; position: fixed; inset: 0; z-index: 9997;
  background: rgba(0,0,0,0.75); backdrop-filter: blur(4px);
  opacity: 0; transition: opacity .28s; pointer-events: none;
}
.sc-overlay.sc-open { opacity: 1; pointer-events: auto; }

.sc-drawer {
  display: none; position: fixed; top: 0; right: 0; bottom: 0; z-index: 9998;
  width: min(320px, 92vw); background: #090b0e;
  border-left: 1px solid #1e2636;
  transform: translateX(100%);
  transition: transform .32s cubic-bezier(.32,0,.15,1), visibility 0s linear .32s;
  overflow-y: auto; padding-bottom: 48px;
  pointer-events: none; visibility: hidden;
}
.sc-drawer.sc-open {
  transform: translateX(0); pointer-events: auto; visibility: visible;
  transition: transform .32s cubic-bezier(.32,0,.15,1), visibility 0s linear 0s;
}
.sc-drawer-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 20px; border-bottom: 1px solid #1e2636; height: 64px; flex-shrink: 0;
  position: sticky; top: 0; background: #090b0e; z-index: 1;
}
.sc-drawer-close {
  background: transparent; border: 1px solid #1e2636; width: 36px; height: 36px;
  border-radius: 8px; cursor: pointer; display: flex; align-items: center; justify-content: center;
  color: #8a95a8; font-size: 18px; transition: border-color .2s, color .2s, background .2s;
}
.sc-drawer-close:hover { border-color: #f5c400; color: #f5c400; background: rgba(245,196,0,0.07); }
.sc-drawer-section { padding: 16px 14px 8px; }
.sc-drawer-section-label {
  font-family: 'Barlow Condensed', sans-serif; font-size: 16px; letter-spacing: 3px;
  text-transform: uppercase; color: white; margin-bottom: 6px; padding: 0 6px; display: block;
}
.sc-mob-link {
  display: flex; align-items: center; gap: 13px;
  padding: 11px 10px; border-radius: 11px;
  color: #c8cedd; text-decoration: none; font-size: 15px; font-family: 'Barlow', sans-serif;
  transition: background .15s, color .15s;
}
.sc-mob-link:hover { background: rgba(245,196,0,0.07); color: #f5c400; }
.sc-mob-divider { height: 1px; background: #141820; margin: 8px 14px; }
.sc-mob-cta {
  margin: 12px 14px 0; display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 15px; border-radius: 12px;
  background: #f5c400; color: #090b0e; font-family: 'Barlow Condensed', sans-serif;
  font-size: 15px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  text-decoration: none; transition: background .2s, transform .15s;
}
.sc-mob-cta:hover { background: #ffd740; transform: translateY(-1px); }

@media (max-width: 820px) {
  .sc-desktop-nav { display: none; }
  .sc-hamburger { display: flex; }
  .sc-overlay, .sc-drawer { display: block; }
}

/* ══════════════════════════ HERO ══════════════════════════ */
#hero-section {
  padding-top: 64px; height: 100vh; min-height: 600px;
  position: relative; overflow: hidden; background: #090b0e; z-index: 999;
}
#road-canvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.hero-overlay {
  position: absolute; inset: 0; z-index: 2;
  background: radial-gradient(ellipse 65% 50% at 50% 50%, rgba(9,11,14,0.75) 0%, rgba(9,11,14,0.88) 55%, rgba(9,11,14,0.97) 100%);
}
#hero-titulo {
  position: absolute; top: 0; left: 0; right: 0;
  height: 100vh; min-height: 600px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  z-index: 9999; text-align: center; padding: 0 24px; pointer-events: none;
}
#hero-titulo .hero-eyebrow {
  pointer-events: auto;
  display: inline-flex; align-items: center; gap: 10px;
  background: rgba(245,196,0,0.08); border: 1px solid rgba(245,196,0,0.22);
  border-radius: 100px; padding: 7px 20px; margin-bottom: 60px;
  font-family: 'Barlow Condensed', sans-serif; font-size: 20px; letter-spacing: 3px; text-transform: uppercase; color: #f5c400;
}
.eyebrow-dot { width: 6px; height: 6px; border-radius: 50%; background: #f5c400; animation: pulse 2s ease-in-out infinite; display: inline-block; }
@keyframes pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:0.3; transform:scale(0.7); } }
#hero-titulo .h1-line {
  font-family: 'Bebas Neue', sans-serif; font-size: 110px; line-height: 0.88; letter-spacing: 5px;
  color: #ffffff; display: block;
  text-shadow: 2px 2px 0 #000, -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 0 4px 20px rgba(0,0,0,0.9);
}
#hero-titulo .h1-line.yellow { color: #f5c400; }
#hero-titulo .hero-sub { font-size: 20px; color: white; max-width: 480px; margin: 20px auto 36px; line-height: 1.65; text-shadow: 0 2px 12px rgba(0,0,0,1); }
#hero-titulo .hero-cta {
  pointer-events: auto;
  display: inline-flex; align-items: center; gap: 12px;
  background: #f5c400; color: #090b0e;
  font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase;
  padding: 14px 30px; border-radius: 7px; transition: background 0.2s, transform 0.15s; margin-bottom: 10px;
}
#hero-titulo .hero-cta:hover { background: #ffd740; transform: translateY(-2px); }
.scroll-hint {
  position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%);
  z-index: 9999; display: flex; flex-direction: column; align-items: center; gap: 6px;
  opacity: 0.35; animation: bob 2.2s ease-in-out infinite;
}
@keyframes bob { 0%,100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(7px); } }
.scroll-hint span { font-family: 'Barlow Condensed', sans-serif; font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: #8a95a8; }
.scroll-arrow { width: 18px; height: 18px; border-right: 2px solid #8a95a8; border-bottom: 2px solid #8a95a8; transform: rotate(45deg); }

/* ══════════════════════════ STATS BAR ══════════════════════════ */
#stats-bar { background: #0f1218; border-top: 1px solid #1a2030; border-bottom: 1px solid #1a2030; }
.stats-inner { max-width: 1100px; margin: 0 auto; padding: 0 32px; display: grid; grid-template-columns: repeat(4,1fr); }
.stat-item { padding: 20px 24px; border-right: 1px solid #1a2030; }
.stat-item:last-child { border-right: none; }
.stat-num { font-family: 'Bebas Neue', sans-serif; font-size: 28px; color: #f5c400; line-height:1; display:block; }
.stat-label { font-family: 'Barlow Condensed', sans-serif; font-size: 14px; letter-spacing: 3px; text-transform: uppercase; color: white; display:block; margin-top:3px; }

/* ══════════════════════════ QUICK NAV ══════════════════════════ */
.sc-quick-label { max-width: 1100px; margin: 0 auto; padding: 48px 28px 18px; display: flex; align-items: center; gap: 14px; }
.sc-quick-label-line { flex: 1; height: 1px; background: #1a2030; }
.sc-quick-label span { font-family: 'Barlow Condensed', sans-serif; font-size: 14px; letter-spacing: 4px; text-transform: uppercase; color: #f5c400; white-space: nowrap; }
.sc-quick-nav { max-width: 1100px; margin: 0 auto; padding: 0 28px 48px; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.sc-quick-card {
  display: flex; align-items: center; gap: 14px;
  background: #0f1218; border: 1px solid #1a2030; border-radius: 14px;
  padding: 16px 18px; text-decoration: none; color: inherit;
  position: relative; overflow: hidden;
  transition: border-color .25s, transform .2s, box-shadow .25s;
}
.sc-quick-card::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px;
  background: var(--qc-accent, #f5c400);
  transform: scaleX(0); transform-origin: left; transition: transform .3s ease;
}
.sc-quick-card:hover { border-color: rgba(245,196,0,0.3); transform: translateY(-3px); box-shadow: 0 16px 40px rgba(0,0,0,0.45); }
.sc-quick-card:hover::after { transform: scaleX(1); }
.sc-quick-icon {
  width: 44px; height: 44px; border-radius: 11px;
  background: rgba(245,196,0,0.08); border: 1px solid rgba(245,196,0,0.18);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; flex-shrink: 0; transition: background .2s;
}
.sc-quick-card:hover .sc-quick-icon { background: rgba(245,196,0,0.15); }
.sc-quick-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.sc-quick-title { font-family: 'Bebas Neue', sans-serif; font-size: 20px; letter-spacing: 1px; color: #fff; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-quick-desc { font-family: 'Barlow Condensed', sans-serif; font-size: 14px; color: white; letter-spacing: .5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-quick-arrow { margin-left: auto; flex-shrink: 0; font-size: 16px; color: #3a4458; transition: transform .2s, color .2s; }
.sc-quick-card:hover .sc-quick-arrow { transform: translateX(4px); color: #f5c400; }

/* ══════════════════════════ ENTRADAS - GRID (archive/home) ══════════════════════════ */
.sc-posts-wrap { max-width: 1100px; margin: 0 auto; padding: 0 28px 60px; }
body:not(.home) .sc-posts-wrap { padding-top: 110px; }
.sc-posts-label {
  font-family: 'Barlow Condensed', sans-serif; font-size: 13px; letter-spacing: 4px; text-transform: uppercase; color: #f5c400;
  padding: 48px 0 20px; border-bottom: 1px solid #1a2030; margin-bottom: 28px; display: block;
}
.sc-posts-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.sc-post-card {
  background: #0f1218; border: 1px solid #1a2030; border-radius: 14px;
  overflow: hidden; display: flex; flex-direction: column; position: relative;
  transition: transform .22s, border-color .22s, box-shadow .22s;
}
.sc-post-card:hover { transform: translateY(-5px); border-color: rgba(245,196,0,0.35); box-shadow: 0 20px 48px rgba(0,0,0,0.55); }
.sc-post-card::before {
  content: ''; display: block; position: absolute; bottom: 0; left: 0; right: 0; height: 3px;
  background: #f5c400; transform: scaleX(0); transform-origin: left; transition: transform .3s ease; z-index: 2;
}
.sc-post-card:hover::before { transform: scaleX(1); }
.sc-post-thumb img { width: 100%; height: 150px; object-fit: cover; display: block; }
.sc-post-title {
  font-family: 'Bebas Neue', sans-serif; font-size: 20px; letter-spacing: 1px;
  color: #fff; line-height: 1.2; padding: 14px 18px 0; margin: 0; display: block;
}
.sc-post-title a { color: #fff; text-decoration: none; }
.sc-post-title a:hover { color: #f5c400; }
.sc-post-excerpt {
  font-size: 13px; color: #7a8599; line-height: 1.6; padding: 10px 18px 14px; margin: 0; flex: 1;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.sc-post-footer { display: flex; align-items: center; justify-content: space-between; padding: 10px 18px; border-top: 1px solid #161c28; }
.sc-post-date { font-size: 12px; color: #3a4458; letter-spacing: .5px; }
.sc-post-link { font-family: 'Barlow Condensed', sans-serif; font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase; color: #3a4458; text-decoration: none; transition: color .2s; }
.sc-post-link:hover { color: #f5c400; }
.no-posts-message { color: #7a8599; padding: 20px 0; }

.sc-pagination { display: flex; gap: 10px; justify-content: center; margin-top: 30px; }
.sc-pagination a, .sc-pagination span {
  padding: 8px 16px; border: 1px solid #1a2030; border-radius: 8px; color: #c8cedd;
  font-family: 'Barlow Condensed', sans-serif; font-size: 14px; letter-spacing: 1px;
}
.sc-pagination a:hover { border-color: #f5c400; color: #f5c400; }
.sc-pagination .current { background: #f5c400; color: #090b0e; border-color: #f5c400; }

/* ══════════════════════════ ENTRADA INDIVIDUAL ══════════════════════════ */
.sc-single-wrap { max-width: 760px; margin: 0 auto; padding: 110px 28px 60px; }
.sc-single-title {
  font-family: 'Bebas Neue', sans-serif; font-size: 56px; line-height: 0.95;
  letter-spacing: 2px; color: #fff; margin-bottom: 14px;
}
.sc-single-meta { font-family: 'Barlow Condensed', sans-serif; font-size: 13px; letter-spacing: 2px; text-transform: uppercase; color: #8a95a8; margin-bottom: 24px; }
.sc-single-thumb img { border-radius: 12px; margin-bottom: 32px; width: 100%; }
.sc-single-content { color: #d8dde8; font-size: 17px; line-height: 1.85; }
.sc-single-content h2, .sc-single-content h3 { font-family: 'Bebas Neue', sans-serif; color: #fff; letter-spacing: 1.5px; margin: 32px 0 16px; }
.sc-single-content h2 { font-size: 36px; }
.sc-single-content h3 { font-size: 28px; color: #f5c400; }
.sc-single-content img { border-radius: 8px; margin: 24px 0; }
.sc-single-content a { color: #f5c400; border-bottom: 1px solid rgba(245,196,0,0.3); }
.sc-single-content a:hover { border-bottom-color: #f5c400; }
.sc-single-content blockquote { border-left: 3px solid #f5c400; padding-left: 20px; color: #8a95a8; font-style: italic; margin: 24px 0; }
.sc-single-content p { margin-bottom: 18px; }
.sc-single-content ul, .sc-single-content ol { margin: 0 0 18px 22px; }

/* ══════════════════════════ PÁGINA GENÉRICA ══════════════════════════ */
.sc-page-wrap { max-width: 760px; margin: 0 auto; padding: 110px 28px 60px; color: #d8dde8; }
.sc-page-wrap h1 { font-family: 'Bebas Neue', sans-serif; font-size: 48px; color: #fff; margin-bottom: 24px; letter-spacing: 1.5px; }
.sc-page-wrap h2 { font-family: 'Bebas Neue', sans-serif; font-size: 32px; color: #f5c400; margin: 28px 0 14px; }
.sc-page-wrap p { margin-bottom: 16px; line-height: 1.8; }
.sc-page-wrap a { color: #f5c400; }

/* ══════════════════════════ COMENTARIOS ══════════════════════════ */
.sc-comments { max-width: 760px; margin: 40px auto 0; padding: 0 28px; }
.sc-comments h3 { font-family: 'Bebas Neue', sans-serif; color: #fff; font-size: 26px; margin-bottom: 18px; }
.sc-comments .comment-body { color: #d8dde8; font-size: 15px; }
.sc-comments textarea, .sc-comments input[type="text"], .sc-comments input[type="email"] {
  background: #141b28; border: 1px solid #1e2636; border-radius: 8px; color: #d8dde8;
  padding: 10px 12px; width: 100%; font-family: 'Barlow', sans-serif; margin-bottom: 12px;
}
.sc-comments .submit, .sc-comments input[type="submit"] {
  background: #f5c400; color: #090b0e; border: none; padding: 10px 22px; border-radius: 8px;
  font-family: 'Barlow Condensed', sans-serif; letter-spacing: 1.5px; text-transform: uppercase; cursor: pointer;
}

/* ══════════════════════════ FOOTER ══════════════════════════ */
#footer-custom { background: #0a0c0f; border-top: 1px solid #1a2030; margin-top: 40px; }
.footer-top-line { height: 3px; background: linear-gradient(90deg, transparent 0%, #f5c400 30%, #ff9800 70%, transparent 100%); }
.footer-grid { max-width: 1100px; margin: 0 auto; padding: 52px 32px 32px; display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 48px; }
.footer-brand .fb-title { font-family: 'Bebas Neue', sans-serif; font-size: 26px; color: white; letter-spacing: 2px; margin-bottom: 10px; }
.footer-brand p { font-size: 14px; color: white; line-height: 1.7; max-width: 280px; }
.footer-col h4 { font-family: 'Barlow Condensed', sans-serif; font-size: 14px; letter-spacing: 3px; text-transform: uppercase; color: white; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 1px solid #1a2030; }
.footer-col ul li { margin-bottom: 8px; }
.footer-col ul li a { font-size: 14px; color: white; transition: color 0.2s; }
.footer-col ul li a:hover { color: #f5c400; }
.footer-bottom { max-width: 1100px; margin: 0 auto; padding: 18px 20px; border-top: 1px solid #1a2030; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.footer-copy { font-family: 'Barlow Condensed', sans-serif; font-size: 14px; letter-spacing: 2px; text-transform: uppercase; color: white; }
.footer-legal { font-size: 14px; color: white; background: #0f1218; border: 1px solid #1a2030; padding: 6px 14px; border-radius: 4px; }

/* ══════════════════════════ CHATBOT ══════════════════════════ */
#sc-chat-fab {
  position: fixed; bottom: 28px; right: 24px; z-index: 99990;
  width: 58px; height: 58px; border-radius: 50%; background: #f5c400;
  border: none; cursor: pointer; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 28px rgba(245,196,0,0.45), 0 2px 8px rgba(0,0,0,0.5);
  transition: transform .2s cubic-bezier(.34,1.56,.64,1), box-shadow .2s; outline: none;
}
#sc-chat-fab:hover { transform: scale(1.1); box-shadow: 0 12px 36px rgba(245,196,0,0.55), 0 4px 12px rgba(0,0,0,0.5); }
#sc-chat-fab svg { transition: opacity .2s, transform .2s; position: absolute; }
#sc-chat-fab .fab-close { opacity: 0; transform: rotate(-90deg) scale(.6); }
#sc-chat-fab.sc-open .fab-icon { opacity: 0; transform: rotate(90deg) scale(.6); }
#sc-chat-fab.sc-open .fab-close { opacity: 1; transform: rotate(0deg) scale(1); }
#sc-chat-fab::before {
  content: ''; position: absolute; top: -4px; right: -4px;
  width: 14px; height: 14px; border-radius: 50%; background: #e84040; border: 2px solid #090b0e;
  animation: chatpulse 2s ease-in-out 3;
}
@keyframes chatpulse { 0%,100%{transform:scale(1);opacity:1;} 50%{transform:scale(1.4);opacity:.7;} }
#sc-chat-fab.sc-open::before { display: none; }

#sc-chat-panel {
  position: fixed; bottom: 100px; right: 24px; z-index: 99989;
  width: min(370px, calc(100vw - 32px)); max-height: min(520px, calc(100vh - 130px));
  background: #0d1017; border: 1px solid #1e2636; border-radius: 20px;
  display: flex; flex-direction: column; box-shadow: 0 32px 80px rgba(0,0,0,0.8);
  overflow: hidden; transform: scale(.92) translateY(16px); transform-origin: bottom right;
  opacity: 0; pointer-events: none; transition: opacity .25s, transform .28s cubic-bezier(.34,1.2,.64,1);
}
#sc-chat-panel.sc-open { opacity: 1; pointer-events: auto; transform: scale(1) translateY(0); }
.sc-chat-header { padding: 14px 18px; background: #090b0e; border-bottom: 1px solid #1e2636; display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.sc-chat-avatar { width: 38px; height: 38px; border-radius: 50%; background: #f5c400; display: flex; align-items: center; justify-content: center; font-family: 'Bebas Neue', sans-serif; font-size: 16px; color: #090b0e; flex-shrink: 0; }
.sc-chat-header-name { font-family: 'Bebas Neue', sans-serif; font-size: 17px; letter-spacing: 1px; color: #fff; }
.sc-chat-header-status { font-family: 'Barlow Condensed', sans-serif; font-size: 12px; letter-spacing: 1.5px; color: #4ada94; display: flex; align-items: center; gap: 5px; }
.sc-chat-header-status::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #4ada94; display: inline-block; animation: pulse 2s ease-in-out infinite; }
.sc-chat-messages { flex: 1; overflow-y: auto; padding: 14px 12px; display: flex; flex-direction: column; gap: 8px; scroll-behavior: smooth; }
.sc-chat-messages::-webkit-scrollbar { width: 4px; }
.sc-chat-messages::-webkit-scrollbar-thumb { background: #1e2636; border-radius: 4px; }
.sc-msg { max-width: 88%; padding: 10px 13px; border-radius: 14px; font-size: 13.5px; line-height: 1.6; animation: msgIn .2s ease; }
@keyframes msgIn { from{opacity:0;transform:translateY(6px);} to{opacity:1;transform:translateY(0);} }
.sc-msg.bot { background: #141b28; border: 1px solid #1e2636; color: #d8dde8; border-bottom-left-radius: 4px; align-self: flex-start; }
.sc-msg.bot a { color: #f5c400; text-decoration: underline; }
.sc-msg.user { background: #f5c400; color: #090b0e; font-weight: 600; border-bottom-right-radius: 4px; align-self: flex-end; }
.sc-chips { padding: 0 12px 8px; display: flex; flex-wrap: wrap; gap: 6px; flex-shrink: 0; }
.sc-chip { font-family: 'Barlow Condensed', sans-serif; font-size: 12px; letter-spacing: .5px; background: transparent; border: 1px solid #2a3448; color: #8a95a8; padding: 5px 11px; border-radius: 100px; cursor: pointer; transition: border-color .18s, color .18s, background .18s; }
.sc-chip:hover { border-color: rgba(245,196,0,0.4); color: #f5c400; background: rgba(245,196,0,0.06); }
.sc-chat-input-row { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid #1e2636; background: #090b0e; flex-shrink: 0; }
#sc-chat-input { flex: 1; background: #141b28; border: 1px solid #1e2636; border-radius: 10px; padding: 9px 13px; font-family: 'Barlow', sans-serif; font-size: 14px; color: #d8dde8; outline: none; transition: border-color .2s; resize: none; }
#sc-chat-input::placeholder { color: #3a4458; }
#sc-chat-input:focus { border-color: rgba(245,196,0,0.4); }
#sc-chat-send { width: 40px; height: 40px; border-radius: 10px; background: #f5c400; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; align-self: flex-end; transition: background .18s, transform .15s; }
#sc-chat-send:hover { background: #ffd740; transform: scale(1.07); }

/* ══════════════════════════ RESPONSIVE ══════════════════════════ */
@media (max-width: 820px) {
  #hero-titulo .h1-line { font-size: 70px; }
  .stats-inner { grid-template-columns: repeat(2,1fr); padding: 0 20px; }
  .stat-item:nth-child(2) { border-right: none; }
  .stat-item:nth-child(3) { border-top: 1px solid #1a2030; }
  .stat-item:nth-child(4) { border-top: 1px solid #1a2030; border-right: none; }
  .footer-grid { grid-template-columns: 1fr; gap: 24px; padding: 36px 20px 24px; }
  .footer-bottom { padding: 14px 20px; flex-direction: column; text-align: center; }
  .sc-quick-nav { grid-template-columns: 1fr 1fr; padding: 0 16px 36px; }
  .sc-quick-label { padding: 36px 16px 14px; }
  .sc-posts-grid { grid-template-columns: repeat(2, 1fr); }
  .sc-posts-wrap { padding: 0 16px 48px; }
  .sc-single-title { font-size: 42px; }
}
@media (max-width: 560px) {
  #hero-titulo .h1-line { font-size: 52px; }
  .sc-nav-inner { padding: 0 16px; }
  #hero-titulo .hero-eyebrow { margin-bottom: 25px; }
  .sc-quick-nav { grid-template-columns: 1fr; }
  .sc-posts-grid { grid-template-columns: 1fr; }
  #sc-chat-panel { right: 12px; bottom: 90px; }
  #sc-chat-fab { right: 16px; bottom: 20px; }
}