/* ═══════════════════════════════════════════════════════════
   TEMA: BITÁCORA DE DESPACHO
   Mundo visual: la libreta de salida del chofer + el cuarto de
   despacho de radio. Papel carbón violeta, renglones, esquinas
   redondas (a mano, humano), sellos ovalados girados, encuadernado
   de espiral como acento. Rige TODO el sitio, no solo el hero.
   ═══════════════════════════════════════════════════════════ */

html[data-theme="bitacora"] {
  /* Superficies: papel carbón violeta */
  --bg:        #f3f1f9;
  --bg-2:      #e9e5f3;
  --surface:   #faf9fd;
  --surface-2: #e9e5f3;
  --line:        rgba(43, 33, 66, 0.14);
  --line-strong: rgba(43, 33, 66, 0.26);

  /* Tinta de bolígrafo */
  --blue:        #4a3b8a;
  --blue-deep:   #352a63;
  --blue-bright: #4a3b8a;
  --blue-soft:   rgba(74, 59, 138, 0.08);
  --green:       #1d7a5f;
  --green-bright:#1d7a5f;

  /* Texto */
  --ink:    #211a33;
  --body:   #43394f;
  --muted:  #665c72;

  --console:    #e2ddf0;
  --console-2:  #e9e5f3;
  --console-3:  #efecf7;
  --con-ink:    #211a33;
  --con-body:   rgba(33, 26, 51, 0.86);
  --con-muted:  rgba(33, 26, 51, 0.58);
  --con-line:   rgba(33, 26, 51, 0.14);
  --con-line-2: rgba(33, 26, 51, 0.26);

  --shadow-sm: 0 1px 2px rgba(43, 33, 66, 0.06);
  --shadow-md: 0 8px 22px rgba(43, 33, 66, 0.10);
  --shadow-console: 0 18px 46px rgba(43, 33, 66, 0.16);

  --font-sans: 'Space Grotesk', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;

  /* Todo redondo: a mano, humano, sin filo de oficina */
  --r-btn:   999px;
  --r-card:  20px;
  --r-panel: 22px;
  --r-pill:  999px;
}

/* ── Textura de renglones detrás de todo el sitio ── */
html[data-theme="bitacora"] body {
  background:
    repeating-linear-gradient(180deg, rgba(43, 33, 66, 0.05) 0, rgba(43, 33, 66, 0.05) 1px, transparent 1px, transparent 34px),
    var(--bg);
}

/* ── NAV: encabezado de libreta ── */
html[data-theme="bitacora"] #header {
  background: rgba(243, 241, 249, 0.86);
  border-bottom: 1px solid var(--line);
}
html[data-theme="bitacora"] #header.scrolled {
  background: rgba(243, 241, 249, 0.96);
  box-shadow: 0 1px 20px rgba(43, 33, 66, 0.08);
}
html[data-theme="bitacora"] .btn-nav { box-shadow: 0 3px 10px rgba(74, 59, 138, 0.22); }
html[data-theme="bitacora"] .platform-dot { background: var(--green); }

