/* ==========================================================================
   LAMED MEDICINE INSTITUTE — V2
   Design system built directly on the real LAMED brand manual:
   - Isotype: circles ("células") forming the Hebrew letter Lamed ל
   - Palette: #4194b2 -> #96bec8 gradient, plus white and black
   - Type: Helvetica Bold (titles/subtitles) + Helvetica Regular (body)
   All tints/shades below are extrapolated FROM those exact specified
   colors (never a new hue) so the site stays inside the real brand.
   ========================================================================== */

:root{
  /* ---- Color: brand teal-blue gradient, extrapolated into a full scale ---- */
  --ink:#132A32;
  --teal-900:#14303B;
  --teal-800:#1D4A58;
  --teal-700:#2C6B81;
  --teal-600:#4194B2;   /* exact brand primary */
  --teal-500:#5CA6C2;
  --teal-400:#7EBAD1;
  --teal-300:#96BEC8;   /* exact brand secondary */
  --teal-200:#BFDAE2;

  --surface-100:#FBFDFD;
  --surface-200:#EEF6F8;
  --line-300:#D7E6EA;
  --line-400:#B9D2D9;

  --charcoal:#2D2D2D;   /* exact brand wordmark color */
  --black:#000000;      /* official "blanco y negro" brand variation */
  --white:#FFFFFF;

  --text-body:#2D2D2D;
  --text-muted:#5C6E75;
  --text-on-dark:#EEF6F8;
  --text-on-dark-muted:#9FBAC2;

  /* ---- Type: Helvetica per brand manual (Bold = titles, Regular = text).
     No web-font import needed — system Helvetica/Arial only. ---- */
  --font-display:"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;
  --font-body:"Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;

  --fs-display:clamp(2.75rem, 1.9rem + 3.6vw, 5.25rem);
  --fs-h1:clamp(2.35rem, 1.75rem + 2.6vw, 4rem);
  --fs-h2:clamp(1.9rem, 1.55rem + 1.5vw, 2.85rem);
  --fs-h3:clamp(1.4rem, 1.22rem + 0.7vw, 1.75rem);
  --fs-lede:clamp(1.05rem, 0.96rem + 0.4vw, 1.25rem);
  --fs-body:1rem;
  --fs-small:0.9375rem;
  --fs-micro:0.8125rem;

  /* ---- Space (4px base) ---- */
  --sp-1:.25rem; --sp-2:.5rem; --sp-3:.75rem; --sp-4:1rem;
  --sp-5:1.5rem; --sp-6:2rem; --sp-7:2.5rem; --sp-8:3rem;
  --sp-9:4rem; --sp-10:5rem; --sp-11:6.5rem; --sp-12:8.5rem;

  /* ---- Shape ---- */
  --radius-sm:8px;
  --radius-md:14px;
  --radius-organic:120px 24px 120px 24px;
  --radius-organic-sm:64px 16px 64px 16px;
  --radius-pill:999px;

  /* ---- Elevation (warm-toned, never pure black) ---- */
  --shadow-sm:0 2px 10px rgba(19,42,50,.07);
  --shadow-md:0 14px 40px rgba(19,42,50,.12);
  --shadow-lg:0 30px 80px rgba(19,42,50,.20);

  /* ---- Motion ---- */
  --ease:cubic-bezier(.22,1,.36,1);
  --t-fast:150ms;
  --t-base:280ms;
  --t-slow:520ms;

  /* ---- Layout ---- */
  --container-max:1280px;
  --container-pad:clamp(1.25rem, 4vw, 3rem);
  --header-h:84px;
}

/* ==========================================================================
   RESET
   ========================================================================== */
*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *, *::before, *::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
  .hero-bg{ background-attachment:scroll; }
}
body{
  margin:0;
  font-family:var(--font-body);
  font-size:var(--fs-body);
  color:var(--text-body);
  background:var(--surface-100);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ max-width:100%; display:block; }
svg{ display:block; }
a{ color:inherit; }
button{ font-family:inherit; }
h1,h2,h3,h4,p,figure{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
input,textarea,select,button{ font-family:inherit; font-size:inherit; color:inherit; }

/* ==========================================================================
   LAYOUT PRIMITIVES
   ========================================================================== */
.container{
  width:100%;
  max-width:var(--container-max);
  margin-inline:auto;
  padding-inline:var(--container-pad);
}
.section{ padding-block:var(--sp-11); position:relative; }
.section--tight{ padding-block:var(--sp-9); }
.section--dark{ background:var(--teal-900); color:var(--text-on-dark); }
.section--stone{ background:var(--surface-200); }

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.6em;
  font-family:var(--font-body);
  font-weight:700;
  font-size:var(--fs-micro);
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--teal-600);
  margin:0 0 var(--sp-4);
}
.eyebrow::before{
  content:"";
  width:22px; height:1px;
  background:var(--teal-500);
  display:inline-block;
}
.section--dark .eyebrow{ color:var(--teal-300); }
.section--dark .eyebrow::before{ background:var(--teal-300); }

.section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:var(--sp-8);
  margin-bottom:var(--sp-9);
}
.section-head__copy{ max-width:640px; }
.section-head__aside{ max-width:340px; color:var(--text-muted); font-size:var(--fs-lede); padding-bottom:.3em; }
.section--dark .section-head__aside{ color:var(--text-on-dark-muted); }

h2.display,
.h-display{
  font-family:var(--font-display);
  font-weight:700;
  font-size:var(--fs-h2);
  line-height:1.1;
  letter-spacing:0;
  color:var(--teal-800);
}
.section--dark h2.display{ color:var(--surface-100); }

