/* =========================================================
   SPINEX — Hoja de estilos principal
   Dirección visual: clínico moderno
   ========================================================= */

/* ---------- Variables ---------- */
:root{
  /* ---------------------------------------------------------
     ESCALA DE AZULES — todos los azules del sitio salen de aquí.
     Son cinco pasos del mismo tono (matiz 224-227°), de modo que
     al combinarlos nunca se pelean entre sí.
     --------------------------------------------------------- */
  --azul-1:        #04113f;   /* el más oscuro: fondos de sección */
  --azul-2:        #071c6b;   /* títulos y fondos oscuros */
  --azul-3:        #0a2a8c;   /* AZUL DE MARCA: logo y navegación */
  --azul-4:        #1140b6;   /* enlaces y degradados */
  --azul-5:        #1550cc;   /* el más claro */

  /* Acento celeste: uno para fondo claro y otro para fondo azul */
  --celeste:       #1f93dd;
  --celeste-luz:   #38b6ff;
  --celeste-suave: #e9f3fb;

  /* Nombres por función — apuntan a la escala de arriba */
  --azul-nav:      var(--azul-3);   /* barra de navegación */
  --azul-btn:      var(--azul-3);   /* botones del slider */
  --azul-profundo: var(--azul-2);
  --azul-oscuro:   var(--azul-2);   /* títulos */
  --azul-medio:    var(--azul-4);
  --morado:        #2c2650;   /* franja de contacto (sitio actual) */

  --texto:         #4b556e;
  --texto-suave:   #6b7690;
  --gris-ic:       #eef2f9;
  --borde:         #e4e9f2;
  --fondo-alt:     #f7f9fc;
  --blanco:        #ffffff;

  --container:     1170px;
  --radio-sm:      6px;
  --radio:         12px;
  --radio-lg:      18px;

  --sombra-sm:     0 2px 10px rgba(10, 30, 80, .06);
  --sombra-md:     0 14px 34px rgba(10, 30, 80, .12);
  --sombra-lg:     0 26px 60px rgba(10, 30, 80, .18);

  --ease:          cubic-bezier(.25, .8, .25, 1);
  --ease-out:      cubic-bezier(.16, 1, .3, 1);

  /* ---- Enganches de tema (cada tema de /temas los sobrescribe) ---- */
  --sec-pad:          96px;
  --hero-alto:        640px;
  --hero-fade:        .8s;     /* duración del deslizamiento entre diapositivas */
  --hero-zoom:        13s;     /* duración del acercamiento de la imagen */
  --hero-delay:       8.5s;    /* debe coincidir con DELAY en main.js */
  --card-radio:       var(--radio);
  --img-radio:        var(--radio);
  --btn-radio:        999px;
  --titulo-size:      31px;
  --titulo-align:     center;
  --titulo-weight:    600;
  --titulo-color:     var(--azul-oscuro);
  --parrafo-align:    left;
  --parrafo-size:     14.5px;
  --topbar-bg:        var(--fondo-alt);
  --nav-bg:           linear-gradient(100deg, var(--azul-2), var(--azul-3) 45%, var(--azul-4) 100%);
  --sec-alt-bg:       linear-gradient(180deg, var(--blanco) 0%, var(--fondo-alt) 22%, var(--fondo-alt) 78%, var(--blanco) 100%);
  --franja-bg:        linear-gradient(115deg, #322b56 0%, #2c2650 55%, #241f45 100%);
  --footer-bg:        linear-gradient(115deg, var(--azul-5) 0%, var(--azul-4) 38%, var(--azul-2) 100%);
  --sombra-card:      var(--sombra-sm);
  --sombra-card-hov:  var(--sombra-lg);
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  font-family:'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size:15px;
  line-height:1.75;
  color:var(--texto);
  background:var(--blanco);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--azul-medio); text-decoration:none; transition:color .25s var(--ease); }
a:hover{ color:var(--celeste); }
ul{ margin:0; padding:0; list-style:none; }
p{ margin:0 0 18px; }
h1,h2,h3,h4{ margin:0 0 18px; color:var(--azul-oscuro); font-weight:600; line-height:1.25; }
button{ font-family:inherit; cursor:pointer; }
svg{ width:100%; height:100%; fill:currentColor; display:block; }
::selection{ background:var(--celeste); color:#fff; }

.container{
  width:100%;
  max-width:var(--container);
  margin:0 auto;
  padding:0 24px;
}

/* =========================================================
   HEADER
   ========================================================= */
.site-header{ position:relative; z-index:100; background:var(--blanco); }

/* ---- Barra superior ---- */
.topbar{
  background:var(--topbar-bg);
  border-bottom:1px solid var(--borde);
}
.topbar-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; min-height:46px; flex-wrap:wrap;
}
.flags{ display:flex; align-items:center; gap:10px; }
.flags img{
  width:38px; height:23px; object-fit:cover;
  border-radius:3px;
  box-shadow:0 1px 3px rgba(10,30,80,.18);
  filter:saturate(.9);
  transition:transform .35s var(--ease-out), box-shadow .35s var(--ease), filter .35s var(--ease);
}
.flags a:hover img{
  transform:translateY(-3px) scale(1.06);
  box-shadow:0 6px 14px rgba(10,30,80,.25);
  filter:saturate(1.15);
}

