/* ============================================================
   STARLINK.CSS — Tema oscuro, blanco y negro puro, minimalista.
   Se carga DESPUÉS de style.css y neutraliza el turquesa.
   ============================================================ */

:root{
  --site-primary:#f4f4f4;
  --site-primary-deep:#ffffff;
  --site-accent:#ffffff;
  --site-accent-soft:rgba(255,255,255,.12);
  --site-surface:#101010;
  --site-text:#f2f2f2;
  --site-text-muted:#9a9a9a;
  --site-border:rgba(255,255,255,.14);
  --site-shadow:0 24px 60px rgba(0,0,0,.6);
  --site-gradient:linear-gradient(135deg,#161616 0%,#2a2a2a 55%,#3a3a3a 100%);
}

/* ---------- Base ---------- */
html,body{background:#000 !important;color:#e9e9e9 !important;}
body a{color:#ffffff;}
h1,h2,h3,h4,h5{color:#ffffff !important;}
p,li,span,blockquote,figcaption,label,td,th{color:inherit;}
.site-section,section.site-section,.section-separator,.noticia-detail-section,
.xp-section,.noticias-section,.proyectos-section,.libros-section,.page-section,
.trabajos-section,.archive-section{background-color:#000 !important;}
::selection{background:#fff;color:#000;}

/* ---------- Navegación antigua (sustituida por .mini-nav en menu.php) ---------- */
.site-header,.site-navigation,.site-nav-shell{
  background:rgba(0,0,0,.72) !important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.08) !important;box-shadow:0 10px 40px rgba(0,0,0,.5) !important;}
.site-logo a{color:#fff !important;letter-spacing:.02em;}
.premium-nav-list a,.nav-section-item a,.navbar-nav a{color:#cfcfcf !important;}
.premium-nav-list a:hover,.nav-section-item a:hover,.navbar-nav a:hover{color:#fff !important;}
.nav-section-item.active a,.premium-nav-list a.active,.nav-section-item a[data-active="true"]{color:#fff !important;}
.nav-section-item.active a::after,.premium-nav-list a.active::after{background:#fff !important;}
.nav-contact-item a{background:#fff !important;color:#000 !important;border-radius:999px !important;
  border:1px solid #fff !important;padding:10px 22px !important;}
.nav-contact-item a:hover{background:transparent !important;color:#fff !important;}
.navbar-toggle .icon-bar{background:#fff !important;}
.mobile-menu-button{background:#fff !important;color:#000 !important;}
.mobile-menu-dropdown{background:#0a0a0a !important;border-color:rgba(255,255,255,.1) !important;}
.mobile-menu-link{color:#e0e0e0 !important;border-color:rgba(255,255,255,.08) !important;}
.mobile-menu-link-contact{color:#000 !important;background:#fff !important;}

/* ---------- Botones globales ---------- */
.btn{background:#fff !important;color:#000 !important;border:1px solid #fff !important;
  border-radius:999px !important;box-shadow:none !important;transition:all .2s ease;}
.btn:hover{background:transparent !important;color:#fff !important;transform:translateY(-2px);}
.btn-inverted{background:transparent !important;color:#fff !important;border:1px solid rgba(255,255,255,.4) !important;}
.btn-inverted:hover{background:#fff !important;color:#000 !important;border-color:#fff !important;}

/* ---------- Citas cinematográficas ---------- */
.section-quote-cinematic,.section-background,.section-me-contacto,
.section-quote,.section-twitter{background:#080808 !important;}
.section-quote-cinematic::before,.section-background::before,.background-overlay::before{
  background:none !important;opacity:0 !important;}
.quote-cinematic-card{background:#0e0e0e !important;border:1px solid rgba(255,255,255,.1) !important;
  border-radius:24px !important;box-shadow:none !important;}
.quote-cinematic-card::before{background:none !important;opacity:0 !important;}
.quote-cinematic-card-cta{background:#0e0e0e !important;}
.quote-cinematic-card-cta p{color:#b8b8b8 !important;}
.section-quote-proyectos.background-overlay:before,.section-quote-proyectos:before{background:none !important;opacity:0 !important;}
.quote-cinematic-body,.quote-cinematic-body p{color:#f0f0f0 !important;}
.quote-cinematic-body span{color:#fff !important;background:none !important;
  -webkit-text-fill-color:#fff !important;text-shadow:none !important;}
.quote-cinematic-mark{color:rgba(255,255,255,.18) !important;}
.quote-cinematic-cite{color:#bdbdbd !important;}
.section-twitter .rectangle,.section-twitter i{color:#fff !important;}

/* ---------- Subtítulos / kickers / eyebrows ---------- */
.section-subtitle span,.section-subtitle{color:#9a9a9a !important;background:transparent !important;box-shadow:none !important;}
.section-subtitle span::before,.section-subtitle span::after{background:rgba(255,255,255,.25) !important;}
.books-kicker,.xp-kicker,.noticia-section-eyebrow,.hero-noticias-kicker{color:#8f8f8f !important;}
.xp-archive-link,.hero-noticias .btn-ver-mas-noticias,.xp-archive-link:hover{color:#fff !important;}

/* ---------- Proyectos ---------- */
.section-works,#proyectos{background:#000 !important;}
.portfolio-sorting li a{color:#bfbfbf !important;border:1px solid rgba(255,255,255,.16) !important;
  border-radius:999px !important;background:transparent !important;}
.portfolio-sorting li a.active,.portfolio-sorting li a:hover{background:#fff !important;color:#000 !important;border-color:#fff !important;}
.project-card,.project-card-wrapper .project-card{background:#111 !important;
  border:1px solid rgba(255,255,255,.1) !important;border-radius:22px !important;box-shadow:none !important;}
.project-card:hover{border-color:rgba(255,255,255,.28) !important;transform:translateY(-4px);}
.project-card-title,.project-card h3{color:#fff !important;}
.project-card-description,.project-card p{color:#a2a2a2 !important;}
.project-card-tag{background:rgba(255,255,255,.06) !important;color:#c8c8c8 !important;
  border:1px solid rgba(255,255,255,.14) !important;}
.project-card-cta,.project-card-cta i{color:#fff !important;}
.project-card-image img{filter:grayscale(1) contrast(1.02);transition:filter .35s ease;}
.project-card:hover .project-card-image img{filter:grayscale(0);}

/* ---------- Libros ---------- */
.section-books,.section-clients-timeline,.books-container,
.books-container.section-clients-timeline{background:#000 !important;background-image:none !important;}
.books-hero{background:#0d0d0d !important;border:1px solid rgba(255,255,255,.1) !important;box-shadow:none !important;}
.book-card{background:#111 !important;border:1px solid rgba(255,255,255,.1) !important;
  border-radius:18px !important;box-shadow:none !important;}
.book-card:hover{border-color:rgba(255,255,255,.28) !important;}
.book-card-title{color:#fff !important;}
.book-card-placeholder{background:#161616 !important;color:#555 !important;}
.book-counter{background:#141414 !important;background-image:none !important;color:#fff !important;
  border:1px solid rgba(255,255,255,.16) !important;box-shadow:none !important;}
.book-counter span,#count{color:#fff !important;}
.book-card-image img{filter:grayscale(1);transition:filter .35s ease;}
.book-card:hover .book-card-image img{filter:grayscale(0);}
.pagination-button{background:#111 !important;color:#ddd !important;border:1px solid rgba(255,255,255,.14) !important;}
.pagination-button.active,.pagination-button:hover{background:#fff !important;color:#000 !important;}

/* ---------- Experiencia (timeline) ---------- */
.xp-section{background:#000 !important;}
.xp-title{color:#fff !important;}
.xp-sub{color:#9a9a9a !important;}
.xp-card,.xp-item,.xp-entry{background:#111 !important;border:1px solid rgba(255,255,255,.1) !important;border-radius:16px !important;}
.xp-timeline::before,.xp-line,.xp-dot{background:rgba(255,255,255,.2) !important;}
.xp-role,.xp-company,.xp-empresa{color:#fff !important;}
.xp-date,.xp-period,.xp-meta{color:#8f8f8f !important;}

/* ---------- Contacto ---------- */
.section-contact{background:#000 !important;}
.contact-premium-shell{background:#0e0e0e !important;border:1px solid rgba(255,255,255,.1) !important;border-radius:24px !important;}
.contact-premium-form .form-control,.form-control{background:#161616 !important;color:#f0f0f0 !important;
  border:1px solid rgba(255,255,255,.16) !important;border-radius:12px !important;}
.form-control::placeholder{color:#7a7a7a !important;}
.form-control:focus{border-color:#fff !important;box-shadow:none !important;}

/* ---------- Footer ---------- */
.site-footer{background:#050505 !important;border-top:1px solid rgba(255,255,255,.08) !important;}
.site-footer a{color:#bdbdbd !important;}
.site-footer a:hover{color:#fff !important;}
.site-footer .rectangle{background:#fff !important;color:#000 !important;}
.copyright,.copyright a{color:#7f7f7f !important;}

/* ---------- Páginas de noticia ---------- */
.noticia-detail-section{background:#000 !important;}
.noticia-back-link,.noticia-back-text{color:#bdbdbd !important;}
.noticia-back-link:hover{color:#fff !important;}
.noticia-detail-title{color:#fff !important;}
.noticia-meta,.noticia-fecha-completa,.noticia-fecha-corta,.noticia-separador{color:#8f8f8f !important;}
.noticia-detail-contenido{color:#d6d6d6 !important;}
.noticia-detail-contenido h2,.noticia-detail-contenido h3,.noticia-detail-contenido h4{color:#fff !important;}
.noticia-detail-contenido p,.noticia-detail-contenido li{color:#d0d0d0 !important;}
.noticia-detail-contenido a{color:#fff !important;text-decoration:underline;}
.noticia-detail-contenido strong{color:#fff !important;}
.noticia-detail-contenido blockquote{border-left:3px solid rgba(255,255,255,.3) !important;color:#c8c8c8 !important;background:#0d0d0d !important;}
.noticia-firma{border-color:rgba(255,255,255,.12) !important;}
.noticia-firma p{color:#e8e8e8 !important;}
.noticia-faq-item{background:#111 !important;border:1px solid rgba(255,255,255,.1) !important;border-radius:14px !important;}
.noticia-faq-item h3{color:#fff !important;}
.noticia-faq-respuesta,.noticia-faq-respuesta p{color:#b8b8b8 !important;}
.noticia-related-card{background:#111 !important;border:1px solid rgba(255,255,255,.1) !important;border-radius:16px !important;}
.noticia-related-card h3 a{color:#fff !important;}
.noticia-related-date{color:#8f8f8f !important;}
.noticia-related-link{color:#cfcfcf !important;}
.noticia-related-image img,.noticia-detail-imagen img{filter:grayscale(1);transition:filter .35s ease;}
.noticia-related-card:hover .noticia-related-image img,.noticia-detail-imagen:hover img{filter:grayscale(0);}
.noticia-declaracion-eyebrow{color:#8f8f8f !important;}

/* ---------- Hero derecha (novedades) por si aparece en otras vistas ---------- */
.hero-noticia-item{background:#111 !important;border-color:rgba(255,255,255,.1) !important;}
.hero-noticia-titulo-link,.hero-noticias-title{color:#fff !important;}
.hero-noticia-texto,.hero-noticias-intro{color:#a0a0a0 !important;}

/* ---------- Contenedores con blanco hardcodeado (rgba(255,255,255,.94)) ---------- */
.noticia-detail-content{background:transparent !important;border:none !important;box-shadow:none !important;}
.noticia-detail-header,.noticia-detail-title-section{background:transparent !important;box-shadow:none !important;}
.noticias-page-container,.proyecto-detail-container,.trabajo-detail-container,
.book-detail-image,.book-detail-description,.proyecto-card,.trabajo-card,
.timeline-panel,.portfolio-item,.service,.skill,.resume,.project,.contact-form{
  background:#0d0d0d !important;border:1px solid rgba(255,255,255,.1) !important;box-shadow:none !important;}
.proyecto-detail-title,.trabajo-detail-title,.book-detail-title,.project-title{color:#fff !important;}
.proyecto-detail-content,.trabajo-detail-content,.book-detail-description,.project-description{color:#b8b8b8 !important;}
.noticia-detail-contenido code{background:#161616 !important;color:#e8e8e8 !important;}
.noticia-detail-contenido blockquote{color:#c8c8c8 !important;}
.rectangle,.big-rectangle{border-color:rgba(255,255,255,.4) !important;box-shadow:none !important;color:#fff !important;}

/* ---------- Azul del hover global ----------
   El tema viejo trae `a:hover,a:focus{color:#005b85}`. Con la pseudoclase pesa
   más (0,1,1) que casi todas las clases del sitio, así que cualquier enlace que
   no repitiese su color se volvía azul al pasar el ratón. Aquí se cambia por
   blanco desde la capa negra: quien defina su propio hover sigue mandando. */
a:hover,a:focus{color:#fff;}

/* ---------- Listados genéricos (noticias/proyectos/libros/trabajos) ---------- */
.archive-title,.page-title,.listing-title{color:#fff !important;}
.card,.grid-item,.listing-card{background:#111 !important;border:1px solid rgba(255,255,255,.1) !important;}

/* ============================================================
   TRAYECTORIA (línea de tiempo) — capa negra
   El tema viejo la pintaba en blanco con cian (--site-accent). Aquí se
   reescribe entera en blanco y negro: la chapa del año era texto oscuro
   sobre pastilla blanca (ilegible) y el «Actualidad» salía en cian, que
   es justo lo que la regla de diseño prohíbe sobre negro.
   ============================================================ */
.xp-kicker{background:rgba(255,255,255,.06) !important;color:#8f8f8f !important;}
.xp-kicker::before{background:#fff !important;box-shadow:none !important;}
.xp-archive-link{border-bottom-color:rgba(255,255,255,.28) !important;}
.xp-archive-link:hover{border-bottom-color:#fff !important;}

.xp-timeline::before{background:rgba(255,255,255,.14) !important;}

.xp-year{margin:26px 0 18px !important;}
.xp-year span{
  background:transparent !important;border:0 !important;box-shadow:none !important;
  color:#6f6f6f !important;font-size:.78rem !important;font-weight:700 !important;
  letter-spacing:.18em !important;padding:0 !important;
}
.xp-year::before{
  background:#000 !important;border:2px solid rgba(255,255,255,.28) !important;
  width:10px !important;height:10px !important;left:-33px !important;
}

.xp-node{
  background:#000 !important;border:2px solid rgba(255,255,255,.28) !important;
  box-shadow:none !important;width:10px !important;height:10px !important;
  left:-33px !important;top:34px !important;
}
.xp-item--current .xp-node{background:#fff !important;border-color:#fff !important;animation:none !important;}

/* La tarjeta entera es un enlace a la ficha. */
a.xp-card{display:block;text-decoration:none !important;color:inherit !important;}
.xp-card{
  background:#0d0d0d !important;border:1px solid rgba(255,255,255,.1) !important;
  border-radius:18px !important;box-shadow:none !important;padding:22px 24px !important;
}
.xp-card:hover{
  transform:none !important;border-color:rgba(255,255,255,.3) !important;
  background:#131313 !important;box-shadow:none !important;
}
.xp-item--current .xp-card{border-color:rgba(255,255,255,.22) !important;box-shadow:none !important;}

.xp-card-head{display:flex !important;align-items:center !important;gap:14px !important;}
/* Cada logo trae su propia pastilla cuadrada (fondo blanco o negro según el
   logo), así que aquí la caja no pinta fondo ni deja aire: si lo hacía, los
   logos claros —CabiTrans, Taxibac, Limpieza.app— desaparecían sobre blanco. */
.xp-logo{
  width:52px !important;height:52px !important;border-radius:12px !important;
  background:transparent !important;border:1px solid rgba(255,255,255,.12) !important;
  padding:0 !important;overflow:hidden !important;
}
.xp-logo img{width:100% !important;height:100% !important;max-width:none !important;max-height:none !important;object-fit:cover !important;}
.xp-company{font-size:1.08rem !important;font-weight:700 !important;color:#fff !important;}
.xp-role{margin:3px 0 0 !important;font-size:.9rem !important;font-weight:500 !important;color:#9a9a9a !important;}
.xp-current-badge{
  background:rgba(255,255,255,.1) !important;border:0 !important;color:#d8d8d8 !important;
  font-size:.66rem !important;font-weight:700 !important;letter-spacing:.12em !important;
  padding:5px 10px !important;align-self:center !important;
}
.xp-desc{color:#9a9a9a !important;font-size:.94rem !important;line-height:1.65 !important;margin:14px 0 0 !important;}
.xp-meta{
  display:flex !important;flex-wrap:wrap !important;align-items:center !important;gap:8px !important;
  margin:14px 0 0 !important;padding:12px 0 0 !important;
  border-top:1px solid rgba(255,255,255,.08) !important;
  color:#6f6f6f !important;font-size:.82rem !important;font-weight:500 !important;
}
.xp-meta-sep{color:#4a4a4a !important;}
.xp-meta-mas{margin-left:auto;color:#8f8f8f !important;font-weight:600 !important;}
.xp-card:hover .xp-meta-mas{color:#fff !important;}
@media(max-width:600px){
  .xp-node,.xp-year::before{left:-25px !important;}
  .xp-card{padding:18px !important;}
  .xp-logo{width:44px !important;height:44px !important;}
  .xp-meta-mas{margin-left:0;width:100%;}
}