.lede{ font-size:var(--fs-lede); color:var(--text-muted); line-height:1.55; }
.section--dark .lede{ color:var(--text-on-dark-muted); }

.visually-hidden{
  position:absolute !important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* Skip link */
.skip-link{
  position:fixed; left:var(--sp-4); top:-60px;
  background:var(--ink); color:var(--surface-100);
  padding:.9em 1.3em; border-radius:var(--radius-sm);
  z-index:1000; font-weight:700; font-size:var(--fs-small);
  transition:top var(--t-base) var(--ease);
  text-decoration:none;
}
.skip-link:focus{ top:var(--sp-4); }

/* Global focus visibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible{
  outline:2.5px solid var(--teal-500);
  outline-offset:3px;
  border-radius:4px;
}

/* ==========================================================================
   BUTTONS
   ========================================================================== */
.btn{
  --btn-fg:var(--surface-100);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6em;
  padding:1.05em 1.7em;
  border-radius:var(--radius-sm);
  border:1.5px solid transparent;
  font-family:var(--font-body);
  font-weight:700;
  font-size:var(--fs-small);
  letter-spacing:.01em;
  text-decoration:none;
  cursor:pointer;
  transition:transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease), background var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }
.btn-primary{ background:var(--teal-700); color:var(--surface-100); box-shadow:var(--shadow-sm); }
.btn-primary:hover{ background:var(--teal-600); box-shadow:var(--shadow-md); }
.btn-whatsapp{ background:#1E5946; color:var(--surface-100); }
.btn-whatsapp svg{ width:1.1em; height:1.1em; }
.btn-whatsapp:hover{ background:var(--teal-600); box-shadow:var(--shadow-md); }
.btn-ghost-dark{ border-color:rgba(238,246,248,.35); color:var(--text-on-dark); background:transparent; }
.btn-ghost-dark:hover{ border-color:var(--teal-300); background:rgba(238,246,248,.06); }
.btn-outline{ border-color:rgba(44,107,129,.28); color:var(--teal-800); background:transparent; }
.btn-outline:hover{ border-color:var(--teal-700); background:rgba(44,107,129,.05); }
.btn-light{ background:var(--surface-100); color:var(--teal-800); }
.btn-light:hover{ background:var(--white); box-shadow:var(--shadow-md); }
.btn-sm{ padding:.7em 1.2em; font-size:var(--fs-micro); }
.btn-full{ width:100%; }
.btn-text{
  background:none; border:0; padding:0; cursor:pointer;
  font-weight:700; font-size:var(--fs-small); color:var(--teal-700);
  display:inline-flex; align-items:center; gap:.4em;
  border-bottom:1.5px solid var(--teal-500);
  padding-bottom:.15em;
  transition:gap var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.btn-text:hover{ gap:.65em; color:var(--teal-600); }
.section--dark .btn-text{ color:var(--surface-100); border-color:var(--teal-300); }

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header{
  position:sticky; top:0; z-index:60;
  height:var(--header-h);
  display:flex; align-items:center;
  background:rgba(251,253,253,.86);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(19,42,50,.08);
  transition:box-shadow var(--t-base) var(--ease);
}
.site-header.is-scrolled{ box-shadow:0 8px 30px rgba(19,42,50,.08); }
.nav-row{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-6); width:100%; }

.brand{ display:inline-flex; align-items:center; gap:.6em; text-decoration:none; }
.brand-mark{ height:32px; width:auto; flex:none; display:block; }
.brand-word{ display:flex; flex-direction:column; line-height:1; }
.brand-word span{ font-size:.7rem; letter-spacing:.13em; text-transform:uppercase; color:var(--text-muted); white-space:nowrap; }

.primary-nav{ display:flex; align-items:center; gap:var(--sp-6); }
.primary-nav a{
  font-size:var(--fs-small); font-weight:600; text-decoration:none; color:var(--text-body);
  position:relative; padding-block:.3em;
}
.primary-nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1.5px;
  background:var(--teal-500); transition:right var(--t-base) var(--ease);
}
.primary-nav a:hover::after{ right:0; }

