/* ============================================================
   CLÍNICA DE CIRUGÍA OCULAR — Stylesheet v2
   ============================================================ */

/* ── CUSTOM PROPERTIES ──────────────────────────────────────── */
:root {
  /* Verde — Hero, Contacto, botones CTA, íconos, acentos */
  --c-primary:       #2DB34A;
  --c-primary-dark:  #1A8A36;
  --c-primary-deep:  #0F5C24;
  --c-primary-light: #E8F8ED;
  --c-primary-glow:  rgba(45,179,74,0.18);
  /* Azul — Especialistas, Visítanos, Footer */
  --c-blue:          #1A6FA8;
  --c-blue-dark:     #1A3A5C;
  --c-blue-deep:     #0D1B2A;
  --c-blue-light:    #E6F1FB;
  --c-blue-mid:      #B5D4F4;
  /* Neutros */
  --c-bg:            #FAFCFB;
  --c-surface:       #FFFFFF;
  --c-surface-alt:   #F5F7FA;
  --c-text:          #1A2332;
  --c-text-mid:      #4A5568;
  --c-text-light:    #718096;
  --c-border:        #E2E8F0;
  --c-border-light:  #EEF2F7;
  --shadow-xs: 0 1px 3px rgba(13,27,42,.06);
  --shadow-sm: 0 4px 16px rgba(13,27,42,.08);
  --shadow-md: 0 8px 32px rgba(13,27,42,.10);
  --shadow-lg: 0 20px 60px rgba(13,27,42,.13);
  --font-display: 'Montserrat', sans-serif;
  --font-body:    'Inter', sans-serif;
  --text-xs:   0.75rem; --text-sm:  0.875rem; --text-base: 1rem;
  --text-lg:   1.125rem; --text-xl: 1.25rem;  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem; --text-4xl:2.5rem;   --text-5xl:  3.5rem;
  --text-6xl:  4.5rem;
  --space-xs: 0.5rem; --space-sm: 1rem; --space-md: 1.5rem;
  --space-lg: 2rem;   --space-xl: 3rem; --space-2xl: 5rem;
  --radius-sm: 8px; --radius-md: 14px; --radius-lg: 22px;
  --radius-xl: 32px; --radius-full: 999px;
  --ease-out: cubic-bezier(0.22,1,0.36,1);
  --dur-fast: 200ms; --dur-mid: 350ms; --dur-slow: 600ms;
  --max-width: 1200px;
  --header-h: 72px;
}

/* ── RESET ──────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-body);color:var(--c-text);background:var(--c-bg);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
address{font-style:normal}
:focus-visible{outline:2.5px solid var(--c-primary);outline-offset:3px;border-radius:4px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;transition-duration:0.01ms!important}}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;line-height:1.2;letter-spacing:-0.02em}

/* ── LAYOUT ─────────────────────────────────────────────────── */
.container{width:min(100%,var(--max-width));margin-inline:auto;padding-inline:clamp(1.25rem,5vw,2.5rem)}

/* ── SHARED SECTION PATTERNS ────────────────────────────────── */
.section-tag{display:inline-block;font-family:var(--font-display);font-size:var(--text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--c-primary);background:var(--c-primary-light);border:1px solid var(--c-border);padding:.3em 1em;border-radius:var(--radius-full);margin-bottom:var(--space-sm)}
.section-title{font-size:clamp(var(--text-2xl),4vw,var(--text-4xl));color:var(--c-text);margin-bottom:var(--space-md)}
.section-subtitle{font-size:var(--text-lg);color:var(--c-text-light);max-width:620px;line-height:1.7}
.section-header{text-align:center;margin-bottom:clamp(2.5rem,5vw,4rem);display:flex;flex-direction:column;align-items:center}

/* ── BUTTONS ────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-display);font-weight:600;font-size:var(--text-sm);letter-spacing:.01em;border-radius:var(--radius-full);transition:all var(--dur-mid) var(--ease-out);white-space:nowrap;cursor:pointer;position:relative;overflow:hidden}
.btn::after{content:'';position:absolute;inset:0;background:rgba(255,255,255,0);transition:background var(--dur-fast)}
.btn:hover::after{background:rgba(255,255,255,0.08)}
.btn--primary{background:var(--c-primary);color:#fff;padding:.75em 1.75em;box-shadow:0 4px 20px rgba(45,179,74,.35)}
.btn--primary:hover{background:var(--c-primary-dark);transform:translateY(-2px);box-shadow:0 8px 28px rgba(45,179,74,.4)}
.btn--outline{background:transparent;color:#fff;padding:.75em 1.75em;border:1.5px solid rgba(255,255,255,.5)}
.btn--outline:hover{background:rgba(255,255,255,.1);border-color:#fff;transform:translateY(-2px)}
/* Botón azul — usado en hero para introducir el azul en la sección verde */
.btn--blue{background:var(--c-blue);color:#fff;padding:.75em 1.75em;box-shadow:0 4px 20px rgba(26,111,168,.4)}
.btn--blue:hover{background:var(--c-blue-dark);transform:translateY(-2px);box-shadow:0 8px 28px rgba(26,111,168,.5)}
.btn--sm{padding:.55em 1.3em;font-size:var(--text-xs)}
.btn--lg{padding:.9em 2.25em;font-size:var(--text-base)}
.btn--full{width:100%;justify-content:center}

/* ── HEADER ─────────────────────────────────────────────────── */
.header{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--header-h);transition:background var(--dur-mid),box-shadow var(--dur-mid)}
.header.scrolled{background:rgba(255,255,255,.93);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:var(--shadow-sm)}
.header__inner{display:flex;align-items:center;justify-content:space-between;height:100%;gap:1rem}
.header__logo-img{height:44px;width:auto;object-fit:contain;display:block;filter:brightness(0) invert(1);transition:filter var(--dur-mid)}
.header.scrolled .header__logo-img{filter:none}
.header__logo{display:flex;align-items:center;flex-shrink:0;color:#fff;transition:color var(--dur-mid)}
.header.scrolled .header__logo{color:var(--c-text)}
.logo-icon{width:36px;height:24px;flex-shrink:0}
.logo-icon svg{width:100%;height:100%}
.logo-text{display:flex;flex-direction:column;line-height:1.1}
.logo-title{font-family:var(--font-display);font-size:var(--text-xs);font-weight:500;opacity:.75;letter-spacing:.05em;text-transform:uppercase}
.logo-subtitle{font-family:var(--font-display);font-size:var(--text-sm);font-weight:700;letter-spacing:-.01em}
.nav__list{display:flex;gap:.25rem;align-items:center}
.nav__link{font-family:var(--font-display);font-size:var(--text-sm);font-weight:500;color:rgba(255,255,255,.85);padding:.4em .85em;border-radius:var(--radius-full);transition:all var(--dur-fast)}
.nav__link:hover{color:#fff;background:rgba(255,255,255,.12)}
.header.scrolled .nav__link{color:var(--c-text-mid)}
.header.scrolled .nav__link:hover{color:var(--c-primary);background:var(--c-primary-light)}
.header__actions{display:flex;align-items:center;gap:.75rem}
.hamburger{display:none;flex-direction:column;gap:5px;width:28px;padding:4px}
.hamburger span{display:block;height:2px;background:#fff;border-radius:2px;transition:all var(--dur-mid) var(--ease-out)}
.header.scrolled .hamburger span{background:var(--c-text)}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* ── HERO ───────────────────────────────────────────────────── */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;background:linear-gradient(135deg,var(--c-primary-deep) 0%,var(--c-primary-dark) 45%,var(--c-primary) 100%);overflow:hidden;padding-top:var(--header-h)}
.hero__bg{position:absolute;inset:0;display:flex;align-items:center;justify-content:flex-end;pointer-events:none;overflow:hidden}
.iris-container{width:clamp(400px,60vw,900px);height:clamp(400px,60vw,900px);flex-shrink:0;opacity:.6}
.iris-svg{width:100%;height:100%;animation:irisRotate 60s linear infinite}
@keyframes irisRotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Hero smart media: video takes priority, image is fallback */
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s;pointer-events:none}
.hero__video.active{opacity:1}
/* Hero image fallback */
.hero__image-layer{position:absolute;inset:0;background-image:url('assets/img/hero-bg.jpg');background-size:cover;background-position:center;opacity:0;transition:opacity .6s;pointer-events:none}
.hero__image-layer.active{opacity:1}
/* Overlay always present so text is readable over media */
.hero::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,transparent 60%,rgba(13,43,21,.45) 100%);pointer-events:none;z-index:1}
.hero__bg,.hero__content,.scroll-indicator{position:relative;z-index:2}

