/* =========================================================
   Dra. Nexaí Reyes Sampieri — hoja propia
   Lenguaje: híbrido entre luminastudiomx.com (editorial, líneas finas,
   esquinas rectas, Playfair + Jost) y el sitio del Dr. Abraham Álvarez
   (barra superior, diferenciadores con borde, testimonio central,
   tarjetas de contacto con renglones). Paleta: verdes de su Instagram.

   Contraste medido:
     --verde-texto #1F6F66 sobre nieve #F4F8F7  5.7:1  -> texto pequeño
     --menta #A8D9D1 sobre profundo #1F4F4A     6.2:1  -> texto sobre oscuro
   ========================================================= */

:root{
  --profundo:#1F4F4A;
  --profundo-2:#163A36;
  --profundo-3:#10302C;
  --turquesa:#2E8C84;
  --verde-texto:#1F6F66;
  --menta:#A8D9D1;
  --piedra:#7FB3AA;
  --nieve:#F4F8F7;
  --nieve-2:#E6EFED;
  --blanco:#FFFFFF;
  --tinta:#1C3A38;
  --tinta-suave:#4E6B68;
  --claro:rgba(255,255,255,.82);
  --linea:rgba(28,58,56,.14);
  --linea-osc:rgba(255,255,255,.16);

  --serif:"Playfair Display", Georgia, "Times New Roman", serif;
  --sans:"Jost", "Helvetica Neue", Arial, sans-serif;
  --ease:cubic-bezier(.4,0,.2,1);

  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:48px; --s6:64px; --s7:96px; --s8:128px;

  /* grano (textura fina sobre fondos profundos, como en Lúmina) */
  --grano:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--blanco); color:var(--tinta-suave);
  font-family:var(--sans); font-weight:300; font-size:17.5px; line-height:1.75; letter-spacing:.01em;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--verde-texto); text-decoration:none; transition:color .2s var(--ease); }
a:hover{ color:var(--profundo); }
h1,h2,h3,h4{ font-family:var(--serif); font-weight:400; color:var(--tinta); margin:0 0 .5em; line-height:1.18; }
h2{ font-size:clamp(32px, 3.6vw, 46px); }
p{ margin:0 0 1.1em; }
strong{ font-weight:500; color:var(--tinta); }
ul,ol,dl,dd{ margin:0; padding:0; list-style:none; }
figure{ margin:0; }
button{ font-family:inherit; }
em{ font-style:italic; }
h1 em,h2 em,h3 em,p em{ font-family:var(--serif); }
h2 em{ color:var(--verde-texto); }
.section--deep h2 em,.hero em,.manifest em,.bigword em,.foot em{ color:var(--menta); }

a:focus-visible,button:focus-visible,[tabindex]:focus-visible{ outline:2px solid var(--turquesa); outline-offset:3px; }
.ico{ width:15px; height:15px; flex:none; }
svg{ fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }

.wrap{ width:100%; max-width:1200px; margin:0 auto; padding:0 40px; }
@media (max-width:767px){ .wrap{ padding:0 20px; } }