.nav-actions{ display:flex; align-items:center; gap:var(--sp-3); }
.lang-toggle{
  display:inline-flex; border:1.5px solid rgba(44,107,129,.22); border-radius:var(--radius-pill);
  padding:3px; background:transparent; cursor:pointer; gap:2px;
}
.lang-toggle span{
  padding:.4em .85em; border-radius:var(--radius-pill); font-size:var(--fs-micro); font-weight:800;
  letter-spacing:.04em; color:var(--text-muted); transition:background var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.lang-toggle[data-lang="es"] span[data-val="es"],
.lang-toggle[data-lang="en"] span[data-val="en"]{ background:var(--teal-700); color:var(--surface-100); }

.nav-burger{
  display:none; width:44px; height:44px; border-radius:var(--radius-sm); border:1.5px solid rgba(44,107,129,.2);
  background:transparent; cursor:pointer; align-items:center; justify-content:center;
}
.nav-burger span, .nav-burger span::before, .nav-burger span::after{
  content:""; display:block; width:18px; height:1.6px; background:var(--teal-800); position:relative; transition:all var(--t-fast) var(--ease);
}
.nav-burger span::before{ position:absolute; top:-6px; }
.nav-burger span::after{ position:absolute; top:6px; }
.nav-burger[aria-expanded="true"] span{ background:transparent; }
.nav-burger[aria-expanded="true"] span::before{ top:0; transform:rotate(45deg); }
.nav-burger[aria-expanded="true"] span::after{ top:0; transform:rotate(-45deg); }

.mobile-nav{
  position:fixed; inset:var(--header-h) 0 0 0; z-index:55;
  background:var(--surface-100);
  transform:translateY(-8px); opacity:0; pointer-events:none;
  transition:opacity var(--t-base) var(--ease), transform var(--t-base) var(--ease);
  padding:var(--sp-7) var(--container-pad);
  overflow-y:auto;
}
.mobile-nav.is-open{ transform:none; opacity:1; pointer-events:auto; }
.mobile-nav a{
  display:flex; justify-content:space-between; align-items:center;
  font-family:var(--font-display); font-size:1.6rem; font-weight:700;
  text-decoration:none; color:var(--teal-800);
  padding:.7em 0; border-bottom:1px solid var(--line-300);
}
.mobile-nav .btn{ margin-top:var(--sp-6); }

/* ==========================================================================
   MOBILE BOTTOM ACTION BAR
   ========================================================================== */
.mobile-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:65;
  display:none;
  grid-template-columns:1fr 1fr 1.3fr;
  background:var(--teal-900);
  box-shadow:0 -10px 30px rgba(19,42,50,.25);
  padding:.55rem .6rem calc(.55rem + env(safe-area-inset-bottom));
  gap:.5rem;
}
.mobile-bar a{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.25rem;
  text-decoration:none; color:var(--text-on-dark-muted);
  font-size:.72rem; font-weight:700; letter-spacing:.02em;
  padding:.4rem 0; border-radius:var(--radius-sm);
}
.mobile-bar a svg{ width:20px; height:20px; }
.mobile-bar a.is-primary{ background:var(--teal-500); color:var(--ink); }

/* ==========================================================================
   ICON LINE STYLE
   Simple stroke icons (checkmarks, small pictograms) used throughout.
   The brand's real signature element is the isotype itself (extracted
   vector logo, used in the header/footer) — these are plain utility icons,
   not a separate decorative motif.
   ========================================================================== */
.continuum{ stroke:currentColor; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }


/* ==========================================================================
   HERO
   ========================================================================== */
.hero-title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:var(--fs-display);
  line-height:1.05;
  letter-spacing:-.005em;
  color:var(--teal-900);
  max-width:15ch;
}
.hero-title em{ font-style:italic; font-weight:400; color:var(--teal-600); }
.hero-lede{ font-size:var(--fs-lede); color:var(--text-muted); max-width:46ch; margin-top:var(--sp-5); }
.hero-ctas{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-4); margin-top:var(--sp-7); }
.hero-trust{
  display:flex; flex-wrap:wrap; gap:var(--sp-2) var(--sp-6);
  margin-top:var(--sp-8);
  padding-top:var(--sp-6);
  border-top:1px solid var(--line-300);
}
.hero-trust__item{ display:flex; align-items:center; gap:.55em; font-size:var(--fs-small); font-weight:600; color:var(--teal-800); }
.hero-trust__item svg{ width:16px; height:16px; color:var(--teal-500); flex:none; }

@keyframes heroReveal{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:translateY(0); } }
.hero-copy .eyebrow{ animation:heroReveal .8s cubic-bezier(.16,1,.3,1) both; animation-delay:.05s; }
.hero-copy .hero-title{ animation:heroReveal .8s cubic-bezier(.16,1,.3,1) both; animation-delay:.16s; }
.hero-copy .hero-lede{ animation:heroReveal .8s cubic-bezier(.16,1,.3,1) both; animation-delay:.32s; }
.hero-copy .hero-ctas{ animation:heroReveal .8s cubic-bezier(.16,1,.3,1) both; animation-delay:.44s; }
.hero-copy .hero-trust{ animation:heroReveal .8s cubic-bezier(.16,1,.3,1) both; animation-delay:.54s; }

.hero--photo{
  position:relative;
  overflow:hidden;
  min-height:min(88vh, 780px);
  display:flex;
  align-items:flex-end;
  padding-top:calc(var(--header-h) + var(--sp-9));
  padding-bottom:var(--sp-11);
}
.hero-bg{
  position:absolute; inset:0; z-index:0;
  background-image:url("assets/img/hero-lounge.jpg");
  background-size:cover;
  background-position:62% 50%;
  background-attachment:fixed;
}
.hero-scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(14,32,40,.88) 0%, rgba(14,32,40,.72) 32%, rgba(14,32,40,.32) 62%, rgba(14,32,40,.08) 85%),
    linear-gradient(0deg, rgba(10,24,30,.55) 0%, rgba(10,24,30,0) 40%);
}
.hero--photo .hero-grid{ display:block; position:relative; z-index:2; width:100%; }
.hero--photo .hero-copy{ max-width:640px; }
.hero--photo .eyebrow{ color:var(--teal-200); }
.hero--photo .hero-title{ color:var(--surface-100); }
.hero--photo .hero-title em{ color:var(--teal-300); }
.hero--photo .hero-lede{ color:rgba(238,246,248,.86); }
.hero-trust--onphoto .hero-trust__item{ color:var(--surface-100); }
.hero-trust--onphoto{ border-top-color:rgba(238,246,248,.22); }
.hero-trust--onphoto .hero-trust__item svg{ color:var(--teal-300); }
.btn-outline--onphoto{ border-color:rgba(238,246,248,.5); color:var(--surface-100); }
.btn-outline--onphoto:hover{ background:rgba(238,246,248,.12); }
.btn-text--onphoto{ color:var(--surface-100); border-color:var(--teal-300); }