.hero__content{position:relative;z-index:2;padding-top:clamp(3rem,8vh,5rem);padding-bottom:clamp(4rem,10vh,7rem);max-width:700px}
.hero__tag{font-family:var(--font-display);font-size:var(--text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7);margin-bottom:var(--space-md);display:flex;align-items:center;gap:.6rem}
.hero__tag::before{content:'';display:block;width:28px;height:2px;background:var(--c-primary-light);border-radius:2px}

/* MEJORA 1: Título en dos líneas separadas y claras */
.hero__title{display:flex;flex-direction:column;gap:0.2em;margin-bottom:var(--space-md);animation:heroFadeUp .8s var(--ease-out) both}
.hero__title--line1{font-size:clamp(var(--text-3xl),5.5vw,var(--text-5xl));color:#fff;display:block}
.hero__title--accent{
  font-size:clamp(var(--text-3xl),5.5vw,var(--text-5xl));
  display:block;
  color:#2DB34A;                        /* verde del logo como relleno */
  -webkit-text-stroke:2px #ffffff;      /* borde blanco */
  paint-order:stroke fill;              /* borde por encima del relleno */
}
@keyframes heroFadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}

/* MEJORA 2: Subtítulo actualizado */
.hero__subtitle{font-size:clamp(var(--text-base),2vw,var(--text-lg));color:rgba(255,255,255,.78);margin-bottom:var(--space-xl);line-height:1.75;max-width:600px;animation:heroFadeUp .8s .15s var(--ease-out) both}
.hero__actions{display:flex;gap:var(--space-sm);flex-wrap:wrap;animation:heroFadeUp .8s .3s var(--ease-out) both}
.scroll-indicator{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center}
.scroll-indicator__line{width:1.5px;height:48px;background:linear-gradient(to bottom,rgba(255,255,255,.5),transparent);animation:scrollPulse 2s ease-in-out infinite}
@keyframes scrollPulse{0%,100%{opacity:.4;transform:scaleY(1)}50%{opacity:1;transform:scaleY(.7)}}

/* ── STATS BRIDGE CARD — flota entre Hero y Nosotros ────────── */
/*
  Técnica: el hero termina normalmente, el bridge tiene
  margin-top negativo para "subir" sobre el hero,
  y la sección about tiene padding-top compensatorio.
*/
.stats-bridge{
  position:relative;
  z-index:10;
  margin-top:-90px;   /* mitad de la tarjeta queda sobre el hero */
  margin-bottom:0;
}
.stats-bridge__card{
  background:rgba(255,255,255,0.18);
  backdrop-filter:blur(28px);
  -webkit-backdrop-filter:blur(28px);
  border:1px solid rgba(255,255,255,0.35);
  border-radius:var(--radius-xl);
  padding:clamp(1.5rem,3vw,2.25rem) clamp(1.5rem,4vw,3rem);
  box-shadow:0 24px 64px rgba(13,43,21,.20);
}
.stats-bridge__header{
  text-align:center;
  margin-bottom:clamp(1.25rem,3vw,2rem);
  padding-bottom:clamp(1rem,2vw,1.5rem);
  border-bottom:1px solid rgba(255,255,255,0.25);
}
/* TRAYECTORIA → azul claro sobre fondo azul oscuro */
.stats-bridge__label{
  display:inline-block;
  font-family:var(--font-display);
  font-size:var(--text-xs);
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#ffffff;
  text-shadow:0 1px 6px rgba(0,0,0,.4);
  margin-bottom:.4rem;
}
/* Título blanco con sombra para leer sobre el hero */
.stats-bridge__title{
  font-family:var(--font-display);
  font-size:clamp(var(--text-lg),2.5vw,var(--text-2xl));
  font-weight:700;
  color:#fff;
  text-shadow:0 2px 10px rgba(0,0,0,.4);
  letter-spacing:-.02em;
  margin:0;
}
.stats-bridge .stats-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:0;
}
.stats-bridge .stat-item{
  background:transparent;
  border:none;
  border-right:1px solid rgba(255,255,255,0.28);
  border-radius:0;
  padding:var(--space-md) var(--space-md);
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  transition:background var(--dur-mid) var(--ease-out);
}
.stats-bridge .stat-item:last-child{border-right:none}
.stats-bridge .stat-item:hover{background:rgba(255,255,255,0.10)}
/* Íconos → verde */
.stats-bridge .stat-item__icon{
  width:28px;height:28px;
  color:var(--c-primary);
  filter:drop-shadow(0 1px 3px rgba(0,0,0,.15));
  margin-bottom:.55rem;
}
.stats-bridge .stat-item__value{display:flex;align-items:flex-start;justify-content:center;gap:1px;line-height:1}
/* Símbolos + y % → verde corporativo */
.stats-bridge .stat-item__prefix,
.stats-bridge .stat-item__suffix{
  font-family:var(--font-display);
  font-size:var(--text-base);
  font-weight:700;
  color:var(--c-primary);
  padding-top:4px;
  text-shadow:none;
}
/* Números → verde oscuro corporativo, máximo contraste */
.stats-bridge .stat-item__number{
  font-family:var(--font-display);
  font-size:clamp(var(--text-2xl),3vw,var(--text-3xl));
  font-weight:800;
  color:#0F5C24;
  text-shadow:0 1px 3px rgba(255,255,255,.4);
}
/* Etiquetas → gris oscuro, legible sobre fondo claro */
.stats-bridge .stat-item__label{
  font-size:10.5px;
  font-weight:600;
  color:#3a4a3e;
  text-shadow:none;
  line-height:1.45;
  margin-top:.45rem;
  letter-spacing:.02em;
}

