/*
Theme Name:   Kadence Child - Endodoncia Exclusiva
Theme URI:    https://endodonciapontevedra.com/
Description:  Tema hijo de Kadence para la landing Endodoncia Exclusiva del Dr. Andrés Domínguez Artime. Cabecera y footer de Kadence en #C7D5E4 con texto #003049.
Author:       Design Media
Template:     kadence
Version:      1.0.2
Text Domain:  kadence-child-endodoncia
*/

/* =========================================================
   CABECERA Y FOOTER DE KADENCE · AJUSTES QUE EL PERSONALIZADOR
   NO CUBRE. Los colores base (fondo #C7D5E4, texto #003049)
   vienen del archivo kadence-export-endodoncia.dat
   ========================================================= */

:root {
  --endo-azul: #003049;
  --endo-azul-hover: #002238;
  --endo-gris: #C7D5E4;
  --endo-blanco: #FFFFFF;
}

/* ---------- Cabecera ---------- */
/* Línea fina bajo la barra, como en el diseño (menú claro) */
.site-main-header-wrap { border-bottom: 1.5px solid rgba(0, 48, 73, .18); }

/* El logo es blanco: se tiñe de #003049 (mismo filtro que el diseño) */
.site-header .custom-logo,
.site-header .site-branding img {
  filter: brightness(0) saturate(100%) invert(13%) sepia(58%) saturate(2470%) hue-rotate(181deg) brightness(93%) contrast(101%);
}

/* Subtítulo «Endodoncia Exclusiva» (descripción corta del sitio) */
.site-header .site-description {
  color: var(--endo-azul);
  font-size: 14px;
  letter-spacing: .06em;
}

/* Menú: enlaces en negrita, como en el diseño */
.main-navigation .primary-menu-container > ul > li > a { font-weight: 700; }

/* «Clínica Dental →» como botón píldora.
   En Apariencia → Menús, añade la clase CSS «endo-nav__clinica» a ese elemento */
.main-navigation .endo-nav__clinica > a {
  border: 2px solid var(--endo-azul);
  border-radius: 999px;
  padding: 10px 18px !important;
  margin-left: 8px;
}
.main-navigation .endo-nav__clinica > a:hover {
  background: var(--endo-azul);
  color: var(--endo-blanco) !important;
}

/* El teléfono solo aparece en el menú móvil.
   Clase CSS del elemento del menú: «endo-nav__solo-movil» */
.main-navigation .endo-nav__solo-movil { display: none; }

/* Tablet y móvil: sin subtítulo, como en el diseño */
@media (max-width: 1024px) {
  .site-header .site-description { display: none; }
}

/* ---------- Footer ---------- */
.site-footer,
.site-footer p,
.site-footer a {
  font-family: 'Century Gothic', 'Questrial', sans-serif;
  font-size: 15px;
  color: var(--endo-azul);
}
.site-footer a:hover { color: var(--endo-azul-hover); text-decoration: underline; }

/* El hueco para la barra fija del móvil ya lo da .endo-page (padding-bottom
   en el <body>), así que el footer no necesita margen extra. */