.hero-badge--float{
  position:relative; z-index:2;
  align-self:flex-end;
  margin:var(--sp-8) auto 0;
  max-width:1180px; width:calc(100% - 3rem);
  background:rgba(20,48,59,.82);
  backdrop-filter:blur(6px);
  color:var(--surface-100);
  border-radius:var(--radius-sm);
  padding:var(--sp-5) var(--sp-6);
}
.hero-badge--float strong{ display:block; font-family:var(--font-display); font-size:1.15rem; font-weight:700; margin-bottom:.3em; }
.hero-badge--float span{ font-size:var(--fs-small); color:var(--text-on-dark-muted); }
.hero-live--float{
  position:absolute; top:calc(var(--header-h) + var(--sp-5)); right:var(--sp-6); z-index:3;
  display:flex; align-items:center; gap:.55em;
  background:rgba(251,253,253,.92);
  color:var(--teal-800);
  padding:.55em .9em;
  border-radius:var(--radius-pill);
  font-size:var(--fs-micro); font-weight:700; letter-spacing:.04em; text-transform:uppercase;
}
.hero-live__dot{ width:7px; height:7px; border-radius:50%; background:var(--teal-500); box-shadow:0 0 0 4px rgba(92,166,194,.25); }

.partners-strip{ background:var(--surface-200); border-bottom:1px solid var(--line-300); padding-block:var(--sp-9); }
.partners-strip__inner{ display:flex; flex-direction:column; align-items:center; gap:var(--sp-6); text-align:center; }
.partners-strip__label{ font-size:var(--fs-micro); font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted); white-space:nowrap; }
.partners-strip__logos{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:var(--sp-9); }
.partners-strip__logos img{ height:56px; width:auto; max-width:170px; object-fit:contain; }

/* ==========================================================================
   PHOTO FRAMES
   Every section now uses real photography (see assets/IMAGE-SOURCES.md).
   Frame classes (.hero-frame, .about-frame, .service-story__frame, etc.)
   define the aspect-ratio box, radius, and shadow; images inside them use
   object-fit:cover via inline style.
   ========================================================================== */


/* ==========================================================================
   QUIÉNES SOMOS
   ========================================================================== */
.about{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:clamp(2rem, 5vw, 5rem);
  align-items:center;
}
.about-visual{ position:relative; }
.about-frame{ aspect-ratio:1/1; border-radius:var(--radius-organic-sm); overflow:hidden; box-shadow:var(--shadow-md); }
.about-copy p{ margin-top:var(--sp-5); }
.about-pillars{ display:flex; flex-wrap:wrap; gap:var(--sp-6); margin-top:var(--sp-7); padding-top:var(--sp-6); border-top:1px solid var(--line-300); }
.about-pillars div{ display:flex; align-items:center; gap:.6em; font-weight:700; font-size:var(--fs-small); color:var(--teal-800); }
.about-pillars svg{ width:18px; height:18px; color:var(--teal-500); }

/* ==========================================================================
   SERVICE STORYTELLING (alternating image/text)
   ========================================================================== */
.service-story{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(2rem, 5vw, 4.5rem);
  align-items:center;
  padding-block:var(--sp-11);
}
.service-story:not(:last-child){ border-bottom:1px solid var(--line-300); }
.service-story.is-reversed .service-story__visual{ order:2; }
.service-story.is-reversed .service-story__copy{ order:1; }
.service-story__code{
  display:inline-block;
  font-family:var(--font-body); font-weight:800; font-size:.76rem;
  letter-spacing:.1em; color:var(--teal-600);
  border:1px solid var(--teal-300); border-radius:var(--radius-pill);
  padding:.4em .9em; margin-bottom:var(--sp-4);
}
.service-story h3{
  font-family:var(--font-display); font-weight:700; font-size:var(--fs-h1);
  line-height:1.08; color:var(--teal-900); letter-spacing:0;
}
.service-story p.lede{ margin-top:var(--sp-4); }
.service-story__list{ margin-top:var(--sp-6); display:flex; flex-direction:column; gap:.9em; }
.service-story__list li{
  display:flex; align-items:flex-start; gap:.75em;
  font-size:var(--fs-small); font-weight:600; color:var(--text-body);
}
.service-story__list svg{ width:16px; height:16px; flex:none; margin-top:.2em; color:var(--teal-500); }
.service-story__foot{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-5); margin-top:var(--sp-7); }
.service-story__note{ font-size:var(--fs-micro); color:var(--text-muted); max-width:32ch; line-height:1.5; }

.service-story__visual{ position:relative; }
.service-story__frame{ aspect-ratio:5/4; border-radius:var(--radius-organic-sm); overflow:hidden; box-shadow:var(--shadow-md); }
.service-story__chip{
  position:absolute; bottom:-18px; left:24px; z-index:3;
  background:var(--white); border-radius:var(--radius-sm);
  box-shadow:var(--shadow-md); padding:.9em 1.1em;
  display:flex; align-items:center; gap:.7em;
  max-width:78%;
}
.service-story__chip svg{ width:28px; height:28px; color:var(--teal-600); flex:none; }
.service-story__chip strong{ display:block; font-size:.9rem; color:var(--teal-900); }
.service-story__chip span{ font-size:.78rem; color:var(--text-muted); }

/* Category intro strip above the storytelling block */
.category-rail{ display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom:var(--sp-9); }
.category-rail a{
  text-decoration:none; font-size:var(--fs-small); font-weight:700; color:var(--teal-800);
  border:1.5px solid var(--line-400); border-radius:var(--radius-pill);
  padding:.6em 1.1em; transition:border-color var(--t-fast), background var(--t-fast);
}
.category-rail a:hover{ border-color:var(--teal-600); background:rgba(44,107,129,.05); }