/* ── ABOUT ──────────────────────────────────────────────────── */
.about{
  padding-block:clamp(4rem,10vw,8rem);
  background:var(--c-bg);
  position:relative;
}
.about .container{position:relative;z-index:1;display:flex;flex-direction:column;gap:var(--space-lg)}
.about--bridge{padding-top:calc(90px + clamp(3rem,6vw,5rem))}

/* FILA SUPERIOR: texto | imagen */
.about__top{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(2rem,5vw,4rem);
  align-items:center;
}
.about__content{display:flex;flex-direction:column;align-items:flex-start}
.about__text{color:var(--c-text-mid);font-size:var(--text-base);line-height:1.8;margin-bottom:var(--space-md)}

/* Imagen nosotros-banner con degradado */
.about__image-wrap{
  position:relative;border-radius:var(--radius-xl);overflow:hidden;line-height:0;
}
.about__image{
  width:100%;height:clamp(240px,30vw,400px);
  object-fit:cover;object-position:center top;display:block;border-radius:var(--radius-xl);
}
.about__image-overlay{
  position:absolute;inset:0;pointer-events:none;border-radius:var(--radius-xl);
  background:linear-gradient(to bottom,rgba(250,252,251,0) 0%,rgba(250,252,251,.10) 35%,rgba(250,252,251,.55) 70%,rgba(250,252,251,1) 100%);
}
.about__image-wrap--no-img{background:linear-gradient(135deg,var(--c-primary-light),var(--c-surface-alt));min-height:220px}
.about__image-wrap--no-img img{display:none}

/* FILA INFERIOR: 4 tarjetas en una sola fila */
.about__bottom{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:var(--space-sm);
  align-items:stretch;
  margin-top:var(--space-lg);
}
/* Tarjetas de valores */
.value-card{
  background:var(--c-surface);border:1px solid var(--c-border-light);
  border-radius:var(--radius-lg);padding:var(--space-md);
  transition:all var(--dur-mid) var(--ease-out);box-shadow:var(--shadow-xs);
  display:flex;flex-direction:column;
}
.value-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--c-primary)}
.value-card__icon{width:36px;height:36px;color:var(--c-primary);margin-bottom:var(--space-xs)}
.value-card__title{font-family:var(--font-display);font-size:var(--text-sm);font-weight:700;margin-bottom:.25rem;color:var(--c-text)}
.value-card__text{font-size:var(--text-xs);color:var(--c-text-light);line-height:1.55}

/* ── SERVICES (MEJORA 4) ────────────────────────────────────── */
.services{background:var(--c-surface-alt)}
/* Banner image de extremo a extremo */
.services__banner{width:100%;height:320px;background:linear-gradient(135deg,var(--c-primary-deep) 0%,var(--c-primary-dark) 50%,var(--c-primary) 100%);background-image:url('assets/img/servicios-banner.jpg');background-size:cover;background-position:center;position:relative}
.services__banner-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(13,43,21,.72) 0%,rgba(26,138,54,.58) 50%,rgba(62,192,33,.45) 100%)}
.services .container{padding-top:clamp(3rem,6vw,5rem);padding-bottom:clamp(3rem,6vw,5rem)}
/* ── SERVICES CAROUSEL ──────────────────────────────────────── */
.services-carousel{
  position:relative;
  display:flex;
  align-items:center;
  gap:0;
}
/* Botones prev/next en extremos */
.services-carousel__btn{
  flex-shrink:0;
  width:48px;
  height:48px;
  border-radius:50%;
  background:#fff;
  border:2px solid var(--c-border);
  color:var(--c-primary);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:var(--shadow-sm);
  transition:all var(--dur-mid) var(--ease-out);
  z-index:2;
}
.services-carousel__btn:hover{
  background:var(--c-primary);
  color:#fff;
  border-color:var(--c-primary);
  box-shadow:0 6px 24px rgba(45,179,74,.35);
  transform:scale(1.08);
}
.services-carousel__btn--prev{ margin-right:var(--space-sm); }
.services-carousel__btn--next{ margin-left:var(--space-sm); }

/* Ventana del carrusel */
.services-carousel__window{
  flex:1;
  overflow:hidden;
  position:relative;
  padding-top:8px;      /* espacio para que el borde verde del hover no se corte */
  margin-top:-8px;
  padding-bottom:4px;
}
/* Fade edges */
.services-carousel__window::before,
.services-carousel__window::after{
  content:'';
  position:absolute;
  top:0;bottom:0;
  width:30px;
  z-index:1;
  pointer-events:none;
}
.services-carousel__window::before{left:0;background:linear-gradient(to right,var(--c-surface-alt),transparent)}
.services-carousel__window::after{right:0;background:linear-gradient(to left,var(--c-surface-alt),transparent)}