.topbar-cta{ display:flex; gap:8px; }
.btn-top{
  position:relative;
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 20px;
  border:1px solid transparent;
  border-radius:var(--btn-radio);
  font-size:10.5px; font-weight:600; letter-spacing:.11em; text-transform:uppercase;
  color:#fff;
  overflow:hidden;
  transition:transform .3s var(--ease-out), box-shadow .3s var(--ease),
             background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.btn-top svg{ width:14px; height:14px; flex:0 0 auto; }
.btn-top::after{           /* destello al pasar el mouse */
  content:"";
  position:absolute; top:0; left:-120%;
  width:60%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.45), transparent);
  transform:skewX(-20deg);
  transition:left .6s var(--ease-out);
}
.btn-top:hover::after{ left:130%; }
.btn-top:hover{ transform:translateY(-2px); box-shadow:0 8px 16px rgba(10,30,80,.22); }
/* los dos en el azul del banner: uno macizo y otro delineado */
.btn-top--one{ background:var(--azul-nav); border-color:var(--azul-nav); }
.btn-top--one:hover{ color:#fff; background:var(--azul-medio); border-color:var(--azul-medio); }
.btn-top--two{ background:transparent; border-color:var(--azul-nav); color:var(--azul-nav); }
.btn-top--two:hover{ background:var(--azul-nav); color:#fff; }

/* ---- Bloque fijo (logo + nav) ---- */
.header-sticky{
  position:sticky; top:0; z-index:90;
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(10px);
  transition:box-shadow .35s var(--ease);
}
.header-sticky.is-stuck{ box-shadow:0 6px 26px rgba(10,30,80,.10); }

.header-main-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding:22px 24px;
  transition:padding .35s var(--ease);
}
.header-sticky.is-stuck .header-main-inner{ padding:11px 24px; }

.brand img{ width:158px; transition:width .35s var(--ease); }
.header-sticky.is-stuck .brand img{ width:128px; }

.header-contact{ display:flex; align-items:center; gap:34px; }
.header-contact li{
  position:relative;
  display:flex; align-items:center; gap:12px;
  padding-left:0;
}
.header-contact li + li{ padding-left:34px; }
.header-contact li + li::before{     /* separador fino */
  content:"";
  position:absolute; left:0; top:50%;
  width:1px; height:30px;
  background:var(--borde);
  transform:translateY(-50%);
}
.header-contact .ic{
  position:relative;
  flex:0 0 auto;
  width:38px; height:38px; padding:9px;
  border-radius:50%;
  background:var(--gris-ic);
  color:var(--azul-nav);
  transition:background .35s var(--ease), color .35s var(--ease), transform .35s var(--ease-out);
}
.header-contact .ic::after{          /* anillo que se expande */
  content:"";
  position:absolute; inset:0;
  border-radius:50%;
  border:1px solid var(--celeste);
  opacity:0;
  transform:scale(.8);
  transition:opacity .45s var(--ease), transform .45s var(--ease-out);
}
.header-contact li:hover .ic{
  background:var(--azul-nav); color:#fff;
  transform:translateY(-2px);
}
.header-contact li:hover .ic::after{ opacity:1; transform:scale(1.32); }
.header-contact p{
  margin:0; font-size:12.5px; line-height:1.55; color:var(--texto);
}
.header-contact strong{
  display:block;
  color:var(--azul-oscuro);
  font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
}
.header-contact a{ color:inherit; }
.header-contact a:hover{ color:var(--celeste); }

/* ---- Hamburguesa ---- */
.nav-toggle{
  display:none;
  width:46px; height:40px; padding:10px 9px;
  border:0; border-radius:var(--radio-sm);
  background:var(--azul-nav);
}
.nav-toggle span{
  display:block; height:2px; border-radius:2px; background:#fff;
  transition:transform .35s var(--ease-out), opacity .2s var(--ease);
}
.nav-toggle span + span{ margin-top:5px; }
.nav-toggle.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2){ opacity:0; }
.nav-toggle.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ---- Navegación ---- */
.header-nav{
  position:relative;
  background:var(--nav-bg);
  background-size:200% 100%;
  animation:navShift 18s ease-in-out infinite;
}
@keyframes navShift{
  0%,100%{ background-position:0% 50%; }
  50%    { background-position:100% 50%; }
}
.header-nav::after{                  /* filo celeste inferior */
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height:2px;
  background:linear-gradient(90deg, transparent, var(--celeste), transparent);
  opacity:.85;
}
.menu{ display:flex; justify-content:center; flex-wrap:wrap; }
.menu > li{ position:relative; }
.menu > li > a{
  display:block;
  padding:13px 28px;
  font-size:13px; font-style:italic; font-weight:600; letter-spacing:.02em;
  color:rgba(255,255,255,.92);
  position:relative;
  transition:color .3s var(--ease);
}
.menu > li > a::after{
  content:"";
  position:absolute; left:50%; bottom:8px;
  width:0; height:2px;
  background:var(--celeste);
  border-radius:2px;
  transform:translateX(-50%);
  transition:width .4s var(--ease-out);
}
.menu > li:hover > a::after,
.menu > li.current > a::after{ width:calc(100% - 56px); }
.menu > li > a:hover{ color:#fff; }

.menu .has-sub > a{ padding-right:38px; }
.menu .has-sub > a::before{
  content:"";
  position:absolute; right:22px; top:50%;
  width:6px; height:6px;
  border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:translateY(-70%) rotate(45deg);
  transition:transform .3s var(--ease-out);
}
.menu .has-sub:hover > a::before{ transform:translateY(-30%) rotate(225deg); }

.sub-toggle{ display:none; }

.sub-menu{
  position:absolute; left:0; top:100%;
  min-width:238px;
  padding:8px 0;
  background:#fff;
  border-radius:0 0 var(--radio) var(--radio);
  box-shadow:var(--sombra-md);
  opacity:0; visibility:hidden;
  transform:translateY(14px);
  transition:opacity .3s var(--ease), transform .3s var(--ease-out), visibility .3s;
}
.menu > li:hover > .sub-menu{ opacity:1; visibility:visible; transform:translateY(0); }
.sub-menu a{
  position:relative;
  display:block;
  padding:11px 22px;
  font-size:13px; font-weight:500;
  color:var(--azul-oscuro);
  transition:background .3s var(--ease), padding-left .3s var(--ease-out), color .3s var(--ease);
}
.sub-menu a::before{
  content:"";
  position:absolute; left:12px; top:50%;
  width:0; height:2px;
  background:var(--celeste);
  transform:translateY(-50%);
  transition:width .3s var(--ease-out);
}
.sub-menu a:hover{ background:var(--celeste-suave); color:var(--azul-nav); padding-left:34px; }
.sub-menu a:hover::before{ width:14px; }

/* =========================================================
   SLIDER
   ========================================================= */
.hero{
  position:relative;
  height:var(--hero-alto);
  overflow:hidden;
  background:var(--azul-profundo);
}
.hero-track{ position:absolute; inset:0; overflow:hidden; }

.hero-slide{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  transform:translateX(100%);
  pointer-events:none;
  /* arranca rápido y frena suave, como un desliz en el celular */
  transition:transform var(--hero-fade) cubic-bezier(.32,.72,0,1);
}
.hero-slide.is-active{ pointer-events:auto; z-index:2; }
/* el JS coloca la diapositiva entrante fuera de cuadro sin animación */
.hero-slide.sin-anim{ transition:none; }

.hero-bg{
  position:absolute; inset:0;
  background-position:center top;
  background-size:cover;
  transform:scale(1.08);
}
/* movimiento continuo de la imagen mientras la diapositiva está visible */
.hero-slide.is-active .hero-bg{
  animation:kenburns var(--hero-zoom) cubic-bezier(.22,.61,.36,1) both;
}
@keyframes kenburns{
  from{ transform:scale(1.09); }
  to  { transform:scale(1); }
}
.hero-bg::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(6,20,60,.30) 0%, rgba(6,20,60,.12) 40%, rgba(6,20,60,.52) 100%),
    radial-gradient(ellipse at center, transparent 35%, rgba(6,20,60,.35) 100%);
}

/* círculos decorativos */
.hero-ring{
  position:absolute; top:50%; left:50%;
  border-radius:50%;
  transform:translate(-50%,-50%) scale(.75);
  opacity:0;
  transition:transform 1.6s var(--ease-out), opacity 1.3s var(--ease);
  z-index:2;
}
.hero-ring--lg{
  width:800px; height:800px;
  background:rgba(255,255,255,.05);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.10);
}
.hero-ring--sm{
  width:560px; height:560px;
  background:rgba(255,255,255,.06);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
}
.hero-slide.is-active .hero-ring{ transform:translate(-50%,-50%) scale(1); opacity:1; }
.hero-slide.is-active .hero-ring--sm{ transition-delay:.12s; }

.hero-content{
  position:relative; z-index:3;
  text-align:center;
  color:#fff;
}
.hero-title{
  margin:0 0 14px;
  font-family:'Roboto', 'Poppins', sans-serif;
  font-size:74px; font-weight:300; line-height:1.1;
  letter-spacing:.04em;
  color:#fff;
  text-shadow:0 4px 26px rgba(0,0,0,.30);
}
.hero-sub{
  position:relative;
  display:block;
  margin:0 0 34px;
  padding-bottom:16px;
  font-family:'Roboto', 'Poppins', sans-serif;
  font-size:27px; font-weight:300; letter-spacing:.06em;
  color:#fff;
  text-shadow:0 3px 18px rgba(0,0,0,.35);
}
.hero-sub::after{                 /* línea que crece bajo el subtítulo */
  content:"";
  position:absolute; left:50%; bottom:0;
  width:0; height:2px;
  background:var(--celeste);
  transform:translateX(-50%);
  transition:width .9s var(--ease-out) .8s;
}
.hero-slide.is-active .hero-sub::after{ width:96px; }

.hero-text{
  margin:0 auto 34px;
  max-width:820px;
  font-family:'Roboto', 'Poppins', sans-serif;
  font-size:19px; font-weight:400; line-height:1.65;
  color:rgba(255,255,255,.96);
  text-shadow:0 3px 18px rgba(0,0,0,.4);
}
.hero-btn{
  position:relative;
  display:inline-block;
  padding:13px 32px;
  border-radius:var(--btn-radio);
  background:var(--azul-btn);
  color:#fff;
  font-size:14px; font-weight:500; letter-spacing:.02em;
  overflow:hidden;
  box-shadow:0 10px 26px rgba(9,2,132,.38);
  transition:transform .35s var(--ease-out), box-shadow .35s var(--ease), background .35s var(--ease);
  z-index:1;
}
.hero-btn::before{                /* relleno que barre de izquierda a derecha */
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(90deg, var(--celeste), var(--azul-4));
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .45s var(--ease-out);
  z-index:-1;
}
.hero-btn:hover{
  color:#fff;
  transform:translateY(-3px);
  box-shadow:0 16px 32px rgba(9,2,132,.45);
}
.hero-btn:hover::before{ transform:scaleX(1); }

/* animación de entrada de los textos */
.hero-slide [data-anim]{
  opacity:0;
  transform:translateY(34px);
  filter:blur(4px);
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out), filter .9s var(--ease-out);
}
.hero-slide.is-active [data-anim]{ opacity:1; transform:translateY(0); filter:blur(0); }
.hero-slide.is-active [data-anim="1"]{ transition-delay:.35s; }
.hero-slide.is-active [data-anim="2"]{ transition-delay:.58s; }
.hero-slide.is-active [data-anim="3"]{ transition-delay:.80s; }

