/* =========================================================
   NAVOA — Healthcare Intelligence
   Design tokens
========================================================= */
:root{
  --ink:        #211217;
  --graphite:   #755760;
  --graphite-2: #211217;
  --warm-white: #FCFAF8;
  --cream:      #F6ECE4;
  --powder:     #B9CFFF;
  --lavender:   #F4E7DD;
  --periwinkle: #194B22;
  --periwinkle-deep: #211217;
  --text-soft:  #755760;
  --text-softer:#8A7078;
  --on-dark-soft: rgba(249,244,241,0.66);
  --on-dark-softer: rgba(249,244,241,0.42);

  --sans: var(--font-body);
  --serif: var(--font-heading);
  --mono: var(--font-mono);

  --container: 1320px;
  --edge: clamp(24px, 6vw, 64px);
  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-full: 999px;

  --ease: cubic-bezier(.19,1,.22,1);

  /* Dark-section extensions (Synthio-inspired alternation) */
  --ink-2: #170D11;
  --on-dark: #F9F4F1;
  --periwinkle-soft: rgba(25,75,34,0.16);
  --gradient-warm: linear-gradient(135deg, #FBF582 0%, #B9CFFF 55%, #211217 100%);
  --gradient-cool: linear-gradient(135deg, #B9CFFF 0%, #194B22 55%, #211217 100%);
  --coral: #FBF582;
  --sky: #B9CFFF;
  --orange: #FBF582;
  --orange-deep: #211217;
  --lilac: #194B22;
  --synthio-blue: #194B22;

  /* Home redesign — Heidi Health palette evaluation pass */
  --bar-lilac-1: #F9F4F1;
  --bar-lilac-2: #F6ECE4;
  --top-lilac: #EFEAF7; /* Synthio Labs top-strip lilac, matched by eye from reference screenshot */
  --nav-h: 66px;
  --bar-on: #211217;
  --bar-on-soft: rgba(33,18,23,0.74);
  --bar-line: rgba(33,18,23,0.1);
  --lilac-ink: #211217;
  --lilac-line: rgba(33,18,23,0.16);
  --clinics-tint-1: #F6ECE4;
  --clinics-tint-2: #F4E7DD;
  --labs-tint-1: #F6ECE4;
  --labs-tint-2: #F4E7DD;
  --hospitals-tint-1: #F6ECE4;
  --hospitals-tint-2: #F4E7DD;
}

*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }

body{
  margin:0;
  background: var(--warm-white);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 400;
  letter-spacing: -0.03em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

h1,h2,h3,h4{ font-weight: 500; letter-spacing: -0.045em; }
h1,h2,h3,h4,p,ul{ margin:0; padding:0; }
ul{ list-style:none; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }

::selection{ background: var(--periwinkle); color: var(--warm-white); }

:focus-visible{
  outline: 2px solid var(--periwinkle);
  outline-offset: 3px;
  border-radius: 4px;
}

.section-inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--edge);
}

/* =========================================================
   Motion primitives
========================================================= */
/* Content is visible by default (no-JS / slow-JS safe).
   Only once the 'js' class lands on <html> (see inline script in <head>)
   do .reveal elements hide themselves ahead of their scroll-triggered entrance. */
.reveal{ opacity: 1; transform: none; }
html.js .reveal{
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .9s var(--ease), transform .9s var(--ease);
}
html.js .reveal.in-view{ opacity: 1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; transition-duration: .001ms !important; }
  html{ scroll-behavior:auto; }
}

/* =========================================================
   Split button — signature CTA
========================================================= */
.btn-split{
  display: inline-flex;
  align-items: stretch;
  border-radius: var(--radius-full);
  overflow: hidden;
  font-family: var(--sans);
  font-weight: 500;
  letter-spacing: 0.01em;
  transition: transform .45s var(--ease), box-shadow .45s var(--ease);
  will-change: transform;
}
.btn-split:hover{ transform: translateY(-2px); box-shadow: 0 14px 30px -14px rgba(17,17,17,0.35); }
.btn-split__left{
  background: var(--graphite);
  color: var(--warm-white);
  padding: 15px 26px;
  font-size: .9375rem;
  display:flex;
  align-items:center;
}
.btn-split--nav .btn-split__left,
.btn-split--hero .btn-split__left{ background: #211217; }
.btn-split__right{
  background: var(--cream);
  color: var(--ink);
  padding: 15px 20px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition: background .3s var(--ease), transform .3s var(--ease);
}
.btn-split:hover .btn-split__right{ transform: translateX(3px); }

.btn-split--nav{ display:none; }
.btn-split--footer .btn-split__left{ padding: 13px 22px; font-size: .875rem; }
.btn-split--footer .btn-split__right{ padding: 13px 18px; }

/* Chat flotante — Asistente Navoa */
.navoa-agent{
  position: fixed;
  right: max(20px, env(safe-area-inset-right));
  bottom: max(20px, env(safe-area-inset-bottom));
  z-index: 95;
}
.navoa-agent__toggle{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px 8px 8px;
  border: 1px solid rgba(17,17,17,0.1);
  border-radius: var(--radius-full);
  background: rgba(250,249,246,0.94);
  color: var(--ink);
  box-shadow: 0 16px 38px -18px rgba(17,17,17,0.48);
  backdrop-filter: blur(12px) saturate(150%);
  -webkit-backdrop-filter: blur(12px) saturate(150%);
  font-family: var(--sans);
  font-size: .8438rem;
  font-weight: 500;
  cursor: pointer;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.navoa-agent__toggle:hover{
  transform: translateY(-3px);
  box-shadow: 0 20px 44px -18px rgba(17,17,17,0.56);
}
.navoa-agent__mark{
  position: relative;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--periwinkle), var(--synthio-blue));
  color: #fff;
  flex-shrink: 0;
}
.navoa-agent__mark svg{ display: block; }
.navoa-agent__dot{
  position: absolute; top: -1px; right: -1px;
  width: 9px; height: 9px; border-radius: 50%;
  background: #194B22; border: 2px solid var(--warm-white);
}

.navoa-agent__panel{
  position: absolute;
  right: 0; bottom: calc(100% + 14px);
  width: min(340px, calc(100vw - 40px));
  background: var(--warm-white);
  border: 1px solid rgba(17,17,17,0.1);
  border-radius: var(--radius-lg);
  box-shadow: 0 30px 70px -24px rgba(17,17,17,0.4);
  overflow: hidden;
  opacity: 0;
  transform: translateY(14px) scale(0.97);
  pointer-events: none;
  transition: opacity .3s var(--ease), transform .3s var(--ease);
}
.navoa-agent.is-open .navoa-agent__panel{ opacity: 1; transform: none; pointer-events: auto; }

.navoa-agent__head{
  display: flex; align-items: center; gap: 12px;
  padding: 16px 18px;
  background: var(--ink); color: var(--on-dark);
}
.navoa-agent__head .navoa-agent__mark{ width: 32px; height: 32px; }
.navoa-agent__head-text{ flex: 1; min-width: 0; }
.navoa-agent__head-text b{ display: block; font-family: var(--sans); font-size: .875rem; }
.navoa-agent__head-text span{ display: block; font-family: var(--mono); font-size: .75rem; color: var(--on-dark-soft); margin-top: 2px; }
.navoa-agent__close{
  background: none; border: none; cursor: pointer; padding: 4px; color: var(--on-dark-soft); flex-shrink: 0;
}
.navoa-agent__close:hover{ color: var(--on-dark); }

.navoa-agent__body{
  padding: 18px; min-height: 140px; max-height: 320px; overflow-y: auto;
  display: flex; flex-direction: column; gap: 10px;
}
.navoa-agent__bubble{
  background: var(--lavender); color: var(--ink);
  border-radius: 14px 14px 14px 4px;
  padding: 12px 14px;
  font-family: var(--sans);
  font-size: .8438rem; line-height: 1.5;
  max-width: 88%;
}
.navoa-agent__bubble--out{
  background: var(--ink); color: var(--on-dark);
  border-radius: 14px 14px 4px 14px;
  align-self: flex-end;
}
.navoa-agent__foot{ padding: 0 14px 14px; }
.navoa-agent__form{
  display: flex; gap: 8px; align-items: center;
  border: 1px solid rgba(17,17,17,0.12);
  border-radius: var(--radius-full);
  padding: 6px 6px 6px 16px;
}
.navoa-agent__form input{
  flex: 1; min-width: 0; border: none; outline: none; background: none;
  font-family: var(--sans); font-size: .8438rem; color: var(--ink);
}
.navoa-agent__send{
  width: 32px; height: 32px; border-radius: 50%; border: none; cursor: pointer;
  background: var(--ink); color: var(--on-dark);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  transition: background .25s var(--ease);
}
.navoa-agent__send:hover{ background: var(--synthio-blue); }
.navoa-agent__wa{ display: block; margin-top: 10px; font-size: .75rem; color: var(--text-softer); text-align: center; }
.navoa-agent__wa a{ color: var(--synthio-blue); font-weight: 500; }

@media (max-width:767px){
  .navoa-agent{
    right: max(14px, env(safe-area-inset-right));
    bottom: max(14px, env(safe-area-inset-bottom));
  }
  .navoa-agent__toggle{ padding: 7px; }
  .navoa-agent__toggle .navoa-agent__label{ display: none; }
  .navoa-agent__toggle .navoa-agent__mark{ width: 42px; height: 42px; }
  .navoa-agent__panel{ width: min(320px, calc(100vw - 28px)); }
}

/* =========================================================
   Navbar
========================================================= */
.nav{
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  background: var(--top-lilac);
  border-bottom: 1px solid rgba(33,18,23,0.1);
}
.nav-inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 1px var(--edge);
  min-height: var(--nav-h);
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 20px;
}
.logo{
  font-family: var(--sans);
  font-weight: 500;
  font-size: 1.0312rem;
  letter-spacing: 0.06em;
  color: var(--bar-on);
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.logo__img{ display: block; height: 19px; width: auto; }
.nav-links{
  display: flex;
  justify-content: center;
  gap: 30px;
  font-size: .9281rem;
  color: var(--ink);
}
.nav-links a{
  position: relative;
  padding: 4px 0;
  opacity: 1;
  transition: opacity .3s var(--ease), color .3s var(--ease);
}
.nav-links a::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-2px;
  height:1px; background: var(--lilac-ink);
  transform: scaleX(0); transform-origin: left;
  transition: transform .35s var(--ease);
}
.nav-links a:hover{ opacity: 1; color: var(--ink); }
.nav-links a:hover::after{ transform: scaleX(1); }
.nav-links__mobile-cta{ display: none; }

.nav-right{
  display: flex;
  align-items: center;
  gap: 14px;
  justify-self: end;
}

.nav-toggle{
  display:none;
  background:none; border:none; cursor:pointer;
  width: 30px; height: 24px;
  flex-direction: column; justify-content: space-between;
  padding: 3px 0;
}
.nav-toggle span{
  display:block; height:1.5px; width:100%;
  background: var(--ink);
  transition: transform .3s var(--ease), opacity .3s var(--ease);
}

.lang-switch{
  display: none;
  align-items: center;
  gap: 10px;
}
.lang-switch__item{
  display: inline-block;
  background: none;
  border: none;
  padding: 8px 4px;
  margin: 0;
  font-family: var(--sans);
  font-size: .8938rem;
  letter-spacing: 0.02em;
  line-height: 1;
  color: var(--ink);
  text-decoration: none;
  cursor: pointer;
  transition: color .25s var(--ease);
}
.lang-switch__item:hover{ color: var(--bar-on); }
.lang-switch__item.is-active{
  color: #6366F1;
  font-weight: 500;
}
.lang-switch__sep{
  width: 1px;
  height: 11px;
  background: rgba(33,18,23,0.14);
}

@media (min-width:768px){
  .lang-switch{ display: inline-flex; }
}

@media (max-width:767px){
  .nav-inner{ grid-template-columns: auto auto; }
  .nav-links{
    position: fixed;
    top: var(--nav-h); left: 0; right: 0;
    background: var(--warm-white);
    flex-direction: column;
    gap: 0;
    border-bottom: 1px solid rgba(17,17,17,0.08);
    max-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    transition: max-height .45s var(--ease);
    color: var(--ink);
  }
  .nav-links.open{ max-height: calc(100dvh - var(--nav-h)); }
  .nav-links a{
    padding: 16px var(--edge);
    border-top: 1px solid rgba(17,17,17,0.06);
    opacity: 1;
  }
  .nav-links a::after{ display: none; }
  .nav-links a:hover{ color: var(--ink); }
  .nav-links__mobile-cta{
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--lilac-ink);
    font-weight: 500;
  }
  .nav-toggle{ display: flex; }
  .nav-toggle.active span:nth-child(1){ transform: translateY(9px) rotate(45deg); }
  .nav-toggle.active span:nth-child(2){ opacity: 0; }
  .nav-toggle.active span:nth-child(3){ transform: translateY(-9px) rotate(-45deg); }
}