/* El grid real — se desplaza con transform */
.services__grid{
  display:grid;
  /* Desktop: 3 visible cards; mobile JS switches to 1 card */
  grid-template-columns:repeat(5, calc((100% - 2 * var(--space-md)) / 3));
  gap:var(--space-md);
  transition:transform 0.5s var(--ease-out);
  will-change:transform;
}
/* Mobile: cada tarjeta ocupa el 100% del viewport del carrusel */
@media(max-width:640px){
  .services__grid{
    grid-template-columns:repeat(5, 100%);
    gap:var(--space-sm);
  }
  .services-carousel__window{ padding-top:6px; margin-top:-6px; }
  .services-carousel__btn{ width:38px; height:38px; }
}
.service-card{
  background:var(--c-surface);
  border:1px solid var(--c-border-light);
  border-radius:var(--radius-lg);
  padding:var(--space-xl) var(--space-lg);
  display:flex;
  flex-direction:column;
  gap:var(--space-md);
  transition:all var(--dur-mid) var(--ease-out);
  box-shadow:var(--shadow-xs);
  cursor:default;
  min-width:0;
}
.service-card:hover,.service-card:focus{
  transform:translateY(-6px);
  box-shadow:var(--shadow-lg);
  border-color:var(--c-primary);
  outline:none;
}
.service-card__icon{width:56px;height:56px;color:var(--c-primary)}
.service-card__body{flex:1;display:flex;flex-direction:column}
.service-card__title{font-family:var(--font-display);font-size:var(--text-xl);font-weight:700;color:var(--c-text);margin-bottom:var(--space-xs)}
.service-card__text{font-size:var(--text-sm);color:var(--c-text-light);line-height:1.7;flex:1;margin-bottom:var(--space-md)}
.service-card__link{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-display);font-size:var(--text-sm);font-weight:600;color:var(--c-primary);transition:gap var(--dur-fast)}
.service-card:hover .service-card__link,.service-card:focus .service-card__link{gap:.7rem}

/* Dots */
.services-carousel__dots{
  position:absolute;
  bottom:-2.5rem;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:.5rem;
  align-items:center;
}
.svc-dot{
  width:8px;height:8px;
  border-radius:50%;
  background:var(--c-border);
  border:none;
  cursor:pointer;
  transition:all var(--dur-fast);
  padding:0;
}
.svc-dot.active{
  background:var(--c-primary);
  width:24px;
  border-radius:var(--radius-full);
}
/* Extra bottom padding for dots */
.services .container{padding-bottom:calc(clamp(3rem,6vw,5rem) + 2rem)}
/* service-card styles defined above — duplicates removed */