/* flechas */
.hero-arrow{
  position:absolute; top:50%; z-index:5;
  width:56px; height:56px; padding:15px;
  transform:translateY(-50%);
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
  background:rgba(255,255,255,.06);
  backdrop-filter:blur(4px);
  color:rgba(255,255,255,.9);
  transition:background .35s var(--ease), color .35s var(--ease),
             transform .35s var(--ease-out), border-color .35s var(--ease);
}
.hero-arrow:hover{ background:rgba(255,255,255,.2); border-color:rgba(255,255,255,.55); color:#fff; }
.hero-arrow--prev{ left:26px; }
.hero-arrow--next{ right:26px; }
.hero-arrow--prev:hover{ transform:translateY(-50%) translateX(-4px); }
.hero-arrow--next:hover{ transform:translateY(-50%) translateX(4px); }

/* puntos */
.hero-dots{
  position:absolute; left:50%; bottom:28px; z-index:5;
  display:flex; align-items:center; gap:10px;
  transform:translateX(-50%);
}
.hero-dots button{
  position:relative;
  width:9px; height:9px; padding:0;
  border:0; border-radius:999px;
  background:rgba(255,255,255,.45);
  overflow:hidden;
  transition:background .35s var(--ease), width .45s var(--ease-out);
}
.hero-dots button.is-active{ width:34px; background:rgba(255,255,255,.35); }
/* la barrita avisa cuánto falta para el siguiente cambio */
.hero-dots button.is-active::after{
  content:"";
  position:absolute; inset:0;
  border-radius:inherit;
  background:#fff;
  transform-origin:left center;
  animation:dotProgreso var(--hero-delay) linear both;
}
@keyframes dotProgreso{
  from{ transform:scaleX(0); }
  to  { transform:scaleX(1); }
}
/* al pasar el mouse el slider se detiene: también la imagen y la barrita */
.hero.is-paused .hero-slide.is-active .hero-bg,
.hero.is-paused .hero-dots button.is-active::after{ animation-play-state:paused; }

/* =========================================================
   TÍTULOS DE SECCIÓN
   ========================================================= */
.section-title{
  position:relative;
  margin:0 0 46px;
  padding-bottom:20px;
  font-size:var(--titulo-size); font-weight:var(--titulo-weight); letter-spacing:-.01em;
  color:var(--titulo-color);
  text-align:var(--titulo-align);
}
.section-title::after{
  content:"";
  position:absolute; left:50%; bottom:0;
  width:0; height:3px;
  border-radius:3px;
  background:linear-gradient(90deg, var(--azul-nav), var(--celeste));
  transform:translateX(-50%);
  transition:width .9s var(--ease-out) .25s;
}
.section-title.is-visible::after{ width:72px; }
.section-title--left{ text-align:left; }
.section-title--left::after{ left:0; transform:none; }

/* =========================================================
   INTRO
   ========================================================= */
.intro{ padding:var(--sec-pad) 0 calc(var(--sec-pad) - 26px); }
.intro-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px 60px;
  max-width:1040px;
  align-items:start;
}
.intro-col p{
  font-size:var(--parrafo-size); line-height:1.95;
  color:var(--texto-suave);
  text-align:var(--parrafo-align);
}
.intro-col p::first-letter{ color:var(--azul-oscuro); font-weight:600; }

.intro-fig{
  position:relative;
  margin:0 0 26px;
  aspect-ratio:16 / 10;          /* las dos fotos con la misma altura */
  border-radius:var(--img-radio);
  overflow:hidden;
  box-shadow:var(--sombra-card);
}
.intro-col:last-child .intro-fig{ margin:0; }
.intro-fig::after{                 /* velo azul que se disipa al pasar el mouse */
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(10,42,140,.12), rgba(10,42,140,.02));
  opacity:1;
  transition:opacity .6s var(--ease);
  pointer-events:none;
}
.intro-fig:hover::after{ opacity:0; }
.intro-fig img{
  width:100%; height:100%;
  object-fit:cover;              /* recorta lo justo en vez de deformar */
  transition:transform .9s var(--ease-out);
}
.intro-fig:hover img{ transform:scale(1.05); }

/* =========================================================
   SOLUCIONES
   ========================================================= */
.soluciones{
  position:relative;
  padding:calc(var(--sec-pad) - 16px) 0 var(--sec-pad);
  background:var(--sec-alt-bg);
}

.deco-circle{
  position:absolute; top:96px;
  width:52px; height:52px;
  border:1.5px dashed rgba(198, 62, 72, .55);
  border-radius:50%;
  pointer-events:none;
  animation:decoFloat 7s ease-in-out infinite;
}
.deco-circle--left{ left:calc(50% - 290px); }
.deco-circle--right{ right:calc(50% - 290px); animation-delay:-3.5s; }
@keyframes decoFloat{
  0%,100%{ transform:translateY(0) rotate(0deg); }
  50%    { transform:translateY(-12px) rotate(180deg); }
}
/* halo que respira; lo usan los temas que ponen esta franja sobre azul */
@keyframes respirar{
  0%,100%{ transform:translateX(-50%) scale(1);    opacity:.85; }
  50%    { transform:translateX(-50%) scale(1.18); opacity:1; }
}

.marcas{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:22px;
  max-width:850px;
  margin:0 auto;
}
.marca{
  position:relative;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:20px;
  aspect-ratio:3 / 2;
  padding:24px;
  border-radius:var(--card-radio);
  background-color:var(--azul-3);
  background-size:cover;
  background-position:center;
  overflow:hidden;
  box-shadow:var(--sombra-card);
  transition:box-shadow .45s var(--ease), transform .45s var(--ease-out);
}
.marca::before{                   /* velo degradado */
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(6,26,92,.12), rgba(6,26,92,.52));
  transition:background .45s var(--ease);
}
.marca::after{                    /* brillo diagonal al pasar el mouse */
  content:"";
  position:absolute; top:0; left:-140%;
  width:70%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.22), transparent);
  transform:skewX(-18deg);
  transition:left .85s var(--ease-out);
}
.marca:hover{ transform:translateY(-8px); box-shadow:var(--sombra-card-hov); }
.marca:hover::before{ background:linear-gradient(180deg, rgba(6,26,92,.32), rgba(6,26,92,.68)); }
.marca:hover::after{ left:140%; }

.marca-logo{
  position:relative; z-index:2;
  width:66%; max-width:180px;
  transition:transform .5s var(--ease-out);
}
.marca:hover .marca-logo{ transform:scale(1.07) translateY(-4px); }

.marca-btn{
  position:relative; z-index:2;
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 20px;
  border:1px solid rgba(255,255,255,.85);
  border-radius:var(--btn-radio);
  color:#fff;
  font-size:11px; font-weight:500; letter-spacing:.06em;
  transition:background .4s var(--ease), color .4s var(--ease), gap .4s var(--ease-out);
}
.marca-btn::after{                /* flecha dibujada con bordes */
  content:"";
  width:6px; height:6px;
  border-right:1.5px solid currentColor;
  border-top:1.5px solid currentColor;
  transform:rotate(45deg);
  transition:transform .4s var(--ease-out);
}
.marca:hover .marca-btn{ background:#fff; color:var(--azul-nav); gap:12px; }
.marca:hover .marca-btn::after{ transform:rotate(45deg) translate(2px,-2px); }

/* =========================================================
   BANNER DE PÁGINA INTERIOR
   ========================================================= */
.banner-int{
  position:relative;
  display:flex; align-items:center;
  min-height:320px;
  overflow:hidden;
  background:var(--azul-profundo);
}
.banner-int-foto{
  position:absolute; inset:0;
  background-size:cover;
  background-position:center;
  transform:scale(1.06);
  animation:bannerZoom 16s ease-out forwards;
}
@keyframes bannerZoom{ to{ transform:scale(1); } }

/* Para fotos de baja resolución: un desenfoque mínimo disimula el pixelado.
   La imagen se mantiene siempre por sobre el 100% para que el desenfoque
   no deje los bordes transparentes. */
.banner-int-foto--suave{
  filter:blur(2.5px);
  transform:scale(1.12);
  animation:bannerZoomSuave 16s ease-out forwards;
}
@keyframes bannerZoomSuave{ to{ transform:scale(1.06); } }
.banner-int-foto::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(6,20,60,.78) 0%, rgba(6,20,60,.42) 55%, rgba(6,20,60,.20) 100%);
}
.banner-int-inner{
  position:relative; z-index:2;
  color:#fff;
}
.banner-int-title{
  margin:0;
  font-size:46px; font-weight:600; letter-spacing:-.01em;
  color:#fff;
  animation:bannerEntra .9s var(--ease-out) both;
}
.banner-int-sub{
  position:relative;
  margin:8px 0 0; padding-top:16px;
  font-size:15px; font-weight:300; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.88);
  animation:bannerEntra .9s var(--ease-out) .15s both;
}
.banner-int-sub::before{
  content:"";
  position:absolute; left:0; top:0;
  width:64px; height:2px;
  background:var(--celeste);
}
@keyframes bannerEntra{
  from{ opacity:0; transform:translateY(24px); }
  to  { opacity:1; transform:none; }
}

/* =========================================================
   PÁGINA DE SOLUCIONES
   ========================================================= */
.soluciones-pag{ padding:var(--sec-pad) 0; }

.sol-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:28px;
}

.sol-card{
  position:relative;
  display:flex; flex-direction:column;
  border-radius:var(--card-radio);
  background:var(--blanco);
  border:1px solid var(--borde);
  box-shadow:var(--sombra-card);
  overflow:hidden;
  transition:transform .45s var(--ease-out), box-shadow .45s var(--ease),
             border-color .45s var(--ease);
}
.sol-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--sombra-card-hov);
  border-color:transparent;
}