/* ==========================================================================
   WEIGHT MANAGEMENT (own conversion moment)
   ========================================================================== */
.weight-panel{
  background:var(--teal-900);
  border-radius:var(--radius-md);
  overflow:hidden;
  display:grid;
  grid-template-columns:1fr 1fr;
  color:var(--text-on-dark);
}
.weight-panel h2.display{ color:var(--surface-100); }
.weight-panel .lede{ color:var(--text-on-dark-muted); }
.weight-panel__copy{ padding:clamp(2rem, 4vw, 4rem); }
.weight-panel__pillars{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-5); margin-top:var(--sp-7); }
.weight-panel__pillars div{ border-top:1px solid rgba(238,246,248,.2); padding-top:var(--sp-3); }
.weight-panel__pillars strong{ display:block; font-family:var(--font-display); font-size:1.1rem; font-weight:700; margin-bottom:.25em; }
.weight-panel__pillars span{ font-size:var(--fs-micro); color:var(--text-on-dark-muted); }
.weight-panel__visual{ position:relative; min-height:320px; }
.weight-panel__visual--photo{ border-radius:var(--radius-md); overflow:hidden; box-shadow:0 20px 50px rgba(0,0,0,.35); }


/* ==========================================================================
   TECHNOLOGY
   ========================================================================== */
.tech-scroller{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(220px, 1fr);
  gap:var(--sp-4);
  overflow-x:auto;
  padding-bottom:var(--sp-4);
  scroll-snap-type:x proximity;
  scrollbar-width:thin;
  scrollbar-color:var(--line-400) transparent;
}
.tech-scroller::-webkit-scrollbar{ height:6px; }
.tech-scroller::-webkit-scrollbar-thumb{ background:var(--line-400); border-radius:99px; }
.tech-card{
  scroll-snap-align:start;
  background:var(--white);
  border:1px solid var(--line-300);
  border-radius:var(--radius-sm);
  padding:var(--sp-6);
  position:relative;
  transition:transform var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease), border-color var(--t-base) var(--ease);
}
.tech-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:transparent; }
.tech-card__icon{ width:34px; height:34px; color:var(--teal-600); margin-bottom:var(--sp-5); }
.tech-card h4{ font-family:var(--font-display); font-size:1.15rem; font-weight:700; color:var(--teal-900); margin-bottom:.4em; }
.tech-card p{ font-size:var(--fs-small); color:var(--text-muted); }

.tech-featured{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-5); margin:var(--sp-7) auto 0; max-width:720px; }
.tech-featured__frame{ aspect-ratio:4/3; border-radius:var(--radius-sm); overflow:hidden; box-shadow:var(--shadow-md); }
.tech-featured__label{ display:block; margin-top:var(--sp-3); font-weight:700; font-size:var(--fs-small); color:var(--teal-800); }

/* ==========================================================================
   ESTÉTICA MÉDICA — editorial, lighter touch
   ========================================================================== */
.aesthetics{
  background:var(--surface-200);
  border-radius:var(--radius-md);
  overflow:hidden;
  display:grid;
  grid-template-columns:1.1fr .9fr;
}
.aesthetics__copy{ padding:clamp(2rem, 4vw, 4rem); }
.aesthetics__grid{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:var(--sp-6); }
.aesthetics__grid span{
  font-size:var(--fs-small); font-weight:600; color:var(--teal-800);
  background:var(--white); border-radius:var(--radius-pill);
  padding:.55em 1em; border:1px solid var(--line-300);
}
.aesthetics__visual{ position:relative; }
.aesthetics__frame{ height:100%; min-height:360px; }

/* ==========================================================================
   WHY LAMED
   ========================================================================== */
.pillars-grid{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  border-top:1px solid var(--line-300);
}
.pillar{
  padding:var(--sp-7) var(--sp-4) var(--sp-6);
  border-right:1px solid var(--line-300);
  position:relative;
}
.pillar:last-child{ border-right:0; }
.pillar__icon{ width:30px; height:30px; color:var(--teal-600); margin-bottom:var(--sp-5); }
.pillar h4{ font-family:var(--font-display); font-weight:700; font-size:1.1rem; color:var(--teal-900); margin-bottom:.5em; }
.pillar p{ font-size:var(--fs-small); color:var(--text-muted); }

/* ==========================================================================
   PATIENT JOURNEY
   ========================================================================== */
.journey{ position:relative; }
.journey-rail{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:var(--sp-5);
  position:relative;
}
.journey-rail::before{
  content:"";
  position:absolute; top:23px; left:6%; right:6%; height:1px;
  background:repeating-linear-gradient(90deg, var(--teal-500) 0 8px, transparent 8px 16px);
  opacity:.55;
  z-index:0;
}
.journey-step{ position:relative; z-index:1; }
.journey-step__num{
  display:inline-flex; align-items:center; justify-content:center;
  width:46px; height:46px; border-radius:50%;
  background:var(--surface-100); border:1.5px solid var(--teal-700);
  color:var(--teal-800); font-family:var(--font-display); font-weight:700; font-size:1.15rem;
  margin-bottom:var(--sp-5);
}
.journey-step h4{ font-family:var(--font-display); font-weight:700; font-size:1.25rem; color:var(--teal-900); margin-bottom:.4em; }
.journey-step p{ font-size:var(--fs-small); color:var(--text-muted); max-width:26ch; }

/* ==========================================================================
   SOCIAL
   ========================================================================== */
