/* ==========================================================================
   HUELLA DEPORTIVA · Identidad «luz y presión»
   Capa final: se carga después de styles.css, tema.css y de la hoja propia de cada página.
   Base clara de papel con grano; azules eléctricos y noche en secciones concretas;
   el naranja solo como luz, detalle o final de degradado.
   Cada tipo de página tiene su propia cabecera (clase pg-* en <body>).
   ========================================================================== */

/* ---------- Tokens ---------- */
:root {
  --paper: #eceef2 !important; --bg: #eceef2 !important; --surface: #f7f8fa !important; --raised: #ffffff !important; --soft: #e3e6ec !important;
  --line: #ccd2dd !important; --ink: #0e1633 !important; --ink2: #2b3452 !important; --muted: #5b6480 !important;
  --blue: #2443ff !important; --blue-text: #1d36d8 !important; --glow: #8fb0ff !important; --pain: #ff5a1f !important; --on-blue: #ffffff !important;
  --electric: #2443ff !important; --deep: #0a1030 !important; --navy: #0a1030; --sky: #a9bcff;
  --accent: #1d36d8 !important; --accent-ink: #ffffff !important; --hot: #ff5a1f !important; --new: #ff5a1f !important; --new-ink: #ffffff !important;
  --bone: #d6dbe6 !important; --bone-edge: #8a93a8 !important; --bone-hover: #c4cbd9 !important;
  --plate: #ffffff !important; --plate-dot: rgba(14, 22, 51, .14) !important;
  --band-bg: #eceef2 !important; --band-fg: #0e1633 !important; --band-muted: #5b6480 !important;
  --display: "Archivo", "Helvetica Neue", Arial, sans-serif !important;
  --body: "Instrument Sans", "Helvetica Neue", Arial, sans-serif !important;
  --monoui: "Archivo", "Helvetica Neue", Arial, sans-serif !important;
  --font-display: var(--display) !important; --font-body: var(--body) !important; --ui: var(--body) !important; --mono: var(--monoui) !important;
  --r: 4px !important; --r-lg: 6px !important;
  --pad-box: clamp(22px, 2.6vw, 32px);
  --runner-bg: #ffffff;
  color-scheme: light !important;
}
::selection { background: var(--blue) !important; color: #fff !important; }

/* ---------- Base: papel con grano ---------- */
html, body { background: var(--bg) !important; color: var(--ink) !important; }
body { font-family: var(--body) !important; font-size: 16px !important; line-height: 1.6 !important; }
body::after { opacity: .3 !important; mix-blend-mode: overlay !important; z-index: 60 !important; }
a { color: var(--blue-text) !important; text-decoration-color: rgba(29, 54, 216, .35) !important; }
a:hover { color: var(--ink) !important; }

/* Tipografía: más contenida, en minúscula y con un solo titular grande por bloque */
:root body h1, :root body h2 { font-family: var(--display) !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: -.025em !important; font-stretch: 100% !important; }
:root body h3, :root body h4 { font-family: var(--display) !important; font-weight: 600 !important; letter-spacing: -.01em !important; text-transform: none !important; }
.banner h1 { font-size: clamp(32px, 4.3vw, 56px) !important; line-height: 1.02 !important; max-width: 20ch; }
.banner-lede { font-size: 17px !important; line-height: 1.55 !important; max-width: 56ch !important; }
.article { font-size: 16px !important; }
.article h2 { font-size: clamp(24px, 2.5vw, 31px) !important; line-height: 1.12 !important; margin: 2.4em 0 .7em !important; }
.article h3, .article .h3, .faq h3 { font-size: 18px !important; line-height: 1.3 !important; }
.answer { font-size: 18px !important; line-height: 1.55 !important; border-left: 2px solid var(--pain) !important; padding-left: 20px !important; }
p, li, dd { overflow-wrap: break-word; }

/* Etiquetas: grotesca ancha, pequeña y espaciada */
.eyebrow, .label, .crumbs, .crumbs a, .article-meta, .ad-label, .zone-h, .ficha-grid dt, .side-box h3, .toc-box > summary,
.footer-legal, .footer-legal a, .footer-cols b, .footer-cols nav b, .vs-k, th, .tl-date, .series-meta, .shoe-cat, .plan-tag, .shoe-specs dt, .contact-list dt,
.calc-k, .legend, .footmap-cap, .figure-sub, .legs-key, .schema-title, .ex-dose, .dose, .hn-mark, .m-zone,
.nav a, .nav-drop, .btn, .m-book, .f-cta, .hdr-cta, .search-btn span, .m-label, .pager a span, .feature-label, .stat-src, .shoe-src, .source,
.figure-note, .clinic-sub, .key, .footmap-legend, .profile-role, .tile-cap, .sz-cause, .search-label, .panel-foot a, .m-all a, .m-links a,
.sports-list em, .m-group > summary, .m-zgroup > summary span, .m-home, .to-top, .ficha-alarm, .lh-label, .lh-more, .lh-corners, .lh-copy, .lh-kicker, .readout, .poster-meta {
  font-family: var(--monoui) !important; font-stretch: 112% !important; letter-spacing: .08em !important;
}
.pmid, .copyable { font-family: var(--monoui) !important; }

/* ---------- Botones en pastilla ---------- */
.btn, .m-book, .f-cta, .hdr-cta, .btn-main {
  border-radius: 999px !important; padding: 13px 22px !important; font-size: 11px !important; font-weight: 600 !important;
  background: var(--blue) !important; color: #fff !important; box-shadow: none !important;
}
.btn:hover, .m-book:hover, .f-cta:hover, .hdr-cta:hover, .btn-main:hover { background: var(--ink) !important; color: #fff !important; box-shadow: 0 10px 30px -10px rgba(255, 90, 31, .7) !important; }
.btn-ghost, .cta-strip .btn + .btn { background: transparent !important; color: var(--ink) !important; box-shadow: inset 0 0 0 1px var(--ink) !important; }
.btn-ghost:hover { background: var(--ink) !important; color: #fff !important; }
.hdr-cta { padding: 10px 16px !important; }

/* ---------- Cabecera del sitio ---------- */
.site-header { background: rgba(236, 238, 242, .82) !important; border-bottom: 1px solid var(--line) !important; }
.brand-name { font-family: var(--display) !important; font-stretch: 118% !important; font-weight: 700 !important; font-size: 16px !important; letter-spacing: .02em !important; text-transform: uppercase !important; }
.brand-name small { font-stretch: 112%; font-weight: 500; font-size: 9.5px !important; color: var(--blue-text) !important; }
.brand-dot { background: var(--blue) !important; box-shadow: 0 0 0 4px rgba(36, 67, 255, .16), 0 0 14px 3px rgba(255, 90, 31, .55) !important; }
.nav a, .nav-drop { color: var(--muted) !important; font-size: 10.5px !important; }
.nav a:hover, .nav-drop:hover, .nav-drop[aria-expanded="true"], .nav-drop.is-current, .nav a[aria-current="page"] { color: var(--ink) !important; }
.nav-drop.is-current, .nav a[aria-current="page"] { border-bottom-color: var(--pain) !important; }
.search-btn, .m-menu { color: var(--ink) !important; box-shadow: inset 0 0 0 1px var(--line) !important; border-radius: 999px !important; }
.m-burger i { background: var(--ink) !important; }
.sports-panel, .search-panel { background: rgba(247, 248, 250, .97) !important; box-shadow: 0 30px 60px -30px rgba(14, 22, 51, .35) !important; }
.sports-list a:hover { background: var(--soft) !important; }
.sports-list b, .m-group ul b, .guide-list b { font-family: var(--display) !important; text-transform: none !important; font-size: 17px !important; font-weight: 600 !important; line-height: 1.2 !important; }
.sports-list span, .m-group ul span, .guide-list span { font-size: 14px !important; }
.m-sheet { background: var(--bg) !important; }
.site-search input, .m-search input, #q-top, .calc-input input, input[type="number"], input[type="text"], input[type="email"], select, textarea {
  background: var(--raised) !important; color: var(--ink) !important; border: 1px solid var(--line) !important; border-radius: 999px !important; padding-inline: 18px !important;
}
.search-results { background: var(--raised) !important; box-shadow: 0 24px 48px -24px rgba(14, 22, 51, .35) !important; border-radius: 6px !important; }
.search-results [aria-selected="true"], .search-results a:hover { background: var(--soft) !important; }

/* ---------- Cabeceras de página: base común ---------- */
header.banner, .banner {
  position: relative; overflow: hidden; isolation: isolate;
  background: var(--bg) !important; border-bottom: 1px solid var(--line) !important; color: var(--ink) !important;
}
header.banner::before { content: ""; position: absolute; inset: -10%; z-index: -1; pointer-events: none; background: none; filter: blur(18px); }
header.banner > .wrap { position: relative; z-index: 1; }
.banner-compact .banner-grid, .banner .banner-grid { padding-block: clamp(48px, 7vw, 96px) clamp(44px, 6vw, 80px) !important; }
.crumbs > span:last-child { color: var(--blue-text) !important; }
.crumbs a { color: var(--muted) !important; }
.banner-lede { color: var(--ink2) !important; }

/* Textos de cartel en los márgenes (los añade identidad.js; solo decoración) */
.poster-meta { position: absolute; inset: 0; z-index: 1; pointer-events: none; font-size: 10px; text-transform: uppercase; color: var(--muted); line-height: 1.5; }
.poster-meta span { position: absolute; }
.poster-meta .pm-tr { top: 22px; right: max(16px, env(safe-area-inset-right, 0px)); text-align: right; }
.poster-meta .pm-br { bottom: 20px; right: max(16px, env(safe-area-inset-right, 0px)); text-align: right; }
.poster-meta .pm-v { top: 50%; left: 22px; writing-mode: vertical-rl; transform: translateY(-50%) rotate(180deg); white-space: nowrap; }
@media (max-width: 1180px) { .poster-meta .pm-v { display: none; } }
@media (max-width: 760px) { .poster-meta .pm-br { display: none; } }
@media (min-width: 1300px) { .poster-meta .pm-tr, .poster-meta .pm-br { right: calc((100vw - 1240px) / 2); } .poster-meta .pm-v { left: calc((100vw - 1240px) / 2 - 20px); } }

/* Lesiones: anillos azules difuminados que se cruzan, con la luz naranja del dolor en el cruce */
.pg-lesion header.banner::before {
  background:
    radial-gradient(circle 90px at 76% 58%, rgba(255, 90, 31, .55), transparent 75%),
    radial-gradient(circle 230px at 70% 40%, transparent 62%, rgba(36, 67, 255, .5) 76%, transparent 92%),
    radial-gradient(circle 200px at 84% 70%, transparent 58%, rgba(36, 67, 255, .42) 74%, transparent 90%),
    radial-gradient(circle 160px at 92% 22%, transparent 55%, rgba(36, 67, 255, .3) 72%, transparent 90%);
}
/* Deportes: azul eléctrico con la pista del deporte dibujada con texto (identidad.js) */
.pg-deporte header.banner { background: radial-gradient(120% 140% at 85% 110%, rgba(255, 90, 31, .55), transparent 45%), linear-gradient(160deg, #2443ff 0%, #1a2fd0 45%, #0b1a6b 100%) !important; border-bottom: 0 !important; }
.pg-deporte header.banner, .pg-deporte header.banner h1, .pg-deporte .banner-lede, .pg-deporte header.banner .crumbs, .pg-deporte header.banner .crumbs a, .pg-deporte .crumbs > span:last-child, .pg-deporte .poster-meta { color: #fff !important; }
.pg-deporte .banner-lede, .pg-deporte header.banner .crumbs a { opacity: .85; }
.court { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; opacity: .42; -webkit-mask-image: linear-gradient(90deg, transparent 0, rgba(0,0,0,.25) 40%, #000 70%); mask-image: linear-gradient(90deg, transparent 0, rgba(0,0,0,.25) 40%, #000 70%); }
.court text { fill: #fff; font-family: "Archivo", sans-serif; font-stretch: 112%; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
/* Calzado: gris azulado con una cápsula de luz azul */
.pg-calzado header.banner { background: linear-gradient(180deg, #e4e8f0, #eceef2) !important; }
.pg-calzado header.banner::before {
  background:
    radial-gradient(ellipse 150px 260px at 80% 55%, rgba(10, 16, 48, .85), rgba(36, 67, 255, .7) 45%, rgba(36, 67, 255, .15) 75%, transparent 100%),
    radial-gradient(circle 60px at 86% 86%, rgba(255, 90, 31, .45), transparent 80%);
  filter: blur(22px);
}
/* Running: horizonte de noche a cielo con una línea naranja al fondo */
.pg-running header.banner { background: linear-gradient(180deg, #0a1030 0%, #14246f 48%, #3f63ff 78%, #a9bcff 92%, #eceef2 100%) !important; border-bottom: 0 !important; }
.pg-running header.banner::after { content: ""; position: absolute; left: 0; right: 0; bottom: 8%; height: 2px; background: linear-gradient(90deg, transparent, rgba(255, 90, 31, .9) 30%, rgba(255, 90, 31, .9) 70%, transparent); filter: blur(1px); z-index: 0; }
.pg-running .banner-grid { padding-bottom: clamp(96px, 12vw, 150px) !important; }
.pg-running header.banner, .pg-running header.banner h1, .pg-running .banner-lede, .pg-running header.banner .crumbs, .pg-running header.banner .crumbs a, .pg-running .crumbs > span:last-child, .pg-running .poster-meta { color: #fff !important; }
.pg-running .banner-lede, .pg-running header.banner .crumbs a { opacity: .85; }
/* Servicios: blanco con una mancha azul gaussiana */
.pg-servicio header.banner { background: #f4f5f8 !important; }
.pg-servicio header.banner::before {
  background:
    radial-gradient(ellipse 300px 230px at 82% 66%, rgba(15, 21, 150, .95), rgba(36, 67, 255, .75) 40%, rgba(36, 67, 255, .2) 72%, transparent 100%),
    radial-gradient(circle 70px at 68% 88%, rgba(255, 90, 31, .4), transparent 80%);
  filter: blur(26px);
}
@media (max-width: 760px) { .pg-servicio header.banner::before { opacity: .45; } .pg-lesion header.banner::before { opacity: .6; } .pg-calzado header.banner::before { opacity: .55; } }
/* Sobre mí: la foto destaca sobre un halo azul */
.pg-sobre header.banner { background: #f4f5f8 !important; }
.pg-sobre header.banner::before { background: radial-gradient(ellipse 420px 460px at 78% 50%, rgba(36, 67, 255, .55), rgba(36, 67, 255, .12) 60%, transparent 85%); filter: blur(30px); }
.banner-profile .profile-photo img { border: 0 !important; border-radius: 14px !important; box-shadow: 0 40px 80px -30px rgba(14, 22, 51, .55) !important; }
/* Índices de sección, mapa, legal */
body[class="pg-hub"] header.banner::before { background: radial-gradient(circle 260px at 82% 50%, transparent 60%, rgba(36, 67, 255, .4) 75%, transparent 92%), radial-gradient(circle 180px at 70% 72%, transparent 58%, rgba(36, 67, 255, .35) 74%, transparent 92%), radial-gradient(circle 60px at 74% 62%, rgba(255, 90, 31, .4), transparent 80%); }
.pg-mapa header.banner::before { background: radial-gradient(circle 120px at 82% 60%, rgba(255, 90, 31, .45), transparent 75%), radial-gradient(circle 260px at 80% 50%, transparent 60%, rgba(36, 67, 255, .35) 76%, transparent 92%); }

/* ---------- Cajas: aire dentro y entre ellas ---------- */
.figure, .ficha, .footmap, .legs-fig, .calc, .exercise, .shoe, .feature, .clinic, .plan, .stat-card, .when > div, .takeaway, .note-box, .ask-box, .legal-box,
.schema-branch, .versus, .book, .series-item, .faq-item, .sub, .ex-fold, .hub-link a, .clinic-mini > div, .p {
  background: var(--surface) !important; border-color: var(--line) !important; border-radius: var(--r-lg) !important; color: var(--ink) !important;
}
.figure, .ficha, .legs-fig, .calc, .shoe, .feature, .clinic, .plan, .stat-card, .when > div, .schema-branch, .versus { padding: var(--pad-box) !important; }
.note-box, .ask-box, .takeaway, .legal-box { padding: 20px 24px !important; border-left-width: 2px !important; }
.note-box, .ask-box, .takeaway { border-left-color: var(--blue) !important; }
.legal-box { border-left-color: var(--pain) !important; }
.figure, .ficha, .calc, .shoe, .clinic, .plan, .versus, .note-box, .ask-box, .takeaway, .legal-box, .exercise, .faq-item, .sub { margin-block: 28px !important; }
.clinics, .plans, .shoes, .shoe-grid { gap: 24px !important; }
.clinic > * + *, .plan > * + *, .shoe > * + * { margin-top: 14px !important; }
.clinic-mini > div { padding: 22px 24px !important; border: 1px solid var(--line) !important; }

/* Clínicas */
.clinic h2, .clinic h3, .plan h3 { font-family: var(--display) !important; text-transform: none !important; font-size: clamp(22px, 2.2vw, 28px) !important; line-height: 1.1 !important; font-weight: 600 !important; }
.clinic .eyebrow { color: var(--blue-text) !important; font-size: 10.5px !important; }
.clinic .contact-list > div { padding-block: 12px !important; }
.clinic-links { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 8px; }
.clinic-note { margin-top: 28px !important; max-width: 80ch; color: var(--muted) !important; }

/* Planes de la consulta online */
.plan-main { box-shadow: inset 0 0 0 1px var(--blue) !important; background: linear-gradient(180deg, #ffffff, #f2f4ff) !important; }
.plan-price b { color: var(--blue-text) !important; font-family: var(--display) !important; font-weight: 600 !important; font-size: 40px !important; letter-spacing: -.02em; }
.plan-price span { color: var(--muted) !important; margin-left: 8px; }
.plan .summary { display: grid; gap: 10px; padding-left: 18px !important; margin-block: 18px !important; }
.plan .btn { margin-top: 18px !important; }

/* Zapatillas: nombre, texto, datos y valoración, cada uno con su espacio */
.shoe { display: flex !important; flex-direction: column; gap: 0; }
.shoe > * { margin: 0 !important; }
.shoe .shoe-cat { color: var(--blue-text) !important; font-size: 10.5px !important; margin-bottom: 8px !important; }
.shoe h3 { font-size: 22px !important; margin-bottom: 10px !important; }
.shoe > p:not([class]) { color: var(--ink2) !important; margin-bottom: 20px !important; }
.shoe-specs { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)) !important; gap: 0 !important; border-block: 1px solid var(--line) !important; margin-bottom: 20px !important; padding: 0 !important; }
.shoe-specs > div { padding: 14px 16px 14px 0 !important; border: 0 !important; }
.shoe-specs dd { margin: 4px 0 0 !important; font-weight: 500; color: var(--ink) !important; }
.shoe-line { display: grid !important; grid-template-columns: 120px minmax(0, 1fr); gap: 16px; padding-block: 10px !important; border-top: 0 !important; color: var(--ink2) !important; }
.shoe-line span { font-family: var(--monoui); font-stretch: 112%; font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--blue-text); padding-top: 3px; }
.shoe-ojo span { color: var(--pain) !important; }
.shoe-src { margin-top: 14px !important; font-size: 10.5px !important; }
@media (max-width: 520px) { .shoe-line { grid-template-columns: 1fr; gap: 4px; } }

/* Índices de sección: número volado, como una alineación */
.series-item { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important; margin: 0 !important; }
.series-item > a { display: grid !important; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 8px 18px; align-items: start; padding: 22px 0 !important; text-decoration: none !important; color: var(--ink) !important; background: none !important; }
:root body .series-num { font-family: var(--monoui) !important; font-stretch: 112%; font-size: 12px !important; font-weight: 600 !important; color: var(--blue-text) !important; padding-top: 4px; letter-spacing: .04em; }
.series-item h3 { font-size: clamp(18px, 1.8vw, 22px) !important; line-height: 1.25 !important; margin: 0 0 6px !important; font-weight: 500 !important; }
.series-item p { color: var(--muted) !important; margin: 0 !important; font-size: 15px; }
.series-item > a:hover h3 { color: var(--blue-text) !important; }
.series-item > a:hover .series-num { color: var(--pain) !important; }
.series-item.is-sub > a { padding-left: 44px !important; }
.series-meta { padding-top: 5px; white-space: nowrap; font-size: 10px !important; }
@media (max-width: 600px) { .series-item > a { grid-template-columns: 34px minmax(0, 1fr); } .series-meta { grid-column: 2; } .series-item.is-sub > a { padding-left: 24px !important; } }
.zone-title, .series-title { font-size: clamp(24px, 2.6vw, 32px) !important; }
.zone-desc { color: var(--muted) !important; }

/* Enlace destacado de la página de lesiones */
.hub-link a { display: grid !important; gap: 6px; padding: 24px 28px !important; border: 1px solid var(--line) !important; border-left: 2px solid var(--pain) !important; background: linear-gradient(90deg, #fff, #f3f5ff) !important; text-decoration: none !important; }
.hub-link b { font-family: var(--display) !important; text-transform: none !important; font-size: 22px !important; font-weight: 600 !important; color: var(--ink) !important; }
.hub-link span, .hub-link a span { color: var(--ink2) !important; }
.hub-link a b { color: var(--ink) !important; font-weight: 600 !important; font-size: 22px !important; }
.hub-link a::after { color: var(--blue-text) !important; }
.hub-link a:hover { background: linear-gradient(90deg, #fff, #e8edff) !important; }
.hub-link a:hover b { color: var(--blue-text) !important; }

/* Etiquetas y filtros: pastillas translúcidas */
.chips a, .zone-nav a, .lh-hints a, .si-links a, .si-cta a:not(.btn), .filters .chip, .pain .chip, .home .chip {
  background: rgba(255, 255, 255, .55) !important; border: 1px solid rgba(36, 67, 255, .22) !important; color: var(--ink) !important; border-radius: 999px !important;
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); font-family: var(--monoui) !important; font-stretch: 112%; font-size: 10.5px !important;
}
.chips a:hover, .zone-nav a:hover, .lh-hints a:hover, .si-links a:hover, .si-cta a:not(.btn):hover, .filters .chip:hover, .pain .chip:hover { border-color: var(--blue) !important; color: var(--blue-text) !important; }
.filters .chip[aria-pressed="true"], .pain .chip[aria-pressed="true"], .home .chip[aria-pressed="true"] { background: var(--blue) !important; color: #fff !important; border-color: var(--blue) !important; }

/* Barra lateral y lecturas */
.toc-box, .side-box { border-top: 1px solid var(--ink) !important; }
.toc a { color: var(--muted) !important; font-size: 14px !important; }
.toc a:hover, .toc a.is-on, .toc a[aria-current="true"] { color: var(--blue-text) !important; }
.pager a { font-family: var(--display) !important; text-transform: none !important; font-weight: 600 !important; font-size: 19px !important; line-height: 1.2 !important; }
.pager a:hover { border-top-color: var(--pain) !important; }
.sub-n, .ex-n, :root body .sub-n, :root body .ex-n, :root body .ex-fold .ex-n { font-family: var(--monoui) !important; font-stretch: 112%; font-size: 13px !important; font-weight: 600 !important; color: var(--blue-text) !important; box-shadow: inset 0 0 0 1px rgba(36, 67, 255, .35) !important; border-radius: 999px !important; }
.sz-num { background: var(--pain) !important; color: #fff !important; border-radius: 999px !important; }
.ficha-alarm { color: var(--pain) !important; box-shadow: inset 0 0 0 1px var(--pain) !important; border-radius: 999px !important; }
.ficha-alarm:hover { background: var(--pain) !important; color: #fff !important; }
.vs-head .vs-a { background: var(--pain) !important; color: #fff !important; }
.vs-head .vs-b { background: var(--blue) !important; color: #fff !important; }
.vs-row .vs-a { color: #c2410c !important; }
:root body .vs-head .vs-mid { background: var(--ink) !important; color: #fff !important; box-shadow: 0 0 0 4px var(--surface), 0 6px 18px rgba(14, 22, 51, .25) !important; font-family: var(--display) !important; }
.cmp-track, .swing { background: var(--soft) !important; }
.cmp-fill, .stance { color: #fff !important; }
td { color: var(--ink2) !important; }

/* Franja de cita: azul eléctrico con su degradado y el naranja al final */
.cta-strip { background: radial-gradient(90% 160% at 100% 120%, rgba(255, 90, 31, .6), transparent 50%), linear-gradient(120deg, #2443ff, #0b1a6b) !important; border-radius: var(--r-lg) !important; padding: clamp(28px, 4vw, 44px) !important; }
.cta-strip b { font-family: var(--display) !important; text-transform: none !important; font-weight: 600 !important; font-size: clamp(22px, 2.6vw, 30px) !important; line-height: 1.12 !important; }
.cta-strip .btn { background: #fff !important; color: var(--ink) !important; }

/* Publicidad y aviso sanitario */
.ad-placeholder { background: transparent !important; border: 1px dashed var(--line) !important; border-radius: var(--r-lg) !important; }
.health-notice { background: var(--surface) !important; }
.health-notice .hn-mark { color: var(--pain) !important; }

/* Pie: azul noche con una luz azul y naranja en la esquina */
.site-footer { background: radial-gradient(60% 90% at 100% 100%, rgba(255, 90, 31, .28), transparent 60%), radial-gradient(70% 100% at 0% 100%, rgba(36, 67, 255, .45), transparent 70%), #0a1030 !important; color: #b8c1dc !important; border-top: 0 !important; }
.site-footer, .site-footer p, .f-about p, .footer-cols b, .footer-cols nav b { color: #b8c1dc !important; }
.site-footer a { color: #e6eaf6 !important; }
.site-footer a:hover { color: #fff !important; }
.footer-cols .f-name, .site-footer .footer-cols b.f-name { color: #fff !important; font-family: var(--display) !important; font-stretch: 118%; text-transform: uppercase !important; font-weight: 700 !important; font-size: 17px !important; letter-spacing: .02em !important; }
.footer-cols .f-name small { color: #8fb0ff !important; font-stretch: 112%; }
.footer-legal { border-top-color: rgba(184, 193, 220, .2) !important; }
.site-footer .f-cta { background: #fff !important; color: var(--ink) !important; }
.to-top { background: var(--ink) !important; color: #fff !important; border-radius: 999px !important; }

/* Dibujos y figuras sobre claro */
.footmap { background: radial-gradient(80% 70% at 50% 42%, #ffffff, #e6e9f0) !important; }
.bf { background: #f7f8fa !important; border-color: var(--line) !important; }
.bf .toe { stroke: #c3c9d6 !important; }
.bf .anno, .bf .dim, .bf .dim2 { fill: #c2410c; stroke: #c2410c; }
.bf .anno { stroke: none; }
.spur-fig .sp-skin { stroke: var(--ink2) !important; }
.figure-title, .when b, .defs dt, .facts b, .step b, .services b, .timeline b, .soon dt { font-family: var(--display) !important; font-weight: 600 !important; }

/* ---------- Mapa del pie (dolor-pie) ---------- */
.pmap { background: radial-gradient(80% 70% at 50% 42%, #ffffff, #e4e8f0) !important; border-color: var(--line) !important; }
#fm-c { filter: drop-shadow(0 18px 22px rgba(14, 22, 51, .22)) !important; }
.th[aria-pressed="true"] { background: #fff !important; border-color: var(--blue) !important; }
.zcard { background: var(--surface) !important; border: 1px solid var(--line); border-radius: var(--r-lg); }
.zcard h3, .home .zcard h3 { font-family: var(--display) !important; text-transform: none !important; font-weight: 600 !important; font-size: clamp(22px, 2.4vw, 28px) !important; line-height: 1.12 !important; }
/* Marcas de corte alrededor del mapa, como en una prueba de imprenta */
.footmap, .lh-clinic .mapart { position: relative; }
.footmap::before, .mapart::after {
  content: ""; position: absolute; inset: 8px; pointer-events: none; z-index: 2;
  background:
    linear-gradient(var(--blue), var(--blue)) left top / 14px 1px no-repeat, linear-gradient(var(--blue), var(--blue)) left top / 1px 14px no-repeat,
    linear-gradient(var(--blue), var(--blue)) right top / 14px 1px no-repeat, linear-gradient(var(--blue), var(--blue)) right top / 1px 14px no-repeat,
    linear-gradient(var(--blue), var(--blue)) left bottom / 14px 1px no-repeat, linear-gradient(var(--blue), var(--blue)) left bottom / 1px 14px no-repeat,
    linear-gradient(var(--blue), var(--blue)) right bottom / 14px 1px no-repeat, linear-gradient(var(--blue), var(--blue)) right bottom / 1px 14px no-repeat;
}

/* ================= Portada ================= */
.home .lh-sec { border-top: 0 !important; }
.lh-sec h2 { font-size: clamp(30px, 4vw, 54px) !important; line-height: 1.02 !important; text-transform: none !important; }
.lh-sec h3 { font-size: 19px !important; }
.home .sec-head h2 { margin-top: 14px !important; }
.home .sec-head { margin-bottom: 44px !important; }

/* Hero: papel, halo azul y luz naranja abajo; el corredor en azul a la derecha */
.lh-hero { background:
  radial-gradient(60% 40% at 70% 108%, rgba(255, 90, 31, .45), transparent 70%),
  radial-gradient(45% 60% at 68% 48%, rgba(36, 67, 255, .22), transparent 70%),
  linear-gradient(180deg, #f3f4f7, #e6e9f0) !important; }
.lh-hero canvas { mix-blend-mode: multiply; }
.lh-hero h1 { font-size: clamp(42px, 6.6vw, 100px) !important; line-height: .96 !important; letter-spacing: -.035em !important; color: var(--ink) !important; text-shadow: none !important; font-weight: 600 !important; }
.lh-hero h1 em { -webkit-text-stroke: 1.5px var(--ink) !important; color: transparent !important; font-style: normal; }
.lh-kicker, .lh-copy, .lh-corners { color: var(--ink) !important; }
.lh-copy { text-transform: none !important; font-family: var(--body) !important; font-stretch: 100% !important; letter-spacing: 0 !important; font-size: 17px !important; line-height: 1.55 !important; max-width: 44ch !important; }
.lh-kicker { font-size: 10.5px !important; color: var(--blue-text) !important; }
.lh-corners { font-size: 10px !important; }
@media (min-width: 900px) {
  .lh-center { align-items: flex-start !important; text-align: left !important; max-width: 58%; }
  .lh-ctas { justify-content: flex-start !important; }
}
@media (max-width: 899px) { .lh-hero canvas { opacity: .45; } }
.ticker { border-color: var(--line) !important; background: var(--surface); }

/* Análisis: retícula de puntos como la plataforma de presiones, con destello naranja */
.analysis { background: #f4f6fa; }
.lab { background: radial-gradient(circle, rgba(14, 22, 51, .2) 1px, transparent 1.6px) 0 0 / 14px 14px, #f9fafc !important; border-color: var(--line) !important; overflow: hidden; }
.lab::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, transparent calc(50% - 1px), rgba(255, 90, 31, .45) 50%, transparent calc(50% + 1px)), linear-gradient(transparent calc(62% - 1px), rgba(255, 90, 31, .35) 62%, transparent calc(62% + 1px));
  filter: blur(.6px); }
.readout strong { color: var(--ink) !important; }

/* Por dónde empiezo */
.start-grid { background: var(--line) !important; border-color: var(--line) !important; }
.start-item { background: var(--surface) !important; padding: 32px !important; }
.si-art { background: #fff !important; border-color: var(--line) !important; border-radius: 50% !important; }
.home .si-art.si-photo { background: #fff !important; }
.si-text h3, .home .si-text h3 { text-transform: none !important; font-family: var(--display) !important; font-weight: 600 !important; font-size: clamp(22px, 2.2vw, 27px) !important; line-height: 1.1 !important; }

/* Método: azul eléctrico con anillos de luz */
#metodo { --bg: #2443ff; --surface: rgba(255, 255, 255, .08); --raised: rgba(255, 255, 255, .12); --line: rgba(255, 255, 255, .28); --ink: #fff; --ink2: #f1f3ff; --muted: #dfe5ff; --blue: #fff; --blue-text: #fff; --pain: #ffb38f;
  position: relative; overflow: hidden; isolation: isolate;
  background: radial-gradient(50% 70% at 100% 100%, rgba(255, 90, 31, .5), transparent 70%), linear-gradient(150deg, #2443ff 0%, #1a2fd0 50%, #0b1a6b 100%) !important; }
#metodo::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; filter: blur(16px);
  background: radial-gradient(circle 260px at 88% 18%, transparent 60%, rgba(255, 255, 255, .28) 75%, transparent 92%), radial-gradient(circle 200px at 78% 34%, transparent 58%, rgba(255, 255, 255, .2) 74%, transparent 92%); }
#metodo .btn, #metodo a.svc .lh-more { color: var(--ink); }
#metodo .svc { background: rgba(10, 16, 48, .18) !important; }
#metodo a.svc:hover { background: rgba(10, 16, 48, .32) !important; }
#metodo .lh-services, #metodo .steps { border-color: rgba(255, 255, 255, .5) !important; }

/* Artículos: papel blanco con una gran mancha azul a la izquierda */
#articulos { --bg: #f7f8fa; --surface: #ffffff; --raised: #ffffff; --line: #d5dae4; --ink: #0e1633; --ink2: #2b3452; --muted: #5b6480; --blue: #2443ff; --blue-text: #1d36d8; --pain: #ff5a1f;
  position: relative; overflow: hidden; isolation: isolate; background: #f7f8fa !important; color: var(--ink) !important; }
#articulos a { color: inherit !important; }
#articulos::before { content: ""; position: absolute; width: 640px; height: 640px; left: -260px; top: -120px; z-index: -1; pointer-events: none; border-radius: 50%;
  background: radial-gradient(circle, rgba(36, 67, 255, .55), rgba(36, 67, 255, .18) 45%, transparent 70%); filter: blur(30px); }
.lh-posts { background: var(--line) !important; border-color: var(--line) !important; }
.lh-post { background: rgba(255, 255, 255, .86) !important; padding: 30px !important; }
.lh-post h3 { font-size: 20px !important; }
.lh-post svg { border-radius: 50%; background: #f4f6fa; }

/* Por qué: azul noche con retícula fina y números entre paréntesis */
#por-que { --bg: #0a1030; --surface: #121a44; --line: rgba(169, 188, 255, .22); --ink: #eef1ff; --ink2: #cfd6f2; --muted: #a9b4d8; --blue-text: #a9bcff;
  position: relative; isolation: isolate; color: var(--ink) !important;
  background: linear-gradient(rgba(169, 188, 255, .12) 1px, transparent 1px) 0 0 / 100% 96px, linear-gradient(90deg, rgba(169, 188, 255, .12) 1px, transparent 1px) 0 0 / 25% 100%,
    radial-gradient(70% 80% at 0% 100%, rgba(169, 188, 255, .45), transparent 65%), linear-gradient(180deg, #0a1030, #13205e) !important; }
#por-que .why { counter-reset: why; }
#por-que .why h3 { counter-increment: why; color: var(--ink) !important; }
#por-que .why h3::before { content: "(" counter(why, decimal-leading-zero) ") "; font-family: var(--monoui); font-stretch: 112%; font-size: 11px; letter-spacing: .06em; color: var(--blue-text); vertical-align: super; margin-right: 6px; }
#por-que p { color: var(--ink2) !important; }

/* Sobre mí en la portada: la foto destaca sobre un halo azul */
#sobre { position: relative; isolation: isolate; overflow: hidden; }
#sobre::before { content: ""; position: absolute; width: 760px; height: 760px; left: -200px; top: 50%; transform: translateY(-50%); z-index: -1; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(36, 67, 255, .5), rgba(36, 67, 255, .12) 50%, transparent 70%); filter: blur(24px); }
.lh-portrait { border: 0 !important; border-radius: 14px !important; box-shadow: 0 40px 90px -30px rgba(14, 22, 51, .6) !important; background: transparent !important; }
.lh-facts { border-top-color: var(--ink) !important; }
.lh-facts strong { font-family: var(--display) !important; font-weight: 600 !important; font-size: clamp(24px, 2.6vw, 34px) !important; letter-spacing: -.02em; }

/* Dónde encontrarme: mapas de trazo azul con marcas de corte */
#encontrarme { --bg: #eceef2; --surface: #ffffff; --raised: #ffffff; --line: #ccd2dd; --ink: #0e1633; --ink2: #2b3452; --muted: #5b6480; --blue: #2443ff; --blue-text: #1d36d8; --pain: #ff5a1f;
  background: #eceef2 !important; color: var(--ink) !important; }
#encontrarme a { color: var(--blue-text) !important; }
#encontrarme .btn { background: var(--blue) !important; color: #fff !important; }
#encontrarme .btn-ghost { background: transparent !important; color: var(--ink) !important; box-shadow: inset 0 0 0 1px var(--ink) !important; }
.lh-clinic { background: #fff; border-color: var(--line) !important; border-radius: var(--r-lg); overflow: hidden; }
.mapart { background: #e8ebf1 !important; border-color: var(--line) !important; }
.mapart .st { stroke: var(--blue) !important; stroke-width: 2.2 !important; opacity: .85; }
.mapart .st2 { stroke: var(--blue) !important; stroke-width: 1 !important; opacity: .55; }
.pin { background: var(--pain) !important; box-shadow: 0 0 0 6px rgba(255, 90, 31, .22), 0 0 24px 6px rgba(255, 90, 31, .45) !important; }
.lh-clinic h3, .home .lh-clinic h3 { text-transform: none !important; font-family: var(--display) !important; font-weight: 600 !important; font-size: clamp(24px, 2.4vw, 32px) !important; line-height: 1.08 !important; }
.lh-clinic .body { padding: var(--pad-box) !important; }
.lh-clinic dd a { color: var(--blue-text) !important; }
.lh-online { background: linear-gradient(90deg, #ffffff, #eef1ff) !important; border-color: var(--line) !important; border-radius: var(--r-lg); padding: 28px 32px !important; }
.lh-online b { font-family: var(--display) !important; text-transform: none !important; font-weight: 600 !important; font-size: clamp(20px, 2.2vw, 26px) !important; line-height: 1.15 !important; }

/* ---------- Ajustes generales ---------- */
.lh-sec, .main-grid { scroll-margin-top: 80px; }
img { max-width: 100%; }
@media (max-width: 600px) { :root { --pad-box: 20px; } .start-item { padding: 24px !important; } .lh-post { padding: 24px !important; } }
@media (prefers-reduced-motion: reduce) { header.banner::before { filter: blur(18px); } }

/* Ajustes tras revisión */
.pg-servicio .poster-meta .pm-br { color: #fff; }
.mapart .pin::before, .mapart .pin::after { display: none !important; content: none !important; }
@media (max-width: 760px) { .court { opacity: .22; -webkit-mask-image: none; mask-image: none; } }
@media (max-width: 600px) {
  .brand-name { font-size: 13.5px !important; font-stretch: 104% !important; }
  .brand-name small { font-size: 8.5px !important; }
  .hdr-cta { padding: 9px 13px !important; font-size: 10px !important; }
  .answer { font-size: 17px !important; }
  body { font-size: 15.5px !important; }
}