.sol-foto{
  position:relative;
  aspect-ratio:4 / 3;
  overflow:hidden;
  background:var(--fondo-alt);
}
.sol-foto img{
  width:100%; height:100%;
  object-fit:cover;
  transition:transform .8s var(--ease-out);
}
.sol-card:hover .sol-foto img{ transform:scale(1.06); }
.sol-foto::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 55%, rgba(6,26,92,.35));
  opacity:0;
  transition:opacity .45s var(--ease);
}
.sol-card:hover .sol-foto::after{ opacity:1; }

.sol-cuerpo{
  display:flex; flex-direction:column; align-items:flex-start;
  gap:10px;
  padding:22px 24px 24px;
}
.sol-titulo{
  margin:0;
  font-size:17px; font-weight:600;
  color:var(--azul-oscuro);
}
.sol-desc{
  display:none;                 /* el texto vive en la ficha flotante */
  margin:0;
  font-size:13.5px; line-height:1.85;
  color:var(--texto-suave);
}
.sol-abrir{
  display:inline-flex; align-items:center; gap:7px;
  margin-top:2px; padding:0;
  border:0; background:none;
  color:var(--azul-medio);
  font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  transition:color .3s var(--ease), gap .3s var(--ease-out);
}
.sol-abrir svg{ width:13px; height:13px; }
.sol-abrir::after{              /* toda la tarjeta queda clicable */
  content:"";
  position:absolute; inset:0;
}
.sol-card:hover .sol-abrir{ color:var(--celeste); gap:12px; }

/* ---- Ficha flotante ---- */
.ficha{
  position:fixed; inset:0; z-index:300;
  display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.ficha[hidden]{ display:none; }
.ficha-fondo{
  position:absolute; inset:0;
  background:rgba(6,20,60,.62);
  backdrop-filter:blur(3px);
  opacity:0;
  transition:opacity .35s var(--ease);
}
.ficha.is-open .ficha-fondo{ opacity:1; }

.ficha-caja{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1.15fr);
  width:100%; max-width:820px;
  max-height:calc(100vh - 48px);
  border-radius:var(--radio-lg);
  background:var(--blanco);
  box-shadow:0 40px 90px rgba(4,17,63,.45);
  overflow:hidden;
  opacity:0;
  transform:translateY(26px) scale(.96);
  transition:opacity .4s var(--ease), transform .45s var(--ease-out);
}
.ficha.is-open .ficha-caja{ opacity:1; transform:none; }

.ficha-foto{ background:var(--fondo-alt); }
.ficha-foto img{
  width:100%; height:100%;
  min-height:260px;
  object-fit:cover;
}
.ficha-texto{
  display:flex; flex-direction:column; justify-content:center;
  gap:14px;
  padding:44px 44px 44px 40px;
  overflow-y:auto;
}
.ficha-titulo{
  position:relative;
  margin:0; padding-bottom:16px;
  font-size:26px; font-weight:600;
  color:var(--azul-oscuro);
}
.ficha-titulo::after{
  content:"";
  position:absolute; left:0; bottom:0;
  width:54px; height:3px; border-radius:3px;
  background:linear-gradient(90deg, var(--azul-nav), var(--celeste));
}
.ficha-desc{
  margin:0;
  font-size:14.5px; line-height:1.9;
  color:var(--texto);
}
.ficha-cerrar{
  position:absolute; top:14px; right:14px; z-index:2;
  width:38px; height:38px; padding:11px;
  border:0; border-radius:50%;
  background:rgba(255,255,255,.92);
  color:var(--azul-oscuro);
  box-shadow:0 4px 14px rgba(4,17,63,.2);
  transition:background .3s var(--ease), color .3s var(--ease), transform .3s var(--ease-out);
}
.ficha-cerrar:hover{ background:var(--azul-nav); color:#fff; transform:rotate(90deg); }

body.ficha-abierta{ overflow:hidden; }

/* =========================================================
   TRABAJA CON NOSOTROS
   ========================================================= */
.razones{ padding:var(--sec-pad) 0 calc(var(--sec-pad) - 20px); }
.razones-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:44px 40px;
  max-width:1020px; margin:0 auto;
}
.razon{ text-align:center; }
.razon-ic{
  width:64px; height:64px; margin:0 auto 18px;
  display:flex; align-items:center; justify-content:center;
  transition:transform .45s var(--ease-out);
}
.razon:hover .razon-ic{ transform:translateY(-5px) scale(1.06); }
.razon-ic img{ max-width:100%; max-height:100%; width:auto; }
.razon p{
  margin:0;
  font-size:13.5px; line-height:1.85;
  color:var(--texto-suave);
}

.razones-fotos{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:16px;
  max-width:1020px; margin:56px auto 0;
}
.razones-fotos figure{
  margin:0;
  aspect-ratio:3 / 4;
  border-radius:var(--card-radio);
  overflow:hidden;
  box-shadow:var(--sombra-card);
}
.razones-fotos img{
  width:100%; height:100%;
  object-fit:cover;
  transition:transform .8s var(--ease-out);
}
.razones-fotos figure:hover img{ transform:scale(1.07); }

/* ---- Formas de postular ---- */
.postular{
  padding:calc(var(--sec-pad) - 16px) 0;
  background:var(--franja-bg);
  color:#fff;
}
.postular-titulo{
  max-width:720px; margin:0 auto 42px;
  font-size:22px; font-weight:500; line-height:1.55;
  color:#fff;
  text-align:center;
}
.postular-vias{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:20px;
  max-width:900px; margin:0 auto;
}
.via{
  display:flex; align-items:center; gap:18px;
  padding:22px 24px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:var(--card-radio);
  background:rgba(255,255,255,.06);
  color:#fff;
  transition:background .35s var(--ease), border-color .35s var(--ease),
             transform .35s var(--ease-out);
}
.via:hover{
  color:#fff;
  background:rgba(255,255,255,.12);
  border-color:var(--celeste-luz);
  transform:translateY(-4px);
}
.via-ic{
  flex:0 0 auto;
  width:44px; height:44px; padding:11px;
  border-radius:50%;
  background:rgba(255,255,255,.14);
  color:#fff;
}
.via-txt{ flex:1 1 auto; min-width:0; }
.via-txt strong{ display:block; font-size:15px; font-weight:600; }
.via-txt small{
  display:block; margin-top:3px;
  font-size:12.5px; line-height:1.6;
  color:rgba(255,255,255,.75);
}
.via-flecha{
  flex:0 0 auto;
  width:18px; height:18px;
  color:var(--celeste-luz);
  transition:transform .35s var(--ease-out);
}
.via:hover .via-flecha{ transform:translateX(5px); }

/* ---- Publicaciones de LinkedIn ---- */
.linkedin-feed{ padding:var(--sec-pad) 0; }
.posts-li{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:22px;
  max-width:1020px; margin:0 auto;
}
.post-li{
  border:1px solid var(--borde);
  border-radius:var(--card-radio);
  background:var(--blanco);
  box-shadow:var(--sombra-card);
  overflow:hidden;
  transition:box-shadow .4s var(--ease), transform .4s var(--ease-out);
}
.post-li:hover{ transform:translateY(-4px); box-shadow:var(--sombra-card-hov); }
/* El iframe viene de LinkedIn con ancho y alto propios de cada publicación.
   Los igualamos para que las tres tarjetas midan lo mismo. */