.social-band{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:clamp(2rem, 5vw, 4rem);
  align-items:center;
}
.social-links{ display:flex; flex-direction:column; }
.social-link{
  display:flex; align-items:center; justify-content:space-between;
  text-decoration:none; color:var(--surface-100);
  padding:var(--sp-5) 0;
  border-bottom:1px solid rgba(238,246,248,.18);
  transition:padding-left var(--t-base) var(--ease), color var(--t-base) var(--ease);
}
.social-link:first-child{ border-top:1px solid rgba(238,246,248,.18); }
.social-link:hover{ padding-left:var(--sp-3); color:var(--teal-300); }
.social-link__name{ display:flex; align-items:center; gap:var(--sp-4); font-family:var(--font-display); font-size:1.6rem; font-weight:700; }
.social-link__name svg{ width:26px; height:26px; color:var(--teal-500); }
.social-link__handle{ font-size:var(--fs-small); color:var(--text-on-dark-muted); font-weight:600; }


/* ==========================================================================
   CONTACT / LEAD FORM
   ========================================================================== */
.contact-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:clamp(2rem, 5vw, 4.5rem);
  align-items:start;
}
.service-select{ display:flex; flex-wrap:wrap; gap:.6rem; margin:var(--sp-6) 0; }
.service-chip{
  border:1.5px solid var(--line-400);
  background:var(--white);
  color:var(--teal-800);
  border-radius:var(--radius-pill);
  padding:.7em 1.1em;
  font-size:var(--fs-small); font-weight:700;
  cursor:pointer;
  transition:background var(--t-fast) var(--ease), color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.service-chip[aria-pressed="true"]{ background:var(--teal-700); border-color:var(--teal-700); color:var(--surface-100); }

.qr-card{
  display:flex; align-items:center; gap:var(--sp-5);
  background:var(--white); border:1px solid var(--line-300);
  border-radius:var(--radius-sm); padding:var(--sp-5);
  max-width:420px;
}
.qr-card img{ width:84px; height:84px; border-radius:6px; flex:none; }
.qr-card strong{ display:block; font-family:var(--font-display); font-size:1.1rem; color:var(--teal-900); }
.qr-card p{ font-size:var(--fs-small); color:var(--text-muted); margin-top:.2em; }

.lead-form{
  background:var(--white);
  border:1px solid var(--line-300);
  border-radius:var(--radius-md);
  padding:clamp(1.6rem, 3vw, 2.6rem);
  box-shadow:var(--shadow-sm);
}
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-4); }
.field{ display:flex; flex-direction:column; gap:.5em; margin-bottom:var(--sp-5); }
.field label{ font-size:var(--fs-micro); font-weight:700; letter-spacing:.03em; color:var(--teal-800); text-transform:uppercase; }
.field input,.field select,.field textarea{
  border:1.5px solid var(--line-400);
  border-radius:var(--radius-sm);
  padding:.9em 1em;
  background:var(--surface-100);
  outline:none;
  transition:border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}
.field input:focus,.field select:focus,.field textarea:focus{ border-color:var(--teal-600); background:var(--white); }
.field-consent{ flex-direction:row; align-items:flex-start; gap:.7em; }

.field-booking{
  background:var(--surface-200);
  border:1px solid var(--line-300);
  border-radius:var(--radius-sm);
  padding:var(--sp-5);
  margin-bottom:var(--sp-5);
}
.field-booking__label{
  display:flex; align-items:center; gap:.6em;
  font-weight:700; font-size:var(--fs-small); color:var(--teal-800);
  margin-bottom:var(--sp-4);
}
.field-booking__label svg{ width:19px; height:19px; color:var(--teal-600); flex:none; }
.field-booking .form-row{ margin-bottom:0; }
.field-booking .field{ margin-bottom:0; }
.field-booking__note{ font-size:var(--fs-micro); color:var(--text-muted); line-height:1.5; margin-top:var(--sp-4); }
.field-consent input{ width:auto; margin-top:.3em; accent-color:var(--teal-700); }
.field-consent span{ font-size:var(--fs-small); font-weight:400; color:var(--text-body); text-transform:none; }
.form-privacy{ font-size:var(--fs-micro); color:var(--text-muted); line-height:1.6; margin-top:var(--sp-4); }
.form-success{
  display:none;
  text-align:center;
  padding:var(--sp-8) var(--sp-4);
}
.form-success.is-visible{ display:block; }
.form-success svg{ width:48px; height:48px; color:var(--teal-500); margin:0 auto var(--sp-4); }
.form-success h3{ font-family:var(--font-display); font-size:1.4rem; color:var(--teal-900); margin-bottom:.4em; }
.form-success p{ color:var(--text-muted); font-size:var(--fs-small); }
.honeypot-field{ position:absolute; left:-9999px; opacity:0; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{ background:var(--ink); color:var(--text-on-dark-muted); padding-top:var(--sp-11); }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:var(--sp-8); padding-bottom:var(--sp-9); }
.footer-brand .brand-word span{ color:var(--text-on-dark-muted); }
.footer-brand p{ margin-top:var(--sp-4); font-size:var(--fs-small); max-width:32ch; }
.footer-social{ display:flex; gap:.7rem; margin-top:var(--sp-5); }
.footer-social a{
  width:38px; height:38px; border-radius:50%; border:1px solid rgba(238,246,248,.22);
  display:flex; align-items:center; justify-content:center; text-decoration:none; color:var(--text-on-dark-muted);
  transition:border-color var(--t-fast), color var(--t-fast);
}
.footer-social a:hover{ border-color:var(--teal-300); color:var(--teal-300); }
.footer-social svg{ width:17px; height:17px; }
.footer-col h5{ color:var(--surface-100); font-size:var(--fs-micro); letter-spacing:.1em; text-transform:uppercase; margin-bottom:var(--sp-4); }
.footer-col p, .footer-col a{ font-size:var(--fs-small); line-height:1.9; text-decoration:none; }
.footer-col a:hover{ color:var(--teal-300); }
.footer-legal{
  border-top:1px solid rgba(238,246,248,.12);
  padding-block:var(--sp-5);
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--sp-4);
  font-size:var(--fs-micro);
}
.footer-legal a{ text-decoration:none; color:var(--text-on-dark-muted); }
.footer-disclaimer{ max-width:760px; line-height:1.7; opacity:.8; }


