/* Dr. Iohan Fernández · estilos propios sobre YOOtheme (propuesta A) */

:root{
  --ihf-teal:#3FE0C5;
  --ihf-teal-dim:rgba(63,224,197,.14);
  --ihf-steel:#B7C7D6;
  --ihf-muted:#8FA3B8;
  --ihf-line:rgba(183,199,214,.16);
  --ihf-bg-3:#15304D;
  --ihf-mono:'JetBrains Mono',Consolas,monaco,monospace;
}

/* Etiquetas en monoespaciada (kickers, niveles L4–L5, años) */
.ihf-kicker{display:block;font-family:var(--ihf-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ihf-teal);margin-bottom:10px}
.ihf-kicker--muted{color:var(--ihf-muted)}
.ihf-teal{color:var(--ihf-teal)}
.el-meta.uk-text-meta,.uk-text-meta{font-family:var(--ihf-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ihf-teal)}

/* Titulares más apretados, como en la propuesta */
h1,h2,h3,.uk-h1,.uk-h2,.uk-h3,.uk-heading-large,.uk-heading-medium{letter-spacing:-.02em}

/* Franja de autoridad bajo el hero */
.ihf-proof .el-item{border-top:1px solid var(--ihf-line);padding-top:18px}
.ihf-proof .el-title{font-size:15px;margin-bottom:4px}
.ihf-proof .el-content{font-size:13.5px;color:var(--ihf-muted);line-height:1.45}

/* Tarjetas */
.uk-card-default{transition:border-color .2s,transform .2s}
.uk-card-default.uk-card-hover:hover{transform:translateY(-3px)}