/* ── SPECIALISTS (MEJORA 5) ─────────────────────────────────── */
.specialists{padding-block:clamp(4rem,10vw,8rem);background:linear-gradient(145deg,var(--c-blue-deep) 0%,var(--c-blue-dark) 55%,var(--c-blue) 100%);position:relative;overflow:hidden}
.specialists::before{content:'';position:absolute;width:600px;height:600px;border-radius:50%;border:1px solid rgba(255,255,255,.05);top:-200px;right:-100px;pointer-events:none}
.specialists::after{content:'';position:absolute;width:400px;height:400px;border-radius:50%;border:1px solid rgba(255,255,255,.04);bottom:-150px;left:-80px;pointer-events:none}
.specialists .section-tag{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#fff}
.specialists__title{color:#fff}
.specialists__subtitle{color:rgba(255,255,255,.7)}
.specialists__grid{
  display:grid;
  grid-template-columns:repeat(17, calc((100% - 2 * var(--space-md)) / 3));
  gap:var(--space-md);
  position:relative;
  z-index:1;
  transition:transform 0.5s var(--ease-out);
  will-change:transform;
}

/* ── SPECIALISTS CAROUSEL — todas las pantallas ──────────────── */
.specialists-carousel-wrap{
  position:relative;
  z-index:1;
  overflow:hidden;
  padding-bottom:3.5rem;
}
/* Controles visibles siempre */
.specialists-carousel__controls{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:var(--space-md);
  margin-top:var(--space-lg);
}
.specialists-carousel__btn{
  width:42px;height:42px;
  border-radius:50%;
  background:rgba(255,255,255,.15);
  border:1.5px solid rgba(255,255,255,.35);
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:all var(--dur-fast);
}
.specialists-carousel__btn:hover{background:var(--c-primary);border-color:var(--c-primary)}
.specialists-carousel__dots{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;justify-content:center;max-width:300px}
.spec-dot{
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,.35);
  border:none;cursor:pointer;
  transition:all var(--dur-fast);padding:0;
}
.spec-dot.active{background:#fff;width:22px;border-radius:var(--radius-full)}

/* Mobile: 1 tarjeta visible */
@media(max-width:768px){
  .specialists__grid{
    grid-template-columns:repeat(17, 100%);
  }
}
.specialist-card{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:var(--radius-lg);overflow:hidden;transition:all var(--dur-mid) var(--ease-out);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.specialist-card:hover{transform:translateY(-5px);background:rgba(255,255,255,.16);box-shadow:0 20px 60px rgba(0,0,0,.25)}

/* Foto circular (MEJORA 5) */
.specialist-card__photo-wrap{display:flex;justify-content:center;padding:var(--space-xl) var(--space-lg) var(--space-md)}
.specialist-card__circle{width:140px;height:140px;border-radius:50%;overflow:hidden;border:3px solid rgba(255,255,255,.35);flex-shrink:0;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;position:relative}
.specialist-card__img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.specialist-card__avatar-fallback{width:100%;height:100%;display:none;align-items:center;justify-content:center;color:rgba(255,255,255,.55)}
.specialist-card__avatar-fallback svg{width:70%;height:70%}
.specialist-card__info{padding:0 var(--space-lg) var(--space-lg);text-align:center}
.specialist-card__name{font-family:var(--font-display);font-size:var(--text-lg);font-weight:700;color:#fff;margin-bottom:.35rem}
.specialist-card__role{display:inline-block;font-size:var(--text-xs);font-weight:600;color:#90CAF9;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);padding:.25em .8em;border-radius:var(--radius-full);margin-bottom:var(--space-sm)}
.specialist-card__bio{font-size:var(--text-sm);color:rgba(255,255,255,.65);line-height:1.65}

/* ── TESTIMONIALS (MEJORA 6) ────────────────────────────────── */
.testimonials{padding-block:clamp(4rem,10vw,8rem);background:var(--c-bg);overflow:hidden}
.testimonials__track-wrap{overflow:hidden;position:relative;padding-bottom:var(--space-xl)}
/* Fade edges */
.testimonials__track-wrap::before,.testimonials__track-wrap::after{content:'';position:absolute;top:0;bottom:0;width:60px;z-index:2;pointer-events:none}
.testimonials__track-wrap::before{left:0;background:linear-gradient(to right,var(--c-bg),transparent)}
.testimonials__track-wrap::after{right:0;background:linear-gradient(to left,var(--c-bg),transparent)}

.testimonials__track{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-md);padding-inline:clamp(1.25rem,5vw,2.5rem);max-width:var(--max-width);margin-inline:auto;transition:transform .5s var(--ease-out)}
.testimonial-card{background:var(--c-surface);border:1px solid var(--c-border-light);border-radius:var(--radius-lg);padding:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-md);box-shadow:var(--shadow-xs);transition:box-shadow var(--dur-mid)}
.testimonial-card:hover{box-shadow:var(--shadow-md)}
.testimonial-card__stars{display:flex;gap:3px;color:#F59E0B}
.testimonial-card__stars svg{width:14px;height:14px}
.testimonial-card__text{font-size:var(--text-sm);color:var(--c-text-mid);line-height:1.75;flex:1;font-style:italic}
.testimonial-card__author{display:flex;align-items:center;gap:var(--space-sm)}
.testimonial-card__initials{width:42px;height:42px;border-radius:50%;background:var(--c-primary-light);border:2px solid var(--c-border);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:var(--text-xs);font-weight:700;color:var(--c-primary);flex-shrink:0}
.testimonial-card__name{font-family:var(--font-display);font-size:var(--text-sm);font-weight:700;color:var(--c-text)}
.testimonial-card__detail{font-size:var(--text-xs);color:var(--c-text-light)}

/* Carrusel controls */
.testimonials__controls{display:flex;align-items:center;justify-content:center;gap:var(--space-md);margin-top:var(--space-lg)}
.testimonials__btn{width:44px;height:44px;border-radius:50%;background:var(--c-surface);border:1.5px solid var(--c-border);color:var(--c-text-mid);display:flex;align-items:center;justify-content:center;transition:all var(--dur-fast);cursor:pointer}
.testimonials__btn:hover{background:var(--c-primary);border-color:var(--c-primary);color:#fff}
.testimonials__dots{display:flex;gap:.5rem;align-items:center}
.testimonials__dot{width:8px;height:8px;border-radius:50%;background:var(--c-border);border:none;cursor:pointer;transition:all var(--dur-fast);padding:0}
.testimonials__dot.active{background:var(--c-primary);width:24px;border-radius:var(--radius-full)}

/* ── CONVENIOS — Red de cobertura ───────────────────────────── */
.convenios{
  background:var(--c-surface-alt);
  overflow:hidden;
  padding-bottom:clamp(3.5rem,8vw,6rem);
}
/* Banner superior de imagen — igual que servicios-banner */
.convenios__banner{
  width:100%;
  /* Proporción 1979x320 → aspect-ratio fijo */
  height:320px;
  background:linear-gradient(135deg,var(--c-primary-deep) 0%,var(--c-primary-dark) 50%,var(--c-primary) 100%);
  background-image:url('assets/img/convenios-banner.jpg');
  background-size:cover;
  background-position:center;
  position:relative;
  margin-bottom:clamp(2.5rem,5vw,4rem);
}
/* Degradado que funde la imagen hacia el fondo claro de la sección */
.convenios__banner-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom, rgba(247,250,248,0) 0%, rgba(247,250,248,.10) 35%, rgba(247,250,248,.75) 70%, rgba(247,250,248,1) 100%);
}
.convenios__logos-wrap{
  position:relative;
  overflow:hidden;
}
/* Fade edges del ticker */
.convenios__logos-wrap::before,
.convenios__logos-wrap::after{
  content:'';
  position:absolute;
  top:0;bottom:0;width:120px;z-index:2;pointer-events:none;
}
.convenios__logos-wrap::before{left:0;background:linear-gradient(to right,var(--c-surface-alt),transparent)}
.convenios__logos-wrap::after{right:0;background:linear-gradient(to left,var(--c-surface-alt),transparent)}

/* Ticker infinito — velocidad ajustada a 11 items */
.convenios__track{
  display:flex;
  gap:clamp(1rem,2vw,1.5rem);
  width:max-content;
  animation:conveniosTicker 32s linear infinite;
}
.convenios__track:hover{ animation-play-state:paused }
@keyframes conveniosTicker{
  from{ transform:translateX(0) }
  to  { transform:translateX(-50%) }
}

/* Cada tarjeta de logo — más grande, logo centrado y bien visible */
.convenio-item{
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  border:1px solid #E8EDE9;
  border-radius:var(--radius-lg);
  padding:1.25rem 2rem;
  width:200px;
  height:110px;
  box-shadow:0 2px 16px rgba(13,43,21,.07);
  transition:box-shadow var(--dur-mid),border-color var(--dur-mid),transform var(--dur-mid);
  flex-shrink:0;
  overflow:hidden;
}
.convenio-item:hover{
  box-shadow:0 8px 28px rgba(13,43,21,.13);
  border-color:var(--c-primary);
  transform:translateY(-3px);
}
/* Logo ocupa el máximo espacio disponible dentro de la tarjeta */
.convenio-item img{
  max-width:100%;
  max-height:70px;
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  /* Para logos sin fondo transparente: recorte limpio */
  border-radius:6px;
}
/* Texto de respaldo — visible y bien presentado cuando no hay imagen */
.convenio-item__name{
  font-family:var(--font-display);
  font-size:var(--text-base);
  font-weight:700;
  color:var(--c-text-mid);
  text-align:center;
  letter-spacing:-.01em;
  display:none;
}

/* ── LOCATION ───────────────────────────────────────────────── */
.location .section-title{color:#fff}
.location .section-subtitle{color:rgba(255,255,255,.7)}
.location .section-tag{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#fff}
.location{padding-block:clamp(4rem,10vw,8rem);background:linear-gradient(160deg,var(--c-blue-deep) 0%,var(--c-blue-dark) 100%);position:relative}
/* Línea verde degradada en la parte superior que separa visualmente de Convenios */
.location::before{
  content:'';
  display:block;
  width:60%;
  max-width:700px;
  height:1px;
  background:linear-gradient(to right, transparent, rgba(255,255,255,.3), transparent);
  margin:0 auto clamp(2.5rem,5vw,4rem);
  border-radius:2px;
}
.location__grid{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(2rem,5vw,4rem);align-items:stretch}
.location__info{display:flex;flex-direction:column;gap:var(--space-md)}

/* Tarjeta de cada bloque de info — con hover */
.info-card{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius-lg);
  padding:var(--space-lg);
  transition:all var(--dur-mid) var(--ease-out);
  cursor:default;
}
.info-card:hover{
  transform:translateY(-3px);
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.3);
}
.info-card:hover .info-block__icon{
  background:rgba(255,255,255,.2);
  color:#fff;
}

.info-block{display:flex;gap:var(--space-md);align-items:flex-start}
.info-block__icon{width:46px;height:46px;flex-shrink:0;background:rgba(255,255,255,.1);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:#90CAF9;padding:10px;transition:all var(--dur-mid) var(--ease-out)}
.info-block__icon svg{width:100%;height:100%}
.info-block__title{font-family:var(--font-display);font-size:var(--text-sm);font-weight:700;color:rgba(255,255,255,.9);margin-bottom:.4rem;letter-spacing:.02em}
.info-block__text{font-size:var(--text-sm);color:rgba(255,255,255,.6);line-height:1.7}
.info-block__link{font-size:var(--text-lg);font-family:var(--font-display);font-weight:600;color:#90CAF9;transition:color var(--dur-fast)}
.info-block__link:hover{color:#fff}
.schedule{display:flex;flex-direction:column;gap:.5rem}
.schedule__row{display:flex;justify-content:space-between;align-items:center;font-size:var(--text-sm);padding:.5rem 0;border-bottom:1px solid rgba(255,255,255,.1);gap:1rem}
.schedule__day{color:rgba(255,255,255,.65);font-weight:500}
.schedule__time{font-family:var(--font-display);font-weight:600;color:var(--c-blue-dark);font-size:var(--text-xs);background:rgba(255,255,255,.9);padding:.25em .7em;border-radius:var(--radius-full);white-space:nowrap}
.schedule__row--closed .schedule__time{background:rgba(255,255,255,.15);color:rgba(255,255,255,.4)}
.location__map{display:flex;flex-direction:column}
.location__map iframe{box-shadow:0 8px 32px rgba(0,0,0,.25);border-radius:16px;border:2px solid rgba(255,255,255,.1);flex:1;min-height:340px;width:100%;height:100%}

/* ── CONTACT (MEJORA 7) ─────────────────────────────────────── */
.contact{padding-block:clamp(4rem,10vw,8rem);background:linear-gradient(160deg,var(--c-primary-deep) 0%,var(--c-primary-dark) 100%);position:relative;overflow:hidden}
.contact::before{content:'';position:absolute;width:600px;height:600px;border-radius:50%;border:1px solid rgba(255,255,255,.06);top:-200px;right:-100px;pointer-events:none}
.contact::after{content:'';position:absolute;width:400px;height:400px;border-radius:50%;border:1px solid rgba(255,255,255,.04);bottom:-150px;left:-100px;pointer-events:none}
.contact__grid{display:grid;grid-template-columns:1fr 1.5fr;gap:clamp(2rem,5vw,4rem);align-items:center;position:relative;z-index:1}
.contact__info .section-tag{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#fff}
.contact__info .section-title{color:#fff}
.contact__text{color:rgba(255,255,255,.7);line-height:1.8;margin-bottom:var(--space-xl)}
.contact__channels{display:flex;flex-direction:column;gap:var(--space-sm)}
/* Columna derecha: asesor pegado a la izquierda del formulario */
.contact__right{
  display:flex;
  align-items:stretch;
  border-radius:var(--radius-xl);
  overflow:hidden;
  box-shadow:var(--shadow-lg);
}
.contact__advisor{
  flex-shrink:0;
  width:clamp(120px,13vw,190px);
  overflow:hidden;
}
.contact__advisor-img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  display:block;
}
/* El formulario ocupa el resto */
.contact__form-wrap{
  flex:1;
  border-radius:var(--radius-xl) 0 0 var(--radius-xl) !important;
  box-shadow:none !important;
}
/* Asesor lado derecho */
.contact__advisor{
  flex-shrink:0;
  width:clamp(120px,13vw,190px);
  overflow:hidden;
  border-radius:0 var(--radius-xl) var(--radius-xl) 0;
}
.channel-btn{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);font-family:var(--font-display);font-size:var(--text-sm);font-weight:600;transition:all var(--dur-mid) var(--ease-out)}
.channel-btn--whatsapp{background:rgba(37,211,102,.15);border:1px solid rgba(37,211,102,.3);color:#4ade80}
.channel-btn--whatsapp:hover{background:rgba(37,211,102,.25);transform:translateX(4px)}
.channel-btn--phone{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.85)}
.channel-btn--phone:hover{background:rgba(255,255,255,.14);transform:translateX(4px)}
/* MEJORA 7: Texto separador */
.contact__divider-text{font-size:var(--text-xs);color:rgba(255,255,255,.4);text-align:center;font-style:italic;letter-spacing:.03em;margin-top:var(--space-xs)}

/* Form */
.contact__form-wrap{background:var(--c-surface);border-radius:var(--radius-xl);padding:clamp(1.5rem,4vw,2.5rem);box-shadow:var(--shadow-lg)}
/* MEJORA 7: Encabezado del formulario */
.form__heading{font-family:var(--font-display);font-size:var(--text-lg);font-weight:700;color:var(--c-text);text-align:center;margin-bottom:var(--space-lg);padding-bottom:var(--space-md);border-bottom:1px solid var(--c-border-light);position:relative}
.form__heading::after{content:'';position:absolute;bottom:-1px;left:50%;transform:translateX(-50%);width:40px;height:2px;background:var(--c-primary);border-radius:2px}
.contact-form{display:flex;flex-direction:column;gap:var(--space-md)}
.form-group{display:flex;flex-direction:column;gap:.4rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-sm)}
.form-label{font-family:var(--font-display);font-size:var(--text-xs);font-weight:600;color:var(--c-text);letter-spacing:.03em}
.form-label span{color:var(--c-primary)}
.form-input{font-family:var(--font-body);font-size:var(--text-sm);color:var(--c-text);background:var(--c-bg);border:1.5px solid var(--c-border);border-radius:var(--radius-md);padding:.7em 1em;width:100%;transition:border-color var(--dur-fast),box-shadow var(--dur-fast);appearance:none;-webkit-appearance:none}
.form-input:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px var(--c-primary-glow)}
.form-input::placeholder{color:#9ca3af}
.form-select{background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%236B8C73' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.5rem;cursor:pointer}
.form-textarea{resize:vertical;min-height:120px}
.form-success{display:flex;align-items:center;gap:.5rem;background:var(--c-primary-light);color:var(--c-primary-dark);border:1px solid var(--c-border);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md);font-size:var(--text-sm);font-weight:500;animation:fadeIn .4s var(--ease-out)}
.form-error{display:flex;align-items:center;gap:.5rem;background:#FEF2F2;color:#991B1B;border:1px solid #FECACA;border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md);font-size:var(--text-sm);font-weight:500;animation:fadeIn .4s var(--ease-out)}
.form-success[hidden],.form-error[hidden]{display:none!important}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ── FOOTER ─────────────────────────────────────────────────── */
.footer{background:var(--c-blue-deep);color:rgba(255,255,255,.65);padding-top:clamp(3rem,7vw,5rem)}
.footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:clamp(1.5rem,4vw,3rem);margin-bottom:clamp(2.5rem,5vw,4rem)}
.footer__logo-link{display:block;margin-bottom:var(--space-sm)}
.footer__logo-img{height:48px;width:auto;object-fit:contain;display:block}
.footer__tagline{font-size:var(--text-sm);font-style:italic;color:rgba(255,255,255,.45);margin-top:var(--space-sm);margin-bottom:.5rem}
.footer__mission{font-size:var(--text-xs);color:rgba(255,255,255,.38);line-height:1.65;margin-bottom:var(--space-lg);max-width:260px}
.footer__social{display:flex;gap:.5rem}
.social-btn{width:36px;height:36px;border-radius:var(--radius-md);background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);transition:all var(--dur-fast)}
.social-btn:hover{background:var(--c-primary);color:#fff;transform:translateY(-2px)}
.footer__nav-title{font-family:var(--font-display);font-size:var(--text-xs);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.9);margin-bottom:var(--space-md)}
.footer__nav-list{display:flex;flex-direction:column;gap:.65rem}
.footer__nav-list a{font-size:var(--text-sm);color:rgba(255,255,255,.5);transition:color var(--dur-fast)}
.footer__nav-list a:hover{color:var(--c-primary)}
.footer__address{display:flex;flex-direction:column;gap:.75rem;font-size:var(--text-sm);color:rgba(255,255,255,.5);line-height:1.6}
.footer__address a{transition:color var(--dur-fast)}
.footer__address a:hover{color:var(--c-primary)}
/* Cada fila de contacto con ícono */
.footer__address-item{display:flex;align-items:flex-start;gap:.6rem}
.footer__address-icon{
  width:22px;height:22px;
  flex-shrink:0;
  background:rgba(255,255,255,.07);
  border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  color:var(--c-primary);
  padding:4px;
  margin-top:1px;
}
.footer__address-icon svg{width:100%;height:100%}
.footer__address-icon--wa{color:#25D366}
.footer__address-icon--fb{color:#1877F2}
.footer__address-icon--ig{color:#E1306C}
.footer__bottom{border-top:1px solid rgba(255,255,255,.08);padding-block:var(--space-md);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem}
.footer__copy{font-size:var(--text-xs);color:rgba(255,255,255,.35)}
.footer__dev{font-size:var(--text-xs);color:rgba(255,255,255,.35)}
.footer__dev a{color:var(--c-primary);font-weight:600}
.footer__dev a:hover{color:var(--c-primary-light)}


/* ── FLOATING BUTTONS ───────────────────────────────────────── */
.floating-buttons{position:fixed;bottom:28px;right:24px;z-index:90;display:flex;flex-direction:column;gap:.7rem;align-items:flex-end}
.float-btn{position:relative;width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(0,0,0,.18);transition:all var(--dur-mid) var(--ease-out)}
.float-btn:hover{transform:scale(1.1)}
.float-btn--whatsapp{background:#25D366;color:#fff}
.float-btn--whatsapp:hover{background:#1ebe5d;box-shadow:0 6px 28px rgba(37,211,102,.45)}
/* Teléfono: fondo blanco, ícono verde */
.float-btn--phone{background:#fff;color:var(--c-primary);border:2px solid var(--c-border)}
.float-btn--phone:hover{background:var(--c-primary-light);color:var(--c-primary-dark);border-color:var(--c-primary);box-shadow:0 6px 28px rgba(45,179,74,.3)}
.float-btn__tooltip{position:absolute;right:calc(100% + 10px);background:var(--c-text);color:#fff;font-family:var(--font-display);font-size:var(--text-xs);font-weight:600;padding:.4em .85em;border-radius:var(--radius-full);white-space:nowrap;opacity:0;pointer-events:none;transform:translateX(6px);transition:all var(--dur-fast)}
.float-btn__tooltip::after{content:'';position:absolute;right:-5px;top:50%;transform:translateY(-50%);border:5px solid transparent;border-left-color:var(--c-text);border-right:none}
.float-btn:hover .float-btn__tooltip{opacity:1;transform:translateX(0)}

/* ── SCROLL TO TOP — botón izquierdo ────────────────────────── */
.scroll-top-btn{
  position:fixed;
  bottom:28px;
  left:24px;
  z-index:90;
  width:54px;
  height:54px;
  border-radius:50%;
  background:#fff;
  border:2px solid var(--c-border);
  color:var(--c-primary);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 4px 20px rgba(0,0,0,.12);
  transition:all var(--dur-mid) var(--ease-out);
  opacity:0;
  pointer-events:none;
  transform:translateY(12px);
}
.scroll-top-btn.visible{
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}
.scroll-top-btn:hover{
  background:var(--c-primary);
  color:#fff;
  border-color:var(--c-primary);
  box-shadow:0 6px 28px rgba(45,179,74,.35);
  transform:translateY(-2px);
}


/* ── REVEAL ANIMATION ───────────────────────────────────────── */
.reveal{opacity:0;transform:translateY(28px);transition:opacity var(--dur-slow) var(--ease-out),transform var(--dur-slow) var(--ease-out)}
.reveal.visible{opacity:1;transform:translateY(0)}

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media(max-width:1100px){
  .stats-bridge .stats-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:1024px){
  .about__top{grid-template-columns:1fr}
  .about__bottom{grid-template-columns:repeat(2,1fr)}
  .location__grid{grid-template-columns:1fr}
  .contact__grid{grid-template-columns:1fr}
  .contact__advisor{display:none}
  .contact__right{border-radius:var(--radius-xl);overflow:hidden}
  .contact__form-wrap{border-radius:var(--radius-xl)!important}
  .footer__grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  :root{--header-h:64px}
  .about__top{grid-template-columns:1fr}
  .about__bottom{grid-template-columns:repeat(2,1fr)}
  .nav{position:fixed;top:var(--header-h);left:0;right:0;background:rgba(255,255,255,.97);backdrop-filter:blur(20px);padding:var(--space-lg) var(--space-lg) var(--space-xl);transform:translateY(-110%);opacity:0;transition:transform var(--dur-mid) var(--ease-out),opacity var(--dur-mid);box-shadow:var(--shadow-md);border-bottom:1px solid var(--c-border-light);z-index:99}
  .nav.open{transform:translateY(0);opacity:1}
  .nav__list{flex-direction:column;gap:.25rem}
  .nav__link{color:var(--c-text-mid);display:block;padding:.75em 1em}
  .nav__link:hover{background:var(--c-primary-light);color:var(--c-primary)}
  .hamburger{display:flex}
  .header__actions .btn--sm{display:none}
  /* Bridge responsive */
  .stats-bridge{margin-top:-60px}
  .stats-bridge .stats-grid{grid-template-columns:repeat(2,1fr)}
  .about--bridge{padding-top:calc(60px + clamp(2.5rem,5vw,4rem))}
  .testimonials__track{grid-template-columns:1fr;padding-inline:clamp(1.25rem,5vw,2.5rem)}
  .form-row{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr}
  .footer__bottom{flex-direction:column;text-align:center}
  .services__banner{height:200px}
}
@media(max-width:480px){
  .hero__actions{flex-direction:column}
  .hero__actions .btn{width:100%;justify-content:center}
  .float-btn{width:48px;height:48px}
  .scroll-top-btn{width:44px;height:44px;left:16px;bottom:20px}
  .floating-buttons{bottom:20px;right:16px}
  .stats-bridge{margin-top:-40px}
  .stats-bridge .stats-grid{grid-template-columns:1fr 1fr}
  .about--bridge{padding-top:calc(40px + clamp(2rem,4vw,3rem))}
}

/* ── POPUP BANNER ────────────────────────────────────────────── */
.popup-overlay{
  position:fixed;inset:0;z-index:200;
  background:rgba(13,27,42,.75);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;
  padding:1rem;
  animation:popupFadeIn .35s var(--ease-out);
}
.popup-overlay.hidden{display:none}
@keyframes popupFadeIn{from{opacity:0}to{opacity:1}}

.popup-card{
  position:relative;
  background:#fff;
  border-radius:20px;
  overflow:hidden;
  max-width:480px;
  width:100%;
  box-shadow:0 24px 80px rgba(0,0,0,.35);
  animation:popupSlideUp .4s var(--ease-out);
}
@keyframes popupSlideUp{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}

/* Botón X */
.popup-close{
  position:absolute;top:12px;right:12px;z-index:2;
  width:36px;height:36px;border-radius:50%;
  background:rgba(13,27,42,.65);
  border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  color:#fff;
  transition:background var(--dur-fast),transform var(--dur-fast);
  backdrop-filter:blur(4px);
}
.popup-close:hover{background:rgba(13,27,42,.9);transform:scale(1.1)}

/* Imagen */
.popup-link{display:block;line-height:0}
.popup-img{width:100%;height:auto;display:block;cursor:pointer}

/* Footer con CTA */
.popup-footer{
  padding:16px 20px;
  background:#fff;
  display:flex;justify-content:center;
  border-top:1px solid var(--c-border-light);
}
.popup-btn{font-size:var(--text-sm);padding:.7em 2em}

@media(max-width:480px){
  .popup-card{max-width:calc(100vw - 2rem);border-radius:16px}
  .popup-footer{padding:12px 16px}
}

/* ── ABOUT TABS ──────────────────────────────────────────────── */
.about-tabs{
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
  margin-bottom:clamp(1.5rem,3vw,2.5rem);
  border-bottom:2px solid var(--c-border-light);
  padding-bottom:0;
}
.about-tab{
  display:flex;
  align-items:center;
  gap:.5rem;
  font-family:var(--font-display);
  font-size:var(--text-sm);
  font-weight:600;
  color:var(--c-text-light);
  padding:.65em 1.25em;
  border:none;
  background:transparent;
  cursor:pointer;
  border-bottom:3px solid transparent;
  margin-bottom:-2px;
  border-radius:var(--radius-sm) var(--radius-sm) 0 0;
  transition:all var(--dur-fast);
}
.about-tab:hover{ color:var(--c-primary); background:var(--c-primary-light); }
.about-tab.active{ color:var(--c-primary); border-bottom-color:var(--c-primary); background:var(--c-primary-light); }

/* Panels */
.about-panel{animation:fadeIn .35s var(--ease-out)}
.about-panel[hidden]{display:none}

/* Panel texto (Misión / Visión) */
.about-text-panel{
  display:grid;
  grid-template-columns:80px 1fr;
  gap:var(--space-lg) var(--space-xl);
  align-items:start;
  max-width:800px;
  margin:0 auto;
  padding:var(--space-lg) 0;
}
.about-text-panel__icon{
  width:80px;height:80px;
  color:var(--c-primary);
  grid-row:1 / 4;
}
.about-text-panel .section-tag{margin-bottom:.25rem}
.about-text-panel .section-title{margin-bottom:var(--space-sm)}
.about-text-panel__body{
  font-size:var(--text-base);
  color:var(--c-text-mid);
  line-height:1.85;
  margin-bottom:var(--space-sm);
}

/* Panel estados financieros */
.estados-panel{padding:var(--space-lg) 0}
.estados-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--space-md);
  margin:var(--space-xl) 0 var(--space-md);
}
.estado-card{
  background:var(--c-surface);
  border:1px solid var(--c-border-light);
  border-radius:var(--radius-lg);
  padding:var(--space-lg);
  display:flex;
  align-items:center;
  gap:var(--space-md);
  box-shadow:var(--shadow-xs);
  transition:all var(--dur-mid) var(--ease-out);
}
.estado-card:hover{box-shadow:var(--shadow-md);border-color:var(--c-primary);transform:translateY(-2px)}
.estado-card__icon{
  width:48px;height:48px;
  color:var(--c-primary);
  flex-shrink:0;
}
.estado-card__info{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:.25rem;
}
.estado-card__year{
  font-family:var(--font-display);
  font-size:var(--text-base);
  font-weight:700;
  color:var(--c-text);
}
.estado-card__desc{
  font-size:var(--text-xs);
  color:var(--c-text-light);
}
.estado-card__actions{
  display:flex;
  flex-direction:column;
  gap:.5rem;
  flex-shrink:0;
}
.estado-btn{
  display:flex;
  align-items:center;
  gap:.4rem;
  font-family:var(--font-display);
  font-size:var(--text-xs);
  font-weight:600;
  padding:.45em 1em;
  border-radius:var(--radius-full);
  text-decoration:none;
  transition:all var(--dur-fast);
  white-space:nowrap;
}
.estado-btn--view{
  background:var(--c-primary-light);
  color:var(--c-primary);
  border:1px solid var(--c-border);
}
.estado-btn--view:hover{background:var(--c-primary);color:#fff}
.estado-btn--download{
  background:var(--c-surface-alt);
  color:var(--c-text-mid);
  border:1px solid var(--c-border-light);
}
.estado-btn--download:hover{background:var(--c-text);color:#fff}
.estados-note{
  display:flex;
  align-items:center;
  gap:.5rem;
  font-size:var(--text-xs);
  color:var(--c-text-light);
  font-style:italic;
}

/* Responsive tabs */
@media(max-width:640px){
  .about-tab{font-size:var(--text-xs);padding:.55em .9em;gap:.35rem}
  .about-tab svg{display:none}
  .about-text-panel{grid-template-columns:1fr}
  .about-text-panel__icon{display:none}
  .estados-grid{grid-template-columns:1fr}
  .estado-card{flex-direction:column;align-items:flex-start}
  .estado-card__actions{flex-direction:row}
}