/* =========================================================
   Hero — editorial, centrado, minimalista
========================================================= */
.eyebrow{
  font-family: var(--mono);
  font-size: .75rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--synthio-blue);
  margin-bottom: 26px;
  display: block;
}
.eyebrow--dark{ color: var(--text-soft); }
.eyebrow--lilac{ color: #194B22; }
.eyebrow--accent-blue{ color: var(--synthio-blue); font-weight: 500; }

.hero{
  position: relative;
  overflow: hidden;
  min-height: 100svh;
  padding: calc(var(--nav-h) + clamp(54px,10vh,66px)) var(--edge) clamp(20px,4vh,40px);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  background:
    radial-gradient(60% 60% at 50% 0%, rgba(185,207,255,0.22), transparent 68%),
    radial-gradient(46% 46% at 12% 92%, rgba(185,207,255,0.14), transparent 70%),
    var(--warm-white);
  text-align: center;
}
.hero::before{
  content:"";
  position:absolute; inset:0; pointer-events:none;
  background-image: radial-gradient(circle, rgba(33,18,23,0.14) 1px, transparent 1.4px);
  background-size: 30px 30px;
  mask-image: radial-gradient(60% 55% at 50% 18%, #000, transparent 78%);
  -webkit-mask-image: radial-gradient(60% 55% at 50% 18%, #000, transparent 78%);
  opacity: .8;
}

.hero-inner{
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(14px,2vh,22px);
}

.hero-title{
  font-family: var(--font-body);
  font-style: normal;
  font-weight: 500;
  font-size: clamp(1.75rem, 5.2vw, 4rem);
  line-height: .98;
  letter-spacing: -0.045em;
  color: var(--ink);
  white-space: nowrap;
}
.hero-title__line{
  display: inline;
}
.hero-title__dark{ color: var(--ink); }
.hero-title__accent{ color: #4E5AE0; }
.hero-title__sub{
  display: block;
  white-space: normal;
  margin-top: clamp(18px,3vh,30px);
  font-family: var(--sans);
  font-style: normal;
  font-weight: 400;
  font-size: 1.0625rem;
  line-height: 1.4;
  letter-spacing: -0.01em;
  color: var(--text-soft);
}
@media (max-width:767px){
  .hero-title{ font-size: clamp(1.25rem, 7.5vw, 1.875rem); }
  .hero-title__sub{ font-size: 1rem; }
}

.hero-actions{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

.btn-lilac{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 18px;
  border-radius: 10px;
  background: var(--ink);
  color: #F9F4F1;
  font-family: var(--sans);
  font-weight: 500;
  font-size: .875rem;
  line-height: 1;
  transition: transform .4s var(--ease), box-shadow .4s var(--ease);
}
.btn-lilac:hover{ transform: translateY(-2px); box-shadow: 0 16px 32px -16px rgba(33,18,23,0.45); }
.btn-lilac svg{ flex-shrink:0; }

.btn-outline-lilac{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 12px 18px;
  border-radius: 10px;
  border: 1.5px solid rgba(33,18,23,0.34);
  color: var(--lilac-ink);
  font-family: var(--sans);
  font-weight: 500;
  font-size: .875rem;
  line-height: 1;
  background: #F9F4F1;
  transition: transform .4s var(--ease), background .4s var(--ease), border-color .4s var(--ease);
}
.btn-outline-lilac:hover{ background: rgba(33,18,23,0.06); border-color: var(--lilac-ink); transform: translateY(-2px); }
.btn-outline-lilac svg{ flex-shrink:0; }

/* =========================================================
   Hero demo — buscador con tipeo + rotación automática por industria
========================================================= */
.hero-demo{
  scroll-margin-top: calc(var(--nav-h) + 16px);
  width: 100%;
  max-width: 1080px;
}

.hero-demo-stage{
  position: relative;
  width: 100%;
  border-radius: 32px;
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(150deg, #F9F4F1 0%, #F6ECE4 52%, #F4E7DD 100%);
}

.hero-demo-scene{ position:absolute; inset:0; opacity:0; transition: opacity .9s var(--ease); }
.hero-demo-scene.is-active{ opacity:1; }
.hero-demo-scene::before,
.hero-demo-scene::after{ content:""; position:absolute; border-radius:50%; filter:blur(46px); }
.hero-demo-scene--clinicas{ background: linear-gradient(150deg, #F6ECE4 0%, #F4E7DD 100%); }
.hero-demo-scene--clinicas::before{ width:40%; height:82%; top:-22%; right:-6%; background: rgba(185,207,255,0.35); }
.hero-demo-scene--clinicas::after{ width:32%; height:60%; bottom:-22%; left:2%; background: rgba(246,236,228,0.7); }
.hero-demo-scene--laboratorios{ background: linear-gradient(150deg, #F6ECE4 0%, #F4E7DD 100%); }
.hero-demo-scene--laboratorios::before{ width:55%; height:85%; top:-25%; left:-10%; background: rgba(185,207,255,0.55); filter: blur(90px); }
.hero-demo-scene--laboratorios::after{ width:45%; height:65%; bottom:-20%; right:-8%; background: rgba(246,236,228,0.6); filter: blur(90px); }
.hero-demo-scene--hospitales{ background: linear-gradient(150deg, #F6ECE4 0%, #F4E7DD 100%); }
.hero-demo-scene--hospitales::before{ width:55%; height:85%; top:-25%; left:-10%; background: rgba(251,245,130,0.55); filter: blur(90px); }
.hero-demo-scene--hospitales::after{ width:42%; height:62%; bottom:-18%; right:-6%; background: rgba(246,236,228,0.6); filter: blur(90px); }

.hero-demo-content{
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  height: calc(2 * clamp(52px,8vh,76px) + 278.8px);
  padding: 0 clamp(32px,6vw,64px) 19px;
}

.hero-search-zone{
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-search-stack{
  position: relative;
  display: grid;
  align-items: center;
  width: 100%;
  min-width: 0;
  max-width: 780px;
  margin: 0 auto;
  overflow: visible;
}
.hero-search{
  grid-area: 1 / 1;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 22px 28px;
  border-radius: 18px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  box-sizing: border-box;
  background: rgba(252,250,248,0.8);
  border: 1px solid rgba(252,250,248,0.92);
  box-shadow: 0 20px 40px -22px rgba(33,18,23,0.35);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  opacity: 0;
  visibility: hidden;
  transition: opacity .55s var(--ease), visibility .55s, padding .5s var(--ease), border-radius .5s var(--ease);
  pointer-events: none;
}
.hero-search[data-search="clinicas"]{ padding: 22px 28px; border-radius: 18px; }
.hero-search[data-search="laboratorios"]{ padding: 24px 40px; border-radius: 24px; justify-content: center; }
.hero-search[data-search="hospitales"]{ padding: 70px 28px; border-radius: 24px; }
.hero-search[data-search="laboratorios"] .hero-search__icon{ display: none; }
.hero-search.is-active{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.hero-search.is-leaving{
  opacity: 0;
  visibility: visible;
}
.hero-search__icon{ flex-shrink:0; color: var(--lilac-ink); opacity: .68; }
.hero-search__field{
  position: relative;
  flex: 1;
  min-width: 0;
  min-height: 24.8px;
  display: flex;
  align-items: center;
  text-align: left;
  overflow: hidden;
}
.hero-search[data-search="laboratorios"] .hero-search__field{
  min-height: 96.8px;
  flex: 0 1 auto;
  width: 100%;
  max-width: 620px;
  justify-content: center;
  text-align: center;
  margin: 0 auto;
}
.hero-search__rotator{
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  transition: opacity .25s var(--ease);
}
.hero-search__q{
  position: absolute;
  inset: 0;
  display: block;
  line-height: 24.8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: var(--sans);
  font-size: .9688rem;
  font-weight: 500;
  color: var(--graphite);
  transform: translateY(0);
  opacity: 1;
  transition: transform .5s var(--ease), opacity .5s var(--ease);
}
.hero-search__q.q-leaving{ transform: translateY(-100%); opacity: 0; }
.hero-search__q.q-enter{ transform: translateY(100%); opacity: 0; transition: none; }
.hero-search[data-search="laboratorios"] .hero-search__q{
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  white-space: normal;
  line-height: 1.35;
  font-size: 1.375rem;
  font-weight: 500;
}
.hero-search__text{
  position: relative;
  z-index: 1;
  appearance: none;
  border: none;
  outline: none;
  background: transparent;
  padding: 0;
  margin: 0;
  font-family: var(--sans);
  font-size: .9688rem;
  font-weight: 500;
  color: var(--graphite);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  flex-shrink: 1;
}
.hero-search.user-active .hero-search__rotator{ opacity: 0; }

.hero-quick-actions{
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 8px;
  white-space: nowrap;
  transition: top .5s var(--ease);
}
.hero-quick-action{
  appearance: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.9);
  background: rgba(255,255,255,0.6);
  color: var(--lilac-ink);
  font-family: var(--sans);
  font-weight: 500;
  font-size: .7812rem;
  line-height: 1;
  box-shadow: 0 6px 14px -10px rgba(33,18,23,0.35);
  transition: background .3s var(--ease), transform .3s var(--ease);
}
.hero-quick-action svg{ flex-shrink: 0; opacity: .8; }
.hero-quick-action:hover{ background: rgba(255,255,255,0.9); transform: translateY(-1px); }

.hero-demo-tabs{
  display: inline-flex;
  align-self: center;
  gap: 3px;
  padding: 3px;
  border-radius: 10px;
  background: rgba(255,255,255,0.5);
  border: 1px solid var(--lilac-line);
}
.hero-demo-tab{
  appearance: none;
  border: none;
  cursor: pointer;
  padding: 7px 14px;
  border-radius: 7px;
  font-family: var(--sans);
  font-weight: 500;
  font-size: .7812rem;
  color: var(--text-soft);
  opacity: 1;
  background: transparent;
  transition: color .3s var(--ease), background .35s var(--ease), box-shadow .35s var(--ease);
}
.hero-demo-tab:hover{ color: var(--ink); }
.hero-demo-tab.is-active{
  color: #F9F4F1;
  background: var(--ink);
  box-shadow: 0 6px 14px -8px rgba(17,17,17,0.5);
}
.hero-demo-tab.is-active:hover{ color: #F9F4F1; }

@media (max-width:767px){
  .hero{ padding: calc(var(--nav-h) + 18px) 20px 28px; }
  .hero-actions{ flex-direction:column; align-items:stretch; width:100%; max-width:280px; }
  .btn-lilac, .btn-outline-lilac{ justify-content:center; }
  .hero-demo-content{ height: calc(2 * clamp(52px,8vh,76px) + 237px); }
  .hero-search{ padding: 16px 18px; border-radius: 14px; }
  .hero-search[data-search="clinicas"]{ padding: 16px 18px; border-radius: 14px; }
  .hero-search[data-search="laboratorios"]{ padding: 14px 22px; border-radius: 20px; }
  .hero-search[data-search="hospitales"]{ padding: 52px 18px; border-radius: 20px; }
  .hero-search__text, .hero-search__q{ font-size: .7812rem; }
  .hero-search__q{ line-height: 20px; }
  .hero-search__field{ min-height: 20px; }
  .hero-search[data-search="laboratorios"] .hero-search__field{ min-height: 80px; max-width: 100%; }
  .hero-search[data-search="laboratorios"] .hero-search__q{ font-size: 1.0625rem; line-height: 1.3; }
  .hero-demo-tabs{ width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .hero-demo-tab{ padding: 7px 14px; white-space: nowrap; }
  .hero-quick-actions{ width: 100%; left: 0; transform: none; justify-content: flex-start; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .hero-quick-action{ padding: 7px 12px; font-size: .75rem; }
}

@media (prefers-reduced-motion: reduce){
  .hero-search__q{ transition: none !important; }
  .hero-search{ transition: none; }
}

/* =========================================================
   Section titles (shared)
========================================================= */
.section-title{
  font-family: var(--sans);
  font-weight: 500;
  font-size: clamp(1.75rem, 3.2vw, 2.5rem);
  line-height: 1.15;
  letter-spacing: -0.015em;
  max-width: 780px;
  margin-top: 14px;
}
.section-lead{
  margin-top: 20px;
  max-width: 560px;
  font-size: 1.0312rem;
  line-height: 1.65;
  color: var(--text-soft);
}
.products-closing{
  margin-top: 20px;
  max-width: 460px;
  font-family: var(--serif);
  font-style: italic;
  font-size: .9375rem;
  line-height: 1.55;
  color: var(--text-soft);
}

/* =========================================================
   02 · Cómo generamos impacto
========================================================= */

@media (max-width:767px){
  .journey{ grid-template-columns: 1fr; gap: 0; }
  .journey-line{ top: 0; bottom: 0; left: 6px; right: auto; width: 1px; height: 100%;
    transform: scaleY(0); transform-origin: top; }
  .journey-line.grow{ transform: scaleY(1); }
  .journey-step{ padding: 0 0 40px 34px; }
  .journey-step::before{ top: 4px; left: 0; }
  .journey-step--results{ margin-top: 0; margin-left: 0; }
}

/* =========================================================
   03 · Productos
========================================================= */
.products{ background: var(--warm-white); padding: 120px 0 0; }
.products-head{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--edge) 64px;
}

.product-panel{
  padding: 90px var(--edge);
  position: relative;
  overflow: hidden;
}
.product-panel__inner{
  max-width: var(--container);
  margin: 0 auto;
}
.product-panel--lavender{ background: var(--lavender); }
.product-panel--blue{ background: var(--powder); }
.product-panel--cream{ background: var(--cream); }

.product-panel__index{
  font-family: var(--mono);
  font-size: .8125rem;
  color: var(--periwinkle-deep);
  letter-spacing: 0.08em;
  margin-bottom: 18px;
}
.product-panel__title{
  font-family: var(--sans);
  font-weight: 500;
  font-size: clamp(1.75rem, 3.6vw, 2.75rem);
  letter-spacing: -0.015em;
  max-width: 620px;
}
.product-panel__descriptor{
  margin-top: 16px;
  font-size: .9062rem;
  letter-spacing: .08em;
  color: var(--text-soft);
  text-transform: uppercase;
  font-family: var(--mono);
  font-size: .75rem;
}
.product-panel__caps{
  margin-top: 34px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  max-width: 640px;
}
.product-panel__caps li{
  font-size: .875rem;
  padding: 9px 16px;
  border-radius: var(--radius-full);
  background: rgba(255,255,255,0.55);
  border: 1px solid rgba(17,17,17,0.08);
  color: var(--ink);
}
.product-panel__copy{
  margin-top: 34px;
  max-width: 560px;
  font-family: var(--serif);
  font-size: 1.25rem;
  line-height: 1.5;
  color: var(--ink);
}
.product-panel__note{
  margin-top: 44px;
  padding-top: 28px;
  border-top: 1px solid rgba(17,17,17,0.12);
  max-width: 460px;
}
.product-panel__note span{
  font-family: var(--mono);
  font-size: .75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--periwinkle-deep);
}
.product-panel__note p{
  margin-top: 8px;
  font-size: .9375rem;
  color: var(--text-soft);
}

.academy-flow{
  margin-top: 40px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  font-family: var(--sans);
  font-weight: 500;
  font-size: .9375rem;
  color: var(--ink);
}
.academy-flow svg{ color: var(--periwinkle-deep); flex-shrink: 0; }

@media (max-width:767px){
  .product-panel{ padding: 64px 22px; }
}

/* =========================================================
   04 · Experiencia & ecosistema
========================================================= */
.ecosystem{ background: var(--lavender); padding: 120px 0; }

.eco-grid{
  margin-top: 70px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(17,17,17,0.1);
  border: 1px solid rgba(17,17,17,0.1);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.eco-card{
  background: var(--lavender);
  padding: 40px 30px;
  transition: background .4s var(--ease);
}
.eco-card:hover{ background: rgba(255,255,255,0.5); }
.eco-card__num{
  font-family: var(--mono);
  font-size: .75rem;
  color: var(--periwinkle-deep);
  display:block;
  margin-bottom: 22px;
}
.eco-card h3{
  font-size: 1.125rem;
  font-weight: 500;
  letter-spacing: -0.01em;
  margin-bottom: 10px;
}
.eco-card p{
  font-size: .9062rem;
  line-height: 1.55;
  color: var(--text-soft);
}

@media (max-width:767px){
  .eco-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width:767px){
  .eco-grid{ grid-template-columns: 1fr; }
}

/* =========================================================
   05 · CTA Final
========================================================= */
.cta-final{
  background: var(--gradient-warm);
  color: #fff;
  padding: 130px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.cta-final::before{
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(circle at 25% 20%, rgba(255,255,255,0.2), transparent 55%);
  pointer-events: none;
}
.cta-final .section-inner{ position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; }

.cta-final__title{
  font-family: var(--sans);
  font-weight: 500;
  font-size: clamp(1.75rem, 3.6vw, 2.625rem);
  line-height: 1.15;
  letter-spacing: -0.015em;
  max-width: 720px;
  color: #fff;
}
.cta-final__copy{
  margin-top: 22px;
  max-width: 540px;
  font-size: 1.0312rem;
  line-height: 1.65;
  color: rgba(255,255,255,0.92);
}

.cta-stack{
  margin-top: 48px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-family: var(--mono);
  font-size: .8125rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.85);
}
.cta-stack .plus{ color: #fff; }

.btn-split--cta{ margin-top: 46px; }
.btn-split--cta .btn-split__left{ background: #fff; color: var(--ink); }
.btn-split--cta .btn-split__right{ background: var(--ink); color: #fff; }

.cta-final__close{
  margin-top: 56px;
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.125rem;
  line-height: 1.6;
  color: rgba(255,255,255,0.8);
}

/* =========================================================
   06 · Footer
========================================================= */
.footer{
  background: var(--graphite-2);
  color: var(--warm-white);
  padding: 90px 0 40px;
}
.footer-inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--edge);
}

.footer-top{
  display: grid;
  grid-template-columns: 1.6fr repeat(4, 1fr) 1.3fr;
  gap: 32px;
  padding-bottom: 70px;
  border-bottom: 1px solid rgba(250,249,246,0.12);
}

.footer-brand .logo--footer{
  font-size: 1.25rem;
  color: var(--warm-white);
}
.footer-brand p{
  margin-top: 16px;
  font-size: .875rem;
  color: var(--on-dark-soft);
  max-width: 200px;
  line-height: 1.55;
}

.footer-col h4{
  font-family: var(--mono);
  font-size: .75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--periwinkle);
  margin-bottom: 20px;
}
.footer-col a{
  display: block;
  font-size: .875rem;
  color: var(--on-dark-soft);
  margin-bottom: 12px;
  transition: color .3s var(--ease);
}
.footer-col a:hover{ color: var(--warm-white); }
.footer-col--contact p{
  font-size: .875rem;
  color: var(--on-dark-soft);
  line-height: 1.55;
  margin-bottom: 22px;
}

.footer-bottom{
  padding-top: 34px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
}
.footer-legal{
  font-size: .7812rem;
  color: var(--on-dark-softer);
}
.footer-loop{
  font-family: var(--mono);
  font-size: .75rem;
  letter-spacing: .08em;
  color: var(--on-dark-soft);
}
.footer-loop span{ color: var(--periwinkle); margin: 0 6px; }

@media (max-width:1023px){
  .footer-top{ grid-template-columns: 1fr 1fr; row-gap: 46px; }
}
@media (max-width:767px){
  .footer-top{ grid-template-columns: 1fr; }
  .footer-bottom{ flex-direction: column; align-items: flex-start; }
}

/* =========================================================
   Section paddings — responsive rhythm
========================================================= */
@media (max-width:767px){
  .products{ padding: 90px 0 0; }
  .products-head{ padding-bottom: 46px; }
  .cta-final{ padding: 90px 0; }
  .footer{ padding: 70px 0 32px; }
}

/* =========================================================
   NAV — dropdown "Productos"
========================================================= */
.nav-item{ position: relative; }
.nav-item > a{ display:flex; align-items:center; gap: 5px; cursor: pointer; }
.nav-caret{ transition: transform .3s var(--ease); }
.nav-item:hover .nav-caret,
.nav-item.open .nav-caret{ transform: rotate(180deg); }

.nav-dropdown{
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  transform: translateX(-50%) translateY(6px);
  min-width: 300px;
  background: var(--ink);
  border-radius: var(--radius-md);
  padding: 10px;
  box-shadow: 0 24px 48px -20px rgba(17,17,17,0.4);
  opacity: 0;
  visibility: hidden;
  transition: opacity .28s var(--ease), transform .28s var(--ease), visibility .28s;
  z-index: 50;
}
.nav-item:hover .nav-dropdown,
.nav-item.open .nav-dropdown{
  opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
}
.nav-dropdown a{
  display: block;
  padding: 13px 16px;
  border-radius: 10px;
  transition: background .25s var(--ease);
}
.nav-dropdown a:hover{ background: rgba(255,255,255,0.06); }
.nav-dropdown a strong{
  display: block;
  font-size: .9062rem;
  font-weight: 500;
  color: var(--on-dark);
}
.nav-dropdown a span{
  display: block;
  margin-top: 3px;
  font-size: .7812rem;
  color: var(--on-dark-soft);
}
@media (max-width:767px){
  .nav-item > a{ justify-content: space-between; }
  .nav-dropdown{
    position: static;
    left: auto;
    width: auto;
    min-width: 0;
    transform: none;
    opacity: 1; visibility: visible;
    display: none; box-shadow: none; background: rgba(17,17,17,0.03);
    margin: 0 var(--edge) 10px;
    padding: 6px 0;
    border-radius: 14px;
  }
  .nav-item.open .nav-dropdown{
    display: block;
    transform: none;
  }
  .nav-dropdown a{
    width: 100%;
    padding: 13px 16px;
  }
  .nav-dropdown a strong{ color: var(--ink); }
  .nav-dropdown a span{ color: var(--text-soft); }
}

/* =========================================================
   Dark-section utility (alternating rhythm)
========================================================= */
.section--dark{ background: var(--ink); color: var(--on-dark); }
.section--dark .eyebrow{ color: var(--periwinkle); }
.section--dark .section-title{ color: var(--on-dark); }
.section--dark .section-lead{ color: var(--on-dark-soft); }

/* =========================================================
   Productos — resumen (home) con link a página propia
========================================================= */
.product-grid{
  margin-top: 70px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.product-card{
  background: var(--warm-white);
  border: 1px solid rgba(17,17,17,0.1);
  border-radius: var(--radius-lg);
  padding: 40px 32px;
  transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
}
.product-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 24px 48px -24px rgba(17,17,17,0.22);
  border-color: var(--periwinkle);
}
.product-card__index{
  font-family: var(--mono);
  font-size: .75rem;
  color: var(--periwinkle-deep);
  letter-spacing: 0.08em;
  margin-bottom: 22px;
  display: block;
}
.product-card h3{
  font-family: var(--sans);
  font-weight: 500;
  font-size: 1.375rem;
  letter-spacing: -0.01em;
  margin-bottom: 14px;
}
.product-card p{
  font-size: .9375rem;
  line-height: 1.6;
  color: var(--text-soft);
  min-height: 76px;
}
.product-card__link{
  margin-top: 24px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--sans);
  font-weight: 500;
  font-size: .9062rem;
  color: var(--ink);
}
.product-card__link svg{ transition: transform .3s var(--ease); color: var(--periwinkle-deep); }
.product-card:hover .product-card__link svg{ transform: translateX(4px); }

@media (max-width:1023px){ .product-grid{ grid-template-columns: 1fr; } }

/* =========================================================
   Así se ve una decisión de salud — journey ilustrativo (dark)
========================================================= */
.decision-demo{ background: var(--ink); padding: 120px 0; color: var(--on-dark); }
.decision-demo__label{
  font-family: var(--mono);
  font-size: .75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--periwinkle);
  margin-bottom: 20px;
  display: block;
}
.decision-demo__scenario{
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1.25rem, 2.6vw, 1.75rem);
  color: var(--on-dark);
  max-width: 680px;
  margin-bottom: 60px;
}
.decision-flow{
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
}
.decision-flow__step{
  padding: 12px 18px;
  border-radius: var(--radius-full);
  border: 1px solid rgba(250,249,246,0.18);
  font-size: .875rem;
  color: var(--on-dark-soft);
  background: rgba(250,249,246,0.03);
}
.decision-flow__arrow{ color: var(--periwinkle); flex-shrink: 0; }
.decision-demo__disclaimer{
  margin-top: 50px;
  font-size: .8125rem;
  color: var(--on-dark-softer);
  max-width: 520px;
}

/* =========================================================
   Ecosistema — stat cards
========================================================= */
.stat-grid{
  margin-top: 60px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: rgba(17,17,17,0.1);
  border: 1px solid rgba(17,17,17,0.1);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.stat-card{ background: var(--warm-white); padding: 38px 30px; }
.stat-card__value{
  font-family: var(--sans);
  font-weight: 500;
  font-size: clamp(1.75rem, 3vw, 2.375rem);
  color: var(--periwinkle-deep);
  letter-spacing: -0.01em;
}
.stat-card__label{
  margin-top: 10px;
  font-size: .8438rem;
  line-height: 1.5;
  color: var(--text-soft);
}
@media (max-width:767px){ .stat-grid{ grid-template-columns: 1fr; } }

/* =========================================================
   Product pages — hero + capability cards + diff line
========================================================= */
.product-hero{
  padding: 150px var(--edge) 90px;
  background: var(--warm-white);
}
.product-hero__inner{ max-width: var(--container); margin: 0 auto; }
.product-hero__tag{
  font-family: var(--mono);
  font-size: .75rem;
  letter-spacing: 0.08em;
  color: var(--periwinkle-deep);
  text-transform: uppercase;
  margin-bottom: 24px;
  display: block;
}
.product-hero h1{
  font-family: var(--sans);
  font-weight: 500;
  font-size: clamp(1.875rem, 3.6vw, 2.75rem);
  line-height: 1.15;
  letter-spacing: -0.015em;
  max-width: 840px;
  color: var(--ink);
}
.product-hero__pain2{
  margin-top: 22px;
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--text-soft);
  max-width: 640px;
}
.product-hero__meta{
  margin-top: 34px;
  font-family: var(--mono);
  font-size: .7812rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-softer);
}

.capability-band{ background: var(--ink); padding: 100px 0; }
.capability-grid{
  margin-top: 50px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.capability-card{
  background: rgba(250,249,246,0.04);
  border: 1px solid rgba(250,249,246,0.1);
  border-radius: var(--radius-lg);
  padding: 34px 28px;
}
.capability-card h3{
  font-family: var(--sans);
  font-weight: 500;
  font-size: 1.125rem;
  color: var(--on-dark);
  margin-bottom: 12px;
}
.capability-card p{
  font-size: .9062rem;
  line-height: 1.6;
  color: var(--on-dark-soft);
}
@media (max-width:1023px){ .capability-grid{ grid-template-columns: 1fr; } }

.product-diff{ background: var(--warm-white); padding: 100px 0; }
.product-diff__quote{
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1.375rem, 3vw, 2rem);
  line-height: 1.4;
  color: var(--ink);
  max-width: 720px;
}

.product-cta{ background: var(--ink); padding: 110px 0; text-align: center; }
.product-cta h2{
  font-family: var(--sans);
  font-weight: 500;
  font-size: clamp(1.625rem, 3.6vw, 2.5rem);
  color: var(--on-dark);
  margin-bottom: 40px;
}

/* =========================================================
   ACADEMIA NAVOA — bloque de estilos propio
   Reutiliza tokens y componentes existentes (product-hero,
   capability-band, capability-card, product-diff, product-cta,
   stat-grid, eco-grid). Solo se agrega lo genuinamente nuevo.
========================================================= */

/* Subnav interna de Academia (Productividad / Herramientas / Comunidad / Empresas) */
.academia-subnav{
  background: var(--warm-white);
  border-bottom: 1px solid rgba(17,17,17,0.08);
  padding: 18px var(--edge);
  position: sticky;
  top: 66px;
  z-index: 40;
}
.academia-subnav__inner{
  max-width: var(--container);
  margin: 0 auto;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.academia-subnav a{
  font-family: var(--sans);
  font-weight: 500;
  font-size: .8438rem;
  padding: 9px 16px;
  border-radius: var(--radius-full);
  border: 1px solid rgba(17,17,17,0.12);
  color: var(--ink);
  transition: background .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease);
}
.academia-subnav a:hover,
.academia-subnav a.is-active{
  background: var(--ink);
  border-color: var(--ink);
  color: var(--on-dark);
}

/* Tag/badge de nivel (No técnico / Intermedio / Técnico) */
.level-badge{
  display: inline-block;
  font-family: var(--mono);
  font-size: .75rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 5px 11px;
  border-radius: var(--radius-full);
  background: var(--periwinkle-soft);
  color: var(--periwinkle-deep);
}
.level-badge--technical{ background: rgba(17,17,17,0.08); color: var(--text-soft); }

/* Grid de módulos (Bloque 2: IA para líderes y organizaciones) */
.module-grid{
  margin-top: 50px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(250,249,246,0.1);
  border: 1px solid rgba(250,249,246,0.1);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.module-card{
  background: var(--ink);
  padding: 34px 26px;
}
.module-card h3{
  font-family: var(--sans);
  font-weight: 500;
  font-size: 1rem;
  color: var(--on-dark);
  line-height: 1.3;
}
@media (max-width:1023px){ .module-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width:767px){ .module-grid{ grid-template-columns: 1fr; } }

/* Tira de herramientas (Bloque 3) */
.tool-chip-row{
  margin-top: 50px;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}
.tool-chip{
  padding: 14px 22px;
  border-radius: var(--radius-full);
  border: 1px solid rgba(17,17,17,0.14);
  font-family: var(--sans);
  font-weight: 500;
  font-size: .9062rem;
  color: var(--ink);
  background: var(--warm-white);
}

/* Tool card (página Herramientas) */
.tool-grid{
  margin-top: 50px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.tool-card{
  background: var(--warm-white);
  border: 1px solid rgba(17,17,17,0.1);
  border-radius: var(--radius-lg);
  padding: 30px 26px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.tool-card__top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.tool-card h3{ font-family: var(--sans); font-weight: 500; font-size: 1.1875rem; }
.tool-card__category{
  font-family: var(--mono); font-size: .75rem; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--periwinkle-deep);
}
.tool-card p{ font-size: .9062rem; line-height: 1.6; color: var(--text-soft); }
.tool-card__when{
  padding-top: 14px;
  border-top: 1px solid rgba(17,17,17,0.08);
  font-size: .8438rem;
  color: var(--text-soft);
}
.tool-card__when strong{ color: var(--ink); font-weight: 500; display:block; margin-bottom:4px; }
.tool-card__cta{
  margin-top: 6px;
  font-family: var(--sans); font-weight: 500; font-size: .8438rem;
  color: var(--ink);
}
@media (max-width:1023px){ .tool-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width:767px){ .tool-grid{ grid-template-columns: 1fr; } }

/* Principios (Bloque 4: Cómo aprendemos) */
.principle-row{
  margin-top: 50px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.principle-card{ text-align: left; }
.principle-card__num{
  font-family: var(--mono); font-size: .75rem; color: var(--periwinkle-deep); letter-spacing: 0.08em;
  display:block; margin-bottom: 14px;
}
.principle-card h3{ font-family: var(--sans); font-weight: 500; font-size: 1.1875rem; margin-bottom: 8px; }
.principle-card p{ font-size: .9062rem; line-height: 1.6; color: var(--text-soft); }
@media (max-width:767px){ .principle-row{ grid-template-columns: 1fr; } }

/* Equipo (Bloque 5) */
.team-grid{
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
}
.team-card{
  background: var(--warm-white);
  border: 1px solid rgba(17,17,17,0.1);
  border-radius: var(--radius-lg);
  padding: 30px 26px;
}
.team-card__avatar{
  width: 84px; height: 84px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--periwinkle), var(--periwinkle-deep));
  color: var(--on-dark);
  font-family: var(--sans);
  font-weight: 500;
  font-size: 1.625rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 22px;
}
.team-card h3{ font-family: var(--sans); font-weight: 500; font-size: 1.1875rem; margin-bottom: 4px; }
.team-card__role{
  font-family: var(--mono); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase;
  color: var(--periwinkle-deep); margin-bottom: 16px; display:block;
}
.team-card__bio{ font-size: .875rem; line-height: 1.6; color: var(--text-soft); margin-bottom: 16px; }
.team-card__focus{ font-size: .7812rem; color: var(--text-softer); border-top: 1px solid rgba(17,17,17,0.08); padding-top: 14px; }
.team-card__focus strong{ color: var(--ink); font-weight:500; }
@media (max-width:1023px){ .team-grid{ grid-template-columns: 1fr; } }

/* Comunidad — lista de beneficios */
.benefit-list{
  margin-top: 40px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px 40px;
}
.benefit-list li{
  padding-left: 26px;
  position: relative;
  font-size: .9375rem;
  line-height: 1.6;
  color: var(--on-dark-soft);
}
.benefit-list li::before{
  content: "";
  position: absolute; left: 0; top: 8px;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--periwinkle);
}
@media (max-width:767px){ .benefit-list{ grid-template-columns: 1fr; } }

/* Ejemplos "lo que pasa dentro" — claramente marcados como ejemplo */
.example-card{
  background: rgba(250,249,246,0.04);
  border: 1px dashed rgba(250,249,246,0.22);
  border-radius: var(--radius-md);
  padding: 24px;
}
.example-card__tag{
  font-family: var(--mono); font-size: .75rem; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--periwinkle); margin-bottom: 12px; display:block;
}
.example-card p{ font-size: .875rem; line-height: 1.55; color: var(--on-dark-soft); }

/* FAQ accordion */
.faq-list{ margin-top: 50px; max-width: 760px; }
.faq-item{
  border-bottom: 1px solid rgba(17,17,17,0.1);
}
.faq-item__q{
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  cursor: pointer;
  padding: 24px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  font-family: var(--sans);
  font-weight: 500;
  font-size: 1rem;
  color: var(--ink);
}
.faq-item__q svg{ flex-shrink:0; transition: transform .3s var(--ease); color: var(--periwinkle-deep); }
.faq-item.open .faq-item__q svg{ transform: rotate(45deg); }
.faq-item__a{
  max-height: 0;
  overflow: hidden;
  transition: max-height .4s var(--ease);
}
.faq-item.open .faq-item__a{ max-height: 260px; }
.faq-item__a p{
  padding: 0 0 24px;
  font-size: .9062rem;
  line-height: 1.65;
  color: var(--text-soft);
  max-width: 640px;
}

/* Programa / temario — lista numerada */
.program-list{ margin-top: 40px; display: flex; flex-direction: column; gap: 0; max-width: 680px; }
.program-list li{
  display: flex;
  gap: 20px;
  padding: 18px 0;
  border-bottom: 1px solid rgba(250,249,246,0.1);
  font-size: .9375rem;
  line-height: 1.55;
  color: var(--on-dark-soft);
}
.program-list li span{
  font-family: var(--mono);
  font-size: .75rem;
  color: var(--periwinkle);
  flex-shrink: 0;
  padding-top: 2px;
}

/* Track cards (Empresas) */
.track-card{
  background: var(--warm-white);
  border: 1px solid rgba(17,17,17,0.1);
  border-radius: var(--radius-lg);
  padding: 38px 32px;
}
.track-card h3{ font-family: var(--sans); font-weight: 500; font-size: 1.375rem; margin-bottom: 6px; }
.track-card__for{ font-size: .8438rem; color: var(--periwinkle-deep); font-weight: 500; margin-bottom: 20px; }
.track-card ul{ display: flex; flex-direction: column; gap: 10px; }
.track-card ul li{
  font-size: .9062rem; color: var(--text-soft); padding-left: 20px; position: relative;
}
.track-card ul li::before{
  content:"→"; position:absolute; left:0; color: var(--periwinkle-deep);
}
.track-grid{ margin-top: 50px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width:767px){ .track-grid{ grid-template-columns: 1fr; } }

/* Placeholder de nota de assets pendientes (visible solo como comentario en código, no en UI) */

/* =========================================================
   PRODUCTOS — layout con título al costado + carrusel 3 columnas
========================================================= */
.products-layout{
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
  min-width: 0;
}
@media (min-width:1024px){
  .products-layout{ grid-template-columns: 0.82fr 1.18fr; gap: 56px; align-items: start; }
  .products-head--sticky{ position: sticky; top: 110px; }
}

.solution-carousel{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  position: relative;
  padding: clamp(20px, 2.6vw, 30px);
  border-radius: var(--radius-lg);
  min-width: 0;
  background:
    radial-gradient(ellipse 60% 40% at 15% 10%, rgba(185,207,255,0.22), transparent 60%),
    radial-gradient(ellipse 55% 45% at 85% 25%, rgba(25,75,34,0.18), transparent 60%),
    radial-gradient(ellipse 50% 50% at 30% 85%, rgba(185,207,255,0.16), transparent 60%),
    radial-gradient(ellipse 55% 45% at 90% 90%, rgba(185,207,255,0.14), transparent 60%),
    linear-gradient(165deg, #F9F4F1 0%, #F6ECE4 45%, #F4E7DD 100%);
}
.solution-carousel::before{
  content: '';
  position: absolute; inset: 0;
  border-radius: var(--radius-lg);
  opacity: 0.5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  pointer-events: none;
}
.solution-network{
  position: absolute;
  top: 20px; left: 9%; right: 9%;
  height: 20px;
  pointer-events: none;
  z-index: 0;
}

/* Conexión sutil entre las 3 columnas — "sistema", no cajas aisladas */
.solution-column{
  position: relative; z-index: 1; min-width: 0;
  --col-accent: #211217;
  --col-wash: linear-gradient(135deg, rgba(185,207,255,0.28), rgba(255,255,255,0.8));
}
.solution-column:nth-of-type(2){ --col-accent:#194B22; --col-wash: linear-gradient(135deg, rgba(185,207,255,0.35), rgba(255,255,255,0.8)); }
.solution-column + .solution-column::before{
  content: '';
  position: absolute;
  left: -9px; top: 78px; bottom: 24px;
  width: 1px;
  background: linear-gradient(to bottom, transparent, rgba(33,18,23,0.28) 12%, rgba(33,18,23,0.28) 88%, transparent);
}

.solution-column__title{
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 16px;
  margin-bottom: 20px;
  border-bottom: 2px solid var(--col-accent);
}
.solution-column__icon{
  position: relative;
  display: flex; align-items: center; justify-content: center;
  width: 38px; height: 38px;
  border-radius: 11px;
  flex-shrink: 0;
  background: var(--col-wash);
  color: var(--col-accent);
  box-shadow: 0 10px 20px -12px var(--col-accent);
}
.solution-column__icon::before{ content:''; position:absolute; inset:7px; border-radius:50%; background:var(--col-accent); opacity:.28; filter:blur(5px); }
.solution-column__icon svg{ position:relative; width: 19px; height: 19px; }
.solution-column__icon::after{ content:''; position:absolute; top:-3px; right:-3px; width:7px; height:7px; border-radius:50%; background:var(--col-accent); box-shadow:0 0 0 2.5px var(--warm-white); }
.solution-column__label{ display:flex; flex-direction:column; line-height:1.2; min-width:0; }
.solution-column__label b{ font-family: var(--sans); font-weight:500; font-size:.9062rem; letter-spacing:-0.005em; color:var(--ink); }
.solution-column__label span{ font-family:var(--mono); font-size:.75rem; letter-spacing:.08em; color:var(--col-accent); margin-top:3px; }

.solution-column__track{
  height: clamp(420px, 46vh, 500px);
  overflow: hidden;
  position: relative;
  -webkit-mask-image: linear-gradient(to bottom, transparent, black 10%, black 88%, transparent);
  mask-image: linear-gradient(to bottom, transparent, black 10%, black 88%, transparent);
}
.solution-column__list{
  display: flex;
  flex-direction: column;
  gap: 12px;
  animation: solution-scroll 22s linear infinite;
}
.solution-column__list--slow{ animation-duration: 27s; animation-direction: reverse; }
.solution-column__track:hover .solution-column__list{ animation-play-state: paused; }

/* Orden estratégico Hospitales: Service Agent primero, luego capacidades */
.solution-column:nth-of-type(2) .solution-card:nth-child(4){ order:1; }
.solution-column:nth-of-type(2) .solution-card:nth-child(1){ order:2; }
.solution-column:nth-of-type(2) .solution-card:nth-child(2){ order:3; }
.solution-column:nth-of-type(2) .solution-card:nth-child(3){ order:4; }
.solution-column:nth-of-type(2) .solution-card:nth-child(8){ order:5; }
.solution-column:nth-of-type(2) .solution-card:nth-child(5){ order:6; }
.solution-column:nth-of-type(2) .solution-card:nth-child(6){ order:7; }
.solution-column:nth-of-type(2) .solution-card:nth-child(7){ order:8; }

@keyframes solution-scroll{
  from{ transform: translateY(0); }
  to{ transform: translateY(-50%); }
}

.solution-card{
  background: var(--warm-white);
  border: 1px solid rgba(17,17,17,0.09);
  border-radius: var(--radius-md);
  padding: 18px;
  flex-shrink: 0;
  transition: border-color .3s var(--ease);
}
.solution-card:hover{ border-color: var(--col-accent); }
.solution-card__icon{
  position: relative;
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px;
  border-radius: 10px;
  background: var(--col-wash);
  color: var(--col-accent);
  margin-bottom: 12px;
  box-shadow: 0 8px 16px -10px var(--col-accent);
}
.solution-card__icon::before{ content:''; position:absolute; inset:8px; border-radius:50%; background:var(--col-accent); opacity:.22; filter:blur(4px); }
.solution-card__icon svg{ position:relative; width: 17px; height: 17px; }
.solution-card h4{
  font-family: var(--sans);
  font-weight: 500;
  font-size: .7812rem;
  letter-spacing: -0.005em;
  margin-bottom: 4px;
  line-height: 1.3;
}
.solution-card p{
  font-size: .75rem;
  line-height: 1.45;
  color: var(--text-soft);
}

@media (max-width:1023px) and (min-width:768px){
  .solution-carousel{ padding: 22px; gap: 12px; }
}
@media (max-width:767px){
  .solution-carousel{ grid-template-columns: 1fr; gap: 32px; padding: 20px; }
  .solution-column__track{ height: 380px; }
  .solution-network{ display: none; }
  .solution-column + .solution-column::before{ display: none; }
}
@media (prefers-reduced-motion: reduce){
  .solution-column__list{ animation: none; }
}

/* =========================================================
   ASÍ FUNCIONA NAVOA — panel claro + gradiente (estilo Synthio)
========================================================= */
.how-it-works{ background: var(--warm-white); padding: 110px 0 70px; }
.how-it-works__inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--edge);
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
  align-items: stretch;
}
@media (min-width:1024px){
  .how-it-works__inner{ grid-template-columns: 0.85fr 1.15fr; gap: 0; }
}

.how-it-works__copy{ padding: 20px 0; }
@media (min-width:1024px){ .how-it-works__copy{ padding: 48px 56px 48px 0; } }
.how-it-works__copy .section-title{ margin-top: 14px; color: var(--ink); }
.how-it-works__points{ margin-top: 44px; display: flex; flex-direction: column; gap: 24px; }
.how-it-works__point h4{
  font-family: var(--sans); font-weight: 500; font-size: .9688rem; color: var(--ink); margin-bottom: 6px;
}
.how-it-works__point p{ font-size: .875rem; line-height: 1.6; color: var(--text-soft); }

.how-it-works__panel{
  position: relative;
  min-height: 480px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: linear-gradient(135deg, #211217 0%, #194B22 48%, #B9CFFF 100%);
}
.connector-diagram__lines{ position: absolute; inset: 0; width: 100%; height: 100%; }
.connector-line{
  stroke-dasharray: 400;
  stroke-dashoffset: 400;
  transition: stroke-dashoffset 0.8s var(--ease);
}
.how-it-works__panel.is-visible #line1{ transition-delay: 0.5s; stroke-dashoffset: 0; }
.how-it-works__panel.is-visible #line2{ transition-delay: 1.5s; stroke-dashoffset: 0; }
.how-it-works__panel.is-visible #line3{ transition-delay: 2.5s; stroke-dashoffset: 0; }

.connector-box{
  position: absolute;
  width: 220px;
  background: var(--warm-white);
  border-radius: 10px;
  padding: 16px 18px;
  box-shadow: 0 16px 32px -18px rgba(17,17,17,0.35);
  opacity: 0;
  transform: translateY(14px) scale(0.96);
  transition: opacity 0.6s var(--ease), transform 0.6s var(--ease);
}
.how-it-works__panel.is-visible #box1{ transition-delay: 0.1s; opacity: 1; transform: translateY(0) scale(1); }
.how-it-works__panel.is-visible #box2{ transition-delay: 1.1s; opacity: 1; transform: translateY(0) scale(1); }
.how-it-works__panel.is-visible #box3{ transition-delay: 2.1s; opacity: 1; transform: translateY(0) scale(1); }
.how-it-works__panel.is-visible #box4{ transition-delay: 3.1s; opacity: 1; transform: translateY(0) scale(1); }

.connector-box__label{
  display: block;
  font-family: var(--mono);
  font-size: .75rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--periwinkle-deep);
  font-weight: 500;
  margin-bottom: 10px;
}
.connector-box__icons{ display: flex; flex-wrap: wrap; gap: 8px; }
.connector-icon{
  display: flex; align-items: center; justify-content: center;
  width: 30px; height: 30px;
  border-radius: 8px;
  background: var(--periwinkle-soft);
  color: var(--periwinkle-deep);
  flex-shrink: 0;
}
.connector-icon svg{ width: 16px; height: 16px; }

.connector-box--1{ top: 8%; left: 6%; }
.connector-box--2{ top: 34%; right: 5%; }
.connector-box--3{ top: 60%; right: 5%; }
.connector-box--4{ top: 76%; left: 6%; }

.how-it-works__disclaimer{
  max-width: var(--container);
  margin: 28px auto 0;
  padding: 0 var(--edge);
  font-family: var(--mono);
  font-size: .75rem;
  color: var(--text-softer);
  text-align: center;
}

@media (max-width:767px){
  .how-it-works__panel{ min-height: 640px; }
  .connector-box{ width: 74%; }
  .connector-box--1{ left: 4%; }
  .connector-box--2{ right: 4%; }
  .connector-box--3{ right: 4%; }
  .connector-box--4{ left: 4%; }
}

/* =========================================================
   RECURSOS — grid editorial de tarjetas (noticias, guías, casos de uso)
   Estructura fija por tarjeta: categoría · miniatura · título · descripción
========================================================= */
.resources{ background: var(--warm-white); padding: 110px 0 120px; }
.resources .section-title{ color: var(--ink); }
.resources .section-lead{ color: var(--text-soft); }

.resource-grid{
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}
@media (max-width:1023px){ .resource-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width:767px){ .resource-grid{ grid-template-columns: 1fr; } }

.resource-card{
  background: var(--warm-white);
  border: 1px solid rgba(17,17,17,0.1);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.resource-card:hover{ transform: translateY(-4px); box-shadow: 0 24px 48px -26px rgba(17,17,17,0.28); border-color: var(--col-accent); }

.resource-card__art{
  position: relative;
  height: 128px;
  display: flex; align-items: center; justify-content: center;
  background: var(--col-wash);
}
.resource-card--a{ --col-accent:#211217; --col-wash: radial-gradient(circle at 30% 25%, rgba(185,207,255,0.32), transparent 60%), var(--lavender); }
.resource-card--b{ --col-accent:#194B22; --col-wash: radial-gradient(circle at 30% 25%, rgba(185,207,255,0.4), transparent 60%), var(--powder); }
.resource-card--c{ --col-accent:#211217; --col-wash: radial-gradient(circle at 30% 25%, rgba(251,245,130,0.35), transparent 60%), var(--cream); }

.resource-card__art .thumb{
  position: relative; width: 52px; height: 52px; border-radius: 14px;
  background: linear-gradient(150deg, rgba(255,255,255,0.85), rgba(255,255,255,0.35));
  border: 1px solid rgba(255,255,255,0.7);
  box-shadow: 0 16px 30px -16px var(--col-accent);
  display: flex; align-items: center; justify-content: center;
  color: var(--col-accent);
}
.resource-card__art .thumb::before{ content:''; position:absolute; inset:8px; border-radius:50%; background:var(--col-accent); opacity:.28; filter:blur(6px); }
.resource-card__art .thumb svg{ position: relative; width: 24px; height: 24px; }
.resource-card__art .thumb-dot{
  position: absolute; width:7px; height:7px; border-radius:50%; background: var(--col-accent);
  box-shadow: 0 0 0 3px var(--warm-white);
}

.resource-card__body{ padding: 22px 22px 26px; }
.resource-card__cat{
  font-family: var(--mono); font-size: .75rem; letter-spacing: 0.07em; text-transform: uppercase;
  color: var(--col-accent);
}
.resource-card__body h3{
  font-family: var(--sans); font-weight: 500; font-size: 1.0312rem; letter-spacing: -0.005em;
  line-height: 1.3; margin-top: 10px;
}
.resource-card__body p{
  margin-top: 8px; font-size: .8438rem; line-height: 1.55; color: var(--text-soft);
}

.resources-close{
  margin-top: 44px;
  font-family: var(--serif);
  font-style: italic;
  font-size: .9375rem;
  color: var(--text-soft);
  max-width: 480px;
}

/* Artículo destacado — misma foto/nota que en /recursos, versión preview del Home */
.resources-featured{
  display: grid;
  grid-template-columns: minmax(0,1.05fr) minmax(320px,.95fr);
  margin-top: 40px;
  background: #fff;
  border: 1px solid rgba(17,17,17,0.1);
  border-radius: var(--radius-lg);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.resources-featured:hover{ transform: translateY(-4px); box-shadow: 0 24px 48px -26px rgba(17,17,17,0.28); border-color: var(--ink); }
.resources-featured__image{ min-height: 360px; background: var(--lavender); overflow: hidden; }
.resources-featured__image img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.resources-featured__body{ display: flex; flex-direction: column; justify-content: center; padding: 44px clamp(28px,4vw,56px); }
.resources-featured__meta{
  display: flex; gap: 14px;
  font-family: var(--mono); font-size: .75rem; letter-spacing: 0.07em; text-transform: uppercase;
  color: var(--text-soft);
}
.resources-featured__body h3{
  font-family: var(--serif); font-weight: 500; font-size: clamp(1.5rem,2.6vw,2rem);
  line-height: 1.15; letter-spacing: -0.02em; margin: 16px 0 0; color: var(--ink);
}
.resources-featured__body p{ margin-top: 14px; max-width: 440px; font-size: .9062rem; line-height: 1.6; color: var(--text-soft); }
.resources-featured__cta{
  display: inline-flex; align-items: center; gap: 6px; margin-top: 26px;
  font-family: var(--sans); font-weight: 500; font-size: .7812rem; letter-spacing: 0.02em; color: var(--ink);
}
.resources-featured__cta svg{ width: 14px; height: 14px; transition: transform .2s var(--ease); }
.resources-featured:hover .resources-featured__cta svg{ transform: translate(3px,-3px); }

@media (max-width:767px){
  .resources-featured{ grid-template-columns: 1fr; margin-top: 28px; }
  .resources-featured__image{ min-height: 220px; }
  .resources-featured__body{ padding: 28px 24px 32px; }
}

/* =========================================================
   EQUIPO — tarjetas con tono duotono (estilo Notion, colores Navoa)
========================================================= */
.team{ background: var(--warm-white); padding: 100px 0 120px; }
.team-grid{
  margin-top: 48px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
@media (max-width:767px){ .team-grid{ grid-template-columns: 1fr; } }

.team-card{
  position: relative;
  border-radius: var(--radius-lg);
  min-height: 420px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  transition: transform .35s var(--ease);
}
.team-card:hover{ transform: translateY(-4px); }

.team-card__watermark{
  position: absolute;
  top: -6%;
  right: -4%;
  font-family: var(--serif);
  font-size: 16.25rem;
  line-height: 1;
  color: rgba(255,255,255,0.22);
  pointer-events: none;
  user-select: none;
}

.team-card--pink{ background: linear-gradient(150deg, #211217, #170D11); }
.team-card--violet{ background: linear-gradient(150deg, #211217 0%, #211217 78%, #194B22 100%); }
.team-card--sky{ background: linear-gradient(150deg, #B9CFFF 0%, #B9CFFF 78%, #194B22 100%); }

.team-card__quote{
  position: relative;
  margin: 0 0 28px;
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.1875rem;
  line-height: 1.45;
  color: #fff;
}

.team-card__footer{
  position: relative;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,0.28);
}
.team-card__name{
  font-family: var(--sans);
  font-weight: 500;
  font-size: 1.0625rem;
  color: #fff;
  margin-bottom: 3px;
}
.team-card__role{
  font-size: .8125rem;
  color: rgba(255,255,255,0.8);
  margin-bottom: 14px;
}
.team-card__link{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--mono);
  font-size: .75rem;
  letter-spacing: .08em;
  color: #fff;
  font-weight: 500;
}
.team-card__link svg{ transition: transform .3s var(--ease); }
.team-card__link:hover svg{ transform: translateX(3px); }

/* =========================================================
   SEGURIDAD Y CUMPLIMIENTO — panel con escudo animado
========================================================= */
.compliance{ background: var(--warm-white); padding: 110px 0; }
.compliance-inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--edge);
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
}
@media (min-width:1024px){
  .compliance-inner{ grid-template-columns: 0.85fr 1.15fr; gap: 56px; align-items: stretch; }
}

.compliance__list{ margin-top: 36px; display: flex; flex-direction: column; gap: 20px; list-style: none; padding: 0; }
.compliance__list li{
  font-size: .9375rem;
  line-height: 1.6;
  color: var(--text-soft);
  padding-left: 22px;
  position: relative;
}
.compliance__list li::before{
  content: '';
  position: absolute; left: 0; top: 7px;
  width: 7px; height: 7px;
  background: var(--periwinkle-deep);
}
.compliance__list li strong{ color: var(--ink); font-weight: 500; }

.compliance__visual{
  position: relative;
  min-height: 620px;
  border-radius: var(--radius-lg);
  background: linear-gradient(150deg, #211217 0%, #211217 75%, #194B22 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 56px 32px;
  overflow: hidden;
}

.compliance-shield{
  position: relative; width: 180px; height: 180px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  opacity: 0; transform: scale(0.85);
}
.compliance-shield__ring{
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.3);
  animation: shield-pulse 3.2s ease-in-out infinite;
}
.compliance-shield__ring--1{ width: 100%; height: 100%; }
.compliance-shield__ring--2{ width: 76%; height: 76%; animation-delay: 0.6s; }
@keyframes shield-pulse{
  0%, 100%{ transform: scale(1); opacity: 0.7; }
  50%{ transform: scale(1.08); opacity: 1; }
}
.compliance-shield__core{
  width: 86px; height: 86px;
  border-radius: 18px;
  background: rgba(255,255,255,0.14);
  display: flex; align-items: center; justify-content: center;
  color: #fff;
}
.compliance-shield__core svg{ width: 44px; height: 44px; }

.compliance-line{
  width: 1px;
  height: 0;
  background: rgba(255,255,255,0.4);
}

.compliance-badge{
  position: relative;
  width: 100%;
  max-width: 340px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.94);
  color: var(--ink);
  border-radius: 10px;
  padding: 14px 22px;
  margin: 12px 0;
  opacity: 0;
  transform: scale(0.82);
}

.compliance-badge svg{
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 17px; height: 17px;
  color: var(--periwinkle-deep);
  flex-shrink: 0;
}
.compliance-badge__text{
  width: 100%;
  text-align: center;
  font-family: var(--mono);
  font-size: .7812rem;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--ink);
}

.compliance-shield__tag{
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  font-family: var(--mono);
  font-size: .75rem;
  letter-spacing: .08em;
  color: rgba(255,255,255,0.85);
  background: rgba(255,255,255,0.14);
  padding: 3px 9px;
  border-radius: 100px;
}

@media (max-width:767px){
  .compliance__visual{ padding: 40px 20px; min-height: auto; }
}

/* =========================================================
   VOCES DE NUESTROS CLIENTES — prueba social pre-CTA
   (estilo Synthio: campo flotante + línea de validación central)
========================================================= */
.voices{ background: var(--warm-white); padding: 110px 0 40px; }

.voices-inner{
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
}
@media (min-width:1024px){
  .voices-inner{ grid-template-columns: 0.85fr 1.15fr; gap: 48px; align-items: stretch; }
}

.voices-intro{
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.voices-intro .eyebrow{ margin-bottom: 22px; }
.voices-intro .section-title{ color: var(--ink); margin-top: 0; }
.voices-intro .section-lead{ margin-top: 18px; max-width: 36ch; }

.voices-counter{
  margin-top: 32px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-family: var(--mono);
  font-size: .75rem;
  letter-spacing: .08em;
  color: var(--periwinkle-deep);
}
.voices-counter::before{
  content:'';
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--periwinkle-deep);
  animation: voices-counter-blink 1.6s ease-in-out infinite;
}
@keyframes voices-counter-blink{ 0%,100%{ opacity: 1; } 50%{ opacity: .3; } }

/* ---- Campo flotante ---- */
.voices-field-wrap{
  position: relative;
  min-height: 740px;
  border-radius: 10px;
  overflow: hidden;
  background: linear-gradient(135deg, #B9CFFF 0%, #B9CFFF 82%, #194B22 100%);
  border: 1px solid rgba(17,17,17,0.06);
}
.voices-field-wrap::before{
  content:'';
  position:absolute; inset:0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  opacity: 0.5;
  pointer-events: none;
}
.voices-field{
  position: absolute;
  inset: 0;
}

/* Línea de validación central */
.voices-line{
  position: absolute;
  top: 0; bottom: 0;
  left: 50%;
  width: 2px;
  transform: translateX(-50%);
  background: linear-gradient(to bottom, transparent, rgba(255,255,255,.95) 15%, rgba(255,255,255,.95) 85%, transparent);
  box-shadow: 0 0 28px 4px rgba(33,18,23,0.5), 0 0 6px 1px rgba(255,255,255,.8);
  z-index: 2;
  pointer-events: none;
}
.voices-line::before{
  content:'';
  position:absolute; top:50%; left:50%;
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--periwinkle-deep);
  transform: translate(-50%,-50%);
  box-shadow: 0 0 16px 4px rgba(33,18,23,0.6);
}

/* Chips / cards flotantes */
.voice-chip{
  position: absolute;
  left: 0;
  will-change: transform;
  z-index: 1;
}
.voice-chip__inner{
  background: rgba(255,255,255,0.5);
  border: 1px solid rgba(255,255,255,0.65);
  border-radius: 9px;
  box-shadow: 0 8px 18px -14px rgba(17,17,17,0.18);
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: background .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease);
  position: relative;
}
.voice-chip.is-validated .voice-chip__inner{
  background: var(--warm-white);
  border-color: rgba(17,17,17,0.08);
  box-shadow: 0 22px 44px -18px rgba(17,17,17,0.4);
}
.voice-chip.is-validated{ z-index: 4; }

.voice-chip__quote{
  font-family: var(--serif);
  line-height: 1.42;
  color: rgba(17,17,17,0.38);
  margin: 0;
  transition: color .4s var(--ease);
}
.voice-chip__quote::before{ content:"“"; }
.voice-chip__quote::after{ content:"”"; }
.voice-chip.is-validated .voice-chip__quote{ color: var(--ink); }

.voice-chip__person{
  display: flex;
  align-items: center;
  gap: 9px;
}
.voice-chip__avatar{
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--sans); font-weight: 500;
  color: #fff;
  flex-shrink: 0;
  opacity: .7;
  transition: opacity .4s var(--ease);
}
.voice-chip.is-validated .voice-chip__avatar{ opacity: 1; }
.voice-chip__name{
  font-family: var(--sans); font-weight: 500;
  color: var(--ink); margin: 0; line-height: 1.2;
}
.voice-chip__role{
  font-family: var(--mono);
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--periwinkle-deep); margin: 1px 0 0;
  opacity: .8;
}

.voice-chip__check{
  position: absolute;
  top: -9px; right: -9px;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--periwinkle-deep);
  display: flex; align-items: center; justify-content: center;
  opacity: 0;
  transform: scale(0.3);
  transition: opacity .3s var(--ease), transform .35s cubic-bezier(.34,1.56,.64,1);
  box-shadow: 0 6px 14px -4px rgba(33,18,23,0.6);
}
.voice-chip.is-validated .voice-chip__check{ opacity: 1; transform: scale(1); }
.voice-chip__check svg{ width: 11px; height: 11px; }

/* Tamaños — distintas escalas, ajustadas al contenido */
.voice-chip--sm{ width: 148px; }
.voice-chip--sm .voice-chip__inner{ padding: 12px 14px; }
.voice-chip--sm .voice-chip__quote{ font-size: .75rem; }
.voice-chip--sm .voice-chip__avatar{ width: 22px; height: 22px; font-size: .75rem; }
.voice-chip--sm .voice-chip__name{ font-size: .75rem; }
.voice-chip--sm .voice-chip__role{ font-size: .75rem; }

.voice-chip--md{ width: 196px; }
.voice-chip--md .voice-chip__inner{ padding: 15px 17px; }
.voice-chip--md .voice-chip__quote{ font-size: .7812rem; }
.voice-chip--md .voice-chip__avatar{ width: 27px; height: 27px; font-size: .75rem; }
.voice-chip--md .voice-chip__name{ font-size: .75rem; }
.voice-chip--md .voice-chip__role{ font-size: .75rem; }

.voice-chip--lg{ width: 236px; }
.voice-chip--lg .voice-chip__inner{ padding: 18px 20px; }
.voice-chip--lg .voice-chip__quote{ font-size: .8438rem; }
.voice-chip--lg .voice-chip__avatar{ width: 32px; height: 32px; font-size: .7812rem; }
.voice-chip--lg .voice-chip__name{ font-size: .7812rem; }
.voice-chip--lg .voice-chip__role{ font-size: .75rem; }

/* =========================================================
   Gradientes tipográficos de título — el título anticipa
   el color del panel/visual de su propia sección.
========================================================= */
.title-gradient--violet,
.title-gradient--sky,
.title-gradient--coral{
  background-clip: text !important;
  -webkit-background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}
.title-gradient--violet{
  background-image: linear-gradient(100deg, #211217 0%, #194B22 60%, #755760 100%);
}
.title-gradient--sky{
  background-image: linear-gradient(100deg, #194B22 0%, #211217 55%, #B9CFFF 100%);
}
.title-gradient--coral{
  background-image: linear-gradient(100deg, #FBF582 0%, #211217 70%, #194B22 100%);
}

/* =========================================================
   NAVOA — sistema cromático unificado de la Home
   Celeste → azul → lila/violeta, con coral controlado
========================================================= */
:root{
  --ink:#211F38;
  --graphite:#57566F;
  --graphite-2:#24213F;
  --warm-white:#FCFCFF;
  --cream:#F6F3FF;
  --powder:#DDF3FF;
  --lavender:#EEE8FF;
  --periwinkle:#746BFF;
  --periwinkle-deep:#5148D8;
  --text-soft:#626178;
  --text-softer:#858399;
  --on-dark:#FCFCFF;
  --on-dark-soft:rgba(252,252,255,.74);
  --on-dark-softer:rgba(252,252,255,.5);
  --periwinkle-soft:rgba(116,107,255,.14);
  --gradient-cool:linear-gradient(135deg,#79D8FF 0%,#628CFF 45%,#8A62E8 100%);
  --gradient-warm:linear-gradient(135deg,#75D9FF 0%,#667DFF 42%,#9A63E8 73%,#F27F9D 100%);
  --coral:#F27F9D;
  --sky:#79D8FF;
  --lilac:#9A70F2;
  --synthio-blue:#526FE8;
  --top-lilac:#EEE9FF;
  --bar-lilac-1:#F4F0FF;
  --bar-lilac-2:#E9E3FF;
  --bar-on:#25223D;
  --bar-on-soft:rgba(37,34,61,.72);
  --bar-line:rgba(81,72,216,.13);
  --lilac-ink:#5148D8;
  --lilac-line:rgba(81,72,216,.18);
  --clinics-tint-1:#F3F0FF;
  --clinics-tint-2:#E7F5FF;
  --labs-tint-1:#E9F7FF;
  --labs-tint-2:#EEE8FF;
  --hospitals-tint-1:#F2EDFF;
  --hospitals-tint-2:#E4F3FF;
}

body{background:#FCFCFF;color:var(--ink)}
.eyebrow,.eyebrow--lilac,.eyebrow--dark{color:#5C55C8}

/* Hero y selector */
.hero{
  background:
    radial-gradient(48% 56% at 10% 88%,rgba(154,112,242,.16),transparent 72%),
    radial-gradient(52% 58% at 86% 6%,rgba(121,216,255,.22),transparent 70%),
    linear-gradient(145deg,#F8F6FF 0%,#EEF7FF 50%,#F2ECFF 100%);
}
.hero::before{background-image:radial-gradient(circle,rgba(91,82,199,.17) 1px,transparent 1.4px)}
.hero-title__dark{color:#292640}.hero-title__accent{color:#655BE5}
.hero-demo-stage{
  background:
    radial-gradient(circle at 18% 18%,rgba(121,216,255,.34),transparent 38%),
    radial-gradient(circle at 84% 78%,rgba(154,112,242,.3),transparent 42%),
    linear-gradient(150deg,#F9FCFF 0%,#EEF0FF 52%,#F4ECFF 100%);
  box-shadow:0 34px 80px -40px rgba(67,70,169,.38);
}
.hero-demo-scene--clinicas,.hero-demo-scene--laboratorios,.hero-demo-scene--hospitales{background:linear-gradient(150deg,#F9FCFF 0%,#EEF1FF 55%,#F3EBFF 100%)}
.hero-demo-scene--clinicas::before{background:rgba(121,216,255,.48)}
.hero-demo-scene--clinicas::after{background:rgba(154,112,242,.3)}
.hero-demo-scene--laboratorios::before{background:rgba(105,159,255,.45)}
.hero-demo-scene--laboratorios::after{background:rgba(154,112,242,.28)}
.hero-demo-scene--hospitales::before{background:rgba(154,112,242,.4)}
.hero-demo-scene--hospitales::after{background:rgba(121,216,255,.3)}
.hero-search{border-color:rgba(93,83,202,.16);box-shadow:0 22px 55px -34px rgba(70,65,155,.42)}
.hero-demo-tab.is-active{background:linear-gradient(135deg,#596FE7,#8265E6);color:#fff;box-shadow:0 8px 20px -10px rgba(81,72,216,.7)}

/* Productos */
.products{background:linear-gradient(180deg,#FCFCFF 0%,#FAF9FF 100%)}
.solution-carousel{
  background:
    radial-gradient(ellipse 62% 48% at 10% 8%,rgba(121,216,255,.28),transparent 62%),
    radial-gradient(ellipse 58% 52% at 92% 18%,rgba(104,132,255,.2),transparent 62%),
    radial-gradient(ellipse 58% 52% at 86% 92%,rgba(154,112,242,.24),transparent 64%),
    linear-gradient(150deg,#F8FCFF 0%,#F0F1FF 48%,#F5EDFF 100%);
  box-shadow:0 30px 70px -44px rgba(69,66,151,.36);
}
.solution-column{--col-accent:#5A71E5;--col-wash:linear-gradient(135deg,rgba(121,216,255,.45),rgba(238,232,255,.9))}
.solution-column:nth-of-type(2){--col-accent:#785BD9;--col-wash:linear-gradient(135deg,rgba(154,112,242,.32),rgba(221,243,255,.9))}
.solution-network line{stroke:#6A63DC}.solution-network circle{fill:#6A63DC}
.solution-column + .solution-column::before{background:linear-gradient(to bottom,transparent,rgba(101,91,218,.24) 12%,rgba(101,91,218,.24) 88%,transparent)}
.solution-card{background:rgba(255,255,255,.82);border-color:rgba(84,77,174,.1);box-shadow:0 16px 35px -30px rgba(57,53,133,.34);backdrop-filter:blur(10px)}

/* Omnicanalidad inteligente */
.how-it-works{background:linear-gradient(180deg,#FAF9FF 0%,#F8FCFF 100%)}
.how-it-works__panel{
  background:
    radial-gradient(circle at 18% 15%,rgba(121,216,255,.52),transparent 37%),
    radial-gradient(circle at 82% 82%,rgba(242,127,157,.2),transparent 35%),
    linear-gradient(145deg,#536FE4 0%,#685EDC 46%,#9869EA 100%);
  box-shadow:0 38px 80px -38px rgba(67,64,160,.55);
}
.connector-box{background:rgba(255,255,255,.9);border-color:rgba(255,255,255,.72);box-shadow:0 18px 38px -24px rgba(35,34,102,.46)}
.connector-icon{background:linear-gradient(135deg,rgba(121,216,255,.28),rgba(154,112,242,.18));color:#5148D8}
.title-gradient--violet{background-image:linear-gradient(100deg,#394EBC 0%,#6759D9 52%,#9C65E7 100%)}

/* Seguridad, privacidad y cumplimiento */
.compliance{background:linear-gradient(180deg,#F8FCFF 0%,#F7F5FF 100%)}
.compliance__visual{
  background:
    radial-gradient(circle at 22% 18%,rgba(121,216,255,.32),transparent 35%),
    radial-gradient(circle at 82% 85%,rgba(154,112,242,.34),transparent 38%),
    linear-gradient(150deg,#354EAE 0%,#4D55C6 44%,#7354CF 100%);
  box-shadow:0 38px 80px -38px rgba(47,52,132,.58);
}
.compliance__list li::before{background:#655DE1;box-shadow:0 0 0 5px rgba(101,93,225,.1)}
.title-gradient--sky{background-image:linear-gradient(100deg,#287CB8 0%,#4E6BDC 52%,#8062DE 100%)}

/* Comunidad: misma familia, expresión más luminosa y humana */
.voices{background:linear-gradient(180deg,#F7F5FF 0%,#FCFCFF 100%)}
.voices-field-wrap{
  background:
    radial-gradient(circle at 12% 18%,rgba(255,255,255,.38),transparent 28%),
    radial-gradient(circle at 88% 82%,rgba(242,127,157,.24),transparent 35%),
    linear-gradient(135deg,#79D8FF 0%,#6C8CFA 48%,#9B69E9 100%);
  box-shadow:0 34px 75px -40px rgba(68,74,170,.48);
}
.voices-counter::before,.voices-line::before,.voice-chip__check{background:#6258DD}
.voice-chip__avatar{background:linear-gradient(135deg,#5A75E7,#9367E8)!important}
.title-gradient--coral{background-image:linear-gradient(100deg,#397FC1 0%,#6A63DC 52%,#C56FAE 84%,#ED809B 100%)}

/* Equipo: blanco dominante y acentos de marca */
.team{background:#FCFCFF}
.team-card{border:1px solid rgba(85,79,171,.1);box-shadow:0 28px 60px -42px rgba(49,47,125,.42)}
.team-card--pink{background:linear-gradient(150deg,#FFF 0%,#F9F5FF 72%,#FCEEF5 100%)}
.team-card--violet{background:linear-gradient(150deg,#FFF 0%,#F2F0FF 72%,#E9E4FF 100%)}
.team-card--sky{background:linear-gradient(150deg,#FFF 0%,#F1FAFF 72%,#E1F3FF 100%)}
.team-card__watermark{color:rgba(105,95,220,.09)}
.team-card__quote,.team-card__name,.team-card__link{color:#292640}
.team-card__role{color:#68667D}.team-card__footer{border-top-color:rgba(78,71,157,.16)}

/* Cierre y footer: profundidad sin superficies negras */
.cta-final{background:var(--gradient-warm)}
.btn-split--cta .btn-split__right{background:#403A9D}
.footer{background:linear-gradient(145deg,#28264E 0%,#34315F 55%,#493A75 100%)}
.footer-col h4,.footer-loop span{color:#AFCFFF}
.navoa-agent__head{background:linear-gradient(135deg,#4D58C8,#7658D3)}
.navoa-agent__dot{background:#79D8FF}
.navoa-agent__send{background:#5F58D7}

@media(max-width:767px){
  .solution-carousel{background:linear-gradient(155deg,#F6FBFF 0%,#F0EEFF 100%)}
}

/* =========================================================
   HOME — lienzo blanco, color concentrado
   Únicos fondos cromáticos: navegación + demo interactiva
========================================================= */
html,body,main{background:#fff}

/* 1 · Navegación: franja lila suave, misma altura */
.nav{background:#F0ECFA}
.nav-links{background:#F0ECFA}
@media(max-width:767px){.nav-links{background:#F0ECFA}}

/* Hero: todo blanco excepto la caja interactiva */
.hero{background:#fff}
.hero::before{display:none}
.hero-demo{background:transparent}
.hero-demo-stage{
  background:linear-gradient(145deg,#DDF5FF 0%,#8EBBFF 34%,#7586F1 61%,#A978EA 100%);
  box-shadow:0 28px 70px -38px rgba(67,70,169,.42);
}
.hero-demo-scene--clinicas,.hero-demo-scene--laboratorios,.hero-demo-scene--hospitales{background:transparent}
.hero-demo-scene--clinicas::before{background:rgba(255,255,255,.3)}
.hero-demo-scene--clinicas::after{background:rgba(154,112,242,.28)}
.hero-demo-scene--laboratorios::before{background:rgba(121,216,255,.4)}
.hero-demo-scene--laboratorios::after{background:rgba(255,255,255,.22)}
.hero-demo-scene--hospitales::before{background:rgba(255,255,255,.26)}
.hero-demo-scene--hospitales::after{background:rgba(154,112,242,.3)}

/* Resto de la Home: superficies blancas, sin campos ambientales */
.products,.how-it-works,.compliance,.voices,.team,.resources,.ecosystem,.cta-final{background:#fff}
.solution-carousel{
  background:#fff;
  border:1px solid rgba(39,37,64,.1);
  box-shadow:0 24px 60px -46px rgba(39,37,64,.28);
}
.solution-card{background:#fff;box-shadow:none}
.how-it-works__panel{
  background:#fff;
  border:1px solid rgba(39,37,64,.1);
  box-shadow:0 24px 60px -46px rgba(39,37,64,.28);
}
.connector-line{stroke:#8B86B8}
.connector-box{background:#fff;border-color:rgba(39,37,64,.1);box-shadow:0 14px 30px -26px rgba(39,37,64,.3)}
.compliance__visual{
  background:#fff;
  color:#5148D8;
  border:1px solid rgba(39,37,64,.1);
  box-shadow:0 24px 60px -46px rgba(39,37,64,.28);
}
.compliance-shield__ring{border-color:rgba(81,72,216,.22)}
.compliance-shield__core{background:rgba(81,72,216,.08);color:#5148D8}
.compliance-line{background:rgba(81,72,216,.28)}
.compliance-shield__tag{color:#5148D8;background:rgba(81,72,216,.08);border-color:rgba(81,72,216,.12)}
.voices-field-wrap{
  background:#fff;
  border:1px solid rgba(39,37,64,.1);
  box-shadow:0 24px 60px -46px rgba(39,37,64,.28);
}
.voices-field-wrap::before{opacity:.2}
.voices-line{background:linear-gradient(to bottom,transparent,rgba(81,72,216,.3) 15%,rgba(81,72,216,.3) 85%,transparent)}
.team-card--pink,.team-card--violet,.team-card--sky{background:#fff}
.cta-final{color:var(--ink);border-top:1px solid rgba(39,37,64,.08)}
.cta-final::before{display:none}
.cta-final__title{color:var(--ink)}
.cta-final p[style]{color:#5C55C8!important}
.btn-split--cta .btn-split__left{background:#F4F2F8;color:var(--ink)}
.btn-split--cta .btn-split__right{background:#2F2C49;color:#fff}
.footer{
  background:#fff;
  color:var(--ink);
  border-top:1px solid rgba(39,37,64,.1);
}
.footer-top{border-bottom-color:rgba(39,37,64,.1)}
.footer-brand .logo--footer{color:var(--ink)}
.footer-brand p,.footer-col a,.footer-col--contact p,.footer-legal,.footer-loop{color:var(--text-soft)}
.footer-col h4,.footer-loop span{color:#5C55C8}
.footer-col a:hover{color:var(--ink)}

@media(max-width:767px){.solution-carousel{background:#fff}}


/* ---- Mobile: mismo campo flotante, escala reducida ---- */
@media (max-width:479px){
  .voice-chip--sm{ width: 128px; }
  .voice-chip--sm .voice-chip__inner{ padding: 10px 12px; }
  .voice-chip--sm .voice-chip__quote{ font-size: .75rem; }

  .voice-chip--md{ width: 172px; }
  .voice-chip--md .voice-chip__inner{ padding: 13px 15px; }
  .voice-chip--md .voice-chip__quote{ font-size: .75rem; }

  .voice-chip--lg{ width: 206px; }
  .voice-chip--lg .voice-chip__inner{ padding: 16px 18px; }
  .voice-chip--lg .voice-chip__quote{ font-size: .7812rem; }
}

/* =========================================================
   FIRST VIEWPORT — composición NAVOA oscura y editorial
========================================================= */
.nav{
  background:transparent;
  border-bottom-color:rgba(255,255,255,.12);
  transition:background .35s ease,border-color .35s ease,box-shadow .35s ease;
}
.nav-inner{max-width:1440px;padding-inline:clamp(26px,4vw,68px)}
.logo__img{filter:brightness(0) invert(1);height:19px}
.nav-links,.lang-switch__item{color:rgba(255,255,255,.84)}
.nav-links a:hover,.lang-switch__item:hover{color:#fff}
.nav-links a::after{background:#8FA8FF}
.lang-switch__item.is-active{color:#fff}.lang-switch__sep{background:rgba(255,255,255,.28)}
.nav-talk{
  display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:1px solid rgba(255,255,255,.42);
  border-radius:999px;color:#fff;font-size:.8125rem;font-weight:500;line-height:1;background:rgba(255,255,255,.06);
  backdrop-filter:blur(12px);transition:background .3s ease,transform .3s ease;
}
.nav-talk:hover{background:rgba(255,255,255,.14);transform:translateY(-1px)}
.nav-toggle span{background:#fff}
.nav.is-scrolled{background:rgba(8,20,39,.94);border-bottom-color:rgba(255,255,255,.1);backdrop-filter:blur(18px)}

.hero{
  min-height:100svh;
  padding:var(--nav-h) var(--edge) 0;
  align-items:stretch;
  justify-content:center;
  background:#081526;
  color:#fff;
  text-align:left;
}
.hero::before{display:none}
.hero-inner{
  position:relative;width:100%;max-width:1320px;min-height:calc(100svh - var(--nav-h));margin:0 auto;
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:30px;overflow:visible;
}
.hero-title{
  position:relative;z-index:3;width:min(49%,650px);margin:0;
  font-family:var(--font-body);font-size:clamp(3.625rem,6.4vw,6.125rem);font-weight:500;
  line-height:.91;letter-spacing:-.058em;color:#fff;white-space:normal;
}
.hero-title__line{display:flex;flex-direction:column;align-items:flex-start}
.hero-title__dark,.hero-title__accent{display:block;color:#fff}
.hero-title__accent{color:#C7CFFF}
.hero-title__sub{
  max-width:520px;margin-top:32px;font-size:clamp(1rem,1.4vw,1.25rem);line-height:1.48;
  color:rgba(255,255,255,.72);letter-spacing:-.012em;
}
.hero-actions{position:relative;z-index:3;justify-content:flex-start;gap:12px}
.hero .btn-lilac,.hero .btn-outline-lilac{min-height:48px;padding:14px 21px;border-radius:999px;font-size:.875rem}
.hero .btn-lilac{background:#fff;color:#0A1830;box-shadow:0 16px 34px -20px rgba(0,0,0,.5)}
.hero .btn-outline-lilac{background:transparent;color:#fff;border-color:rgba(255,255,255,.38)}
.hero .btn-outline-lilac:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.62)}
.hero-art{
  position:absolute;z-index:0;inset:0;
  width:100%;height:100%;overflow:hidden;pointer-events:none;
  -webkit-mask-image:none;mask-image:none;
}
.hero-art::after{display:none}
.hero-art img{width:100%;height:100%;object-fit:cover;object-position:60% center;display:block;transform:scale(1.025);animation:hero-art-breathe 14s ease-in-out infinite alternate}
@keyframes hero-art-breathe{to{transform:scale(1.055) translate3d(-.7%,.4%,0)}}
.hero-demo{display:none!important}

@media(max-width:767px){
  .nav-links{background:#081526;color:#fff}.nav-links a:hover{color:#fff}.nav-talk{display:none}
  .hero{padding-inline:24px;overflow:hidden}.hero-inner{justify-content:flex-end;padding:100px 0 64px;min-height:calc(100svh - var(--nav-h))}
  .hero-title{width:100%;font-size:clamp(3rem,12vw,4.5rem)}.hero-title__sub{max-width:38ch;font-size:1rem}
  .hero-art{
    inset:0;width:100%;height:100%;opacity:.72;
    -webkit-mask-image:none;mask-image:none;
  }
  .hero-art img{object-position:65% center}
}
@media(max-width:479px){
  .hero-inner{padding-bottom:44px}.hero-title{font-size:clamp(2.625rem,12.2vw,3.625rem)}.hero-title__sub{margin-top:24px}
  .hero-actions{flex-direction:column;align-items:stretch;width:100%;max-width:260px}.hero .btn-lilac,.hero .btn-outline-lilac{width:100%}
  .logo__img{height:17px}
}
@media(prefers-reduced-motion:reduce){.hero-art img{animation:none}}

/* =========================================================
   HOME EDITORIAL — extensión del nuevo look & feel
========================================================= */
.hero{
  position:relative;isolation:isolate;display:block;width:100%;min-height:100svh;padding:0;
  overflow:hidden;background:#081526;
}
.hero-inner{display:contents}
.hero-overlay{
  position:absolute;z-index:1;inset:0;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(4,17,36,.92) 0%,rgba(4,17,36,.76) 35%,rgba(4,17,36,.3) 68%,rgba(4,17,36,.08) 100%),
    linear-gradient(180deg,rgba(8,21,38,.08) 0%,transparent 58%,rgba(8,21,38,.28) 100%);
}
.hero-viewport{
  position:relative;z-index:2;width:calc(100% - (2 * var(--edge)));max-width:1320px;min-height:100svh;margin:0 auto;
  padding-top:calc(var(--nav-h) + env(safe-area-inset-top));
  padding-bottom:max(44px,env(safe-area-inset-bottom));
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:30px;
}

/* 02 · Experiencia interactiva — gran pieza editorial, no dashboard */
.hero-demo{
  display:block!important;width:100%;max-width:none;padding:112px var(--edge) 124px;margin:0;
  background:#fff;scroll-margin-top:var(--nav-h);
}
.hero-demo-stage{
  width:100%;max-width:1180px;min-height:620px;margin:0 auto;border-radius:0;
  background:#F6F7FB;box-shadow:none;border:0;overflow:hidden;
}
.hero-demo-stage::before{
  content:"EXPERIENCIA INTERACTIVA";position:absolute;z-index:4;top:34px;left:42px;
  font:500 .75rem/1 var(--mono);letter-spacing:.08em;color:#66647B;
}
.hero-demo-scene--clinicas,.hero-demo-scene--laboratorios,.hero-demo-scene--hospitales{background:transparent}
.hero-demo-scene::before{width:52%;height:76%;top:-28%;right:-8%;left:auto;background:rgba(111,126,232,.14);filter:blur(90px)}
.hero-demo-scene::after{width:45%;height:70%;bottom:-30%;left:-8%;background:rgba(151,113,230,.12);filter:blur(100px)}
.hero-demo-content{height:620px;padding:90px 42px 40px;justify-content:center;gap:44px}
.hero-search-zone{flex:0 0 auto;width:100%;max-width:920px;margin:0 auto}
.hero-search-stack{width:100%}
.hero-search{
  min-height:104px;padding:20px 0!important;border:0;border-bottom:1px solid rgba(33,31,56,.18);border-radius:0!important;
  background:transparent;box-shadow:none;backdrop-filter:none;
}
.hero-search__icon{width:24px;height:24px;margin-right:18px;color:#5148D8}
.hero-search__field{height:66px}.hero-search__q{font-size:clamp(1.75rem,3.5vw,3rem);font-weight:500;letter-spacing:-.035em;color:#25233C}
.hero-quick-actions{margin-top:38px;gap:0;justify-content:space-between;border-top:1px solid rgba(33,31,56,.12);border-bottom:1px solid rgba(33,31,56,.12)}
.hero-quick-action{
  position:relative;flex:1;justify-content:center;padding:20px 12px;border:0;border-radius:0;background:transparent;
  font-size:.75rem;font-weight:500;letter-spacing:.02em;color:#55536B;
}
.hero-quick-action+ .hero-quick-action::before{content:"→";position:absolute;left:-5px;color:#8B87A6}
.hero-quick-action:hover{background:transparent;color:#5148D8;transform:none}.hero-quick-action svg{display:none}
.hero-demo-tabs{width:auto;margin:0 auto;padding:0;border:0;border-radius:0;background:transparent;gap:32px}
.hero-demo-tab{padding:8px 0;border-radius:0;border-bottom:1px solid transparent;font-size:.8125rem;color:#77758B}
.hero-demo-tab.is-active{background:transparent;color:#24223C;box-shadow:none;border-bottom-color:#5148D8}

/* 03 · Productos — dos plataformas editoriales de gran escala */
.products{padding:126px 0 140px!important;background:#fff}
.products-layout{display:grid;grid-template-columns:1fr;gap:68px}
.products-head{max-width:820px;padding:0;position:static}
.products-head .section-title{font-size:clamp(2.625rem,5vw,4.5rem);line-height:1.02;letter-spacing:-.045em;max-width:780px}
.products-head .section-lead{max-width:620px;font-size:1.125rem}.products-closing{margin-top:28px}
.solution-carousel{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:0;border:0;background:transparent;box-shadow:none}
.solution-carousel::before,.solution-network{display:none}
.solution-column{padding:34px 34px 38px;background:#F2F5FF;border-radius:26px;min-width:0}
.solution-column:nth-of-type(2){background:#111E38;color:#fff}
.solution-column+.solution-column::before{display:none}
.solution-column__title{margin-bottom:30px;padding-bottom:22px;border-bottom-width:1px}
.solution-column:nth-of-type(2) .solution-column__title{border-bottom-color:rgba(255,255,255,.32)}
.solution-column:nth-of-type(2) .solution-column__label b,.solution-column:nth-of-type(2) .solution-column__label span{color:#fff}
.solution-column__track{height:auto;overflow:visible;-webkit-mask-image:none;mask-image:none}
.solution-column__list,.solution-column__list--slow{display:grid;grid-template-columns:1fr 1fr;gap:12px;animation:none;transform:none!important}
.solution-card{min-height:185px;padding:20px;border:0;border-radius:16px;background:rgba(255,255,255,.74);box-shadow:none}
.solution-card[aria-hidden="true"]{display:none}
.solution-column:nth-of-type(2) .solution-card{background:rgba(255,255,255,.08);color:#fff}
.solution-column:nth-of-type(2) .solution-card p{color:rgba(255,255,255,.67)}
.solution-card__icon{box-shadow:none}.solution-card h4{font-size:.875rem}.solution-card p{font-size:.75rem;line-height:1.52}

/* 04 · Omnicanalidad — segundo momento cinematográfico */
.how-it-works{position:relative;padding:138px 0;background:#0B1830;color:#fff;overflow:hidden}
.how-it-works::before{content:"";position:absolute;width:70vw;height:70vw;right:-30vw;top:-24vw;border-radius:50%;background:radial-gradient(circle,rgba(99,107,226,.34),transparent 66%)}
.how-it-works__inner{position:relative;z-index:1;grid-template-columns:.8fr 1.2fr;gap:80px}
.how-it-works__copy .eyebrow{color:#AAB9FF}.how-it-works__copy .section-title{color:#fff;font-size:clamp(2.75rem,5vw,4.5rem);line-height:1.02}.how-it-works__copy .section-lead{color:rgba(255,255,255,.68)}
.how-it-works__point{padding-top:18px;border-top:1px solid rgba(255,255,255,.15)}
.how-it-works__point h4{color:#fff}.how-it-works__point p{color:rgba(255,255,255,.62)}
.how-it-works__panel{min-height:650px;background:transparent;border:0;box-shadow:none}
.connector-box{background:rgba(255,255,255,.96);border:0;box-shadow:0 28px 60px -34px rgba(0,0,0,.7)}
.how-it-works__disclaimer{color:rgba(255,255,255,.36)}

/* 05 · Compliance — blanco institucional y respirado */
.compliance{padding:142px 0;background:#fff}
.compliance-inner{grid-template-columns:1fr 1fr;gap:90px}
.compliance__copy .section-title{font-size:clamp(2.625rem,4.7vw,4.25rem);line-height:1.03}
.compliance__list{gap:0}.compliance__list li{padding:24px 0 24px 30px;border-top:1px solid rgba(33,31,56,.1)}
.compliance__visual{min-height:610px;border:0;background:#F4F6FC;box-shadow:none}

/* 06 · Comunidad — luminosa, humana y editorial */
.voices{padding:132px 0 80px;background:#fff}
.voices-inner{grid-template-columns:.72fr 1.28fr;gap:72px}
.voices-intro .section-title{font-size:clamp(2.625rem,4.8vw,4.25rem);line-height:1.02}
.voices-field-wrap{min-height:720px;border:0;background:#EEEFFD;box-shadow:none}
.voice-chip__inner{border:0;box-shadow:0 24px 50px -36px rgba(39,36,88,.32)}

/* 07 · Equipo — cierre senior, sobrio y tipográfico */
.team{padding:132px 0 150px;background:#fff;border-top:1px solid rgba(33,31,56,.08)}
.team .section-title{font-size:clamp(2.75rem,5vw,4.5rem);line-height:1.02}
.team-grid{margin-top:72px;gap:18px}
.team-card{min-height:500px;padding:32px;border-radius:4px;border:0;background:#F6F7FA;box-shadow:none}
.team-card--violet{background:#EDEFFD}.team-card--sky{background:#E9F4FA}
.team-card__watermark{top:-10%;right:-2%;font-size:18.75rem}.team-card__quote{font-size:1.3125rem;line-height:1.48}
.cta-final{display:none}

@media(max-width:1023px){
  .solution-carousel,.how-it-works__inner,.compliance-inner,.voices-inner{grid-template-columns:1fr}
  .how-it-works__panel{min-height:620px}.voices-field-wrap{min-height:680px}
}
@media(max-width:767px){
  .hero-demo{padding:78px 20px 88px}.hero-demo-stage{min-height:560px}.hero-demo-content{height:560px;padding:78px 22px 28px}
  .hero-demo-stage::before{left:22px;top:24px}.hero-search__q{font-size:1.75rem}.hero-quick-actions{overflow-x:auto;justify-content:flex-start}.hero-quick-action{flex:0 0 auto;padding:17px 18px}.hero-demo-tabs{gap:20px}
  .products{padding:92px 0 104px!important}.products-layout{gap:46px}.products-head .section-title{font-size:2.5rem}
  .solution-carousel{grid-template-columns:1fr}.solution-column{padding:26px 20px}.solution-column__list,.solution-column__list--slow{grid-template-columns:1fr}.solution-card{min-height:0}
  .how-it-works,.compliance,.voices,.team{padding-block:96px}.how-it-works__copy .section-title,.compliance__copy .section-title,.voices-intro .section-title,.team .section-title{font-size:2.5rem}
  .team-grid{margin-top:48px}.team-card{min-height:420px}
}

/* Header fix: una sola superficie navy, navegación siempre por encima */
.nav{
  z-index:1000;
  background:#081526;
  overflow:visible;
}
.nav-inner{
  position:relative;
  z-index:1001;
  overflow:visible;
}
.nav .logo,.nav .nav-right{position:relative;z-index:1003}
.nav .nav-links{
  z-index:1002;
  background:transparent;
  opacity:1;
  overflow:visible;
}
.nav .nav-links> a,.nav .nav-item> a{
  color:rgba(255,255,255,.88);
  opacity:1;
  visibility:visible;
}
.nav .nav-links> a:hover,.nav .nav-item> a:hover{color:#fff}
.nav .nav-dropdown{
  z-index:1200;
  background:#101F38;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 28px 60px -24px rgba(0,0,0,.62);
}
@media(min-width:768px){
  .nav .nav-links{display:flex;position:relative;max-height:none}
}
@media(max-width:767px){
  .nav .nav-links{background:#081526;overflow-x:hidden;overflow-y:auto}
  .nav .nav-dropdown{background:#101F38;border-color:rgba(255,255,255,.1)}
  .nav .nav-dropdown a strong{color:#fff}.nav .nav-dropdown a span{color:rgba(255,255,255,.64)}
}

/* Experiencia interactiva retirada de la Home */
.hero-demo{display:none!important}

/* Productos — composición editorial de cuatro servicios */
.products{padding:140px 0 150px!important;background:#fff}
.products>.products-layout{display:none!important}
.products-editorial{display:block}
.products-editorial__intro{
  display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(48px,8vw,128px);align-items:start;
  padding-bottom:88px;border-bottom:1px solid rgba(33,31,56,.14);
}
.products-editorial__title{
  margin:0;font-family:var(--font-body);font-size:clamp(3rem,5.6vw,5rem);font-weight:500;
  line-height:.95;letter-spacing:-.055em;text-transform:uppercase;color:#201E34;
}
.products-editorial__statement{
  max-width:700px;margin:4px 0 0;font-size:clamp(1.375rem,2.2vw,2rem);font-weight:400;line-height:1.32;
  letter-spacing:-.03em;color:#333147;
}
.products-editorial__grid{display:grid;grid-template-columns:1fr 1fr}
.product-service{
  position:relative;min-height:440px;padding:54px 48px 48px;overflow:hidden;
  border-bottom:1px solid rgba(33,31,56,.14);background:#fff;
}
.product-service:nth-child(even){border-left:1px solid rgba(33,31,56,.14)}
.product-service__number{
  position:absolute;right:22px;bottom:-42px;font-family:var(--font-body);font-size:clamp(9.375rem,17vw,15.625rem);
  font-weight:500;line-height:1;letter-spacing:-.09em;color:rgba(78,75,113,.055);pointer-events:none;user-select:none;
}
.product-service__content{position:relative;z-index:1;max-width:560px}
.product-service h3{
  margin:0 0 62px;font-family:var(--font-body);font-size:clamp(1.625rem,2.5vw,2.375rem);font-weight:500;
  line-height:1.08;letter-spacing:-.04em;color:#211F37;
}
.product-service__lead{
  max-width:500px;margin:0 0 20px;font-family:var(--font-heading);font-size:clamp(1.4375rem,2.15vw,2rem);
  line-height:1.22;letter-spacing:-.02em;color:#27243E;
}
.product-service__detail{max-width:520px;margin:0;font-size:.9375rem;line-height:1.65;color:#69677A}
.product-service::before{
  content:"";position:absolute;left:48px;top:112px;width:38px;height:2px;background:#6670D8;
  transform-origin:left;transition:width .5s var(--ease);
}
.product-service:hover::before{width:76px}
.product-service:hover .product-service__number{color:rgba(89,83,190,.075)}

@media(max-width:1023px){
  .products-editorial__intro{grid-template-columns:1fr;gap:34px;padding-bottom:62px}
  .products-editorial__statement{max-width:760px}
  .product-service{min-height:420px;padding:46px 34px 40px}.product-service::before{left:34px;top:98px}.product-service h3{margin-bottom:54px}
}
@media(max-width:767px){
  .products{padding:96px 0 104px!important}.products-editorial__title{font-size:2.75rem}
  .products-editorial__statement{font-size:1.375rem}.products-editorial__grid{grid-template-columns:1fr}
  .product-service{min-height:390px;padding:42px 0 36px}.product-service:nth-child(even){border-left:0}.product-service::before{left:0;top:92px}
  .product-service h3{font-size:1.75rem;margin-bottom:52px}.product-service__number{right:8px;font-size:10.625rem}
}

/* Productos — ajuste fino de escala y atmósferas suaves */
@media(min-width:1024px){
  .products{padding:62px 0 70px!important}
  .products-editorial__intro{
    grid-template-columns:.88fr 1.12fr;gap:clamp(54px,7vw,104px);padding-bottom:34px;
  }
  .products-editorial__title{
    max-width:500px;font-size:clamp(2.25rem,3.5vw,3.125rem);line-height:1;letter-spacing:-.045em;
  }
  .products-editorial__statement{
    max-width:620px;margin-top:0;font-size:clamp(1.125rem,1.65vw,1.4375rem);line-height:1.35;letter-spacing:-.022em;
  }
  .product-service{
    min-height:250px;padding:25px 30px 27px;
  }
  .product-service h3{
    margin-bottom:34px;font-size:clamp(1.3125rem,1.8vw,1.6875rem);line-height:1.08;letter-spacing:-.032em;
  }
  .product-service__lead{
    max-width:470px;margin-bottom:11px;font-size:clamp(1.125rem,1.45vw,1.375rem);line-height:1.2;
  }
  .product-service__detail{
    max-width:500px;font-size:.7812rem;line-height:1.48;
  }
  .product-service__number{
    right:20px;bottom:-18px;font-size:clamp(5.75rem,9vw,8.25rem);
  }
  .product-service::before{left:30px;top:72px;width:28px;height:1.5px}
  .product-service:hover::before{width:52px}
}
.product-service:nth-child(1){background:linear-gradient(145deg,#F5F3FF 0%,#EEF2FF 100%)}
.product-service:nth-child(2){background:linear-gradient(145deg,#F2FAFF 0%,#EAF5FF 100%)}
.product-service:nth-child(3){background:linear-gradient(145deg,#FFF6FA 0%,#F8F1FF 100%)}
.product-service:nth-child(4){background:linear-gradient(145deg,#F4F6FA 0%,#EEEFFC 100%)}
.product-service:nth-child(1) .product-service__number{color:rgba(92,78,193,.075)}
.product-service:nth-child(2) .product-service__number{color:rgba(50,132,190,.07)}
.product-service:nth-child(3) .product-service__number{color:rgba(184,86,143,.065)}
.product-service:nth-child(4) .product-service__number{color:rgba(77,83,145,.065)}

/* Productos — interacción y segundo nivel de información */
.product-service{
  isolation:isolate;cursor:pointer;transform-origin:center;
  transition:transform .42s cubic-bezier(.19,1,.22,1),box-shadow .42s ease,filter .42s ease,opacity .42s ease;
}
.product-service:focus-visible{outline:2px solid #6670D8;outline-offset:-3px;z-index:4}
.product-service__content{transition:transform .42s cubic-bezier(.19,1,.22,1)}
.product-service__detail{transition:opacity .35s ease,transform .42s cubic-bezier(.19,1,.22,1)}
.product-service__lead strong{font-weight:500;color:#19172E}
.product-service__impact{
  position:absolute;z-index:3;left:30px;right:30px;bottom:22px;margin:0;padding:13px 16px;
  border:1px solid rgba(255,255,255,.62);border-radius:12px;
  background:rgba(255,255,255,.78);box-shadow:0 14px 32px rgba(37,37,75,.1);
  color:#252241;font-size:.8125rem;font-weight:500;line-height:1.35;letter-spacing:-.01em;
  opacity:0;transform:translate3d(0,14px,0);pointer-events:none;
  transition:opacity .34s ease,transform .42s cubic-bezier(.19,1,.22,1);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
.product-service:hover,.product-service.is-active{
  z-index:3;transform:translate3d(0,-5px,0) scale(1.018);
  box-shadow:0 24px 52px rgba(38,37,82,.15);filter:saturate(1.06) contrast(1.015);
}
.product-service:hover::before,.product-service.is-active::before{width:52px}
.product-service:hover .product-service__content,.product-service.is-active .product-service__content{transform:translate3d(0,-4px,0)}
.product-service:hover .product-service__detail,.product-service.is-active .product-service__detail{opacity:.2;transform:translate3d(0,-5px,0)}
.product-service:hover .product-service__impact,.product-service.is-active .product-service__impact{opacity:1;transform:translate3d(0,0,0)}
.products-editorial__grid:has(.product-service.is-active) .product-service:not(.is-active){opacity:.72;filter:saturate(.82)}
@media(hover:hover) and (pointer:fine){
  .products-editorial__grid:hover .product-service:not(:hover){opacity:.78;filter:saturate(.86)}
}
@media(max-width:767px){
  .product-service__impact{left:0;right:0;bottom:18px}
  .product-service:hover{transform:none;box-shadow:none;filter:none}
  .product-service.is-active{transform:translate3d(0,-3px,0) scale(1.008)}
}
@media(prefers-reduced-motion:reduce){
  .product-service,.product-service__content,.product-service__detail,.product-service__impact{transition:none}
}

/* Compliance — sistema editorial y visual NAVOA */
.compliance{padding:112px 0;background:linear-gradient(135deg,#E8EEF6 0%,#EAF0F8 52%,#EDEFFA 100%)}
.compliance-inner{grid-template-columns:.92fr 1.08fr;gap:clamp(58px,7vw,104px);align-items:center}
.compliance__copy{max-width:570px}
.compliance__copy .eyebrow{
  margin:0 0 24px;font-family:var(--mono);font-size:.75rem;font-weight:500;line-height:1.45;
  letter-spacing:.08em;color:#625DD0;
}
.compliance__copy .section-title{
  max-width:560px;margin:0;font-family:var(--font-body);font-size:clamp(2.5rem,4.2vw,3.75rem);
  font-weight:500;line-height:1.02;letter-spacing:-.045em;
  background-image:linear-gradient(105deg,#22203A 0%,#354FAE 48%,#7560D8 100%);
}
.compliance__list{margin-top:46px;gap:0}
.compliance__list li{
  margin:0;padding:20px 0 20px 24px;border-top:1px solid rgba(42,39,72,.11);
  font-size:.875rem;line-height:1.62;color:#69677A;
}
.compliance__list li:last-child{border-bottom:1px solid rgba(42,39,72,.11)}
.compliance__list li::before{
  top:27px;width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#5F78E8,#8A65DF);
  box-shadow:0 0 0 5px rgba(102,96,218,.09);
}
.compliance__list li strong{font-weight:500;color:#24213C}
.compliance__visual{
  min-height:590px;border:1px solid rgba(80,75,153,.11);border-radius:26px;
  background:
    radial-gradient(circle at 18% 12%,rgba(117,207,255,.2),transparent 34%),
    radial-gradient(circle at 88% 88%,rgba(158,116,239,.19),transparent 38%),
    linear-gradient(145deg,#F8FBFF 0%,#F1F3FF 52%,#F7F1FF 100%);
  box-shadow:0 28px 70px -48px rgba(49,48,118,.42);
}
.compliance-shield__ring{border-color:rgba(91,93,207,.24)}
.compliance-shield__core{
  color:#fff;background:linear-gradient(145deg,#5977DB,#765DD6);
  box-shadow:0 18px 38px -20px rgba(73,70,176,.58);
}
.compliance-line{background:linear-gradient(to bottom,rgba(87,112,218,.16),rgba(123,91,213,.42))}
.compliance-badge{
  border:1px solid rgba(82,78,155,.11);background:rgba(255,255,255,.84);
  box-shadow:0 16px 36px -26px rgba(45,43,109,.38);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
.compliance-badge svg{color:#665FD5}
.compliance-badge__text{color:#2D2A4B;letter-spacing:.045em}
.compliance-shield__tag{
  color:#5750C8;background:rgba(255,255,255,.88);border-color:rgba(91,85,198,.14);
  box-shadow:0 8px 20px -14px rgba(58,53,144,.4);
}
@media(max-width:1023px){
  .compliance-inner{grid-template-columns:1fr;gap:54px}.compliance__copy{max-width:720px}.compliance__visual{min-height:570px}
}
@media(max-width:767px){
  .compliance{padding:92px 0}.compliance__copy .section-title{font-size:2.5rem}.compliance__list{margin-top:38px}
  .compliance__visual{min-height:540px;border-radius:22px}
}

/* Voces — sistema editorial y visual NAVOA */
.voices{padding:112px 0 88px;background:#fff}
.voices-intro{max-width:520px}
.voices-intro .eyebrow{
  margin:0 0 24px;font-family:var(--mono);font-size:.75rem;font-weight:500;line-height:1.45;
  letter-spacing:.08em;color:#625DD0;
}
.voices-intro .section-title{
  margin:0;font-family:var(--font-body);font-size:clamp(2.5rem,4.2vw,3.75rem);font-weight:500;
  line-height:1.02;letter-spacing:-.045em;
  background-image:linear-gradient(105deg,#102C62 0%,#236FD1 54%,#5C7FE0 88%,#716FD1 100%);
}
.voices-intro .section-lead{
  max-width:43ch;margin-top:24px;font-family:var(--font-body);font-size:.9375rem;
  line-height:1.68;letter-spacing:-.01em;color:#69677A;
}
.voices-counter{
  width:max-content;margin-top:30px;padding:8px 12px;border:1px solid rgba(42,105,187,.12);border-radius:999px;
  background:#F5F9FF;font-family:var(--mono);font-size:.75rem;font-weight:500;letter-spacing:.08em;color:#2868BC;
}
.voices-counter::before{
  width:6px;height:6px;background:linear-gradient(135deg,#2F7BD3,#5B8CE4);
  box-shadow:0 0 0 4px rgba(47,123,211,.08);
}
.voices-field-wrap{
  border:1px solid rgba(39,91,159,.11);border-radius:26px;
  background:
    radial-gradient(circle at 14% 10%,rgba(126,211,255,.2),transparent 32%),
    radial-gradient(circle at 90% 88%,rgba(111,139,225,.14),transparent 36%),
    linear-gradient(145deg,#F7FBFF 0%,#EDF5FF 52%,#F2F4FF 100%);
  box-shadow:0 28px 70px -48px rgba(31,74,137,.38);
}
.voices-field-wrap::before{opacity:.14}
.voices-line{
  width:1px;background:linear-gradient(to bottom,transparent,rgba(43,111,197,.32) 15%,rgba(66,118,210,.4) 85%,transparent);
  box-shadow:0 0 24px 3px rgba(45,109,196,.11);
}
.voices-line::before{
  background:linear-gradient(135deg,#2F78CF,#5D8DE3);box-shadow:0 0 0 5px rgba(48,120,207,.09),0 0 18px rgba(46,110,196,.22);
}
.voice-chip__inner{
  border:1px solid rgba(255,255,255,.7);border-radius:12px;background:rgba(255,255,255,.6);
  box-shadow:0 12px 30px -25px rgba(43,41,103,.28);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
.voice-chip.is-validated .voice-chip__inner{
  border-color:rgba(81,77,151,.1);background:rgba(255,255,255,.94);
  box-shadow:0 22px 48px -28px rgba(43,41,103,.36);
}
.voice-chip__quote{font-family:var(--font-heading);color:rgba(39,36,66,.48);letter-spacing:-.01em}
.voice-chip.is-validated .voice-chip__quote{color:#292640}
.voice-chip__name{font-family:var(--font-body);font-weight:500;color:#27243F}
.voice-chip__role{font-family:var(--mono);color:#3472BE;letter-spacing:.08em}
.voice-chip__avatar{background:linear-gradient(135deg,#286DC1,#5A8DDE)!important;box-shadow:0 8px 18px -12px rgba(34,82,151,.5)}
.voice-chip__check{
  background:linear-gradient(135deg,#2872C8,#5B8DE0);box-shadow:0 8px 18px -10px rgba(35,80,148,.46);
}

/* Voces — progresión visual de señal a testimonio validado */
.voices-field-wrap{
  background:
    radial-gradient(circle at 8% 15%,rgba(255,255,255,.42),transparent 34%),
    radial-gradient(circle at 88% 82%,rgba(117,112,224,.24),transparent 38%),
    linear-gradient(112deg,#C6E8F7 0%,#AFDCF3 43%,#477FD3 62%,#6576D2 100%);
  border-color:rgba(53,103,171,.18);box-shadow:0 34px 74px -42px rgba(16,54,108,.58);
}
.voices-field-wrap::before{z-index:0;opacity:.18;mix-blend-mode:soft-light}
.voices-field-wrap::after{
  content:"";position:absolute;z-index:0;inset:0;pointer-events:none;
  background-image:
    linear-gradient(90deg,rgba(225,240,255,.15) 1px,transparent 1px),
    linear-gradient(180deg,rgba(225,240,255,.1) 1px,transparent 1px),
    linear-gradient(90deg,rgba(5,33,70,.2) 0%,rgba(11,50,95,.1) 45%,rgba(255,255,255,.035) 55%,rgba(255,255,255,.08) 100%);
  background-size:25% 100%,100% 92px,100% 100%;
}
.voices-field{z-index:1}
.voices-line{
  background:linear-gradient(to bottom,transparent,rgba(217,236,255,.72) 14%,rgba(225,237,255,.8) 86%,transparent);
  box-shadow:0 0 30px 5px rgba(173,211,255,.2),0 0 7px 1px rgba(238,246,255,.45);
}
.voices-line::before{
  background:#D8EBFF;box-shadow:0 0 0 5px rgba(216,235,255,.15),0 0 22px rgba(225,239,255,.62);
}
.voice-chip{
  opacity:.32;filter:blur(1.8px) saturate(.72);transition:opacity .62s ease,filter .62s ease;
}
.voice-chip__inner{
  background:rgba(220,238,255,.18);border-color:rgba(225,241,255,.3);
  box-shadow:0 12px 28px -22px rgba(4,31,69,.48);
}
.voice-chip__quote{opacity:.2;color:#fff;transition:opacity .58s ease,color .58s ease}
.voice-chip__person{opacity:.08;transition:opacity .58s ease}
.voice-chip__avatar{opacity:.22}
.voice-chip.is-validated{z-index:4;opacity:1;filter:none}
.voice-chip.is-validated .voice-chip__inner{
  background:rgba(255,255,255,.96);border-color:rgba(255,255,255,.72);
  box-shadow:0 24px 48px -27px rgba(5,35,78,.52);
}
.voice-chip.is-validated .voice-chip__quote{opacity:1;color:#292640}
.voice-chip.is-validated .voice-chip__person{opacity:1}
.voice-chip.is-validated .voice-chip__avatar{opacity:1}
@media(prefers-reduced-motion:reduce){
  .voice-chip,.voice-chip__quote,.voice-chip__person{transition:none}
}
@media(max-width:1023px){
  .voices-intro{max-width:720px}.voices-field-wrap{min-height:680px}
}
@media(max-width:767px){
  .voices{padding:92px 0}.voices-intro .section-title{font-size:2.5rem}.voices-field-wrap{border-radius:22px}
}

/* Liderazgo — composición editorial y tarjetas ejecutivas */
.team{padding:88px 0 106px;background:#fff;border-top:1px solid rgba(31,49,83,.08);scroll-margin-top:66px}
.team-header__eyebrow{
  margin:0 0 36px;font-family:var(--font-body);font-size:clamp(2.125rem,3.5vw,3.125rem);font-weight:500;
  line-height:1;letter-spacing:-.045em;text-transform:uppercase;color:#17243A;
}
.team-manifesto{
  display:grid;grid-template-columns:minmax(0,1.45fr) minmax(210px,.55fr);gap:clamp(48px,8vw,120px);
  align-items:end;padding-bottom:26px;border-bottom:1px solid rgba(31,49,83,.12);
}
.team-manifesto__quote{
  max-width:760px;margin:0;font-family:var(--font-heading);font-size:clamp(1.5rem,2.7vw,2.25rem);
  font-weight:400;line-height:1.04;letter-spacing:-.035em;color:#17243A;
}
.team-manifesto__signature{padding-bottom:6px}
.team-manifesto__name{margin:0 0 5px;font-family:var(--font-body);font-size:.9375rem;font-weight:500;color:#17243A}
.team-manifesto__role{margin:0;font-family:var(--mono);font-size:.75rem;line-height:1.45;letter-spacing:.07em;text-transform:uppercase;color:#667085}
.team-grid{margin-top:28px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.team-card{
  position:relative;min-height:590px;padding:0;border:1px solid rgba(255,255,255,.07);border-radius:18px;
  display:flex;flex-direction:column;justify-content:flex-start;overflow:hidden;background:#0B1A2E;
  box-shadow:0 26px 54px -42px rgba(7,21,43,.6);
  transition:transform .42s cubic-bezier(.19,1,.22,1),box-shadow .42s ease,filter .42s ease;
}
.team-card:hover{transform:translate3d(0,-7px,0) scale(1.012);box-shadow:0 34px 70px -38px rgba(7,21,43,.68);filter:contrast(1.035)}
.team-card__photo{
  position:relative;min-height:350px;display:grid;place-items:center;overflow:hidden;
  background:
    linear-gradient(145deg,rgba(38,111,197,.09),rgba(91,103,207,.06)),
    repeating-linear-gradient(135deg,rgba(34,88,151,.035) 0 1px,transparent 1px 18px),
    #F0F4F9;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.team-card__photo::before{
  content:"";position:absolute;width:150px;height:190px;bottom:-30px;border-radius:80px 80px 0 0;
  border:1px solid rgba(38,105,184,.13);background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(213,226,241,.5));
}
.team-card__photo::after{
  content:"";position:absolute;width:72px;height:72px;top:82px;border-radius:50%;
  border:1px solid rgba(38,105,184,.13);background:rgba(255,255,255,.72);
}
.team-card__photo-label{
  position:absolute;z-index:2;left:20px;bottom:18px;padding:7px 10px;border:1px solid rgba(36,91,157,.12);
  border-radius:999px;background:rgba(255,255,255,.82);font-family:var(--mono);font-size:.75rem;font-weight:500;
  letter-spacing:.08em;text-transform:uppercase;color:#45698F;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.team-card__body{flex:1;display:flex;flex-direction:column;padding:27px 26px 24px;background:linear-gradient(145deg,#0A192C 0%,#102542 100%)}
.team-card__name{margin:0 0 5px;font-family:var(--font-body);font-size:1.25rem;font-weight:500;letter-spacing:-.025em;color:#fff}
.team-card__role{margin:0 0 20px;font-family:var(--mono);font-size:.75rem;font-weight:500;line-height:1.45;letter-spacing:.07em;text-transform:uppercase;color:#91B9EA}
.team-card__description{margin:0;font-family:var(--font-body);font-size:.8125rem;line-height:1.62;color:rgba(235,242,251,.7)}
.team-card__contacts{
  display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);
}
.team-card__contact-icon{
  width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(151,191,237,.22);border-radius:50%;
  color:#A7C8EE;background:rgba(255,255,255,.035);opacity:.7;
  transition:opacity .3s ease,transform .3s ease,background .3s ease,border-color .3s ease;
}
.team-card__contact-icon svg{width:15px;height:15px}
.team-card:hover .team-card__contact-icon{opacity:1;transform:translateY(-2px);background:rgba(58,122,200,.12);border-color:rgba(151,191,237,.36)}
.team-card__graphic{
  position:relative;min-height:350px;overflow:hidden;isolation:isolate;
  border-bottom:1px solid rgba(255,255,255,.1);
  background:
    radial-gradient(circle at 82% 16%,rgba(102,161,255,.32),transparent 34%),
    linear-gradient(145deg,#071A36 0%,#0D3B79 55%,#245EBB 100%);
}
.team-card--violet .team-card__graphic{
  background:
    radial-gradient(circle at 15% 18%,rgba(90,154,255,.34),transparent 32%),
    linear-gradient(150deg,#081A35 0%,#133E82 54%,#356FD1 100%);
}
.team-card--sky .team-card__graphic{
  background:
    radial-gradient(circle at 84% 82%,rgba(128,177,255,.3),transparent 34%),
    linear-gradient(140deg,#0A1B37 0%,#174A91 55%,#3975D1 100%);
}
.team-card__graphic::before{
  content:"";position:absolute;inset:0;z-index:-1;opacity:.32;
  background-image:linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.065) 1px,transparent 1px);
  background-size:72px 100%,100% 72px;
}
.team-card__graphic::after{
  content:"";position:absolute;width:230px;height:230px;right:-105px;bottom:-118px;border:1px solid rgba(255,255,255,.18);border-radius:50%;
}
.team-card__index{position:absolute;top:22px;left:24px;font:500 .75rem/1 var(--mono);letter-spacing:.08em;color:rgba(255,255,255,.66)}
.team-card__word{position:absolute;display:block;font-family:var(--font-body);font-weight:500;line-height:.8;letter-spacing:-.075em;text-transform:uppercase;color:#fff;white-space:nowrap;transition:transform .55s cubic-bezier(.19,1,.22,1),opacity .4s ease}
.team-card__word--a{top:69px;left:-8px;font-size:clamp(2.6875rem,4vw,3.9375rem)}
.team-card__word--b{top:148px;right:-7px;font-size:clamp(3.375rem,5vw,4.75rem);color:rgba(255,255,255,.12);-webkit-text-stroke:1px rgba(255,255,255,.64)}
.team-card__word--c{top:230px;left:20px;font-size:clamp(2.75rem,4.3vw,4.1875rem);color:rgba(196,224,255,.92)}
.team-card--violet .team-card__word--a{font-size:clamp(5.125rem,7vw,7rem);top:45px;left:17px}
.team-card--violet .team-card__word--b{top:153px;right:-19px;font-size:clamp(3rem,4.4vw,4.3125rem)}
.team-card--violet .team-card__word--c{top:235px;left:-8px}
.team-card--sky .team-card__word--a{top:62px;left:-6px}
.team-card--sky .team-card__word--b{top:145px;right:-12px;font-size:clamp(2.9375rem,4.5vw,4.3125rem)}
.team-card--sky .team-card__word--c{top:231px;left:-19px;font-size:clamp(2.1875rem,3.5vw,3.375rem)}
.team-card__keywords{position:absolute;left:24px;right:18px;bottom:20px;font:500 .75rem/1.4 var(--mono);letter-spacing:.07em;text-transform:uppercase;color:rgba(226,239,255,.72)}
.team-card:hover .team-card__graphic{filter:brightness(1.06)}
.team-card:hover .team-card__word--a{transform:translate3d(2.5%,0,0) scale(1.018)}
.team-card:hover .team-card__word--b{transform:translate3d(-2.5%,0,0) scale(1.02)}
.team-card:hover .team-card__word--c{transform:translate3d(2%,0,0) scale(1.016)}
@media(max-width:1023px){
  .team-manifesto{grid-template-columns:1fr;gap:26px}.team-grid{grid-template-columns:1fr}.team-card{min-height:560px}.team-card__graphic{min-height:350px}
}
@media(max-width:767px){
  .team{padding:72px 0 88px}.team-header__eyebrow{margin-bottom:28px}.team-manifesto{padding-bottom:22px}
  .team-manifesto__quote{font-size:1.75rem}.team-grid{margin-top:24px}
}
@media(prefers-reduced-motion:reduce){.team-card__word{transition:none}}

/* Footer — cierre tecnológico NAVOA */
.footer{
  position:relative;isolation:isolate;overflow:hidden;padding:92px 0 32px;border:0;
  background:#071628;color:#fff;
}
.footer::before{
  content:"";position:absolute;z-index:-2;inset:-12%;pointer-events:none;
  background:url("assets/navoa-hero-abstract-v1.png") center right/cover no-repeat;
  opacity:.3;transform:scale(1.04) translate3d(1%,0,0);
  animation:navoa-footer-ambient 22s cubic-bezier(.45,0,.55,1) infinite alternate;
  will-change:transform;
}
.footer::after{
  content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(7,22,40,.98) 0%,rgba(7,22,40,.91) 50%,rgba(7,22,40,.68) 100%);
}
@keyframes navoa-footer-ambient{
  0%{transform:scale(1.04) translate3d(1%,0,0)}
  52%{transform:scale(1.065) translate3d(-.4%,.35%,0)}
  100%{transform:scale(1.09) translate3d(-1.8%,.75%,0)}
}
.footer-inner{position:relative;z-index:1}
.footer-grid{
  display:grid;grid-template-columns:1.25fr 1fr 1fr .95fr 1.35fr;gap:clamp(30px,4vw,66px);
  padding-bottom:72px;border-bottom:1px solid rgba(203,222,245,.15);
}
.footer-brand .logo--footer{font-family:var(--font-body);font-size:1.4375rem;font-weight:500;letter-spacing:.035em;color:#fff}
.footer-brand p{max-width:210px;margin:18px 0 0;font-size:.8125rem;line-height:1.65;color:rgba(225,235,247,.65)}
.footer-nav h4,.footer-closing__label{
  margin:0 0 22px;font-family:var(--mono);font-size:.75rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:#85B8F0;
}
.footer-nav a,.footer-nav span{
  display:block;width:max-content;max-width:100%;margin:0 0 12px;font-family:var(--font-body);
  font-size:.8125rem;line-height:1.45;color:rgba(229,238,248,.7);transition:color .3s ease,transform .3s ease;
}
.footer-nav a:hover{color:#fff;transform:translateX(3px)}
.footer-closing{display:flex;min-height:185px;flex-direction:column;align-items:flex-start}
.footer-socials{display:flex;align-items:center;gap:10px;margin-bottom:34px}
.footer-social{
  width:36px;height:36px;display:grid;place-items:center;border:1px solid rgba(174,204,239,.22);border-radius:50%;
  color:#DCEBFA;background:rgba(255,255,255,.035);transition:background .3s ease,border-color .3s ease,transform .3s ease;
}
.footer-social[href]:hover{transform:translateY(-3px);border-color:rgba(145,190,238,.48);background:rgba(57,124,201,.14)}
.footer-social:not([href]){opacity:.62;cursor:default}
.footer-social svg{width:16px;height:16px}
.footer-statement{
  max-width:290px;margin:auto 0 0;font-family:var(--font-heading);font-size:clamp(1.5625rem,2.4vw,2.125rem);
  font-weight:400;line-height:1.08;letter-spacing:-.025em;color:#fff;
}
.footer-bottom{padding-top:26px;display:flex;justify-content:space-between;align-items:center;gap:24px}
.footer-legal{margin:0;font-size:.75rem;color:rgba(213,225,239,.48)}
.footer-bottom__mark{margin:0;font-family:var(--mono);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:#83AEE0}
@media(max-width:1023px){
  .footer-grid{grid-template-columns:1.15fr repeat(2,1fr);row-gap:48px}.footer-closing{grid-column:2/4}.footer-company{grid-column:1}
}
@media(max-width:767px){
  .footer{padding:76px 0 28px}.footer-grid{grid-template-columns:1fr 1fr;gap:42px 28px;padding-bottom:56px}
  .footer-brand,.footer-closing{grid-column:1/-1}.footer-company{grid-column:auto}.footer-closing{min-height:0}
  .footer-statement{margin-top:10px}.footer-bottom{align-items:flex-start;flex-direction:column}
}
@media(prefers-reduced-motion:reduce){.footer::before{animation:none;transform:scale(1.05)}}

/* Hero — movimiento ambiental tecnológico, sin alterar composición */
.hero-art{
  --hero-parallax-x:0px;
  --hero-parallax-y:0px;
  transform:translate3d(var(--hero-parallax-x),var(--hero-parallax-y),0);
  transition:transform 1.8s cubic-bezier(.19,1,.22,1);
  will-change:transform;
}
.hero-art__float{
  position:absolute;
  inset:-5%;
  animation:navoa-dna-float 84s cubic-bezier(.45,0,.55,1) infinite;
  will-change:transform;
}
.hero-art__float img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:60% center;
  display:block;
  filter:brightness(.94) contrast(1.05) saturate(.90);
  transform-origin:70% 50%;
  animation:navoa-dna-spin 190s linear infinite;
  will-change:transform;
  backface-visibility:hidden;
}
.hero-art::before{
  content:"";
  position:absolute;
  z-index:1;
  inset:-12%;
  pointer-events:none;
  opacity:.12;
  background:radial-gradient(ellipse 34% 52% at 72% 44%,rgba(155,181,255,.55),transparent 72%);
  mix-blend-mode:screen;
  transform:translate3d(-3%,1%,0) scale(.98);
  animation:navoa-hero-light 3.55s cubic-bezier(.45,0,.55,1) infinite alternate;
  will-change:transform,opacity;
}
@keyframes navoa-dna-spin{
  from{transform:scale(1.14) rotate(0deg)}
  to{transform:scale(1.14) rotate(360deg)}
}
@keyframes navoa-dna-float{
  0%,100%{transform:translate3d(-.18%,.08%,0)}
  24%{transform:translate3d(.38%,-.28%,0)}
  51%{transform:translate3d(.16%,.34%,0)}
  76%{transform:translate3d(-.36%,.2%,0)}
}
@keyframes navoa-hero-light{
  0%{opacity:.08;transform:translate3d(-3%,1%,0) scale(.98)}
  55%{opacity:.14}
  100%{opacity:.1;transform:translate3d(4%,-1%,0) scale(1.035)}
}
@keyframes navoa-dna-mobile-axis{
  0%,100%{transform:scale(1.14) translate3d(-.25%,0,0)}
  50%{transform:scale(1.14) translate3d(.25%,-.18%,0)}
}
@media(max-width:767px){
  .hero-background.hero-art{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;
    margin:0!important;border:0!important;border-radius:0!important;clip-path:none!important;
    -webkit-mask:none!important;mask:none!important;transform:none!important;overflow:hidden!important;
  }
  .hero-art__float{inset:0;animation-duration:96s}
  .hero-art__float img{
    width:100%;height:100%;max-width:none;object-fit:cover;object-position:62% center;
    animation:navoa-dna-mobile-axis 210s cubic-bezier(.45,0,.55,1) infinite;
    filter:brightness(.94) contrast(1.05) saturate(.90);
  }
  .hero-overlay{
    background:
      linear-gradient(90deg,rgba(4,17,36,.84) 0%,rgba(4,17,36,.48) 62%,rgba(4,17,36,.18) 100%),
      linear-gradient(180deg,rgba(8,21,38,.1) 0%,rgba(8,21,38,.2) 52%,rgba(8,21,38,.82) 100%);
  }
  .hero-art::before{opacity:.08;animation-duration:4.89s}
  .hero-actions{
    width:auto;max-width:none;flex-direction:row;flex-wrap:wrap;align-items:center;gap:10px;
  }
  .hero .btn-lilac,.hero .btn-outline-lilac{
    width:auto!important;min-height:44px;padding:11px 18px;font-size:.8125rem;flex:0 0 auto;
  }
}
@media(prefers-reduced-motion:reduce){
  .hero-art{transform:none!important;transition:none}
  .hero-art__float,.hero-art__float img,.hero-art::before{animation:none!important}
  .hero-art__float{transform:none}
  .hero-art__float img{transform:scale(1.14)}
  .hero-art::before{opacity:.08;transform:none}
}

/* Hero final — esfera healthcare AI con ADN integrado */
.hero{
  min-height:100svh;background:#071426;isolation:isolate;
}
.hero::before{
  content:"";display:block;position:absolute;z-index:0;inset:0;pointer-events:none;
  background:
    radial-gradient(circle at 73% 47%,rgba(87,116,172,.2),transparent 38%),
    radial-gradient(circle at 18% 18%,rgba(52,75,118,.12),transparent 34%),
    linear-gradient(135deg,#071426 0%,#0A1A31 58%,#06111F 100%);
}
.hero-overlay{
  background:linear-gradient(90deg,rgba(4,14,29,.78) 0%,rgba(4,14,29,.54) 34%,rgba(4,14,29,.16) 61%,transparent 82%);
}
.hero-orb{
  position:absolute;z-index:0;top:50%;right:-5.5vw;width:clamp(530px,55vw,820px);aspect-ratio:1;
  transform:translateY(-47%);pointer-events:none;filter:drop-shadow(0 42px 80px rgba(0,0,0,.28));
}
.hero-orb__sphere{
  position:absolute;inset:0;overflow:hidden;border-radius:50%;
  background:
    radial-gradient(circle at 31% 24%,rgba(255,255,255,.18),transparent 20%),
    radial-gradient(circle at 67% 72%,rgba(22,45,82,.92),transparent 49%),
    radial-gradient(circle at 47% 44%,#28466f 0%,#142c4d 43%,#09192d 76%,#050e1a 100%);
  border:1px solid rgba(232,242,255,.32);
  box-shadow:inset -42px -46px 90px rgba(0,5,14,.65),inset 26px 24px 74px rgba(151,187,228,.12),0 0 0 1px rgba(255,255,255,.04);
  animation:navoa-orb-float 20s cubic-bezier(.45,0,.55,1) infinite alternate;
}
.hero-orb__sphere::before{
  content:"";position:absolute;inset:-18%;border-radius:50%;opacity:.42;
  background:
    repeating-radial-gradient(circle at 52% 48%,transparent 0 17px,rgba(255,255,255,.035) 18px 19px),
    conic-gradient(from 40deg,transparent,rgba(174,208,241,.12),transparent 28%,rgba(255,255,255,.06),transparent 64%);
  transform-origin:50% 50%;animation:navoa-orb-surface 11s linear infinite;
}
.hero-orb__sphere::after{
  content:"";position:absolute;inset:1px;border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.2),transparent 24%,transparent 68%,rgba(139,176,218,.08));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);pointer-events:none;
  transform-origin:50% 50%;animation:navoa-orb-highlight 15s linear infinite reverse;
}
.hero-orb__atmosphere{
  position:absolute;inset:7%;border-radius:50%;opacity:.48;filter:blur(12px);
  background:radial-gradient(ellipse at 50% 48%,rgba(205,225,245,.09),transparent 65%);
}
.hero-orb__dna{
  position:absolute;z-index:2;left:17%;top:14%;width:66%;height:72%;overflow:visible;
  opacity:.72;filter:drop-shadow(0 0 12px rgba(228,241,255,.2));
  transform-origin:50% 50%;animation:navoa-orb-dna 40s linear infinite;
}
@keyframes navoa-orb-float{
  from{transform:translate3d(-.35%,-.4%,0) rotate(-.18deg)}
  to{transform:translate3d(.4%,.45%,0) rotate(.18deg)}
}
@keyframes navoa-orb-surface{to{transform:rotate(360deg)}}
@keyframes navoa-orb-highlight{to{transform:rotate(360deg)}}
@keyframes navoa-orb-dna{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}
.hero .btn-lilac,.hero .btn-outline-lilac{
  min-height:44px;padding:11px 18px;border-width:1px;font-size:.8125rem;box-shadow:none;
}
.hero .btn-lilac{background:rgba(255,255,255,.96);border:1px solid rgba(255,255,255,.72)}
.hero .btn-outline-lilac{background:rgba(5,16,31,.12);border-color:rgba(255,255,255,.48);backdrop-filter:blur(10px)}
@media(max-width:767px){
  .hero{min-height:100svh}
  .hero-overlay{
    background:
      linear-gradient(180deg,rgba(4,14,29,.08) 0%,rgba(4,14,29,.12) 36%,rgba(4,14,29,.58) 68%,rgba(4,14,29,.94) 100%),
      linear-gradient(90deg,rgba(4,14,29,.28),rgba(4,14,29,.06));
  }
  .hero-orb{top:7%;left:50%;right:auto;width:min(108vw,520px);transform:translateX(-50%);opacity:.92}
  .hero-viewport{justify-content:flex-end;padding-bottom:max(48px,env(safe-area-inset-bottom))}
  .hero-title{position:relative;z-index:3}
  .hero-actions{position:relative;z-index:3}
  .hero .btn-lilac,.hero .btn-outline-lilac{min-height:42px;padding:9px 15px;font-size:.7656rem}
}
@media(max-width:479px){
  .hero-orb{top:9%;width:110vw}.hero-viewport{padding-bottom:max(38px,env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:reduce){
  .hero-orb__sphere,.hero-orb__sphere::before,.hero-orb__sphere::after,.hero-orb__dna,.hero-orb__pulse{animation:none!important}
}

/* HOME — sistema clínico premium coherente de extremo a extremo */
.navoa-agent,.hero-demo{display:none!important}
.products,.compliance,.voices,.team{font-family:var(--font-body)}
.products{
  padding:118px 0 132px!important;background:#F7F9FB!important;border-top:1px solid rgba(10,31,55,.1);
}
.products-editorial__intro{padding-bottom:58px;border-bottom-color:rgba(10,31,55,.16)}
.products-editorial__title{
  max-width:560px;font-size:clamp(2.625rem,4.6vw,4.125rem);font-weight:500;line-height:.98;letter-spacing:-.05em;
  text-transform:none;color:#0A1B30;
}
.products-editorial__statement{font-size:clamp(1.1875rem,1.8vw,1.625rem);line-height:1.4;color:#405064}
.product-service,.product-service:nth-child(1),.product-service:nth-child(2),.product-service:nth-child(3),.product-service:nth-child(4){
  background:#fff;border-color:rgba(10,31,55,.14);box-shadow:none;
}
.product-service h3,.product-service__lead,.product-service__lead strong{color:#0A1B30}
.product-service__detail{color:#627083}.product-service::before{background:#7890AB}
.product-service__number,.product-service:nth-child(1) .product-service__number,.product-service:nth-child(2) .product-service__number,
.product-service:nth-child(3) .product-service__number,.product-service:nth-child(4) .product-service__number{color:rgba(15,47,79,.055)}
.product-service__impact{
  border-color:rgba(10,31,55,.12);background:rgba(247,249,251,.94);color:#0A1B30;
  box-shadow:0 18px 42px rgba(7,20,38,.1);border-radius:4px;
}
.compliance{
  padding:132px 0!important;background:#EEF2F5!important;border-top:1px solid rgba(10,31,55,.1);
}
.compliance__copy .eyebrow,.voices-intro .eyebrow,.team-header__eyebrow{
  color:#617A96!important;letter-spacing:.15em;font-weight:500;
}
.compliance__copy .section-title,.voices-intro .section-title{
  background:none!important;-webkit-text-fill-color:currentColor!important;color:#0A1B30!important;
  font-size:clamp(2.625rem,4.6vw,4.125rem);font-weight:500;letter-spacing:-.05em;
}
.compliance__list li{border-color:rgba(10,31,55,.14);color:#536275}
.compliance__list li strong{color:#0A1B30}.compliance__list li::before{background:#7890AB;box-shadow:none}
.compliance__visual{
  border:1px solid rgba(220,233,246,.18);border-radius:4px;
  background:radial-gradient(circle at 50% 45%,#173454 0%,#0D223A 48%,#081727 100%);
  box-shadow:0 34px 70px -48px rgba(3,14,28,.64);
}
.compliance-shield__ring{border-color:rgba(210,229,247,.23)}
.compliance-shield__core{background:#F5F8FA;color:#0A1B30;box-shadow:0 18px 44px rgba(0,0,0,.24)}
.compliance-line{background:rgba(208,226,244,.25)}
.compliance-badge{border-color:rgba(222,235,248,.18);background:rgba(247,250,252,.94);border-radius:4px}
.compliance-shield__tag{background:rgba(247,250,252,.94);border-color:rgba(255,255,255,.18);color:#173454}
.voices{padding:132px 0 96px!important;background:#fff!important;border-top:1px solid rgba(10,31,55,.1)}
.voices-intro .section-lead{color:#627083}.voices-counter{color:#516A85}
.voices-counter::before,.voices-line::before,.voice-chip__check{background:#52779F!important}
.voices-field-wrap{
  border:1px solid rgba(10,31,55,.12);border-radius:4px;
  background:linear-gradient(145deg,#132E4D 0%,#0B2038 58%,#071725 100%)!important;
  box-shadow:0 34px 70px -48px rgba(3,14,28,.58);
}
.voices-field-wrap::before{opacity:.12}.voices-line{background:rgba(220,233,247,.2)}
.voice-chip__inner{border-radius:4px;border-color:rgba(255,255,255,.7);box-shadow:0 18px 42px rgba(0,0,0,.2)}
.voice-chip__avatar{background:#52779F!important}
.team{
  padding:132px 0 146px!important;background:#071426!important;color:#fff;border-top:1px solid rgba(255,255,255,.1);
}
.team-manifesto{border-color:rgba(255,255,255,.14)}
.team-manifesto__quote,.team-manifesto__name{color:#fff}.team-manifesto__role{color:rgba(221,231,242,.62)}
.team-card,.team-card--pink,.team-card--violet,.team-card--sky{
  border:1px solid rgba(220,233,247,.14);border-radius:4px;background:#0D2139!important;
  box-shadow:none;color:#fff;
}
.team-card:nth-child(2){background:#102945!important}.team-card:nth-child(3){background:#132D49!important}
.team-card__graphic{border-bottom-color:rgba(255,255,255,.12)}
.team-card__word,.team-card__keywords,.team-card__index{color:rgba(235,243,251,.78)}
.team-card__name,.team-card__description{color:#fff!important}.team-card__role{color:rgba(221,231,242,.62)!important}
.team-card__contacts{border-top-color:rgba(255,255,255,.12)}
.team-card__contact-icon{border-color:rgba(255,255,255,.2);color:#E7EFF7}
.team-card__contact-icon:hover{background:#fff;color:#0A1B30;border-color:#fff}
@media(max-width:767px){
  .products,.compliance,.voices,.team{padding-block:92px!important}
  .products-editorial__title,.compliance__copy .section-title,.voices-intro .section-title{font-size:2.5rem}
  .product-service{background:#fff!important}
}

/* HOME NAVOA — composición editorial steel-blue original */
body{background:#E6E8E9}
main>.products,main>.compliance,main>.voices,main>.team,.footer,.hero-demo{display:none!important}
.hero{
  min-height:100svh;padding:0;overflow:hidden;background:#606974;color:#142231;
}
.hero::before{
  background:linear-gradient(180deg,
    #606974 0%,
    #6C747F 14%,
    #99A2AC 34%,
    #B5BDC3 57%,
    #D2D6D9 79%,
    #E6E8E9 100%
  );
}
.hero-overlay{background:transparent;}
.hero-viewport{
  width:min(calc(100% - 80px),1440px);max-width:1440px;min-height:100svh;
  padding:calc(var(--nav-h) + 46px) 0 38px;display:grid;grid-template-columns:minmax(310px,.9fr) 300px;
  justify-content:space-between;align-items:center;gap:clamp(250px,29vw,460px);
}
.hero-copy{position:relative;z-index:3;align-self:start;margin-top:clamp(48px,7vh,76px)}
.hero-title{width:auto;max-width:480px;color:#fff;font-size:clamp(2.375rem,3.25vw,3rem);font-weight:400;line-height:1.03;letter-spacing:-.035em}
.hero-title__dark,.hero-title__accent{color:#fff}
.hero-title__sub{max-width:430px;margin-top:18px;color:#fff;font-size:.75rem;line-height:1.4;font-weight:500;letter-spacing:.075em;text-transform:uppercase}
.hero-actions{margin-top:30px}
.hero .btn-lilac,.hero .btn-outline-lilac{
  min-height:42px;padding:10px 17px;border-radius:999px;font-size:.7812rem;font-weight:500;
  color:#132232;border:1px solid rgba(19,34,50,.34);background:rgba(246,249,250,.38);backdrop-filter:blur(12px);
}
.hero .btn-lilac{background:#EFF3F4;border-color:#EFF3F4}.hero .btn-outline-lilac:hover{background:rgba(255,255,255,.48)}
.hero-orb{top:48%;right:50%;width:clamp(430px,40vw,650px);transform:translate(50%,calc(-50% + 38px));filter:drop-shadow(0 40px 70px rgba(49,65,77,.24))}
.hero-orb__sphere{
  background:
    radial-gradient(circle at 29% 23%,rgba(255,255,255,.79),transparent 18%),
    radial-gradient(circle at 62% 68%,rgba(112,131,145,.5),transparent 47%),
    radial-gradient(circle at 46% 43%,#E2E7E9 0%,#BBC5CB 46%,#94A3AD 77%,#71828D 100%);
  border-color:rgba(255,255,255,.8);
  box-shadow:inset -38px -42px 88px rgba(54,71,83,.34),inset 28px 25px 64px rgba(255,255,255,.42),0 0 0 1px rgba(49,67,80,.07),0 0 34px rgba(255,255,255,.1);
}
.hero-orb__sphere::before{opacity:.36;background:repeating-radial-gradient(circle at 52% 48%,transparent 0 18px,rgba(255,255,255,.09) 19px 20px),conic-gradient(from 40deg,transparent,rgba(255,255,255,.32),transparent 28%,rgba(91,111,126,.12),transparent 64%)}
.hero-orb__dna{opacity:.82;filter:drop-shadow(0 0 10px rgba(255,255,255,.34));animation-duration:40s;animation-timing-function:linear;animation-direction:normal}
.hero-insight{
  position:relative;z-index:4;align-self:center;justify-self:end;width:300px;padding:22px;border:1px solid rgba(19,34,50,.13);border-radius:18px;
  background:rgba(238,242,243,.9);box-shadow:0 26px 70px -42px rgba(34,50,62,.42);backdrop-filter:blur(18px);
}
.hero-insight__kicker{margin:0 0 18px;font-size:.75rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:#667887}
.hero-insight h2{margin:0;font-size:1.25rem;font-weight:500;line-height:1.2;letter-spacing:-.035em;color:#152536}
.hero-insight__lead{margin:14px 0 22px;font-size:.7812rem;line-height:1.55;color:#60707D}
.hero-insight__options{display:grid;gap:7px}
.hero-insight__options a{
  min-height:50px;padding:9px 12px;display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:10px;
  border:1px solid rgba(19,34,50,.11);border-radius:10px;background:rgba(255,255,255,.56);color:#1A2B3B;font-size:.7812rem;font-weight:500;
}
.hero-insight__icon{width:26px;height:26px;display:grid;place-items:center;border:1px solid rgba(19,34,50,.15);border-radius:50%;font-size:.8125rem;font-weight:400}
.hero-insight__options b{font-size:.75rem;font-weight:500}.hero-insight__options a:hover{background:#fff}
.hero-insight__ask{
  min-height:48px;margin-top:14px;padding:0 8px 0 15px;display:flex;align-items:center;justify-content:space-between;
  border:1px solid rgba(19,34,50,.18);border-radius:999px;color:#526373;font-size:.7812rem;background:rgba(255,255,255,.45);
}
.hero-insight__ask b{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:#16293A;color:#fff;font-size:.9375rem}
.hero-copyright{position:absolute;z-index:5;right:40px;bottom:26px;margin:0;font-size:.75rem;color:rgba(19,34,50,.58)}
@media(max-width:1023px){
  .hero-viewport{gap:170px;grid-template-columns:minmax(290px,.85fr) 286px}
  .hero-orb{width:500px}.hero-title{font-size:2.875rem}
}
@media(max-width:767px){
  body{background:#E6E8E9}
  .hero{
    /* El hero debe cubrir el viewport completo en mobile — antes usaba
       min-height:auto y colapsaba a la altura del contenido, dejando una
       franja del fondo blanco del body debajo del CTA. 100svh evita que
       la barra dinámica de Safari iOS deje el hero corto; 100vh queda
       primero como fallback para navegadores sin soporte de *vh. */
    min-height:100vh;
    min-height:100svh;
    padding-bottom:0;overflow:hidden;
  }
  .hero-viewport{
    width:calc(100% - 40px);min-height:auto;padding:calc(var(--nav-h) + env(safe-area-inset-top) + 36px) 0 36px;
    display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:34px;
  }
  .hero-copy{min-height:520px;display:flex;flex-direction:column;justify-content:flex-end}
  .hero-title{max-width:100%;font-size:clamp(2.125rem,10vw,2.625rem)}.hero-title__sub{max-width:38ch;font-size:.75rem}
  .hero-orb{top:105px;left:50%;right:auto;width:min(104vw,470px);transform:translateX(-50%);opacity:.88}
  .hero-insight{padding:22px;border-radius:16px}.hero-insight h2{font-size:1.375rem}
  .hero-copyright{position:relative;right:auto;bottom:auto;margin:0;padding:0 20px max(24px,env(safe-area-inset-bottom));font-size:.75rem}
}
@media(max-width:479px){
  .hero-copy{min-height:500px}.hero-orb{top:118px;width:110vw}.hero-actions{gap:8px}
  .hero .btn-lilac,.hero .btn-outline-lilac{padding:9px 14px;font-size:.75rem}
}
.navoa-agent{display:block!important;right:18px;bottom:18px;z-index:6000}
.hero-insight{display:none!important}
.navoa-agent__toggle{padding:5px!important;border-color:rgba(20,35,50,.18)!important;background:rgba(240,243,244,.9)!important;box-shadow:0 12px 34px rgba(34,49,60,.16)!important}
.navoa-agent__toggle .navoa-agent__label{display:none!important}
.navoa-agent__toggle .navoa-agent__mark{width:34px!important;height:34px!important}
.navoa-agent__panel{
  display:block!important;width:min(340px,calc(100vw - 36px))!important;visibility:hidden;
  border-color:rgba(20,35,50,.14)!important;border-radius:18px!important;background:#EEF2F3!important;
  box-shadow:0 26px 70px rgba(34,49,60,.24)!important;
  opacity:0!important;transform:translate3d(0,12px,0) scale(.98)!important;pointer-events:none!important;
  transition:opacity .26s ease,transform .3s cubic-bezier(.19,1,.22,1),visibility .26s!important;
}
.navoa-agent.is-open .navoa-agent__panel{visibility:visible;opacity:1!important;transform:none!important;pointer-events:auto!important}
.navoa-agent__head{padding:14px 16px!important;background:#172A3B!important}
.navoa-agent__body{min-height:0;max-height:none;padding:18px!important;gap:0!important}
.navoa-agent__title{margin:0;color:#172737;font-size:1.1875rem;font-weight:500;line-height:1.22;letter-spacing:-.03em}
.navoa-agent__description{margin:11px 0 16px;color:#61717E;font-size:.7812rem;line-height:1.5}
.navoa-agent__options{display:grid;gap:7px}
.navoa-agent__options a{min-height:43px;padding:0 13px;display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(20,35,50,.12);border-radius:10px;background:rgba(255,255,255,.62);color:#172737;font-size:.7812rem;font-weight:500}
.navoa-agent__options a:hover{background:#fff}.navoa-agent__options b{font-weight:500}
.navoa-agent__foot{padding:0 16px 16px!important}.navoa-agent__form{background:rgba(255,255,255,.68)}

/* Asistente NAVOA — acabado clínico premium */
.navoa-agent__toggle{
  width:46px!important;height:46px!important;padding:5px!important;
  border:1px solid rgba(255,255,255,.72)!important;border-radius:50%!important;
  background:rgba(255,255,255,.96)!important;color:#182a3a!important;
  box-shadow:0 12px 34px rgba(6,18,30,.2),inset 0 0 0 1px rgba(18,36,51,.05)!important;
  backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%)
}
.navoa-agent__toggle:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(6,18,30,.25),inset 0 0 0 1px rgba(18,36,51,.07)!important}
.navoa-agent__toggle .navoa-agent__mark{
  width:34px!important;height:34px!important;background:transparent!important;color:#172a3a!important
}
.navoa-agent__toggle .navoa-agent__mark svg{width:19px;height:19px}
.navoa-agent__dot{width:7px;height:7px;top:1px;right:1px;background:#7895a8;border:2px solid #fff}
.navoa-agent__panel{
  width:min(356px,calc(100vw - 36px))!important;
  border:1px solid rgba(19,37,52,.13)!important;border-radius:20px!important;
  background:#f6f6f2!important;
  box-shadow:0 30px 80px rgba(4,17,29,.25),0 1px 0 rgba(255,255,255,.9) inset!important
}
.navoa-agent__head{
  min-height:64px;padding:13px 16px!important;gap:10px!important;
  background:rgba(250,250,247,.96)!important;color:#172a3a!important;
  border-bottom:1px solid rgba(19,37,52,.1)
}
.navoa-agent__head .navoa-agent__mark{
  width:32px;height:32px;background:#fff!important;color:#172a3a!important;
  border:1px solid rgba(19,37,52,.13);box-shadow:0 4px 14px rgba(19,37,52,.08)
}
.navoa-agent__head-text b{font-size:.8125rem;font-weight:500;letter-spacing:-.01em;color:#172a3a}
.navoa-agent__head-text span{margin-top:3px;color:#72808a;font-family:var(--sans);font-size:.75rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase}
.navoa-agent__close{width:30px;height:30px;display:grid;place-items:center;padding:0;border:1px solid transparent;border-radius:50%;color:#697986}
.navoa-agent__close:hover{border-color:rgba(19,37,52,.12);background:#fff;color:#172a3a}
.navoa-agent__body{padding:20px 18px 18px!important;background:linear-gradient(180deg,#f6f6f2 0%,#f2f3f1 100%)}
.navoa-agent__title{color:#172a3a;font-size:1.125rem;font-weight:500;line-height:1.25;letter-spacing:-.025em}
.navoa-agent__description{margin:10px 0 18px;color:#65747f;font-size:.75rem;line-height:1.55}
.navoa-agent__options{gap:8px}
.navoa-agent__options a{
  min-height:46px;padding:0 14px;border:1px solid rgba(19,37,52,.11);border-radius:12px;
  background:rgba(255,255,255,.72);color:#223745;font-size:.75rem;font-weight:500;
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset;transition:background .22s ease,border-color .22s ease,transform .22s ease
}
.navoa-agent__options a:hover{background:#fff;border-color:rgba(19,37,52,.22);transform:translateY(-1px)}
.navoa-agent__options b{color:#788895;font-size:.875rem;font-weight:400}
.navoa-agent__foot{padding:0 16px 15px!important;background:#f2f3f1}
.navoa-agent__form{
  min-height:49px;gap:8px;padding:5px 5px 5px 16px;
  border:1px solid rgba(19,37,52,.14);border-radius:25px;background:#fff!important;
  box-shadow:0 5px 18px rgba(19,37,52,.06),0 1px 0 rgba(255,255,255,.9) inset
}
.navoa-agent__form:focus-within{border-color:rgba(19,37,52,.32);box-shadow:0 6px 20px rgba(19,37,52,.08),0 0 0 3px rgba(28,57,79,.06)}
.navoa-agent__form input{font-size:.7812rem;color:#172a3a}.navoa-agent__form input::placeholder{color:#85919a;opacity:1}
.navoa-agent__send{
  width:38px;height:38px;border:1px solid rgba(255,255,255,.18);background:#172a3a;color:#fff;
  box-shadow:0 5px 14px rgba(19,37,52,.2);transition:transform .22s ease,background .22s ease
}
.navoa-agent__send:hover{background:#243f52;transform:translateX(1px)}
.navoa-agent__wa{margin-top:9px;color:#82909a;font-size:.75rem}.navoa-agent__wa a{color:#304c60;font-weight:500}
.navoa-agent__bubble{background:#e7eaeb;color:#203542}.navoa-agent__bubble--out{background:#172a3a;color:#fff}
@media(max-width:767px){
  .navoa-agent{right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}
  .navoa-agent__toggle{width:44px!important;height:44px!important}
  .navoa-agent__panel{position:fixed!important;left:12px!important;right:12px!important;bottom:70px!important;width:auto!important;max-height:calc(100svh - 88px);overflow-y:auto;border-radius:18px!important}
  .navoa-agent__head{min-height:58px;padding:11px 14px!important}.navoa-agent__body{padding:17px 15px 15px!important}
  .navoa-agent__title{font-size:1.0625rem}.navoa-agent__foot{padding:0 13px 13px!important}
}

/* ============ Ajuste cromático — alineación con www.tempus.com (fondo, textura, esfera, tipografía) ============ */
.hero{background:#2F4253}
.hero::before{
  opacity:1;
  mask-image:none;
  -webkit-mask-image:none;
  background-image:
    repeating-radial-gradient(circle at 50% 50%, rgba(255,255,255,.03) 0px, rgba(255,255,255,.03) 1px, transparent 1px, transparent 3px),
    linear-gradient(180deg,
      #2F4253 0%,
      #38495A 14%,
      #475667 30%,
      #5D6879 50%,
      #707889 68%,
      #8D90A2 100%
    );
  background-repeat:repeat,no-repeat;
  background-size:3px 3px,100% 100%;
  background-position:0 0,center;
}
.hero-orb__sphere{
  background:
    radial-gradient(circle at 27% 19%,rgba(255,255,255,.95) 0%,rgba(255,255,255,.55) 6%,transparent 15%),
    radial-gradient(circle at 68% 82%,rgba(74,102,149,.6),transparent 46%),
    radial-gradient(circle at 30% 22%,
      #F3FAFF 0%,
      #DCE6F9 12%,
      #BCCBE7 24%,
      #9FB1D6 38%,
      #99ACD2 52%,
      #7E93BB 66%,
      #4A6695 82%,
      #6F86AC 100%
    );
  border-color:rgba(240,247,255,.55);
  box-shadow:inset -46px -50px 100px rgba(10,18,36,.6),inset 30px 28px 80px rgba(220,232,250,.32),inset 0 0 60px rgba(255,255,255,.08),0 0 0 1px rgba(255,255,255,.08),0 0 46px rgba(140,165,210,.22);
}
.hero-orb__sphere::before{opacity:.5;background:repeating-radial-gradient(circle at 52% 48%,transparent 0 18px,rgba(255,255,255,.13) 19px 20px),conic-gradient(from 40deg,transparent,rgba(255,255,255,.4),transparent 28%,rgba(122,145,185,.16),transparent 64%)}
.hero-orb__sphere::after{background:linear-gradient(135deg,rgba(255,255,255,.32),transparent 22%,transparent 70%,rgba(139,168,218,.14));box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.hero-title,.hero-title__dark,.hero-title__accent{color:rgba(255,255,255,.94);font-weight:400}
.hero-title__sub{color:rgba(255,255,255,.8)}

/* Escala tipográfica del headline — alineada a "Welcome to the future of healthcare" de tempus.com (24px/300/1.3) */
.hero-title{
  max-width:600px;
  font-size:clamp(1.3125rem,1.9vw,1.6875rem);
  line-height:1.3;
  letter-spacing:normal;
}
@media(min-width:768px){
  html[lang="es-CL"] .hero-title{
    font-size:clamp(1.5rem,1.9vw,1.875rem);
  }
}
.hero-title__sub{
  margin-top:14px;
  max-width:460px;
  font-size:.875rem;
  line-height:1;
  letter-spacing:.08em;
}
.hero-actions{margin-top:22px}

/* Barra de agendamiento — réplica del "Upcoming webinar" bar de tempus.com */
.hero-banner{
  position:absolute;left:0;bottom:56px;z-index:3;
  display:flex;align-items:center;justify-content:flex-start;gap:14px;
  width:fit-content;max-width:min(100%,800px);height:40px;
  padding:0 16px;border-radius:8px;background:#206EF3;
  text-decoration:none;box-sizing:border-box;
  transition:filter .25s ease,transform .25s ease;
}
.hero-banner:hover{filter:brightness(1.08);transform:translateY(-1px)}
.hero-banner__title{
  flex:0 1 auto;min-width:0;font-family:var(--font-body);font-size:.875rem;font-weight:500;
  letter-spacing:normal;text-transform:none;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.hero-banner__cta{
  flex:0 1 auto;display:flex;align-items:center;gap:4px;
  font-family:var(--font-body);font-size:.875rem;font-weight:500;
  text-transform:uppercase;color:#fff;white-space:nowrap;
}
.hero-banner__arrow{display:inline-block;transition:transform .25s ease}
.hero-banner:hover .hero-banner__arrow{transform:translate(2px,-2px)}
@media(max-width:767px){
  .hero-banner{position:relative;left:auto;bottom:auto;margin-top:26px;max-width:100%}
}
@media(max-width:479px){
  .hero-banner{height:auto;min-height:40px;padding:10px 14px;flex-wrap:wrap;gap:6px 14px}
}

/* Asistente Navoa — panel más compacto (sin el párrafo descriptivo) */
.navoa-agent__body{padding:16px 18px!important}
.navoa-agent__options{margin-top:12px}

/* Esfera del hero — red de 3 nodos (Datos → IA → Impacto) en vez del ADN */
.hero-orb__dna{animation:none!important}
.hero-orb__pulse{animation:navoa-orb-pulse 4s linear infinite}
@keyframes navoa-orb-pulse{to{stroke-dashoffset:-100}}

/* Esfera — movimiento ambiental: el punto de luz se desplaza lento sobre el degradé (CASO B, sin rotar el objeto) */
@property --hx{syntax:'<percentage>';inherits:false;initial-value:27%}
@property --hy{syntax:'<percentage>';inherits:false;initial-value:19%}
.hero-orb__sphere{
  background:
    radial-gradient(circle at var(--hx) var(--hy),rgba(255,255,255,.95) 0%,rgba(255,255,255,.55) 6%,transparent 15%),
    radial-gradient(circle at 68% 82%,rgba(74,102,149,.6),transparent 46%),
    radial-gradient(circle at var(--hx) var(--hy),
      #F3FAFF 0%,
      #DCE6F9 12%,
      #BCCBE7 24%,
      #9FB1D6 38%,
      #99ACD2 52%,
      #7E93BB 66%,
      #4A6695 82%,
      #6F86AC 100%
    );
  animation:navoa-orb-float 20s cubic-bezier(.45,0,.55,1) infinite alternate,navoa-sphere-light 18s ease-in-out infinite alternate;
}
@keyframes navoa-sphere-light{
  from{--hx:27%;--hy:19%}
  to{--hx:39%;--hy:31%}
}

/* Ajuste mobile — esfera compacta para que header + esfera + headline + subheadline + CTA
   entren en el primer viewport en iPhone. No toca desktop (>860px): la esfera y el layout
   ahí siguen exactamente igual, esto solo redimensiona el contenedor .hero-orb (width/top)
   y el "slot" de despeje que reserva .hero-copy — la esfera conserva forma, animación,
   degradé y el gráfico IA/Datos/Impacto sin deformarse porque son proporcionales a .hero-orb. */
@media(max-width:767px){
  .hero-orb{
    top:20px;
    width:clamp(190px,52vw,270px);
  }
  .hero-copy{
    min-height:clamp(216px,60vw,290px);
  }
}

/* Ajuste 2026 — etiquetas de la esfera + más aire antes del CTA en mobile.
   No toca desktop (>860px) ni ningún otro elemento del hero. */
@media(max-width:767px){
  html[lang="es-CL"] .hero-title{
    font-size:1.375rem;
  }
  html[lang="es-CL"] .hero-title__sub{
    font-size:.8125rem;
  }

  /* Etiquetas IA / DATOS / IMPACTO: ya existen en el markup (<text> dentro del
     svg), pero a font-size:14 (unidades de viewBox) se vuelven casi ilegibles
     una vez que la esfera se achica en mobile (~0.33-0.45x de escala real).
     Solo se agranda el texto — el triángulo, los puntos y el trazo no se tocan. */
  .hero-orb__dna text{
    font-size:1.625rem;
  }

  /* Balance vertical: baja TODO el bloque (título + CTA) junto, ~25%
     más (108px -> 135px en .hero-copy, .hero-banner sin cambios) —
     ambos se mueven la misma distancia y el aire entre ellos (~14px)
     no se reduce. */
  .hero-copy{
    margin-top:135px;
  }
  .hero-banner{
    margin-top:-10px;
  }

  /* La esfera (.hero-orb) es position:absolute respecto de .hero.
     Sin cambios — se queda en 73px. El centrado horizontal
     (left:50% + translateX(-50%)) no se toca. */
  .hero-orb{
    top:73px;
  }
}

/* Home ES: subir únicamente el bloque de textos un 3% del viewport. */
html[lang="es-CL"] .hero-copy{top:-3svh}

/* Ajustes puntuales de copy del Hero ES, sin desplazar el resto del layout. */
html[lang="es-CL"] .hero-title__sub{position:relative;top:-3px}

@media(min-width:768px){
  html[lang="es-CL"] .hero-banner__title{font-size:calc(.875rem + 1pt)}
}

/* Headline ES: un punto tipográfico adicional, conservando la escala responsive. */
html[lang="es-CL"] .hero-title__dark{font-size:calc(1em + 1pt)}

/* Fase 2 — celular: el banner del hero muestra el texto completo (sin "…") */
@media (max-width:767px) {
  .hero-banner { height: auto; min-height: 44px; flex-wrap: wrap; row-gap: 6px; padding: 10px 14px; }
  .hero-banner__title { white-space: normal; overflow: visible; text-overflow: clip; }
}

/* Inicio: título principal completamente en blanco (incluida la frase de acento en serif). */
.hero-title .hero-title__dark, .hero-title .navoa-accent { color: #fff !important; }