/* Línea de tiempo del doctor: elemento Description List (Stacked, meta arriba) con la clase ihf-timeline */
.ihf-timeline{list-style:none;padding-left:26px;border-left:1px solid var(--ihf-line);margin:30px 0 0}
.ihf-timeline > li{position:relative;margin:0 0 18px}
.ihf-timeline.uk-list > li:nth-child(n+2){margin-top:0}
.ihf-timeline > li::before{content:"";position:absolute;left:-31px;top:8px;width:9px;height:9px;border-radius:50%;background:var(--ihf-teal);box-shadow:0 0 0 4px #10263F}
.ihf-timeline .el-meta.uk-text-meta.uk-text-meta{display:block;font-family:var(--ihf-mono);font-size:12px;letter-spacing:.14em;color:var(--ihf-muted)}
.ihf-timeline .el-title{color:#fff;font-weight:700}
.ihf-timeline .el-content{color:var(--ihf-muted);font-size:15px}

/* Innovación: cifra grande */
.ihf-big{font-family:'Sora',sans-serif;font-size:40px;font-weight:300;color:var(--ihf-teal);letter-spacing:-.03em;line-height:1}
.ihf-big small{font-size:14px;color:var(--ihf-muted);font-family:var(--ihf-mono);letter-spacing:.1em;margin-left:8px}

/* Podcast: lista de episodios */
.ihf-ep{list-style:none;padding:0;margin:22px 0;display:grid;gap:10px}
.ihf-ep li{display:flex;gap:14px;align-items:center;padding:12px 14px;border:1px solid var(--ihf-line);border-radius:10px;font-size:15px}
.ihf-ep .play{width:34px;height:34px;border-radius:50%;border:1px solid var(--ihf-teal);color:var(--ihf-teal);display:grid;place-items:center;flex:none}
.ihf-ep .tag{margin-left:auto;font-family:var(--ihf-mono);font-size:12px;color:var(--ihf-muted)}

/* Contacto */
.ihf-info{display:grid;grid-template-columns:auto 1fr;gap:12px 24px;margin:26px 0}
.ihf-info dt{font-family:var(--ihf-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ihf-muted);padding-top:4px}
.ihf-info dd{margin:0}
.ihf-map{aspect-ratio:16/8;border-radius:14px;border:1px solid var(--ihf-line);background:repeating-linear-gradient(0deg,transparent 0 39px,var(--ihf-line) 39px 40px),repeating-linear-gradient(90deg,transparent 0 39px,var(--ihf-line) 39px 40px),#0A1A2F;display:grid;place-items:center;color:var(--ihf-muted);font-family:var(--ihf-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
@media (max-width:639px){.ihf-info{grid-template-columns:1fr}}

/* Botón flotante de WhatsApp */
.ihf-wa{position:fixed;right:22px;bottom:22px;z-index:980;background:#25D366;color:#06301A;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;box-shadow:0 10px 30px rgba(0,0,0,.35);transition:transform .2s}
.ihf-wa:hover{color:#06301A;transform:scale(1.06)}

/* Columna vertebral del hero (elemento firma) */
.spine-fig{position:relative;max-width:380px;margin:0 auto}
.spine-fig svg{width:100%;height:auto;display:block}
.spine-fig .axis{fill:none;stroke:var(--ihf-steel);stroke-width:1.2;stroke-dasharray:1400;stroke-dashoffset:1400;animation:ihf-draw 2.2s cubic-bezier(.6,0,.2,1) .2s forwards;opacity:.55}
.spine-fig .vert{fill:var(--ihf-bg-3);stroke:var(--ihf-steel);stroke-width:1;opacity:0;animation:ihf-pop .5s ease forwards;transform-origin:center;transform-box:fill-box;cursor:pointer;transition:fill .35s ease,stroke .35s ease}
.spine-fig .disc{fill:var(--ihf-teal);opacity:0;animation:ihf-pop .5s ease forwards}
.spine-fig g.region:hover .vert,.spine-fig g.region:focus-within .vert{fill:var(--ihf-teal-dim);stroke:var(--ihf-teal)}
.spine-fig .lbl{font:500 11px var(--ihf-mono);fill:var(--ihf-muted);letter-spacing:.12em;opacity:0;animation:ihf-fade .6s ease 1.9s forwards}
.spine-fig .tick{stroke:var(--ihf-line);stroke-width:1}
.spine-fig .hit{fill:transparent;pointer-events:all}
.spine-tip{text-align:center;font-size:13px;color:var(--ihf-muted);min-height:44px;margin-top:6px}
.spine-tip strong{color:#fff}
@keyframes ihf-draw{to{stroke-dashoffset:0}}
@keyframes ihf-pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}
@keyframes ihf-fade{to{opacity:1}}
@media (prefers-reduced-motion:reduce){
  .spine-fig .axis{animation:none;stroke-dashoffset:0}
  .spine-fig .vert,.spine-fig .disc,.spine-fig .lbl{animation:none;opacity:1}
}
@media (max-width:959px){.spine-fig{max-width:300px}}

/* Botón primario dentro de tarjetas: UIkit lo invierte a blanco; lo devolvemos al teal */
.uk-card.uk-card-default .uk-button-primary.uk-button-primary{background-color:#3FE0C5;color:#07141F;border-color:transparent}
.uk-card.uk-card-default .uk-button-primary.uk-button-primary:hover{background-color:#5CEBD3;color:#07141F}
.uk-card.uk-card-default .uk-button-default.uk-button-default{background:transparent;color:#E8EEF5;border-color:#22384F}
.uk-card.uk-card-default .uk-button-default.uk-button-default:hover{border-color:#3FE0C5;color:#3FE0C5}

/* Botón "Solicitar cita" dentro del menú: el navbar le impone 72px de alto y color teal al texto */
.uk-navbar-nav > li > a.btn-navbar{min-height:0;line-height:44px;padding:0 20px;margin-left:10px;color:#07141F;border-radius:999px;font-weight:600}
.uk-navbar-nav > li > a.btn-navbar:hover,.uk-navbar-nav > li.uk-active > a.btn-navbar{color:#07141F;background-color:#5CEBD3}

/* Kickers escritos como párrafo en el builder: sin margen extra */
.el-text p > .ihf-kicker{margin-bottom:0}
.el-text:has(> p > .ihf-kicker:only-child){margin-bottom:10px}
.el-text:has(> p > .ihf-kicker:only-child) p{margin:0}

/* Fondos y líneas divisorias de la propuesta A */
.ihf-line-top{border-top:1px solid var(--ihf-line)}
.ihf-line-bottom{border-bottom:1px solid var(--ihf-line)}
.ihf-hero{position:relative;overflow:hidden}
.ihf-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(900px 500px at 85% 20%,rgba(63,224,197,.10),transparent 60%),linear-gradient(180deg,transparent,rgba(16,38,63,.6))}
.ihf-hero > .uk-container{position:relative}
/* Caja del podcast alineada con la retícula: se dibuja dentro del padding del contenedor */
.ihf-pod > .uk-container{position:relative;--ihf-gut:15px}
@media (min-width:640px){.ihf-pod > .uk-container{--ihf-gut:30px}}
@media (min-width:960px){.ihf-pod > .uk-container{--ihf-gut:40px}}
.ihf-pod > .uk-container::before{content:"";position:absolute;top:0;bottom:0;left:var(--ihf-gut);right:var(--ihf-gut);background:linear-gradient(135deg,#15304D,#10263F);border:1px solid var(--ihf-line);border-radius:20px;pointer-events:none}
.ihf-pod > .uk-container > *{position:relative;padding:40px}
@media (max-width:639px){.ihf-pod > .uk-container > *{padding:24px}.ihf-pod > .uk-container::before{border-radius:14px}}

/* Formulario de cita (módulo mod_ihfcita): campo trampa oculto para robots */
.ihf-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.ihf-hp + .uk-margin{margin-top:0!important}

/* Desplegables: la lista nativa de opciones salía blanca con texto blanco en Windows */
.uk-select{color-scheme:dark}
.uk-select option,.uk-select optgroup{background-color:#10263F;color:#E8EEF5}

/* Sección de contacto: mapa de Google en oscuro y, en móvil/tablet, el formulario antes que la dirección */
#contacto iframe[src*="google.com/maps"]{display:block;border:0!important;border-radius:14px;filter:invert(.9) hue-rotate(180deg) saturate(.85) brightness(.95)}
@media (max-width:959px){#contacto .uk-grid > :nth-child(2){order:-1}}

/* Banner de las páginas interiores (sección con clase header + elemento Overlay) */
.header .uk-position-center-left,.header .uk-position-center-left > div{width:100%;max-width:860px}
.header picture > img.el-image{height:380px;object-fit:cover}
@media (max-width:639px){.header .el-image{object-position:76% center}}

/* Botón "Solicitar cita" del menú centrado en vertical (antes se hacía con jQuery desde el personalizador) */
.uk-navbar-nav > li:has(> a.btn-navbar){display:flex;align-items:center}

/* Línea superior del pie */
footer{border-top:1px solid #3fe0c54f}

/* Avisos de contenido pendiente de entregar por el cliente: buscar "ihf-pendiente" antes de publicar */
.ihf-pendiente{border:1px dashed var(--ihf-teal);border-radius:10px;padding:10px 14px;color:var(--ihf-teal);font-family:var(--ihf-mono);font-size:12.5px;letter-spacing:.02em}

/* Tratamientos (plantilla YOOtheme «Tratamiento»): pasos numerados 01, 02… y ficha rápida */
.ihf-pasos{counter-reset:ihf-paso}
.ihf-pasos > li{counter-increment:ihf-paso}
.ihf-pasos .el-title::before{content:counter(ihf-paso,decimal-leading-zero);display:block;font-family:var(--ihf-mono);font-size:12px;letter-spacing:.14em;color:var(--ihf-teal);margin-bottom:6px}
.ihf-ficha .el-title{color:var(--ihf-muted);font-weight:400}
/* Condiciones (plantilla «Condición»): tarjetas de diagnóstico y tratamiento numeradas 01, 02… */
.ihf-numerada{counter-reset:ihf-card}
.ihf-numerada .el-item{counter-increment:ihf-card}
.ihf-numerada .el-title::before{content:counter(ihf-card,decimal-leading-zero);display:block;font-family:var(--ihf-mono);font-size:12px;letter-spacing:.14em;color:var(--ihf-teal);margin-bottom:12px}
/* Innovación: cita destacada del doctor · Prensa: fecha de las tarjetas en gris */
.ihf-cita{border-left:2px solid var(--ihf-teal);padding-left:24px}
#prensa .el-content{color:var(--ihf-muted)}
/* Galería de fotos al final de Innovación y Prensa: la etiqueta va en CSS para que desaparezca con la galería si no hay fotos */
.ihf-galeria::before{content:"Galería";display:block;text-align:left;font-family:var(--ihf-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ihf-teal);margin-bottom:20px}
.ihf-galeria .el-item{border-radius:14px;overflow:hidden}
/* Galería: toda la foto abre el lightbox; al pasar el ratón aparece un ojo (en vez del botón "Read more") */
.ihf-galeria .uk-link-toggle::after{content:"";position:absolute;top:50%;left:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:var(--ihf-teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle fill='none' stroke='%2307141f' stroke-width='1.4' cx='10' cy='10' r='3.45'/%3E%3Cpath fill='none' stroke='%2307141f' stroke-width='1.4' d='M19.5 10c-2.4-3.66-5.26-7-9.5-7S2.9 6.34.5 10c2.4 3.66 5.26 7 9.5 7s7.1-3.34 9.5-7Z'/%3E%3C/svg%3E") center/24px no-repeat;opacity:0;transform:scale(.8);transition:opacity .25s,transform .25s;pointer-events:none;z-index:2}
.ihf-galeria .uk-link-toggle:hover::after,.ihf-galeria .uk-link-toggle:focus-visible::after{opacity:1;transform:scale(1)}
/* Episodios del podcast: etiquetas en CSS para que desaparezcan con su lista si está vacía; video con esquinas redondeadas */
.ihf-temas::before,.ihf-rel-cond::before,.ihf-rel-trat::before{display:block;font-family:var(--ihf-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ihf-teal);margin-bottom:14px}
.ihf-temas::before{content:"En este episodio"}
.ihf-rel-cond::before{content:"Condiciones relacionadas"}
.ihf-rel-trat::before{content:"Tratamientos relacionados"}
.ihf-video iframe,.ihf-video video{border-radius:14px}
/* Página de error 404 (plantilla YOOtheme «Error 404») */
.ihf-404-num{font-family:var(--ihf-mono);color:var(--ihf-teal);line-height:1;letter-spacing:-.04em}
/* Blog: texto del artículo (subtítulos del editor más contenidos que los titulares de sección) */
.ihf-prosa{max-width:720px}
.ihf-prosa h2{font-size:1.6rem;margin-top:1.8em}
.ihf-prosa h3{font-size:1.25rem;margin-top:1.5em}
/* Menú principal entre 1200 y 1339 px: con 8 ítems + botón no cabía y los textos se partían en dos líneas */
.uk-navbar-nav > li > a,.uk-navbar-nav > li > a.btn-navbar{white-space:nowrap}
@media (min-width:1200px) and (max-width:1339px){.uk-navbar-nav{gap:16px}}