.post-li iframe{
  width:100% !important;
  max-width:100%;
  height:520px !important;
  border:0;
  display:block;
}
.post-li--vacio{
  display:flex; align-items:center; justify-content:center;
  min-height:320px;
  border:1px dashed var(--borde);
  background:var(--fondo-alt);
  color:var(--texto-suave);
  font-size:13px;
}
/* Tarjeta de respaldo cuando la página se abre como archivo local */
.post-li-local{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:12px;
  min-height:300px; padding:32px 26px;
  background:var(--fondo-alt);
  text-align:center;
}
.post-li-local-ic{
  width:44px; height:44px; padding:11px;
  border-radius:50%;
  background:var(--azul-3);
  color:#fff;
  transition:transform .35s var(--ease-out);
}
.post-li-local:hover .post-li-local-ic{ transform:scale(1.08); }
.post-li-local-txt{
  font-size:14px; font-weight:600;
  color:var(--azul-oscuro);
}
.post-li-local small{
  font-size:12px; line-height:1.6;
  color:var(--texto-suave);
}
.linkedin-pie{ margin:34px 0 0; text-align:center; }
.linkedin-pie .franja-btn{
  border-color:var(--azul-3);
  color:var(--azul-3);
}
.linkedin-pie .franja-btn::before{ background:var(--azul-3); }
.linkedin-pie .franja-btn:hover{ color:#fff; }

/* =========================================================
   INFORMACIÓN AL CIRUJANO
   ========================================================= */
.cirujano-pag{ padding:var(--sec-pad) 0 calc(var(--sec-pad) - 24px); }
.accesos{
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:26px;
}
.acceso{
  display:flex; flex-direction:column; align-items:center;
  flex:0 1 300px;
  padding:38px 30px 32px;
  border:1px solid var(--borde);
  border-radius:var(--card-radio);
  background:var(--blanco);
  box-shadow:var(--sombra-card);
  text-align:center;
  transition:transform .45s var(--ease-out), box-shadow .45s var(--ease),
             border-color .45s var(--ease);
}
.acceso:hover{
  transform:translateY(-8px);
  box-shadow:var(--sombra-card-hov);
  border-color:transparent;
}
.acceso-ic{
  width:74px; height:74px; margin-bottom:20px; padding:14px;
  border-radius:50%;
  background:var(--celeste-suave);
  transition:background .45s var(--ease), transform .45s var(--ease-out);
}
.acceso:hover .acceso-ic{ background:var(--azul-3); transform:scale(1.06); }
.acceso-ic img{
  width:100%; height:100%; object-fit:contain;
  transition:filter .45s var(--ease);
}
.acceso:hover .acceso-ic img{ filter:brightness(0) invert(1); }
.acceso-titulo{
  margin:0 0 8px;
  font-size:17px; font-weight:600;
  color:var(--azul-oscuro);
}
.acceso-txt{
  margin:0 0 22px;
  font-size:13px; line-height:1.75;
  color:var(--texto-suave);
}
.acceso-btn{
  display:inline-flex; align-items:center; gap:8px;
  margin-top:auto; padding:10px 22px;
  border-radius:var(--btn-radio);
  background:var(--azul-3);
  color:#fff;
  font-size:11.5px; font-weight:600; letter-spacing:.07em; text-transform:uppercase;
  transition:background .3s var(--ease), gap .3s var(--ease-out), color .3s var(--ease);
}
.acceso-btn svg{ width:13px; height:13px; }
.acceso:hover .acceso-btn{ background:var(--azul-4); color:#fff; gap:13px; }

/* ---- Panel de Instagram ---- */
.instagram-cta{ padding:0 0 var(--sec-pad); }
.ig-panel{
  position:relative;
  display:flex; align-items:center; gap:24px;
  max-width:760px; margin:0 auto;
  padding:30px 34px;
  border-radius:var(--card-radio);
  background:linear-gradient(100deg, var(--azul-2) 0%, var(--azul-3) 55%, var(--azul-4) 100%);
  color:#fff;
  overflow:hidden;
  box-shadow:0 18px 44px rgba(10, 42, 140, .28);
  transition:transform .4s var(--ease-out), box-shadow .4s var(--ease);
}
.ig-panel::after{                  /* destello al pasar el mouse */
  content:"";
  position:absolute; top:0; left:-130%;
  width:60%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.28), transparent);
  transform:skewX(-18deg);
  transition:left .9s var(--ease-out);
}
.ig-panel:hover{ color:#fff; transform:translateY(-4px); box-shadow:0 26px 56px rgba(10,42,140,.38); }
.ig-panel:hover::after{ left:140%; }
.ig-ic{
  position:relative; z-index:2;
  flex:0 0 auto;
  width:58px; height:58px; padding:13px;
  border-radius:18px;
  background:rgba(255,255,255,.18);
  color:#fff;
}
.ig-txt{ position:relative; z-index:2; flex:1 1 auto; min-width:0; }
.ig-txt strong{
  display:block;
  font-size:19px; font-weight:600; letter-spacing:-.01em;
}
.ig-txt em{
  display:block; margin-top:2px;
  font-size:14px; font-style:normal;
  color:rgba(255,255,255,.85);
}
.ig-btn{
  position:relative; z-index:2;
  flex:0 0 auto;
  padding:11px 26px;
  border-radius:var(--btn-radio);
  background:#fff;
  color:var(--azul-3);
  font-size:12px; font-weight:600; letter-spacing:.07em; text-transform:uppercase;
  transition:background .3s var(--ease), color .3s var(--ease);
}
.ig-panel:hover .ig-btn{ background:var(--celeste-luz); color:var(--azul-1); }

@media (max-width:600px){
  .ig-panel{ flex-direction:column; text-align:center; gap:16px; padding:28px 22px; }
  .acceso{ flex:1 1 100%; }
}

/* =========================================================
   PÁGINA DE CONTACTO
   ========================================================= */
.contacto-pag{ padding:var(--sec-pad) 0 calc(var(--sec-pad) - 30px); }
.contacto-grid{
  display:grid;
  grid-template-columns:1.25fr 1fr;
  gap:56px;
  align-items:start;
}
.contacto-form .section-title,
.contacto-datos .section-title{ font-size:24px; margin-bottom:32px; }

.dato{
  display:flex; align-items:flex-start; gap:16px;
  margin-bottom:14px; padding:18px 20px;
  border:1px solid var(--borde);
  border-radius:var(--card-radio);
  background:var(--blanco);
  box-shadow:var(--sombra-card);
  color:var(--texto);
  transition:transform .35s var(--ease-out), box-shadow .35s var(--ease),
             border-color .35s var(--ease);
}
.dato:hover{
  color:var(--texto);
  transform:translateX(5px);
  box-shadow:var(--sombra-card-hov);
  border-color:transparent;
}
.dato-ic{
  flex:0 0 auto;
  width:42px; height:42px; padding:11px;
  border-radius:50%;
  background:var(--celeste-suave);
  color:var(--azul-3);
  transition:background .35s var(--ease), color .35s var(--ease);
}
.dato:hover .dato-ic{ background:var(--azul-3); color:#fff; }
.dato--wa:hover .dato-ic{ background:#25d366; }
.dato-txt{
  font-size:13px; line-height:1.7;
  color:var(--texto-suave);
}
.dato-txt strong{
  display:block; margin-bottom:2px;
  font-size:13.5px; font-weight:600;
  color:var(--azul-oscuro);
}

/* ---- Mapa ---- */
.mapa{ padding:0 0 var(--sec-pad); }
.mapa-marco{
  border-radius:var(--card-radio);
  overflow:hidden;
  box-shadow:var(--sombra-card);
  line-height:0;
}
.mapa-marco iframe{
  width:100%; height:420px;
  border:0; display:block;
  filter:saturate(.9);
  transition:filter .5s var(--ease);
}
.mapa-marco:hover iframe{ filter:saturate(1); }

/* =========================================================
   VENTANAS MODALES (formulario y textos legales)
   ========================================================= */
.modal{
  position:fixed; inset:0; z-index:320;
  display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.modal[hidden]{ display:none; }
.modal-fondo{
  position:absolute; inset:0;
  background:rgba(4,17,63,.62);
  backdrop-filter:blur(3px);
  opacity:0;
  transition:opacity .35s var(--ease);
}
.modal.is-open .modal-fondo{ opacity:1; }
.modal .modal-caja{
  position:relative;
  width:100%; max-width:620px;
  max-height:calc(100vh - 48px);
  padding:44px 44px 40px;
  border-radius:var(--radio-lg);
  background:var(--blanco);
  box-shadow:0 40px 90px rgba(4,17,63,.45);
  overflow-y:auto;
  opacity:0;
  transform:translateY(26px) scale(.96);
  transition:opacity .4s var(--ease), transform .45s var(--ease-out);
}
.modal.is-open .modal-caja{ opacity:1; transform:none; }
.modal-caja--texto{ max-width:680px; }
.modal-cerrar{
  position:absolute; top:14px; right:14px; z-index:2;
  width:38px; height:38px; padding:11px;
  border:0; border-radius:50%;
  background:var(--fondo-alt);
  color:var(--azul-oscuro);
  transition:background .3s var(--ease), color .3s var(--ease), transform .3s var(--ease-out);
}
.modal-cerrar:hover{ background:var(--azul-3); color:#fff; transform:rotate(90deg); }
.modal .modal-titulo{
  position:relative;
  margin:0 0 8px; padding-bottom:16px;
  font-size:24px; font-weight:600;
  color:var(--azul-oscuro);
}
.modal .modal-titulo::after{
  content:"";
  position:absolute; left:0; bottom:0;
  width:54px; height:3px; border-radius:3px;
  background:linear-gradient(90deg, var(--azul-3), var(--celeste));
}
.modal-bajada{
  margin:14px 0 26px;
  font-size:13.5px; line-height:1.75;
  color:var(--texto-suave);
}

/* ---- Campos ---- */
.form-cv .campo{ margin-bottom:16px; }
.form-cv .campo-fila{
  display:grid; grid-template-columns:1fr 1fr; gap:16px;
}
.form-cv label{
  display:block; margin-bottom:6px;
  font-size:12.5px; font-weight:600;
  color:var(--azul-oscuro);
}
.req{ color:#c8324a; }
.form-cv input[type="text"],
.form-cv input[type="email"],
.form-cv input[type="tel"],
.form-cv textarea{
  width:100%;
  padding:11px 14px;
  border:1px solid var(--borde);
  border-radius:var(--radio-sm);
  background:var(--fondo-alt);
  font-family:inherit; font-size:14px;
  color:var(--texto);
  transition:border-color .25s var(--ease), background .25s var(--ease), box-shadow .25s var(--ease);
}
.form-cv input:focus,
.form-cv textarea:focus{
  outline:none;
  border-color:var(--azul-4);
  background:var(--blanco);
  box-shadow:0 0 0 3px rgba(17,64,182,.12);
}
.form-cv textarea{ resize:vertical; min-height:76px; }
.form-cv .campo-ayuda{
  display:block; margin-top:6px;
  font-size:11.5px; color:var(--texto-suave);
}
.form-cv .error{ border-color:#c8324a; background:#fff6f7; }

/* trampa anti-bots: fuera de la vista pero no con display:none */
.campo-trampa{
  position:absolute !important;
  left:-9999px; top:auto;
  width:1px; height:1px; overflow:hidden;
}

/* ---- Selector de archivo ---- */
.campo-archivo{ position:relative; }
.campo-archivo input[type="file"]{
  position:absolute; inset:0;
  width:100%; height:100%;
  opacity:0; cursor:pointer;
}
.campo-archivo-cara{
  display:flex; align-items:center; gap:10px;
  padding:11px 14px;
  border:1px dashed var(--borde);
  border-radius:var(--radio-sm);
  background:var(--fondo-alt);
  font-size:13.5px;
  color:var(--texto-suave);
  transition:border-color .25s var(--ease), color .25s var(--ease);
}
.campo-archivo-cara svg{ width:17px; height:17px; flex:0 0 auto; color:var(--azul-4); }
.campo-archivo:hover .campo-archivo-cara,
.campo-archivo input:focus + .campo-archivo-cara{
  border-color:var(--azul-4); color:var(--azul-oscuro);
}
.campo-archivo.tiene-archivo .campo-archivo-cara{
  border-style:solid; border-color:var(--azul-4);
  color:var(--azul-oscuro); background:var(--celeste-suave);
}

/* ---- Consentimiento ---- */
.form-cv .campo-check{
  display:flex; align-items:flex-start; gap:11px;
  margin:22px 0 18px; padding:16px 18px;
  border:1px solid var(--borde);
  border-radius:var(--radio-sm);
  background:var(--fondo-alt);
  font-size:12.5px; font-weight:400; line-height:1.7;
  color:var(--texto);
  margin-bottom:18px;
}
.form-cv .campo-check input{
  flex:0 0 auto; width:17px; height:17px; margin-top:2px;
  accent-color:var(--azul-3);
}
.enlace-terminos{
  display:inline; padding:0;
  border:0; background:none;
  color:var(--azul-4);
  font:inherit; text-decoration:underline;
}
.enlace-terminos:hover{ color:var(--celeste); }

/* ---- Captcha ---- */
.campo-captcha{ margin-bottom:16px; }
.campo-captcha:empty{ margin-bottom:0; }   /* sin clave configurada, no ocupa espacio */
.campo-captcha > div{ max-width:100%; }

/* ---- Aviso y botón ---- */
.form-aviso{
  margin-bottom:16px; padding:13px 16px;
  border-radius:var(--radio-sm);
  font-size:13px; line-height:1.65;
}
.form-aviso.es-error{ background:#fdeff1; color:#9d2438; border:1px solid #f3c9d1; }
.form-aviso.es-ok{ background:#eaf7ef; color:#1d6b3d; border:1px solid #c2e7d1; }

.form-enviar{
  position:relative;
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  width:100%; padding:14px 28px;
  border:0; border-radius:var(--btn-radio);
  background:var(--azul-3);
  color:#fff;
  font-size:13px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  transition:background .3s var(--ease), transform .3s var(--ease-out), opacity .3s var(--ease);
}
.form-enviar:hover{ background:var(--azul-4); transform:translateY(-2px); }
.form-enviar[disabled]{ opacity:.6; transform:none; cursor:not-allowed; }
.form-enviar-carga{
  display:none;
  width:15px; height:15px;
  border:2px solid rgba(255,255,255,.4);
  border-top-color:#fff;
  border-radius:50%;
  animation:girar .8s linear infinite;
}
.form-enviar.enviando .form-enviar-carga{ display:block; }
@keyframes girar{ to{ transform:rotate(360deg); } }

/* ---- Aviso de consentimiento ---- */
.legal-intro{
  margin:18px 0 22px;
  font-size:13px; line-height:1.8;
  color:var(--texto);
}
.legal-intro p{ margin:0 0 12px; }
.legal-intro p:last-child{ margin:0; }

.legal-bloques{
  border:1px solid var(--borde);
  border-radius:var(--radio-sm);
  overflow:hidden;
}
.legal-bloque{
  padding:14px 18px;
  border-bottom:1px solid var(--borde);
}
.legal-bloque:last-child{ border-bottom:0; }
.legal-bloque:nth-child(even){ background:var(--fondo-alt); }
.legal-bloque h4{
  position:relative;
  margin:0 0 5px; padding-left:16px;
  font-size:13px; font-weight:600;
  color:var(--azul-oscuro);
}
.legal-bloque h4::before{          /* viñeta */
  content:"";
  position:absolute; left:0; top:7px;
  width:7px; height:7px; border-radius:50%;
  background:var(--celeste);
}
.legal-bloque p{
  margin:0; padding-left:16px;
  font-size:12.5px; line-height:1.75;
  color:var(--texto-suave);
}

.legal-consents{ margin-top:22px; }
.legal-check{
  display:flex; align-items:flex-start; gap:12px;
  margin-bottom:12px; padding:14px 16px;
  border:1px solid var(--borde);
  border-radius:var(--radio-sm);
  font-size:12.5px; line-height:1.75;
  color:var(--texto);
  cursor:pointer;
  transition:border-color .25s var(--ease), background .25s var(--ease);
}
.legal-check:hover{ border-color:var(--azul-4); }
.legal-check input{
  flex:0 0 auto; width:17px; height:17px; margin-top:2px;
  accent-color:var(--azul-3);
}
.legal-check input:checked ~ span{ color:var(--azul-oscuro); }
.legal-check strong{ color:var(--azul-oscuro); }

.legal-acciones{
  display:flex; flex-direction:column; gap:10px;
  margin-top:22px;
}
.legal-aceptar,
.legal-cancelar{
  width:100%; padding:14px 24px;
  border:0; border-radius:var(--radio-sm);
  font-size:14px; font-weight:600;
  transition:background .3s var(--ease), color .3s var(--ease);
}
.legal-aceptar{ background:var(--azul-3); color:#fff; }
.legal-aceptar:hover:not([disabled]){ background:var(--azul-4); }
.legal-aceptar[disabled]{
  background:var(--borde); color:var(--texto-suave); cursor:not-allowed;
}
.legal-cancelar{ background:var(--fondo-alt); color:var(--azul-3); }
.legal-cancelar:hover{ background:var(--celeste-suave); }

/* ---- Texto legal ---- */
.texto-legal{
  margin-top:22px;
  font-size:13px; line-height:1.85;
  color:var(--texto);
}
.texto-legal p{ margin:0 0 14px; }
.texto-legal strong{ color:var(--azul-oscuro); }
.texto-legal-nota{
  margin-top:20px; padding:13px 16px;
  border-left:3px solid var(--celeste);
  background:var(--fondo-alt);
  font-size:12px; color:var(--texto-suave);
}

/* el botón de "Envíanos tu CV" es <button>: hay que igualarlo al <a> */
button.via{
  width:100%;
  border:1px solid rgba(255,255,255,.2);
  font-family:inherit; font-size:inherit; text-align:left;
}

/* ---- Aviso de cookies / seguimiento ---- */
.aviso-cookies{
  position:fixed; left:24px; bottom:24px; z-index:310;
  width:min(420px, calc(100vw - 48px));
  padding:22px 24px;
  border-radius:var(--radio);
  background:var(--blanco);
  box-shadow:0 24px 60px rgba(4,17,63,.28);
  transform:translateY(24px);
  opacity:0;
  transition:opacity .4s var(--ease), transform .45s var(--ease-out);
}
.aviso-cookies[hidden]{ display:none; }
.aviso-cookies.is-open{ opacity:1; transform:none; }
.aviso-cookies h4{
  margin:0 0 8px;
  font-size:15px; font-weight:600;
  color:var(--azul-oscuro);
}
.aviso-cookies p{
  margin:0 0 16px;
  font-size:12.5px; line-height:1.7;
  color:var(--texto-suave);
}
.aviso-cookies-botones{ display:flex; gap:10px; flex-wrap:wrap; }
.aviso-cookies button{
  padding:9px 20px;
  border-radius:var(--btn-radio);
  border:1px solid var(--azul-3);
  font-size:12px; font-weight:600;
  transition:background .3s var(--ease), color .3s var(--ease);
}
.aviso-cookies .acepta{ background:var(--azul-3); color:#fff; }
.aviso-cookies .acepta:hover{ background:var(--azul-4); border-color:var(--azul-4); }
.aviso-cookies .lee{ background:transparent; color:var(--azul-3); }
.aviso-cookies .lee:hover{ background:var(--celeste-suave); }

@media (max-width:600px){
  .modal{ padding:12px; }
  .modal .modal-caja{ padding:34px 22px 28px; }
  .form-cv .campo-fila{ grid-template-columns:1fr; }
  .aviso-cookies{ left:12px; right:12px; bottom:12px; width:auto; }
}

/* =========================================================
   NUESTRA EMPRESA
   ========================================================= */
.empresa{ padding:var(--sec-pad) 0; }
.empresa-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:48px 64px;
  max-width:1040px;
}
.empresa-txt p{
  font-size:var(--parrafo-size); line-height:1.95;
  color:var(--texto-suave);
  text-align:var(--parrafo-align);
}
.empresa-txt p strong,
.empresa-txt p b{ color:var(--azul-oscuro); }
.empresa-cert{
  width:80%; max-width:330px;
  margin:34px 0 0;
  transition:transform .5s var(--ease-out);
}
.empresa-cert:hover{ transform:scale(1.04); }
.empresa-img{
  position:relative;
  border-radius:var(--radio-lg);
  padding:14px;
  background:radial-gradient(circle at 50% 45%, var(--celeste-suave), transparent 70%);
}
.empresa-img img{
  width:100%;
  animation:floatY 8s ease-in-out infinite;
}
@keyframes floatY{
  0%,100%{ transform:translateY(0); }
  50%    { transform:translateY(-14px); }
}

/* =========================================================
   FRANJA DE CONTACTO
   ========================================================= */
.franja{
  position:relative;
  padding:calc(var(--sec-pad) - 12px) 0;
  background:var(--franja-bg);
  color:#fff;
  overflow:hidden;
}
.franja::before{                  /* halo suave en movimiento */
  content:"";
  position:absolute; top:-40%; left:-10%;
  width:620px; height:620px;
  background:radial-gradient(circle, rgba(37,150,211,.22), transparent 65%);
  animation:haloDrift 16s ease-in-out infinite;
  pointer-events:none;
}
@keyframes haloDrift{
  0%,100%{ transform:translate(0,0); }
  50%    { transform:translate(140px, 60px); }
}
.franja-grid{
  position:relative; z-index:2;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:44px;
}
.franja-col{ padding:0 10px; }
.franja-col + .franja-col{
  border-left:1px solid rgba(255,255,255,.16);
  padding-left:56px;
  text-align:right;
}
.franja-pre{
  display:block;
  font-size:12px; font-weight:300; letter-spacing:.08em;
  color:rgba(255,255,255,.7);
}
.franja-title{
  margin:4px 0 16px;
  font-size:32px; font-weight:300; letter-spacing:.09em;
  color:#fff;
}
.franja p{
  font-size:13px;
  color:rgba(255,255,255,.78);
  margin-bottom:26px;
}
.franja-btn{
  position:relative;
  display:inline-block;
  padding:11px 28px;
  border:1px solid rgba(255,255,255,.9);
  border-radius:var(--btn-radio);
  background:transparent;
  color:#fff;
  font-size:11px; font-weight:600; letter-spacing:.11em; text-transform:uppercase;
  overflow:hidden;
  transition:color .4s var(--ease), transform .35s var(--ease-out), box-shadow .35s var(--ease);
  z-index:1;
}
.franja-btn::before{
  content:"";
  position:absolute; inset:0;
  background:#fff;
  transform:scaleX(0);
  transform-origin:right center;
  transition:transform .45s var(--ease-out);
  z-index:-1;
}
.franja-btn:hover{
  color:var(--morado);
  transform:translateY(-3px);
  box-shadow:0 12px 26px rgba(0,0,0,.25);
}
.franja-btn:hover::before{ transform:scaleX(1); transform-origin:left center; }

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{
  position:relative;
  padding:calc(var(--sec-pad) - 16px) 0 28px;
  background:var(--footer-bg);
  color:rgba(255,255,255,.85);
  overflow:hidden;
}
.footer-glow{
  position:absolute; top:-160px; left:-90px;
  width:880px; height:460px;
  background:radial-gradient(ellipse at center, rgba(74,160,255,.45), transparent 65%);
  animation:haloDrift 20s ease-in-out infinite;
  pointer-events:none;
}
.footer-grid{
  position:relative; z-index:2;
  display:grid;
  grid-template-columns:1.25fr 1fr 1fr;
  gap:46px;
}
.footer-brand img{
  width:186px; margin-bottom:24px;
  transition:transform .45s var(--ease-out);
}
.footer-brand:hover img{ transform:translateY(-3px); }
.footer-col p{
  font-size:12.5px; line-height:1.95;
  color:rgba(255,255,255,.78);
}
.footer-col h4{
  position:relative;
  margin:0 0 24px; padding-bottom:12px;
  font-size:16px; font-weight:600; letter-spacing:.01em;
  color:#fff;
}
.footer-col h4::after{
  content:"";
  position:absolute; left:0; bottom:0;
  width:34px; height:2px; border-radius:2px;
  background:rgba(255,255,255,.55);
}
.footer-contact li{
  display:flex; align-items:center; gap:12px;
  margin-bottom:14px;
  font-size:13px;
}
.footer-contact svg{
  width:15px; height:15px; flex:0 0 auto; color:#fff;
  transition:transform .35s var(--ease-out);
}
.footer-contact li:hover svg{ transform:translateY(-2px) scale(1.1); }
.footer-contact a{
  position:relative;
  color:rgba(255,255,255,.88);
}
.footer-contact a::after{
  content:"";
  position:absolute; left:0; bottom:-2px;
  width:0; height:1px; background:#fff;
  transition:width .35s var(--ease-out);
}
.footer-contact a:hover{ color:#fff; }
.footer-contact a:hover::after{ width:100%; }

.footer-social{ display:flex; gap:10px; margin-top:26px; }
.footer-social a{
  display:block;
  width:36px; height:36px; padding:9px;
  border-radius:50%;
  background:rgba(255,255,255,.13);
  color:#fff;
  transition:background .35s var(--ease), transform .35s var(--ease-out), box-shadow .35s var(--ease);
}
.footer-social a:hover{
  background:#fff; color:var(--azul-nav);
  transform:translateY(-5px);
  box-shadow:0 10px 20px rgba(0,0,0,.25);
}

/* carrusel ISO */
.footer-col--iso{ display:flex; align-items:flex-start; justify-content:center; }
.iso-carousel{
  position:relative;
  width:100%; max-width:262px;
  padding:0 28px;
}
.iso-viewport{ position:relative; height:186px; overflow:hidden; }
.iso-slide{
  position:absolute; inset:0;
  margin:0;
  display:flex; align-items:center; justify-content:center;
  transform:translateX(100%);
  transition:transform .65s cubic-bezier(.32,.72,0,1);
}
.iso-slide.sin-anim{ transition:none; }
.iso-slide img{ max-height:186px; width:auto; }
.iso-arrow{
  position:absolute; top:50%; z-index:3;
  width:26px; height:26px; padding:4px;
  transform:translateY(-50%);
  border:0; border-radius:50%;
  background:transparent;
  color:rgba(255,255,255,.8);
  transition:color .3s var(--ease), background .3s var(--ease);
}
.iso-arrow:hover{ color:#fff; background:rgba(255,255,255,.2); }
.iso-arrow--prev{ left:2px; }
.iso-arrow--next{ right:2px; }
.iso-dots{ display:flex; justify-content:center; gap:7px; margin-top:14px; }
.iso-dots button{
  width:7px; height:7px; padding:0;
  border:0; border-radius:999px;
  background:rgba(255,255,255,.4);
  transition:background .3s var(--ease), width .4s var(--ease-out);
}
.iso-dots button.is-active{ width:20px; background:#fff; }

.footer-divider{
  position:relative; z-index:2;
  height:1px; margin:52px 0 22px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
}
.footer-copy{
  position:relative; z-index:2;
  margin:0;
  text-align:center;
  font-size:12px;
  color:rgba(255,255,255,.72);
}

/* =========================================================
   WHATSAPP
   ========================================================= */
.wa-float{
  position:fixed; right:24px; bottom:24px; z-index:200;
  width:54px; height:54px; padding:12px;
  border-radius:50%;
  background:#25d366;
  color:#fff;
  box-shadow:0 8px 22px rgba(37,211,102,.42);
  animation:wa-in .5s var(--ease-out) both;
  transition:transform .35s var(--ease-out), box-shadow .35s var(--ease);
}
.wa-float::before{                /* anillo que late */
  content:"";
  position:absolute; inset:0;
  border-radius:50%;
  border:2px solid rgba(37,211,102,.55);
  animation:waPulse 2.6s var(--ease-out) infinite;
}
@keyframes waPulse{
  0%  { transform:scale(1);    opacity:.8; }
  70% { transform:scale(1.55); opacity:0; }
  100%{ transform:scale(1.55); opacity:0; }
}
.wa-float:hover{ color:#fff; transform:scale(1.1) rotate(-6deg); box-shadow:0 12px 30px rgba(37,211,102,.5); }
@keyframes wa-in{ from{ opacity:0; transform:scale(0); } to{ opacity:1; transform:scale(1); } }

/* =========================================================
   REVELADO AL HACER SCROLL
   ========================================================= */
.reveal{
  opacity:0;
  transform:translateY(42px);
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out);
  will-change:opacity, transform;
}
.reveal--left  { transform:translateX(-48px); }
.reveal--right { transform:translateX(48px); }
.reveal--zoom  { transform:scale(.94); }
.reveal.is-visible{ opacity:1; transform:none; }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1199px){
  .deco-circle{ display:none; }
  .hero-title{ font-size:64px; }
}

@media (max-width:991px){
  .hero{ height:560px; }
  .hero-title{ font-size:52px; }
  .hero-sub{ font-size:22px; }
  .hero-text{ font-size:17px; }
  .hero-ring--lg{ width:600px; height:600px; }
  .hero-ring--sm{ width:400px; height:400px; }

  .header-contact{ gap:22px; }
  .header-contact li + li{ padding-left:22px; }
  .header-contact p{ font-size:11.5px; }
  .brand img{ width:134px; }

  .section-title{ font-size:27px; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .footer-col--iso{ grid-column:1 / -1; }
}

@media (max-width:860px){
  .nav-toggle{ display:block; }
  .header-contact{ display:none; }

  .header-nav{
    max-height:0;
    overflow:hidden;
    transition:max-height .45s var(--ease-out);
  }
  .header-nav.is-open{ max-height:560px; }
  .menu{ display:block; padding:8px 0; }
  .menu > li > a{ padding:13px 24px; }
  .menu > li > a::after{ display:none; }
  .menu .has-sub > a::before{ display:none; }

  .sub-toggle{
    display:block;
    position:absolute; right:10px; top:7px;
    width:34px; height:34px;
    border:0; border-radius:50%;
    background:rgba(255,255,255,.14);
  }
  .sub-toggle::before{
    content:"";
    position:absolute; left:50%; top:45%;
    width:7px; height:7px;
    border-right:2px solid #fff; border-bottom:2px solid #fff;
    transform:translate(-50%,-50%) rotate(45deg);
    transition:transform .3s var(--ease-out);
  }
  .sub-toggle.is-open::before{ transform:translate(-50%,-20%) rotate(225deg); }

  .sub-menu{
    position:static;
    opacity:1; visibility:visible; transform:none;
    max-height:0; overflow:hidden;
    padding:0; border-radius:0; box-shadow:none;
    background:rgba(255,255,255,.07);
    transition:max-height .4s var(--ease-out);
  }
  .sub-menu.is-open{ max-height:220px; }
  .sub-menu a{ color:#fff; padding-left:38px; }
  .sub-menu a:hover{ background:rgba(255,255,255,.1); color:#fff; }

  .sol-grid,
  .razones-grid,
  .posts-li{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .razones-fotos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .ficha-caja{ grid-template-columns:1fr; max-height:calc(100vh - 40px); }
  .ficha-foto img{ min-height:0; aspect-ratio:16 / 9; }
  .ficha-texto{ padding:30px 28px 34px; }

  .intro-grid,
  .empresa-grid,
  .franja-grid,
  .contacto-grid{ grid-template-columns:1fr; }
  .mapa-marco iframe{ height:320px; }
  .franja-col + .franja-col{
    border-left:0; border-top:1px solid rgba(255,255,255,.16);
    padding-left:10px; padding-top:40px; text-align:left;
  }
  .intro-col:last-child{ display:flex; flex-direction:column-reverse; }
  .intro-col:last-child .intro-fig{ margin:0 0 26px; }
  .reveal--left, .reveal--right{ transform:translateY(42px); }
}

@media (max-width:600px){
  .container{ padding:0 18px; }
  .hero{ height:470px; }
  .hero-title{ font-size:36px; }
  .hero-sub{ font-size:17px; padding-bottom:12px; }
  .hero-text{ font-size:14px; }
  .hero-text br{ display:none; }
  .hero-ring--lg{ width:430px; height:430px; }
  .hero-ring--sm{ width:290px; height:290px; }
  .hero-arrow{ width:44px; height:44px; padding:12px; }
  .hero-arrow--prev{ left:8px; }
  .hero-arrow--next{ right:8px; }

  .topbar-inner{ justify-content:center; padding-top:10px; padding-bottom:10px; }
  .intro{ padding:64px 0 48px; }
  .soluciones{ padding:56px 0 70px; }
  .empresa{ padding:70px 0; }
  .franja{ padding:64px 0; }
  .marcas{ grid-template-columns:1fr; max-width:340px; }
  .sol-grid,
  .razones-grid,
  .posts-li,
  .postular-vias{ grid-template-columns:1fr; }
  .postular-titulo{ font-size:18px; }
  .banner-int{ min-height:230px; }
  .banner-int-title{ font-size:32px; }
  .banner-int-sub{ font-size:12px; letter-spacing:.12em; }
  .ficha{ padding:14px; }
  .ficha-titulo{ font-size:21px; }
  .footer-grid{ grid-template-columns:1fr; }
  .section-title{ font-size:23px; margin-bottom:34px; }
  .franja-title{ font-size:26px; }
}

/* =========================================================
   ESTILO CLÍNICO MODERNO
   Estas reglas vivían en un archivo de tema aparte. Al quedarnos
   con este estilo se integraron aquí, después de las reglas base
   porque las sobrescriben.
   ========================================================= */
:root{
  --sec-pad:          96px;
  --hero-alto:        640px;
  --card-radio:       12px;
  --img-radio:        12px;
  --btn-radio:        999px;
  --titulo-size:      31px;
  --titulo-align:     center;
  --titulo-weight:    600;
  --parrafo-align:    left;
  --parrafo-size:     14.5px;

  /* Los fondos oscuros se arman con la misma escala de azules de arriba */
  --sec-alt-bg:       linear-gradient(165deg, var(--azul-2) 0%, var(--azul-3) 48%, var(--azul-1) 100%);
  --franja-bg:        var(--azul-1);
  --footer-bg:        linear-gradient(160deg, var(--azul-2) 0%, var(--azul-3) 100%);
  --morado:           var(--azul-1);   /* color del texto del botón al rellenarse */
}

/* ---- Cierre de página: franja de contacto y footer ---- */
.franja::before{ display:none; }
.franja-grid{ gap:0; }
.franja-col + .franja-col{ border-left-color:rgba(255,255,255,.14); }
.franja-pre{
  font-size:10px; letter-spacing:.2em; text-transform:uppercase;
}
.franja-title{
  margin:10px 0 18px;
  font-size:44px; font-weight:700; letter-spacing:-.03em;
}
.franja-btn{
  padding:15px 34px;
  border-radius:0;
  font-size:10px; letter-spacing:.18em;
}

.footer-glow{ display:none; }
.footer-col h4{
  padding-bottom:0;
  font-size:11px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase;
  color:rgba(255,255,255,.75);
}
.footer-col h4::after{ display:none; }
.footer-social a{ border-radius:0; }
.iso-dots button{ border-radius:0; height:3px; }

@media (max-width:600px){
  .franja-title{ font-size:32px; }
}

/* ---- Soluciones terapéuticas sobre azul profundo ---- */
.soluciones{
  position:relative;
  overflow:hidden;
  --celeste:var(--celeste-luz);   /* sobre azul oscuro, el acento sube de brillo */
}
.soluciones::before{              /* halo que respira detrás del título */
  content:"";
  position:absolute; top:-30%; left:50%;
  width:900px; height:900px;
  background:radial-gradient(circle, rgba(56,182,255,.16), transparent 62%);
  transform:translateX(-50%);
  animation:respirar 12s ease-in-out infinite;
  pointer-events:none;
}
.soluciones .container{ position:relative; z-index:2; }
.soluciones .section-title{ color:#fff; }
.soluciones .section-title::after{
  background:var(--celeste-luz);
  box-shadow:0 0 18px rgba(56,182,255,.6);
}
.deco-circle{ border-color:rgba(56,182,255,.5); }

.marcas{ max-width:900px; gap:24px; }
.marca{
  border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(2px);
}
.marca::before{ background:linear-gradient(180deg, rgba(4,17,63,.35), rgba(4,17,63,.72)); }
.marca:hover::before{ background:linear-gradient(180deg, rgba(4,17,63,.15), rgba(4,17,63,.55)); }
.marca:hover{ border-color:rgba(56,182,255,.55); }
.marca-btn{
  background:rgba(255,255,255,.1);
  border-color:rgba(255,255,255,.55);
  backdrop-filter:blur(4px);
}
.marca:hover .marca-btn{ background:var(--celeste); border-color:var(--celeste); color:#fff; }

/* Accesibilidad: menos movimiento */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  .reveal{ opacity:1; transform:none; }
}