/* ---------- secciones ---------- */
.section{ padding:var(--s8) 0; position:relative; }
.section--nieve{ background:var(--nieve); }
.section--deep{ background:var(--profundo) var(--grano); color:var(--claro); }
.section--deep h2,.section--deep h3{ color:#fff; }
.section--deep p{ color:var(--claro); }
@media (max-width:767px){ .section{ padding:var(--s7) 0; } }

/* eyebrow editorial: pequeño, espaciado, con ornamento circular */
.eyebrow{
  display:inline-flex; align-items:center; gap:10px; margin-bottom:var(--s3);
  font-size:12px; font-weight:500; letter-spacing:.24em; text-transform:uppercase; color:var(--verde-texto);
}
.eyebrow::before{ content:""; width:7px; height:7px; border-radius:50%; border:1.5px solid currentColor; }
.eyebrow--light{ color:var(--menta); }

/* ---------- botones (rectos, mayúsculas espaciadas) ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:16px 30px; font-family:var(--sans); font-size:12.5px; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
  border:1px solid transparent; cursor:pointer; line-height:1.2;
  transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.btn svg{ width:14px; height:14px; }
.btn--solid{ background:var(--verde-texto); color:#fff; }
.btn--solid:hover{ background:var(--profundo); color:#fff; }
.btn--light{ background:var(--menta); color:var(--profundo-3); }
.btn--light:hover{ background:#fff; color:var(--profundo-3); }
.btn--ghost{ border-color:rgba(255,255,255,.4); color:#fff; }
.btn--ghost:hover{ border-color:#fff; background:rgba(255,255,255,.06); color:#fff; }
.btn--line{ border-color:var(--linea-osc); color:#fff; }
.btn--line:hover{ border-color:var(--menta); color:var(--menta); }
.btn--sm{ padding:12px 22px; font-size:11.5px; }

/* =========================================================
   BARRA SUPERIOR
   ========================================================= */
.topbar{ background:var(--profundo-3); color:rgba(255,255,255,.72); font-size:13px; letter-spacing:.03em; position:relative; z-index:1001; }
.topbar__row{ display:flex; justify-content:space-between; align-items:center; height:40px; }
.topbar__info,.topbar__right{ display:flex; align-items:center; gap:18px; }
.topbar a,.topbar span{ display:inline-flex; align-items:center; gap:8px; color:inherit; }
.topbar a:hover{ color:#fff; }
.topbar__sep{ width:1px; height:14px; background:rgba(255,255,255,.2); }
.topbar__lang{ letter-spacing:.2em; font-size:11.5px; }
@media (max-width:767px){ .topbar__info span:not(.topbar__sep),.topbar__sep,.topbar__lang{ display:none; } .topbar__info{ gap:0; } }

/* =========================================================
   HEADER
   ========================================================= */
.hdr{ position:absolute; top:40px; left:0; right:0; z-index:1000; padding:22px 0; transition:background .3s var(--ease), padding .3s var(--ease), box-shadow .3s var(--ease); }
.hdr.is-scrolled{ position:fixed; top:0; padding:12px 0; background:rgba(244,248,247,.96); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); box-shadow:0 1px 0 var(--linea); }
.hdr__inner{ display:flex; align-items:center; justify-content:space-between; gap:var(--s3); }

.brand{ display:flex; align-items:center; gap:12px; color:#fff; }
.brand__orn{ width:30px; height:30px; color:var(--menta); flex:none; }
.brand__txt{ display:flex; flex-direction:column; line-height:1.15; }
.brand__name{ font-family:var(--serif); font-size:19px; color:#fff; letter-spacing:.01em; transition:color .3s; }
.brand__spec{ font-size:10.5px; letter-spacing:.28em; text-transform:uppercase; color:var(--menta); margin-top:4px; transition:color .3s; }
.hdr.is-scrolled .brand__name{ color:var(--profundo); }
.hdr.is-scrolled .brand__spec,.hdr.is-scrolled .brand__orn{ color:var(--verde-texto); }

.hdr__nav{ display:flex; align-items:center; gap:var(--s5); }
.hdr__menu{ display:flex; gap:30px; }
.hdr__menu a{ position:relative; font-size:11.5px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.85); padding:6px 0; }
.hdr__menu a::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--menta); transform:scaleX(0); transition:transform .3s var(--ease); }
.hdr__menu a:hover,.hdr__menu a.is-active{ color:#fff; }
.hdr__menu a:hover::after,.hdr__menu a.is-active::after{ transform:none; }
.hdr__cta{ background:var(--menta); color:var(--profundo-3); }
.hdr__cta:hover{ background:#fff; color:var(--profundo-3); }
@media (min-width:1101px){
  .hdr.is-scrolled .hdr__menu a{ color:var(--tinta-suave); }
  .hdr.is-scrolled .hdr__menu a:hover,.hdr.is-scrolled .hdr__menu a.is-active{ color:var(--profundo); }
  .hdr.is-scrolled .hdr__menu a::after{ background:var(--verde-texto); }
  .hdr.is-scrolled .hdr__cta{ background:var(--verde-texto); color:#fff; }
  .hdr.is-scrolled .hdr__cta:hover{ background:var(--profundo); }
}

.hdr__toggle{ display:none; width:44px; height:44px; border:0; background:transparent; position:relative; cursor:pointer; z-index:1002; }
.hdr__toggle span{ position:absolute; left:10px; right:10px; height:1.5px; background:#fff; transition:transform .25s var(--ease), opacity .25s, background .25s; }
.hdr__toggle span:nth-child(1){ top:16px; } .hdr__toggle span:nth-child(2){ top:22px; } .hdr__toggle span:nth-child(3){ top:28px; }
.hdr__toggle.is-active span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.hdr__toggle.is-active span:nth-child(2){ opacity:0; }
.hdr__toggle.is-active span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }
.hdr.is-scrolled .hdr__toggle span{ background:var(--profundo); }

@media (max-width:1100px){
  .hdr__toggle{ display:block; }
  .hdr__nav{
    position:fixed; top:0; right:0; height:100vh; height:100dvh; width:min(340px,86vw);
    background:var(--profundo-3) var(--grano); flex-direction:column; align-items:flex-start; gap:var(--s5);
    padding:110px 36px 36px; z-index:1001; transform:translateX(100%); visibility:hidden;
    transition:transform .35s var(--ease), visibility 0s linear .35s;
  }
  .hdr__nav.is-open{ transform:none; visibility:visible; transition:transform .35s var(--ease), visibility 0s; }
  .hdr__menu{ flex-direction:column; gap:24px; }
  .hdr__menu a,.hdr.is-scrolled .hdr__menu a{ font-size:13px; color:#fff; }
  .hdr__cta,.hdr.is-scrolled .hdr__cta{ width:100%; background:var(--menta); color:var(--profundo-3); }
  .hdr__toggle.is-active span{ background:#fff !important; }
}
@media (max-width:420px){ .brand__orn{ display:none; } .brand__name{ font-size:17px; } .brand__spec{ letter-spacing:.2em; } }

.hdr__scrim{ position:fixed; inset:0; background:rgba(8,22,20,.55); z-index:999; opacity:0; pointer-events:none; transition:opacity .3s var(--ease); }
.hdr__scrim.is-visible{ opacity:1; pointer-events:auto; }

/* =========================================================
   HERO — retrato a toda altura a la derecha, texto editorial a la izquierda.
   La columna de texto respeta el ancho del wrap (1200px) con un padding
   izquierdo calculado; la foto sangra hasta el borde derecho y hasta abajo.
   ========================================================= */
.hero{
  position:relative; overflow:hidden; color:#fff;
  min-height:100vh; min-height:100svh; display:flex;
  background:
    radial-gradient(760px 620px at 22% 42%, rgba(46,140,132,.40), transparent 72%),
    var(--grano),
    var(--profundo-2);
}
/* ondas: nacen detrás de ella y se abren hacia el texto */
.hero__waves{ position:absolute; left:64%; top:44%; width:min(1180px,135vw); transform:translate(-50%,-50%); color:var(--menta); opacity:.15; pointer-events:none; stroke-width:1; }
.hero__waves circle{ transform-origin:400px 400px; animation:respira 10s var(--ease) infinite; }
.hero__waves circle:nth-child(2){ animation-delay:.8s; } .hero__waves circle:nth-child(3){ animation-delay:1.6s; } .hero__waves circle:nth-child(4){ animation-delay:2.4s; }
@keyframes respira{ 0%,100%{ transform:scale(1); opacity:1; } 50%{ transform:scale(1.04); opacity:.55; } }

.hero__grid{
  position:relative; z-index:1; width:100%;
  display:grid; grid-template-columns:minmax(0,1fr) clamp(360px, 42vw, 660px); align-items:stretch;
}
.hero__copy{
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
  padding:170px var(--s6) 100px max(40px, calc((100vw - 1200px) / 2));
}
.hero__copy > *{ max-width:30em; }
.hero__title{ font-size:clamp(42px, 4.9vw, 74px); line-height:1.02; color:#fff; margin-bottom:var(--s3); letter-spacing:-.015em; }
.hero__title em{ font-weight:400; }
.hero__kicker{ display:flex; align-items:center; gap:13px; flex-wrap:wrap; margin-bottom:var(--s4); padding-top:var(--s3);
  border-top:1px solid rgba(168,217,209,.3); align-self:stretch; max-width:520px;
  font-size:11px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:var(--menta); }
.hero__kicker span + span::before{ content:"·"; margin-right:14px; }
.hero__sub{ font-family:var(--serif); font-size:clamp(21px, 1.9vw, 27px); line-height:1.38; color:#fff; max-width:17em; margin-bottom:var(--s3); }
.hero__lead{ max-width:34em; color:var(--claro); margin-bottom:var(--s5); }
.hero__actions{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:var(--s4); max-width:none; }
.hero__cred{ font-size:11.5px; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.5); margin:0; }

/* la foto arranca bajo el encabezado y sangra a la derecha y abajo */
.hero__photo{ position:relative; margin-top:148px; overflow:hidden; background:var(--nieve); }
.hero__photo img{ width:100%; height:100%; object-fit:cover; object-position:50% 6%; }
/* velo mínimo para que el blanco de estudio entre en la paleta */
.hero__photo::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(205deg, rgba(168,217,209,.26), rgba(168,217,209,0) 46%); }

/* portátiles de poca altura: todo el hero (incluidas las cédulas) debe caber sin bajar */
@media (min-width:900px) and (max-height:820px){
  .hero__copy{ padding-top:150px; padding-bottom:64px; }
  .hero__title{ font-size:clamp(38px, 4.2vw, 60px); }
  .hero__sub{ font-size:clamp(20px, 1.7vw, 24px); margin-bottom:var(--s2); }
  .hero__lead{ margin-bottom:var(--s4); }
  .hero__actions{ margin-bottom:var(--s3); }
  .hero__photo{ margin-top:134px; }
}

@media (max-width:1100px){
  .hero__grid{ grid-template-columns:minmax(0,1fr) 40vw; }
  /* el punto separador queda suelto si la línea se parte: se separa solo con espacio */
  .hero__kicker{ gap:6px 16px; max-width:none; }
  .hero__kicker span + span::before{ display:none; }
  .hero__copy{ padding:150px var(--s4) 90px max(28px, calc((100vw - 1200px) / 2)); }
  .hero__photo{ margin-top:132px; }
}
@media (max-width:899px){
  .hero{ min-height:0; }
  .hero__grid{ grid-template-columns:1fr; }
  .hero__copy{ padding:118px 20px 60px; }
  /* el botón flotante de WhatsApp se encima del renglón de cédulas */
  .hero__cred{ padding-right:76px; }
  .hero__photo{ margin-top:0; height:min(62vh, 500px); }
  .hero__photo img{ object-position:50% 10%; }
}
@media (max-width:767px){
  .hero__kicker{ gap:6px 12px; letter-spacing:.2em; font-size:11px; max-width:none; }
  .hero__kicker span + span::before{ margin-right:12px; }
  .hero__actions .btn{ width:100%; }
  .hero__actions{ width:100%; max-width:340px; }
}

/* =========================================================
   DIFERENCIADORES
   ========================================================= */
.diff{ background:#fff; padding:var(--s6) 0; border-bottom:1px solid var(--linea); }
.diff__row{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s5); }
.diff__item{ border-left:2px solid var(--turquesa); padding:4px 0 4px 26px; }
.diff__item h3{ font-size:22px; margin-bottom:10px; }
.diff__item p{ font-size:15.5px; margin:0; }
@media (max-width:991px){ .diff__row{ grid-template-columns:1fr; gap:var(--s4); } }

/* =========================================================
   SOBRE MÍ
   ========================================================= */
.about__grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:var(--s7); align-items:center; }
.about__photo{ position:relative; }
.about__photo::before{ content:""; position:absolute; inset:24px -24px -24px 24px; border:1px solid var(--piedra); z-index:0; }
.about__photo img{ position:relative; z-index:1; width:100%; aspect-ratio:4/5; object-fit:cover; }
.about__text .lead{ font-size:19px; color:var(--tinta); }
.signature{ display:flex; align-items:center; gap:14px; margin:var(--s4) 0 0; font-size:11.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--verde-texto); font-weight:500; }
.signature::before{ content:""; width:40px; height:1px; background:currentColor; }
@media (max-width:991px){
  .about__grid{ grid-template-columns:1fr; gap:var(--s6); }
  .about__photo{ max-width:400px; margin-right:24px; }
}

/* =========================================================
   PRINCIPIOS (lista numerada con líneas finas)
   ========================================================= */
.principles__grid{ display:grid; grid-template-columns:.8fr 1.2fr; gap:var(--s7); align-items:start; }
.principles__list li{ display:grid; grid-template-columns:60px 180px 1fr; gap:var(--s3); align-items:baseline; padding:30px 0; border-top:1px solid var(--linea-osc); }
.principles__list li:last-child{ border-bottom:1px solid var(--linea-osc); }
.principles__num{ font-size:12px; letter-spacing:.2em; color:var(--menta); }
.principles__list h3{ font-size:28px; margin:0; }
.principles__list p{ margin:0; font-size:15.5px; }
@media (max-width:991px){
  .principles__grid{ grid-template-columns:1fr; gap:var(--s5); }
  .principles__list li{ grid-template-columns:44px 1fr; }
  .principles__list p{ grid-column:2; }
}

/* =========================================================
   FRASE MANIFIESTO
   ========================================================= */
.manifest{ background:var(--profundo-3) var(--grano); padding:var(--s7) 0; text-align:right; }
.manifest__text{ font-family:var(--serif); font-size:clamp(34px, 4.8vw, 64px); line-height:1.12; color:#fff; margin:0 0 0 auto; max-width:780px; }
@media (max-width:767px){ .manifest{ text-align:left; } }

/* =========================================================
   CUÁNDO ACUDIR (palabra gigante de fondo)
   ========================================================= */
.when{ overflow:hidden; }
.when__word{
  position:absolute; right:-2%; top:40px; font-family:var(--serif); font-style:italic; font-size:clamp(140px, 22vw, 320px); line-height:1;
  color:transparent; -webkit-text-stroke:1px rgba(31,111,102,.14); pointer-events:none; user-select:none; white-space:nowrap;
}
.when .wrap{ position:relative; }
.when__head,.proc__head{ display:grid; grid-template-columns:1.1fr .9fr; gap:var(--s7); align-items:end; margin-bottom:var(--s6); }
.when__head > p,.proc__head > p,.proc__head > div:last-child p{ margin-bottom:0; }
.when__label{ font-size:12px; font-weight:500; letter-spacing:.24em; text-transform:uppercase; color:var(--tinta); padding-bottom:var(--s2); border-bottom:1px solid var(--linea); margin-bottom:var(--s4); }
.when__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s3); }
.when__card{ background:#fff; padding:34px 28px 30px; transition:transform .3s var(--ease), box-shadow .3s var(--ease); }
.when__card:nth-child(even){ margin-top:var(--s5); }
.when__card:hover{ transform:translateY(-4px); box-shadow:0 22px 44px rgba(28,58,56,.08); }
.when__num{ display:block; font-family:var(--serif); font-size:44px; line-height:1; color:var(--turquesa); margin-bottom:var(--s4); }
.when__card h3{ font-size:21px; margin-bottom:10px; }
.when__card p{ font-size:15px; margin:0; }
@media (max-width:991px){
  .when__head,.proc__head{ grid-template-columns:1fr; gap:var(--s3); }
  .when__grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:599px){ .when__grid{ grid-template-columns:1fr; } .when__card:nth-child(even){ margin-top:0; } }

/* =========================================================
   PADECIMIENTOS (lista + tarjeta)
   ========================================================= */
.cond__grid{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s7); align-items:center; }
.cond__list{ margin-top:var(--s4); border-top:1px solid var(--linea); }
.cond__list li{ border-bottom:1px solid var(--linea); }
.cond__list button{
  width:100%; display:flex; justify-content:space-between; align-items:center; gap:16px; text-align:left;
  background:none; border:0; padding:15px 0; cursor:pointer;
  font-family:var(--serif); font-size:19px; color:var(--tinta-suave); transition:color .25s, padding .25s var(--ease);
}
.cond__list button::after{ content:"↗"; font-family:var(--sans); font-size:14px; opacity:.5; transition:opacity .25s, transform .25s var(--ease); }
.cond__list button:hover{ color:var(--tinta); }
.cond__list button.is-active{ color:var(--profundo); padding-left:18px; }
.cond__list button.is-active::before{ content:""; position:absolute; margin-left:-18px; width:10px; height:1px; background:var(--turquesa); }
.cond__list button.is-active::after{ opacity:1; color:var(--turquesa); transform:rotate(45deg); }

.cond__card{
  position:relative; background:var(--profundo) var(--grano); color:var(--claro); padding:56px 48px 48px; min-height:460px;
  display:flex; flex-direction:column; overflow:hidden;
}
.cond__orn{ position:absolute; right:-70px; bottom:-70px; width:280px; height:280px; color:var(--menta); opacity:.18; stroke-width:.6; }
.cond__n{ font-size:12px; letter-spacing:.24em; color:var(--menta); margin-bottom:var(--s3); }
.cond__card h3{ font-size:clamp(28px, 3vw, 38px); color:#fff; margin-bottom:var(--s3); }
.cond__card p{ color:var(--claro); }
.cond__k{ margin-top:auto; font-family:var(--serif); font-style:italic; font-size:22px; color:var(--menta) !important; }
.cond__cta{ display:inline-flex; align-items:center; gap:8px; color:#fff; font-size:12px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; position:relative; z-index:1; }
.cond__cta svg{ width:14px; height:14px; }
.cond__cta:hover{ color:var(--menta); }
.cond__card.is-changing h3,.cond__card.is-changing p:not(.cond__k),.cond__card.is-changing .cond__k{ opacity:0; transform:translateY(8px); }
.cond__card h3,.cond__card p{ transition:opacity .3s var(--ease), transform .3s var(--ease); }
@media (max-width:991px){ .cond__grid{ grid-template-columns:1fr; gap:var(--s5); } .cond__card{ min-height:0; padding:40px 28px; } .cond__k{ margin-top:var(--s3); } }

/* =========================================================
   SERVICIOS — tarjetas con ícono redondo (como la primera propuesta)
   ========================================================= */
.svc__head{ max-width:680px; margin:0 auto var(--s6); text-align:center; }
.svc__head .eyebrow{ justify-content:center; }
.svc__head p:last-child{ margin:0; }
.svc__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s3); }
.svc{ padding:36px 32px; border-radius:14px; background:#fff; border:1px solid transparent;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s; }
.svc:hover{ transform:translateY(-4px); box-shadow:0 18px 36px rgba(28,58,56,.09); border-color:var(--linea); }
.svc__icon{ width:56px; height:56px; border-radius:50%; background:var(--nieve); color:var(--verde-texto);
  display:flex; align-items:center; justify-content:center; margin-bottom:22px;
  box-shadow:0 0 0 6px rgba(46,140,132,.08); transition:background .3s, color .3s; }
.svc:hover .svc__icon{ background:var(--verde-texto); color:#fff; }
.svc__icon svg{ width:24px; height:24px; }
.svc h3{ font-size:23px; margin-bottom:10px; }
.svc p{ font-size:15.5px; margin:0; }
.svc__cta{ text-align:center; margin-top:var(--s5); }
@media (max-width:991px){ .svc__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:599px){ .svc__grid{ grid-template-columns:1fr; } .svc{ padding:28px 24px; } }

/* =========================================================
   PALABRA GRANDE
   ========================================================= */
.bigword{ background:var(--profundo-3) var(--grano); padding:var(--s7) 0 var(--s6); text-align:center; overflow:hidden; }
.bigword__pre{ font-family:var(--serif); font-size:clamp(18px, 1.8vw, 22px); color:#fff; margin:0 0 var(--s2); }
.bigword__word{ font-family:var(--serif); font-style:italic; font-size:clamp(64px, 12vw, 176px); line-height:1; margin:0; color:var(--menta); letter-spacing:-.02em; }

/* =========================================================
   PROCESO
   ========================================================= */
.proc__steps{ position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s4); padding-top:var(--s5); }
.proc__steps::before{ content:""; position:absolute; top:5px; left:0; right:0; height:1px; background:var(--linea); }
.proc__steps li{ position:relative; }
.proc__steps li::before{ content:""; position:absolute; top:-48px; left:0; width:11px; height:11px; border-radius:50%; background:var(--nieve); border:1.5px solid var(--turquesa); }
.proc__phase{ display:block; font-size:11.5px; font-weight:500; letter-spacing:.24em; text-transform:uppercase; color:var(--verde-texto); margin-bottom:var(--s3); }
.proc__steps svg{ width:24px; height:24px; color:var(--turquesa); margin-bottom:var(--s2); }
.proc__steps h3{ font-size:24px; margin-bottom:8px; }
.proc__steps p{ font-size:15px; margin:0; }
@media (max-width:991px){ .proc__steps{ grid-template-columns:1fr 1fr; row-gap:var(--s5); } .proc__steps::before{ display:none; } .proc__steps li::before{ display:none; } }
@media (max-width:520px){ .proc__steps{ grid-template-columns:1fr; } }

/* =========================================================
   TRAYECTORIA
   ========================================================= */
.edu{ display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--linea); }
.edu li{ padding:var(--s5) var(--s4) var(--s4) 0; border-right:1px solid var(--linea); }
.edu li + li{ padding-left:var(--s4); }
.edu li:last-child{ border-right:0; }
.edu__n{ display:block; font-family:var(--serif); font-size:56px; line-height:1; color:var(--turquesa); margin-bottom:var(--s3); }
.edu h3{ font-size:22px; margin-bottom:6px; }
.edu__tag{ display:block; font-size:11px; font-weight:500; letter-spacing:.24em; text-transform:uppercase; color:var(--verde-texto); margin-bottom:var(--s2); }
.edu p{ font-size:15px; margin:0; }
.edu__cert{ margin:var(--s5) 0 0; padding-top:var(--s3); border-top:1px solid var(--linea); font-size:13px; letter-spacing:.04em; color:var(--tinta-suave); text-align:center; }
.doctoralia-link{ display:inline-flex; align-items:center; gap:12px; margin-top:var(--s3); padding:8px 20px 8px 8px; border:1px solid var(--linea); background:#fff; transition:border-color .25s, box-shadow .25s; }
.doctoralia-link img{ width:40px; height:40px; }
.doctoralia-link span{ font-size:12px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--profundo); }
.doctoralia-link:hover{ border-color:var(--turquesa); box-shadow:0 10px 24px rgba(28,58,56,.08); }
@media (max-width:991px){
  .edu{ grid-template-columns:1fr 1fr; }
  .edu li,.edu li + li{ padding:var(--s4) var(--s3) var(--s4) 0; border-right:0; border-bottom:1px solid var(--linea); }
  .edu li:nth-child(even){ padding-left:var(--s3); border-left:1px solid var(--linea); }
}
@media (max-width:520px){ .edu{ grid-template-columns:1fr; } .edu li:nth-child(even){ padding-left:0; border-left:0; } }

/* =========================================================
   TESTIMONIOS
   ========================================================= */
.testi{ overflow:hidden; text-align:center; }
.testi__waves{ position:absolute; left:50%; top:50%; width:1100px; transform:translate(-50%,-50%); color:var(--menta); opacity:.12; pointer-events:none; }
.testi__inner{ position:relative; z-index:1; }
.testi__stage{ display:grid; grid-template-columns:48px 1fr 48px; align-items:center; gap:var(--s4); max-width:960px; margin:var(--s5) auto 0; }
.testi__track{ position:relative; transition:height .45s var(--ease); }
.testi__slide{ position:absolute; inset:0; opacity:0; transform:translateY(10px); transition:opacity .5s var(--ease), transform .5s var(--ease); pointer-events:none; }
.testi__slide.is-active{ position:relative; opacity:1; transform:none; pointer-events:auto; }
.testi blockquote{ margin:0 0 var(--s3); font-family:var(--serif); font-style:italic; font-size:clamp(21px, 2.4vw, 30px); line-height:1.5; color:#fff; }
.testi figcaption{ font-size:13px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:#fff; }
.testi figcaption span{ color:var(--menta); margin-left:4px; }
.testi__arrow{ width:48px; height:48px; border:1px solid var(--linea-osc); background:transparent; color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:border-color .25s, color .25s; }
.testi__arrow svg{ width:18px; height:18px; }
.testi__arrow:hover{ border-color:var(--menta); color:var(--menta); }
.testi__count{ margin-top:var(--s4); font-size:12px; letter-spacing:.24em; color:rgba(255,255,255,.55); }
.testi__count span:first-child{ color:#fff; }
.testi__link{ display:inline-flex; align-items:center; gap:8px; margin-top:var(--s4); font-size:12px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:var(--menta); }
.testi__link svg{ width:14px; height:14px; }
.testi__link:hover{ color:#fff; }
@media (max-width:767px){
  .testi__stage{ grid-template-columns:1fr; gap:var(--s3); }
  .testi__arrow{ display:none; }
}

/* =========================================================
   CONTACTO (tarjetas con renglones)
   ========================================================= */
.loc__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s3); margin-bottom:var(--s3); }
.loc{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--linea); padding:34px 30px 26px; }
.loc--deep{ background:var(--profundo) var(--grano); border-color:var(--profundo); }
.loc__kind{ font-size:11.5px; font-weight:500; letter-spacing:.24em; text-transform:uppercase; color:var(--verde-texto); margin-bottom:var(--s2); }
.loc h3{ font-size:22px; margin-bottom:10px; }
.loc__addr{ font-size:15px; margin-bottom:var(--s3); }
.loc__rows{ margin-top:auto; }
.loc__rows div{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:13px 0; border-top:1px solid var(--linea); }
.loc__rows dt{ font-size:11px; font-weight:500; letter-spacing:.22em; text-transform:uppercase; color:var(--verde-texto); }
.loc__rows dd{ font-size:15px; font-weight:500; color:var(--tinta); text-align:right; }
.loc__rows dd a{ color:var(--tinta); }
.loc__rows dd a:hover{ color:var(--verde-texto); }
.loc--deep .loc__kind,.loc--deep .loc__rows dt{ color:var(--menta); }
.loc--deep h3,.loc--deep .loc__rows dd,.loc--deep .loc__rows dd a{ color:#fff; }
.loc--deep .loc__addr{ color:var(--claro); }
.loc--deep .loc__rows div{ border-top-color:var(--linea-osc); }
.loc--deep .loc__rows dd a:hover{ color:var(--menta); }
.contact__map iframe{ display:block; width:100%; height:360px; border:0; filter:grayscale(.35) contrast(1.02); }
@media (max-width:991px){ .loc__grid{ grid-template-columns:1fr; } .contact__map iframe{ height:300px; } }

/* =========================================================
   FOOTER
   ========================================================= */
.foot{ background:var(--profundo-3) var(--grano); color:rgba(255,255,255,.66); padding:var(--s7) 0 var(--s4); font-size:15px; }
.foot__top{ display:flex; justify-content:space-between; align-items:center; gap:var(--s4); flex-wrap:wrap; padding-bottom:var(--s6); margin-bottom:var(--s6); border-bottom:1px solid var(--linea-osc); }
.foot__claim{ font-family:var(--serif); font-size:clamp(30px, 3.6vw, 48px); color:#fff; margin:0; line-height:1.15; }
.foot__grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:var(--s5); margin-bottom:var(--s6); }
.foot__name{ font-family:var(--serif); font-size:22px; color:#fff; margin-bottom:var(--s2); }
.foot p{ color:rgba(255,255,255,.62); max-width:360px; }
.foot__legal{ font-size:12.5px; color:rgba(255,255,255,.45) !important; }
.foot h4{ font-family:var(--sans); font-size:11.5px; font-weight:500; letter-spacing:.24em; text-transform:uppercase; color:var(--menta); margin-bottom:var(--s3); }
.foot__links li{ margin-bottom:12px; }
.foot__links a{ color:rgba(255,255,255,.72); }
.foot__links a:hover{ color:#fff; }
.foot__bottom{ padding-top:var(--s3); border-top:1px solid var(--linea-osc); font-size:12.5px; letter-spacing:.04em; color:rgba(255,255,255,.45); text-align:center; }
.foot__bottom a{ color:rgba(255,255,255,.72); }
@media (max-width:767px){ .foot__grid{ grid-template-columns:1fr; gap:var(--s4); } }

.wa-float{ position:fixed; right:22px; bottom:22px; z-index:900; width:56px; height:56px; border-radius:50%; background:var(--menta); color:var(--profundo-3);
  display:flex; align-items:center; justify-content:center; box-shadow:0 12px 30px rgba(8,22,20,.3); transition:transform .25s var(--ease), background .25s; }
.wa-float svg{ width:26px; height:26px; }
.wa-float:hover{ transform:scale(1.06); background:#fff; color:var(--profundo-3); }

/* =========================================================
   ANIMACIONES
   ========================================================= */
@keyframes sube{ from{ opacity:0; transform:translateY(24px); } to{ opacity:1; transform:none; } }
.hero__copy > *{ opacity:0; animation:sube 1s var(--ease) forwards; }
.hero__copy > :nth-child(1){ animation-delay:.05s; }
.hero__copy > :nth-child(2){ animation-delay:.2s; }
.hero__copy > :nth-child(3){ animation-delay:.34s; }
.hero__copy > :nth-child(4){ animation-delay:.46s; }
.hero__copy > :nth-child(5){ animation-delay:.58s; }
.hero__copy > :nth-child(6){ animation-delay:.7s; }
/* la foto entra sola, un poco antes que el texto */
.hero__photo{ opacity:0; animation:entraFoto 1.2s var(--ease) forwards; }
@keyframes entraFoto{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }

.reveal{ opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.is-visible{ opacity:1; transform:none; }
.when__card.reveal:nth-child(2),.diff__item.reveal:nth-child(2),.principles__list .reveal:nth-child(2),.proc__steps .reveal:nth-child(2),.edu .reveal:nth-child(2),.loc.reveal:nth-child(2){ transition-delay:.1s; }
.when__card.reveal:nth-child(3),.diff__item.reveal:nth-child(3),.principles__list .reveal:nth-child(3),.proc__steps .reveal:nth-child(3),.edu .reveal:nth-child(3),.loc.reveal:nth-child(3){ transition-delay:.2s; }
.when__card.reveal:nth-child(4),.proc__steps .reveal:nth-child(4),.edu .reveal:nth-child(4){ transition-delay:.3s; }
/* las tarjetas pares de "cuándo acudir" van desfasadas: el reveal no debe pisar ese margen */
.when__card.reveal:nth-child(even).is-visible{ transform:none; }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .hero__copy > *,.hero__photo,.reveal{ opacity:1 !important; transform:none !important; }
}

.skip-link{ position:absolute; left:-999px; top:0; background:#fff; color:var(--profundo); padding:12px 20px; z-index:2000; }
.skip-link:focus{ left:0; }

/* sin cortes de renglón en menú, marca y botones */
.hdr__menu a,.btn,.brand__name,.brand__spec{ white-space:nowrap; }
@media (min-width:1101px) and (max-width:1280px){
  .hdr__menu{ gap:20px; }
  .hdr__nav{ gap:var(--s4); }
  .hdr__menu a{ letter-spacing:.16em; }
}

/* ---- correcciones móvil ---- */
@media (max-width:767px){
  /* la regla genérica .topbar span ganaba en especificidad y dejaba visible el separador */
  .topbar .topbar__info > span,.topbar .topbar__lang{ display:none; }
  /* el punto separador quedaba suelto al partir el renglón: en móvil se separa solo con espacio */
  .hero__kicker span + span::before{ display:none; }
  .hero__kicker{ gap:4px 18px; }
}


/* =========================================================
   FOTOS
   ========================================================= */
/* el retrato del hero vive en el bloque HERO (arriba) */

/* frase manifiesto con foto */
.manifest{ text-align:left; padding:var(--s7) 0; }
.manifest__grid{ display:grid; grid-template-columns:.7fr 1.3fr; gap:var(--s7); align-items:center; }
.manifest__photo img{ width:100%; aspect-ratio:4/5; object-fit:cover; }
.manifest__photo{ position:relative; isolation:isolate; }
.manifest__photo::after{ content:""; position:absolute; inset:18px 18px -18px -18px; border:1px solid rgba(168,217,209,.35); z-index:-1; }
.manifest__photo img{ position:relative; }
.manifest__text{ margin:0 0 var(--s3); max-width:none; }
.manifest__note{ font-size:13px; letter-spacing:.24em; text-transform:uppercase; color:var(--menta); margin:0; }
@media (max-width:767px){
  .manifest__grid{ grid-template-columns:1fr; gap:var(--s5); }
  .manifest__photo{ max-width:300px; margin-left:18px; }
}

/* contacto: foto + mapa */
.contact__media{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s3); }
.contact__photo img{ width:100%; height:360px; object-fit:cover; object-position:60% 40%; }
@media (max-width:991px){ .contact__media{ grid-template-columns:1fr; } .contact__photo img{ height:auto; aspect-ratio:3/2; } }
