/* ============================================================
   Portal de Servicios Climáticos (DMC) — Página de tema
   Reutiliza tokens.css + portada.css + catalogo.css
   (breadcrumb, tarjetas .dmc-cat-card, rótulos). Sin CSS inline.
   El color del tema viene de --tema-color (clases .dmc-c-1..12).
   ============================================================ */

.dmc-tema-pg { padding-block: var(--sp-5) var(--sp-7); }

/* Hero del tema */
.dmc-tema-hero { margin-bottom: var(--sp-6); }
.dmc-tema-hero__eyebrow {
  display: inline-block; margin: 0 0 6px;
  border-top: 3px solid var(--tema-color, var(--dmc-azul)); padding-top: 8px;
  font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  color: var(--tema-color, var(--dmc-azul));
}
.dmc-tema-hero__titulo { font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 700; letter-spacing: -.02em; margin: 0 0 var(--sp-2); }
.dmc-tema-hero__desc { font-size: 1.05rem; color: var(--tinta-suave); margin: 0; max-width: 70ch; }

/* Secciones */
.dmc-tema-sec { margin-bottom: var(--sp-7); }
.dmc-tema-sec__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--sp-3); margin-bottom: var(--sp-4); }
.dmc-tema-cta { margin: var(--sp-4) 0 0; }
.dmc-tema-cta .btn { min-height: var(--touch); }

/* Preguntas frecuentes */
.dmc-tema-faq { margin: 0; }
.dmc-tema-faq > div { border: 1px solid var(--linea); border-radius: var(--radio); padding: var(--sp-4); margin-bottom: var(--sp-3); background: #fff; }
.dmc-tema-faq dt { font-weight: 700; font-size: 1rem; margin: 0 0 4px; }
.dmc-tema-faq dd { margin: 0; color: var(--tinta-suave); }

@media print {
  .dmc-header, .dmc-footer, .dmc-navsearch, .dmc-navsesion, .dmc-toggler, .dmc-tema-cta { display: none !important; }
}