/* ═══════════════════════════════════════════════════════════════════
   MARTHA PATRICIA · Alineación total con KIMO (v3)
   Se carga al final de cada página y unifica: azul, header, botones,
   ritmo claro/oscuro, eyebrows, tarjetas y campo de bolitas de los heroes.
   Valores tomados directamente de KIMO (site.css / v5.css).
   ═══════════════════════════════════════════════════════════════════ */
:root{
  --ink:#05070D; --ink-2:#0A1020; --ink-3:#10182C;
  --paper:#F3F6FA; --paper-2:#E9EEF6; --white:#FCFDFE;
  --kimo-blue:#4E7BFF; --kimo-purple:#755CF6; --kimo-cyan:#57D8E8; --kimo-mint:#72E5C0; --kimo-violet:#A98BFF;
  --line-k:rgba(255,255,255,.10); --line-dark-k:rgba(8,15,29,.10);
  /* variables propias del sitio → paleta KIMO */
  --lime:#4E7BFF; --lime-hover:#72E5C0; --blue:#4E7BFF; --blue-dim:#2C4A9A;
  --bg-dark:#05070D; --bg-dark-sub:#0A1020; --bg-footer:#03050A; --bg-2:#05070D;
  --bg-light:#F3F6FA; --bg-light-panel:#FCFDFE;
  --text-dark:#0C1220; --text-muted:#5C677B;
  --light-tone:#F3F6FA;
}
html{background:#05070D!important}
body{font-family:'Manrope',-apple-system,BlinkMacSystemFont,sans-serif}

/* ───────── HEADER (oscuro, igual que KIMO) ───────── */
html body .nav{background:rgba(5,7,13,.88)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.07)!important;box-shadow:none!important}
html body .nav.nav-scrolled{background:rgba(5,7,13,.96)!important;box-shadow:0 12px 40px rgba(0,0,0,.18)!important}
html body .nav .logo-text,html body .nav .logo span:not(.logo-mark){color:#FCFDFE!important}
html body .nav .logo-mark{box-shadow:0 0 0 1px rgba(255,255,255,.14),0 6px 18px rgba(78,123,255,.3)}
html body .nav .logo-mark::after{border-color:rgba(255,255,255,.14)}
html body .nav-links > a.nav-link,html body .nav-dropdown-trigger,html body .mp-about-trigger{color:#D9E0EC!important;font-family:'Manrope',sans-serif!important;font-weight:600!important;font-size:.94rem!important}
html body .nav-links > a.nav-link:hover,html body .nav-links > a.nav-link.is-active,html body .nav-dropdown-trigger:hover,html body .nav-dropdown-trigger.is-active,html body .mp-about-trigger:hover,html body .mp-about-trigger.is-active{color:#FCFDFE!important;font-weight:600!important}
html body .nav-links a.nav-link{position:relative!important}
html body .nav-links a.nav-link::after{content:""!important;position:absolute;left:0;right:100%;bottom:2px;top:auto;width:auto!important;height:2px!important;background:linear-gradient(90deg,#96EED1,#4E7BFF)!important;border-radius:0!important;transition:right .25s ease}
html body .nav-links a.nav-link:hover::after,html body .nav-links a.nav-link.is-active::after{right:0}
html body .lang-toggle,html body .lang-toggle-text{border:1px solid rgba(255,255,255,.16)!important;color:#DFE5EF!important;background:rgba(255,255,255,.035)!important;border-radius:999px!important;padding:8px 13px!important}
html body .lang-toggle:hover,html body .lang-toggle-text:hover{border-color:rgba(114,229,192,.55)!important;color:#72E5C0!important;background:rgba(255,255,255,.035)!important}
html body .lang-toggle-text .lang-opt{color:#93A0B7!important}html body .lang-toggle-text .lang-opt.active{color:#fff!important}html body .lang-toggle-text .lang-sep{color:#4B566B!important}
/* CTA del header: contorno azul transparente como KIMO */
html body .nav .btn-nav-cta,html body .nav .btn-nav-contact,html body .nav .btn,html body .nav .btn.btn-primary,html body .nav-links a.btn{background:transparent!important;color:#F7FBFF!important;border:1px solid rgba(117,177,255,.72)!important;border-radius:999px!important;box-shadow:inset 0 0 18px rgba(58,132,255,.05)!important;padding:11px 22px!important;font-family:'Manrope',sans-serif!important;font-size:.9rem!important;font-weight:700!important;letter-spacing:0!important;min-width:150px;justify-content:center}
html body .nav-links .btn-nav-cta:hover,html body .nav-links .btn-nav-contact:hover,html body .nav-links .btn:hover{background:rgba(72,142,255,.09)!important;box-shadow:0 0 32px rgba(73,144,255,.16)!important;transform:translateY(-1px)}
html body .nav-toggle span{background:#FCFDFE!important}
/* menú desplegable "Sobre mí" */
html body .nav-dropdown-menu,html body .mp-about-menu{background:rgba(7,10,18,.98)!important;border:1px solid rgba(255,255,255,.10)!important;box-shadow:0 24px 70px rgba(0,0,0,.4)!important;border-radius:18px!important}
html body .nav-dropdown-menu a,html body .mp-about-menu a{color:#D9E0EC!important;border-radius:12px!important}
html body .nav-dropdown-menu a:hover,html body .mp-about-menu a:hover{background:rgba(255,255,255,.06)!important;color:#96EED1!important}
html body .nav-dropdown-menu .sub-arrow,html body .mp-about-menu .sub-arrow{color:#96EED1!important}
@media (max-width:900px){html body .nav-links{background:rgba(7,10,18,.98)!important;color:#D9E0EC!important;border:0!important;border-radius:20px!important;left:14px!important;right:14px!important;width:auto!important;top:calc(100% + 8px)!important;box-shadow:0 24px 70px rgba(0,0,0,.4)!important}
  html body .nav-links.open{border:1px solid rgba(255,255,255,.10)!important}
  html body .nav-links > a.nav-link,html body .nav-dropdown-trigger,html body .mp-about-trigger{color:#D9E0EC!important;border-bottom:1px solid rgba(255,255,255,.06)!important}
  html body .nav-links > a.nav-link.is-active{box-shadow:inset 0 -3px 0 #72E5C0!important}
  html body .nav-dropdown-menu,html body .mp-about-menu{background:rgba(255,255,255,.03)!important}
  html body .nav-dropdown-menu a,html body .mp-about-menu a{color:#C6D0E2!important;border-bottom-color:rgba(255,255,255,.05)!important}
  html body .nav-dropdown-menu a:first-child,html body .mp-about-menu a:first-child{color:#fff!important}
  html body .nav-dropdown,html body .mp-about-dropdown{border-bottom-color:rgba(255,255,255,.06)!important}
}

/* ───────── BOTONES (píldoras KIMO) ───────── */
.btn,.btn-nav-cta,.btn-small{border-radius:999px!important}
a.btn,button.btn,.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 24px!important;font-family:'Manrope',sans-serif!important;font-weight:700!important;font-size:.92rem!important;letter-spacing:0!important;text-transform:none!important;border:1px solid transparent;transition:transform .22s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease!important}
.btn:hover{transform:translateY(-2px)}
.btn.btn-primary,.btn-primary{background:linear-gradient(120deg,#755CF6,#4E7BFF)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 12px 34px rgba(78,123,255,.24)!important}
.btn.btn-primary:hover,.btn-primary:hover{background:linear-gradient(120deg,#755CF6,#4E7BFF)!important;box-shadow:0 16px 42px rgba(117,92,246,.35)!important;color:#fff!important}
.btn.btn-ghost,.btn-ghost,.btn-ghost-light{background:rgba(255,255,255,.035)!important;color:#fff!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:none!important}
.btn.btn-ghost:hover,.btn-ghost:hover,.btn-ghost-light:hover{border-color:rgba(114,229,192,.45)!important;background:rgba(114,229,192,.07)!important;color:#fff!important}
/* En el hero: botón principal blanco + secundario contorno (como KIMO) */
.mp-hero .btn.btn-primary{background:#F9FBFF!important;color:#07101E!important;border-color:#F9FBFF!important;box-shadow:0 9px 30px rgba(120,190,255,.14)!important}
.mp-hero .btn.btn-primary:hover{box-shadow:0 12px 34px rgba(120,190,255,.24)!important;color:#07101E!important}
.mp-hero .btn.btn-ghost{border-color:rgba(234,245,255,.66)!important;background:rgba(3,8,16,.18)!important}
.mp-hero .btn.btn-ghost:hover{border-color:#82E7FF!important;background:rgba(74,148,255,.07)!important}
/* Botones de acento (menta plano de "Compartir experiencia", etc.) → mismo lenguaje */
.reviews-section .btn,.btn-mint,a.btn-review{background:linear-gradient(120deg,#755CF6,#4E7BFF)!important;color:#fff!important;border:0!important;box-shadow:0 12px 34px rgba(78,123,255,.24)!important}
.text-link,.hub-box-link,.mp-link{color:#5B4AD6}

/* ───────── TIPOGRAFÍA / EYEBROWS / ACENTOS ───────── */
h1,h2,h3,h4{font-family:'Space Grotesk',Arial,sans-serif}
.eyebrow,.hub-eyebrow-tag,.hero-label{font-family:'IBM Plex Mono','JetBrains Mono',monospace!important;font-size:.72rem!important;font-weight:600!important;letter-spacing:.2em!important;text-transform:uppercase!important;gap:0!important}
.eyebrow::before,.hub-eyebrow-tag::before,.hero-label::before{display:none!important;content:none!important}
.mp-light .eyebrow,.mp-light .hub-eyebrow-tag,.mp-light [class*="eyebrow"]{color:#5A46D3!important}
.mp-dark .eyebrow,.mp-dark .hub-eyebrow-tag,.mp-dark .hero-label,.mp-dark [class*="eyebrow"],.hero-label{color:#96EED1!important}
/* énfasis de titulares: degradado KIMO */
.mp-dark .accent-lime,.mp-dark .highlight,.mp-dark .thesis-line.highlight,.mp-dark .accent{background:linear-gradient(93deg,#5E92FF 0%,#82D6FF 47%,#94EFD3 100%);-webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent}
.mp-light .accent-lime,.mp-light .highlight,.mp-light .accent{background:linear-gradient(90deg,#4E5BE0,#755CF6 55%,#14A3B8);-webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent}
mark[style]{background:linear-gradient(120deg,#755CF6,#4E7BFF)!important;box-shadow:0 6px 18px rgba(78,123,255,.28)!important}
.hero-support,.hero-lead{color:#B9C3D5!important}

/* ───────── SECCIONES: ritmo blanco / negro como KIMO ───────── */
/* oscuras = ink #05070D con resplandor azul-violeta (no negro plano) */
html body .mp-dark:not(.mp-keep){background:radial-gradient(circle at 80% 18%,rgba(117,92,246,.17),transparent 30%),radial-gradient(circle at 12% 100%,rgba(78,123,255,.13),transparent 32%),#05070D!important;color:#FCFDFE;border-color:rgba(255,255,255,.07)!important}
html body .mp-navy{background:radial-gradient(circle at 50% 0%,rgba(78,123,255,.14),transparent 40%),linear-gradient(180deg,#0A1020,#06111F)!important}
html body .mp-paper:not(.mp-keep){background:#F3F6FA!important;color:#0C1220;border-color:rgba(8,15,29,.08)!important}
html body .mp-white:not(.mp-keep){background:#FCFDFE!important;color:#0C1220;border-color:rgba(8,15,29,.08)!important}
html body .site-footer{background:#03050A!important;border-top:1px solid rgba(255,255,255,.07)!important}
.site-footer .footer-col h4,.site-footer h4{color:#8FA0BD!important}
.site-footer a:hover{color:#96EED1!important}

/* ───────── TARJETAS (blancas, radio 22, hover a oscuro como KIMO) ───────── */
.hub-box,.practice-col,.capability-block,.service-card,.diff-card,.decision-card{border-radius:20px!important;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease!important}
.hub-box{background:#fff!important;border:1px solid #DCE4EF!important;box-shadow:0 12px 34px rgba(15,30,55,.045)!important}
.hub-box:hover{background:#F8F6FF!important;border-color:rgba(117,92,246,.42)!important;box-shadow:0 18px 42px rgba(70,61,165,.10)!important;transform:translateY(-3px)}
.capability-block:hover,.service-card:hover{transform:translateY(-3px);box-shadow:0 20px 55px rgba(14,25,48,.09)!important;border-color:rgba(78,123,255,.28)!important}
.mp-light .chip:hover,.chip:hover{border-color:rgba(117,92,246,.4)!important;color:#5A46D3!important}
/* selector segmentado del home ("Negocio & estrategia / Datos & tecnología") */
.hub-segmented-ctrl{border-radius:999px!important;background:#E9EEF6!important;border:1px solid #DCE4EF!important}
.hub-seg-btn{border-radius:999px!important}
.hub-seg-btn.is-active{background:linear-gradient(120deg,#755CF6,#4E7BFF)!important;color:#fff!important;box-shadow:0 8px 22px rgba(78,123,255,.28)!important}
.hub-seg-btn.is-active svg{color:#fff!important;stroke:#fff}
.hub-seg-indicator{display:none!important}
/* tarjetas oscuras (etapas / trayectoria) */
.stage-card{border-radius:20px!important;background:rgba(10,16,32,.85)!important}
.stage-card:hover{transform:translateY(-3px);box-shadow:0 18px 44px rgba(78,123,255,.16)!important}
.stage-card.active-stage{background:linear-gradient(180deg,#0E1730,#0A1020)!important;border-color:#4E7BFF!important}
/* formularios */
input:focus,textarea:focus,select:focus{outline:none;border-color:#4E7BFF!important;box-shadow:0 0 0 3px rgba(78,123,255,.16)!important}
button[type="submit"],.btn-submit{background:linear-gradient(120deg,#755CF6,#4E7BFF)!important;border-radius:999px!important;color:#fff!important;border:0!important;box-shadow:0 12px 34px rgba(78,123,255,.24)!important}
button[type="submit"]:hover{transform:translateY(-2px);box-shadow:0 16px 42px rgba(117,92,246,.35)!important}

/* ───────── HEROES: portal sin marco + bolitas ───────── */
.mp-hero{position:relative;overflow:hidden;isolation:isolate}
.mp-hero > .container,.mp-hero > .wrap,.mp-hero > .hero-grid{position:relative;z-index:4}
.hero-dots{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.hero-dots canvas{display:block;width:100%;height:100%}
.kimo-star-field{position:absolute;inset:0;z-index:2;pointer-events:none}
.kimo-star{position:absolute;width:var(--s);height:var(--s);border-radius:50%;background:var(--c);opacity:var(--o,.4);animation:kimoStarDrift var(--d,12s) ease-in-out infinite alternate;box-shadow:none}
@keyframes kimoStarDrift{0%{transform:translate3d(-3px,4px,0);opacity:.35}100%{transform:translate3d(5px,-5px,0);opacity:.9}}
/* ───────── varios ───────── */
.reveal{transition-timing-function:cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion:reduce){.kimo-star,.hero-dots{animation:none}}

/* hijos directos del hero por encima del campo de bolitas */

/* ───────── secciones convertidas a claro: textos legibles ───────── */
/* Sobre mí · "Mi forma de verlo" */
#filosofia.mp-light .diff-headline{color:#0C1220!important}
#filosofia.mp-light .diff-support{color:#56627A!important}
#filosofia.mp-light .differentiator-box{background:transparent!important;border-color:transparent!important;box-shadow:none!important}
/* Soluciones · "¿Por dónde empezamos?" */
.decision-section.mp-light{border-color:rgba(8,15,29,.08)!important}
.decision-section.mp-light .decision-title{color:#0C1220!important}
.decision-section.mp-light .decision-subtitle{color:#5C677B!important}
.decision-section.mp-light .routing-row{background:#fff!important;border:1px solid #DCE4EF!important;border-radius:16px!important;box-shadow:0 12px 34px rgba(15,30,55,.045)!important;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease!important}
.decision-section.mp-light .routing-row:hover{background:#F8F6FF!important;border-color:rgba(117,92,246,.42)!important;box-shadow:0 18px 42px rgba(70,61,165,.10)!important;transform:translateY(-2px)}
.decision-section.mp-light .routing-problem,.decision-section.mp-light .routing-problem span{color:#0C1220!important}
.decision-section.mp-light .routing-quote-icon{color:#755CF6!important}
.decision-section.mp-light .routing-sol{background:rgba(117,92,246,.08)!important;border:1px solid rgba(117,92,246,.28)!important;color:#5A46D3!important;border-radius:999px!important}
.decision-section.mp-light .routing-arrow{color:#5A46D3!important}
/* Home · contacto: fondo claro, tarjeta oscura/clara intacta */
#contacto.mp-light{border-color:rgba(8,15,29,.08)!important}
#contacto.mp-light > .container > div{box-shadow:0 24px 60px rgba(15,30,55,.18)!important}
@media (min-width:901px){html body .nav-links a.nav-link.is-active{border-bottom:0!important;box-shadow:none!important}}
/* botones de reseñas y misc → píldora KIMO */
html body .reviews-cta,html body .form-card button,html body .card a.btn,html body .card a[href="/"]{background:linear-gradient(120deg,#755CF6,#4E7BFF)!important;color:#fff!important;border:0!important;border-radius:999px!important;box-shadow:0 12px 34px rgba(78,123,255,.24)!important;font-family:'Manrope',sans-serif!important;font-weight:700!important;transition:transform .22s ease,box-shadow .22s ease!important}
html body .reviews-cta:hover,html body .form-card button:hover{transform:translateY(-2px);box-shadow:0 16px 42px rgba(117,92,246,.35)!important}
span[style*="width: 20px"][style*="height: 2px"]{display:none!important}
html body .nav > .nav-inner > a.logo,html body .nav a.logo{color:#FCFDFE!important}
/* Contacto: el panel oscuro lleva las mismas bolitas; estrellas solo en su mitad para no invadir el texto */
.split-navy-col.bg-constellation{display:none!important}

/* Soluciones · "Del problema al resultado": timeline en claro (antes muy oscuro) */
html body #roadmap-metodologia.mp-light h2{color:#0C1220!important}
html body #roadmap-metodologia.mp-light .roadmap-intro p:not(.eyebrow){color:#5C677B!important}
html body #roadmap-metodologia.mp-light .roadmap-track-line{background:linear-gradient(90deg,#4E7BFF,#755CF6)!important;opacity:.45;box-shadow:none!important}
html body #roadmap-metodologia.mp-light .methodology-step{background:#fff!important;border:1px solid #DCE4EF!important;border-radius:20px!important;box-shadow:0 12px 34px rgba(15,30,55,.05)!important}
html body #roadmap-metodologia.mp-light .methodology-step:hover,html body #roadmap-metodologia.mp-light .methodology-step.is-active{background:#F8F6FF!important;border-color:rgba(117,92,246,.45)!important;box-shadow:0 18px 42px rgba(70,61,165,.12)!important;transform:translateY(-3px)}
html body #roadmap-metodologia.mp-light .step-title{color:#3A4560!important}
html body #roadmap-metodologia.mp-light .step-desc{color:#6B7790!important}
html body #roadmap-metodologia.mp-light .step-phase-label{color:#7A86A0!important}
html body #roadmap-metodologia.mp-light .methodology-step.is-active .step-title,html body #roadmap-metodologia.mp-light .methodology-step:hover .step-title{color:#0C1220!important}
html body #roadmap-metodologia.mp-light .methodology-step.is-active .step-desc,html body #roadmap-metodologia.mp-light .methodology-step:hover .step-desc{color:#56627A!important}
html body #roadmap-metodologia.mp-light .methodology-step.is-active .step-phase-label,html body #roadmap-metodologia.mp-light .methodology-step:hover .step-phase-label{color:#5A46D3!important}
html body #roadmap-metodologia.mp-light .step-node{background:#fff!important;border:2.5px solid #755CF6!important;box-shadow:0 0 0 5px #F3F6FA,0 6px 16px rgba(78,123,255,.25)!important}
html body #roadmap-metodologia.mp-light .step-number{color:#5A46D3!important}
html body #roadmap-metodologia.mp-light .methodology-step.is-active .step-node{background:linear-gradient(120deg,#755CF6,#4E7BFF)!important;border-color:#72E5C0!important}
html body #roadmap-metodologia.mp-light .methodology-step.is-active .step-number{color:#fff!important}
/* Inicio · reseñas: el botón va justo debajo del texto, no al otro extremo */
html body .reviews-head{flex-direction:column!important;align-items:flex-start!important;gap:22px!important}