/* ── HERO: la libreta abierta ── */
html[data-theme="bitacora"] .hero { background: var(--bg); }
html[data-theme="bitacora"] .hero-bg {
  background:
    linear-gradient(160deg, rgba(243, 241, 249, 0.93) 0%, rgba(243, 241, 249, 0.88) 50%, rgba(233, 229, 243, 0.93) 100%),
    url('../images/TransporteFondo.webp') center 30%/cover no-repeat;
  filter: saturate(0.35) sepia(0.06);
}
html[data-theme="bitacora"] .hero-glow { display: none; }
html[data-theme="bitacora"] .hero-scan { display: none; }
html[data-theme="bitacora"] .hero::before {
  background-image: repeating-linear-gradient(180deg, rgba(43, 33, 66, 0.06) 0, rgba(43, 33, 66, 0.06) 1px, transparent 1px, transparent 34px);
  mask-image: radial-gradient(ellipse 85% 80% at 50% 40%, #000 0%, transparent 82%);
  -webkit-mask-image: radial-gradient(ellipse 85% 80% at 50% 40%, #000 0%, transparent 82%);
}

html[data-theme="bitacora"] .hero-statusbar {
  border-top: 1px dashed var(--line-strong);
  border-bottom: 1px dashed var(--line-strong);
  color: var(--muted);
}
html[data-theme="bitacora"] .hsb-coord,
html[data-theme="bitacora"] .hsb-right { color: var(--ink); }

html[data-theme="bitacora"] .hero-badge {
  background: var(--surface);
  border: 1.5px solid var(--ink);
  color: var(--ink);
  transform: rotate(-1.2deg);
}
html[data-theme="bitacora"] .hero-copy h1 { color: var(--ink); }
html[data-theme="bitacora"] .hero-copy h1 em { color: var(--blue); }
html[data-theme="bitacora"] .hero-sub { color: var(--body); }
html[data-theme="bitacora"] .hero-stats .stat strong { color: var(--ink); }
html[data-theme="bitacora"] .hero-stats .stat span { color: var(--muted); }
html[data-theme="bitacora"] .hero-stats .stat-sep { background: var(--line-strong); }

/* ── Botones: sello ovalado girado ── */
html[data-theme="bitacora"] .btn-primary,
html[data-theme="bitacora"] .btn-submit {
  box-shadow: 0 4px 14px rgba(74, 59, 138, 0.25);
}
html[data-theme="bitacora"] .btn-outline {
  border: 1.5px solid var(--ink);
  color: var(--ink);
  background: transparent;
}
html[data-theme="bitacora"] .btn-outline:hover { background: var(--ink); color: var(--bg); }

/* ── SECCIONES ── */
html[data-theme="bitacora"] .section-raised { background: var(--bg-2); }
html[data-theme="bitacora"] .section-header::before {
  content: '';
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}

/* ── BENTO → renglones de bitácora ── */
html[data-theme="bitacora"] .bento-card {
  border: 1px solid var(--line-strong);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
html[data-theme="bitacora"] .bento-card:hover {
  border-color: var(--blue);
  box-shadow: var(--shadow-md);
}
html[data-theme="bitacora"] .bento-tag,
html[data-theme="bitacora"] .bento-ch {
  background: var(--blue-soft);
  color: var(--blue-deep);
}
html[data-theme="bitacora"] .bento-icon {
  background: var(--surface-2);
  color: var(--blue-deep);
}

/* ── SOFTWARE: pizarrón del despacho ── */
html[data-theme="bitacora"] .section-software {
  background: var(--bg-2);
  color: var(--ink);
}
html[data-theme="bitacora"] .software-bg,
html[data-theme="bitacora"] .software-gridlines { display: none; }
html[data-theme="bitacora"] .section-software h2,
html[data-theme="bitacora"] .section-software h3,
html[data-theme="bitacora"] .software-intro h2 { color: var(--ink); }
html[data-theme="bitacora"] .section-software p,
html[data-theme="bitacora"] .software-intro p { color: var(--body); }
html[data-theme="bitacora"] .software-fact { border-left-color: var(--blue); }
html[data-theme="bitacora"] .soft-module {
  background: var(--surface);
  border: 1px solid var(--line-strong);
  box-shadow: var(--shadow-sm);
}
html[data-theme="bitacora"] .soft-module:hover {
  border-color: var(--blue);
  box-shadow: var(--shadow-md);
}
html[data-theme="bitacora"] .soft-module-ch,
html[data-theme="bitacora"] .soft-spec,
html[data-theme="bitacora"] .section-tag {
  background: var(--blue-soft);
  color: var(--blue-deep);
}

/* ── PRODUCTOS: ficha de unidad ── */
html[data-theme="bitacora"] .product-card {
  border: 1px solid var(--line-strong);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
html[data-theme="bitacora"] .product-card:hover {
  border-color: var(--blue);
  box-shadow: var(--shadow-md);
}
html[data-theme="bitacora"] .product-badge {
  background: var(--blue);
  color: #fff;
  transform: rotate(-2deg);
}
html[data-theme="bitacora"] .product-features li { border-bottom: 1px dashed var(--line); padding-bottom: 6px; }

/* ── BANDA DE IMAGEN ── */
html[data-theme="bitacora"] .img-band-overlay {
  background: linear-gradient(100deg, rgba(243, 241, 249, 0.94) 0%, rgba(243, 241, 249, 0.78) 60%, rgba(233, 229, 243, 0.65) 100%);
}
html[data-theme="bitacora"] .img-band-content h3 { color: var(--ink); }
html[data-theme="bitacora"] .img-band-content p  { color: var(--body); }

/* ── CARRUSEL / VIDEOS / MAPA ── */
html[data-theme="bitacora"] .carousel-track-container,
html[data-theme="bitacora"] .video-card,
html[data-theme="bitacora"] .map-container {
  border: 1px solid var(--line-strong);
  box-shadow: var(--shadow-sm);
}
html[data-theme="bitacora"] .video-card:hover { box-shadow: var(--shadow-md); }

/* ── NOSOTROS ── */
html[data-theme="bitacora"] .nosotros-img-wrap,
html[data-theme="bitacora"] .stat-card {
  border: 1px solid var(--line-strong);
  box-shadow: var(--shadow-sm);
}
html[data-theme="bitacora"] .nosotros-img-tag {
  transform: rotate(-1.5deg);
}
html[data-theme="bitacora"] .valor-key { color: var(--blue-deep); }

/* ── CONTACTO ── */
html[data-theme="bitacora"] .contact-form-wrap {
  border: 1px solid var(--line-strong);
  background: var(--surface);
  box-shadow: var(--shadow-md);
}
html[data-theme="bitacora"] .form-group input,
html[data-theme="bitacora"] .form-group select,
html[data-theme="bitacora"] .form-group textarea {
  border: 1px solid var(--line-strong);
  background: var(--bg);
  border-radius: 12px;
}
html[data-theme="bitacora"] .contact-item {
  border: 1px solid var(--line);
}
html[data-theme="bitacora"] .contact-icon {
  background: var(--blue-soft);
  color: var(--blue-deep);
}

/* ── FOOTER ── */
html[data-theme="bitacora"] .footer {
  background: var(--bg-2);
  border-top: 1px dashed var(--line-strong);
  color: var(--body);
}
html[data-theme="bitacora"] .footer h4 { color: var(--ink); }
html[data-theme="bitacora"] .footer-logo-name { color: var(--ink); }
html[data-theme="bitacora"] .footer-links li a,
html[data-theme="bitacora"] .footer-contact p,
html[data-theme="bitacora"] .footer-brand p { color: var(--body); }
html[data-theme="bitacora"] .footer-links li a:hover { color: var(--blue); }
html[data-theme="bitacora"] .footer-bottom {
  border-top: 1px solid var(--line);
  color: var(--muted);
}

/* ── Chat ── */
html[data-theme="bitacora"] .chat-box { border: 1px solid var(--line-strong); }