/* =========================================================
   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; }
}

/* ---------- Política de privacidad ---------- */
.politica{ padding:var(--sec-pad) 0; }
.politica .section-title{ font-size:var(--titulo-size); }
.politica-texto{ max-width:820px; margin:0 auto; }
.politica-texto p{ margin:0 0 20px; font-size:15.5px; line-height:1.95; color:var(--texto-suave); }
.politica-texto .politica-fecha{ margin:0 0 26px; font-size:13px; }
.politica-texto h3{
  margin:34px 0 10px;
  font-size:18px; font-weight:600;
  color:var(--azul-oscuro);
}
.politica-texto ul{ margin:0 0 20px; padding-left:22px; list-style:disc; }
.politica-texto li{ margin-bottom:8px; font-size:15px; line-height:1.8; color:var(--texto-suave); }
.politica-texto li::marker{ color:var(--azul-4); }
.politica-texto strong{ color:var(--azul-oscuro); }
.politica-texto a{ color:var(--azul-3); font-weight:500; }

/* =========================================================
   BANNER DE TRABAJA CON NOSOTROS: DOS FOTOS QUE SE TURNAN
   No se busca un solo perfil: hay vacantes de pabellon y
   tambien administrativas. Con una sola foto, la mitad de
   quienes podrian postular no se veian reflejados.

   Van en dos capas superpuestas y se turnan cada diez
   segundos, con un segundo de cruce. Sin JavaScript: si algo
   fallara, se queda viendose la primera, que es la de antes.
   ========================================================= */
.banner-int-foto--alterna{
  opacity:0;
  /* El zoom se repite igual que en la capa de abajo, o al cambiar
     la foto daria un salto de escala. */
  animation:bannerZoom 16s ease-out forwards,
            bannerTrabaja 20s linear infinite;
}

@keyframes bannerTrabaja{
  0%, 45%  { opacity:0; }
  50%, 95% { opacity:1; }
  100%     { opacity:0; }
}

/* EXCEPCION AL BLOQUE DE "MENOS MOVIMIENTO"
   Mas arriba hay una regla general que, cuando el sistema pide reducir
   movimiento, deja TODAS las animaciones en 0,01 ms y una sola repeticion.
   Con eso esta capa se quedaba invisible para siempre y la foto del equipo
   administrativo no la veia nadie con esa preferencia activada: justo las
   personas a las que se quiere llegar.

   Aqui no se trata de decoracion sino de contenido, asi que el cambio se
   mantiene. Lo que si desaparece es el zoom (bannerZoom), que es el
   movimiento de verdad: queda solo un fundido de opacidad de un segundo
   cada diez, que no es el tipo de efecto que esa preferencia busca evitar.

   El !important es necesario porque la regla general tambien lo lleva; se
   impone esta por tener mas especificidad (una clase contra el selector *). */
@media (prefers-reduced-motion:reduce){
  .banner-int-foto--alterna{
    animation:bannerTrabaja 20s linear infinite !important;
  }
}

/* =========================================================
   BANNER INTERIOR SIN EL NOMBRE DE LA EMPRESA
   Antes el banner decia dos lineas: la marca en grande y el
   nombre de la pagina debajo, pequeño. Repetir la marca ahi
   no aportaba nada —ya esta en el logo, en el menu y en el
   pie— asi que queda solo el nombre de la pagina, y pasa a
   ocupar el tamaño grande.

   El filete celeste colgaba del subtitulo, que ya no existe;
   se vuelve a poner aqui debajo del titulo para que el banner
   no pierda su acento.
   ========================================================= */
.banner-int-title--solo{
  position:relative;
  padding-bottom:22px;
}
.banner-int-title--solo::after{
  content:"";
  position:absolute; left:0; bottom:0;
  width:64px; height:2px;
  background:var(--celeste);
}