/* ==========================================================================
   FLOATING ACTIONS — WhatsApp + AI Concierge
   ========================================================================== */
.float-stack{
  position:fixed; right:22px; bottom:22px; z-index:70;
  display:flex; flex-direction:column; align-items:flex-end; gap:.8rem;
}
.float-btn{
  display:inline-flex; align-items:center; gap:.6em;
  border:0; cursor:pointer; text-decoration:none;
  border-radius:var(--radius-pill);
  padding:1em 1.3em;
  font-weight:800; font-size:var(--fs-small);
  box-shadow:var(--shadow-lg);
  transition:transform var(--t-fast) var(--ease);
}
.float-btn:hover{ transform:translateY(-2px); }
.float-btn--whatsapp{ background:#1E5946; color:var(--surface-100); }
.float-btn--whatsapp svg{ width:20px; height:20px; }
.float-btn--concierge{ background:var(--teal-500); color:var(--ink); }
.float-btn--concierge svg{ width:19px; height:19px; }
.float-pulse{ width:8px; height:8px; border-radius:50%; background:var(--teal-300); box-shadow:0 0 0 5px rgba(150,190,200,.3); }

/* ==========================================================================
   AI CONCIERGE PANEL
   ========================================================================== */
.concierge-panel{
  position:fixed; right:22px; bottom:22px; z-index:90;
  width:min(400px, calc(100vw - 28px));
  max-height:min(680px, calc(100vh - 100px));
  background:var(--white);
  border-radius:20px;
  box-shadow:var(--shadow-lg);
  display:flex; flex-direction:column;
  overflow:hidden;
  transform:translateY(16px) scale(.97);
  opacity:0; pointer-events:none;
  transition:transform var(--t-base) var(--ease), opacity var(--t-base) var(--ease);
}
.concierge-panel.is-open{ transform:none; opacity:1; pointer-events:auto; }

.concierge-head{
  background:var(--teal-900);
  color:var(--surface-100);
  padding:var(--sp-5);
  display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-4);
  flex:none;
}
.concierge-head__id{ display:flex; align-items:center; gap:.6em; }
.concierge-head__mark{ width:34px; height:34px; border-radius:50%; background:var(--teal-500); color:var(--ink); display:flex; align-items:center; justify-content:center; flex:none; }
.concierge-head__mark svg{ width:18px; height:18px; }
.concierge-head strong{ display:block; font-family:var(--font-display); font-size:1.05rem; font-weight:700; }
.concierge-head small{ font-size:.76rem; color:var(--text-on-dark-muted); letter-spacing:.03em; }
.concierge-close{ border:0; background:transparent; color:var(--text-on-dark-muted); cursor:pointer; width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex:none; }
.concierge-close:hover{ color:var(--surface-100); background:rgba(238,246,248,.1); }
.concierge-close svg{ width:18px; height:18px; }

.concierge-notice{
  background:var(--surface-200);
  padding:.75em var(--sp-5);
  font-size:var(--fs-micro);
  line-height:1.5;
  color:var(--text-muted);
  flex:none;
  border-bottom:1px solid var(--line-300);
}
.concierge-notice strong{ color:var(--teal-700); }

.concierge-services{
  display:flex; flex-wrap:wrap; gap:.4rem;
  padding:var(--sp-4) var(--sp-5);
  border-bottom:1px solid var(--line-300);
  flex:none;
}
.concierge-chip{
  border:1px solid var(--line-400); background:var(--surface-100); color:var(--teal-800);
  border-radius:var(--radius-pill); padding:.45em .85em; font-size:.76rem; font-weight:700; cursor:pointer;
  transition:background var(--t-fast), color var(--t-fast), border-color var(--t-fast);
}
.concierge-chip[aria-pressed="true"]{ background:var(--teal-700); border-color:var(--teal-700); color:var(--surface-100); }

.concierge-body{
  flex:1; min-height:220px; max-height:360px;
  overflow-y:auto;
  padding:var(--sp-5);
  display:flex; flex-direction:column; gap:.65rem;
  background:var(--surface-100);
}
.concierge-msg{ max-width:88%; padding:.75em .95em; border-radius:14px; font-size:var(--fs-small); line-height:1.5; }
.concierge-msg.from-bot{ background:var(--white); border:1px solid var(--line-300); color:var(--text-body); border-bottom-left-radius:4px; }
.concierge-msg.from-user{ margin-left:auto; background:var(--teal-700); color:var(--surface-100); border-bottom-right-radius:4px; }
.concierge-typing{ display:inline-flex; gap:4px; padding:.2em 0; }
.concierge-typing span{ width:6px; height:6px; border-radius:50%; background:var(--line-400); animation:typing-bounce 1.1s ease-in-out infinite; }
.concierge-typing span:nth-child(2){ animation-delay:.15s; }
.concierge-typing span:nth-child(3){ animation-delay:.3s; }
@keyframes typing-bounce{ 0%,60%,100%{ transform:translateY(0); opacity:.5; } 30%{ transform:translateY(-4px); opacity:1; } }

.concierge-lead{ padding:var(--sp-5); border-top:1px solid var(--line-300); display:none; flex-direction:column; gap:.6rem; flex:none; background:var(--white); }
.concierge-lead.is-visible{ display:flex; }
.concierge-lead input, .concierge-lead select{
  border:1.5px solid var(--line-400); border-radius:var(--radius-sm); padding:.7em .8em; font-size:var(--fs-small); outline:none;
}
.concierge-lead input:focus, .concierge-lead select:focus{ border-color:var(--teal-600); }

.concierge-form{ display:flex; gap:.5rem; padding:var(--sp-4) var(--sp-5); border-top:1px solid var(--line-300); flex:none; background:var(--white); }
.concierge-form input{ flex:1; border:1.5px solid var(--line-400); border-radius:var(--radius-pill); padding:.75em 1.1em; outline:none; font-size:var(--fs-small); }
.concierge-form input:focus{ border-color:var(--teal-600); }
.concierge-form button{
  width:42px; height:42px; border-radius:50%; border:0; background:var(--teal-700); color:var(--surface-100);
  display:flex; align-items:center; justify-content:center; cursor:pointer; flex:none;
}
.concierge-form button:hover{ background:var(--teal-600); }
.concierge-form button svg{ width:17px; height:17px; }
.concierge-form button:disabled{ opacity:.5; cursor:default; }

.concierge-emergency{
  font-size:var(--fs-small); font-weight:600; text-align:center; color:var(--teal-700); background:var(--surface-200);
  padding:.6em var(--sp-5); flex:none;
}

/* ==========================================================================
   SCROLL REVEAL
   ========================================================================== */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* ==========================================================================
   TOAST
   ========================================================================== */
.toast{
  position:fixed; left:50%; bottom:28px; transform:translate(-50%, 14px);
  background:var(--ink); color:var(--surface-100);
  padding:.9em 1.4em; border-radius:var(--radius-pill);
  font-size:var(--fs-small); font-weight:600;
  opacity:0; pointer-events:none; transition:all var(--t-base) var(--ease);
  z-index:120; box-shadow:var(--shadow-lg);
}
.toast.is-visible{ opacity:1; transform:translate(-50%, 0); }


/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1024px){
  .primary-nav{ display:none; }
  .nav-burger{ display:flex; }
  .pillars-grid{ grid-template-columns:repeat(3,1fr); }
  .pillar:nth-child(3){ border-right:0; }
  .pillar{ border-bottom:1px solid var(--line-300); }
  .about, .weight-panel, .aesthetics, .social-band, .contact-grid{ grid-template-columns:1fr; }
  .weight-panel__visual{ min-height:220px; order:-1; }
  .aesthetics__visual{ min-height:260px; order:-1; }
  .service-story{ grid-template-columns:1fr; }
  .service-story.is-reversed .service-story__visual{ order:-1; }
  .service-story__visual{ order:-1; }
  .journey-rail{ grid-template-columns:1fr 1fr; row-gap:var(--sp-8); }
  .journey-rail::before{ display:none; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width:720px){
  :root{ --header-h:64px; }
  .hero--photo{ min-height:min(78vh, 640px); padding-top:calc(var(--header-h) + 92px); padding-bottom:var(--sp-8); }
  .hero-bg{ background-position:70% 50%; background-attachment:scroll; }
  .hero-scrim{
    background:
      linear-gradient(0deg, rgba(14,32,40,.92) 0%, rgba(14,32,40,.75) 38%, rgba(14,32,40,.25) 68%, rgba(14,32,40,.05) 100%);
  }
  .hero--photo .hero-copy{ max-width:none; }
  .hero-title{ max-width:none; }
  .hero-ctas{ flex-direction:column; align-items:stretch; }
  .hero-ctas .btn{ width:100%; }
  .hero-trust{ flex-direction:column; gap:.6rem; }
  .hero-badge--float{ width:calc(100% - 2rem); margin-top:var(--sp-6); }
  .section{ padding-block:var(--sp-9); }
  .tech-featured{ grid-template-columns:1fr; }
  .section-head{ flex-direction:column; align-items:flex-start; gap:var(--sp-4); }
  .pillars-grid{ grid-template-columns:1fr 1fr; }
  .pillar{ border-right:0 !important; }
  .pillar:nth-child(odd){ border-right:1px solid var(--line-300) !important; }
  .journey-rail{ grid-template-columns:1fr; }
  .form-row{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; gap:var(--sp-6); }
  .footer-legal{ flex-direction:column; }
  .footer-disclaimer{ order:2; }
  .qr-card{ max-width:none; }
  .partners-strip__logos{ gap:var(--sp-6); }

  .mobile-bar{ display:grid; }
  body{ padding-bottom:64px; }
  .float-stack{ right:14px; bottom:calc(64px + 14px + env(safe-area-inset-bottom)); }
  .concierge-panel{ right:10px; left:10px; width:auto; bottom:calc(64px + 14px + env(safe-area-inset-bottom)); max-height:min(72vh, 620px); }
  .float-btn--whatsapp span, .float-btn--concierge span{ display:none; }
  .float-btn{ padding:.9em; }
}

@media (max-width:460px){
  .container{ padding-inline:1.1rem; }
  .hero-live--float{ top:calc(var(--header-h) + var(--sp-3)); right:var(--sp-4); }
  .weight-panel__pillars{ grid-template-columns:1fr; }
}

/* Sticky-header aware anchor scrolling */
[id]{ scroll-margin-top:calc(var(--header-h) + 16px); }