/* ──────────────────────────────────────────────
   RESET & TOKENS
────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --blue:      #007bff;
  --sai-blue:  #007bff;
  --blue-dk:   #005fcc;
  --blue-lt:   #e4f3ff;
  --blue-mid:  #f0f6ff;
  --navy:      #06055c;
  --text:      #1e293b;
  --muted:     #64748b;
  --white:     #ffffff;
  --gray-100:  #f1f5f9;
  --gray-200:  #e2e8f0;
  --danger:    #ef4444;
  --green:     #22c55e;
  --cyan-blob: rgba(78,223,241,.36);
  --font:      'DM Sans', system-ui, sans-serif;
  --radius:    16px;
  --shadow:    0 10px 40px rgba(6,5,92,.08);
  --shadow-lg: 0 20px 60px rgba(6,5,92,.13);
}

html, body {
  width: 100%; height: auto;
  overflow-x: hidden; overflow-y: auto;
  color: var(--text);
  font-family: var(--font);
  -webkit-font-smoothing: antialiased;
}

/* Desktop: deck takes full viewport — lock scroll */
@media (min-width: 768px) {
  html, body { overflow: hidden; height: 100%; }
}

/* ──────────────────────────────────────────────
   BACKGROUND BLOBS
────────────────────────────────────────────── */
.blobs {
  position: fixed; inset: 0; pointer-events: none; z-index: 0; overflow: hidden;
}
.blob {
  position: absolute; border-radius: 50%;
  background: var(--cyan-blob);
  filter: blur(80px);
  animation: blobFloat 14s ease-in-out infinite alternate;
}
.blob-a { width:520px;height:520px;top:-120px;left:-120px;  animation-delay:0s; }
.blob-b { width:480px;height:480px;top:-100px;right:-140px; animation-delay:-4s; }
.blob-c { width:440px;height:440px;bottom:-160px;left:-80px;animation-delay:-8s; opacity:.7; }

@media (max-width:767px) {
  .blob   { filter:blur(50px); }
  .blob-a { width:220px;height:220px;top:-110px;left:-110px; }
  .blob-b { width:200px;height:200px;top:-100px;right:-110px; }
  .blob-c { width:180px;height:180px;bottom:-100px;left:-90px;opacity:.5; }
}

@keyframes blobFloat {
  from { transform: translate(0,0) scale(1); }
  to   { transform: translate(30px,20px) scale(1.06); }
}

/* ──────────────────────────────────────────────
   DECK — mobile-first
────────────────────────────────────────────── */
.deck {
  position: relative; z-index: 2;
  width: 100%; height: auto;
}

/* Mobile: slides stack as scrollable sections (default) */
.slide {
  position: relative; inset: auto;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 56px 20px 48px;
  opacity: 1; transform: none;
  pointer-events: auto;
  border-bottom: 1px solid var(--gray-200);
  min-height: 100svh;
}
.slide:last-child { border-bottom: none; }
.slide-hero { justify-content: center; padding-top: 0; }

/* Desktop: stacked slides with transition */
@media (min-width: 768px) {
  .deck { height: 100%; }
  .slide {
    position: absolute; inset: 0;
    align-items: center; justify-content: center;
    padding: 48px 72px;
    opacity: 0;
    transform: translateY(28px) scale(.98);
    transition: opacity .55s cubic-bezier(.4,0,.2,1), transform .55s cubic-bezier(.4,0,.2,1);
    pointer-events: none;
    border-bottom: none;
    min-height: unset;
  }
  .slide.active {
    opacity: 1; transform: translateY(0) scale(1);
    pointer-events: auto;
  }
  .slide.out-up { opacity:0; transform:translateY(-28px) scale(.98); }
  .slide-hero { justify-content: center; padding-top: 0; }
}

/* ──────────────────────────────────────────────
   PER-ELEMENT ENTRANCE ANIMATIONS
────────────────────────────────────────────── */
@keyframes fadeUp {
  from { opacity:0; transform:translateY(20px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes fadeIn {
  from { opacity:0; }
  to   { opacity:1; }
}
@keyframes fadeFromLeft {
  from { opacity:0; transform:translateX(-32px); }
  to   { opacity:1; transform:translateX(0); }
}
@keyframes fadeFromRight {
  from { opacity:0; transform:translateX(32px); }
  to   { opacity:1; transform:translateX(0); }
}

/* Elements inside slides animate when slide becomes .active */
.slide-el {
  opacity: 0;
  transition: none;
}
.slide.active .slide-el,
.slide.mobile-visible .slide-el {
  animation: fadeUp .5s cubic-bezier(.16,1,.3,1) var(--delay, 0ms) both;
}
/* Mobile: always visible */
@media (max-width: 767px) {
  .slide-el {
    opacity: 0;
    animation: fadeUp .5s cubic-bezier(.16,1,.3,1) var(--delay, 0ms) both;
  }
}

/* ──────────────────────────────────────────────
   NAVIGATION
────────────────────────────────────────────── */
.nav-dots {
  position: fixed; right: 24px; top: 50%; transform: translateY(-50%);
  display: flex; flex-direction: column; gap: 8px; z-index: 100;
}
.dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(6,5,92,.22); border: 1.5px solid rgba(6,5,92,.38);
  cursor: pointer; transition: all .3s;
}
.dot.active {
  background: var(--blue); border-color: var(--blue);
  height: 24px; border-radius: 4px;
  box-shadow: 0 0 0 3px rgba(0,123,255,.2);
}

.nav-arrows {
  position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%);
  display: flex; gap: 12px; z-index: 100;
}
.arrow-btn {
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--white); border: 1.5px solid var(--gray-200);
  color: var(--navy); font-size: 16px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; box-shadow: 0 2px 8px rgba(6,5,92,.1);
  transition: all .2s;
}
.arrow-btn:hover {
  background: var(--blue); color: var(--white); border-color: var(--blue);
  box-shadow: 0 4px 16px rgba(0,123,255,.35);
}

.counter {
  position: fixed; bottom: 36px; right: 36px;
  font-size: 11px; font-weight: 500; letter-spacing: 2px;
  color: var(--muted); z-index: 100;
}

/* Hide dots & counter on mobile; keep arrows but reposition */
@media (max-width: 767px) {
  .nav-dots, .counter { display: none; }
  .nav-arrows {
    position: fixed;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    gap: 16px;
    z-index: 200;
  }
  .arrow-btn {
    width: 48px; height: 48px;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 4px 16px rgba(6,5,92,.18);
    border: 1.5px solid var(--gray-200);
  }
}

/* ──────────────────────────────────────────────
   SHARED
────────────────────────────────────────────── */
.slide-inner { width: 100%; max-width: 1060px; }

.eyebrow {
  font-size: 11px; font-weight: 600; letter-spacing: 4px;
  text-transform: uppercase; color: var(--blue); margin-bottom: 12px;
}

.slide-title {
  font-size: clamp(26px, 4.2vw, 54px);
  font-weight: 700; line-height: 1.1; letter-spacing: -.02em; color: var(--navy);
}
.slide-title em { font-style: italic; color: var(--blue); }

.slide-sub {
  margin-top: 12px; font-size: 15px; color: var(--muted);
  line-height: 1.7; max-width: 600px;
}

.rule { width:48px;height:3px;border-radius:2px;background:var(--blue);margin:18px 0; }

.badge {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--blue-lt); border: 1px solid rgba(0,123,255,.25);
  color: var(--blue); font-size: 11px; font-weight: 600;
  letter-spacing: 2px; text-transform: uppercase;
  padding: 5px 14px; border-radius: 24px;
}

/* ──────────────────────────────────────────────
   SLIDE 1 — HERO
────────────────────────────────────────────── */
.slide-hero { flex-direction: column; text-align: center; }

.hero-wordmark {
  font-size: clamp(16px,1.8vw,20px); font-weight: 800;
  letter-spacing: -.04em; color: var(--navy); line-height: 1; margin-bottom: 12px;
}
.hero-wordmark span { color: var(--blue); }

.hero-tagline {
  font-size: clamp(10px,1.1vw,13px); font-weight: 400;
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 16px;
}

.hero-desc {
  font-family: var(--font);
  font-size: clamp(1.9rem, 4.5vw, 3.2rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.01em;
  color: var(--navy);
  margin: 1.1rem auto 40px;
  overflow: hidden;
  max-width: 860px;
}

.trust-pills { margin-top:5%;display:flex;gap:10px;flex-wrap:wrap;justify-content:center; }
.pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 16px; border-radius: 32px;
  background: var(--white); border: 1.5px solid var(--gray-200);
  font-size: 13px; font-weight: 500; color: var(--text);
  box-shadow: 0 2px 8px rgba(6,5,92,.06);
}
.pill-dot {
  width:8px;height:8px;border-radius:50%;background:var(--blue);
  animation: pulse-dot 2.5s ease-in-out infinite; flex-shrink:0;
}
@keyframes pulse-dot {
  0%,100%{box-shadow:0 0 0 0 rgba(0,123,255,.4);}
  50%    {box-shadow:0 0 0 7px rgba(0,123,255,0);}
}

/* ── HOSPITAL LOGO STRIP ── */
.logo-strip-label {
  text-align: center;
  font-size: 10.5px; font-weight: 500;
  letter-spacing: .13em; text-transform: uppercase;
  color: var(--muted); opacity: .45;
  margin-top: 24px; margin-bottom: 8px;
}
.logo-strip-wrap {
  width: 100vw;
  margin-inline-start: calc(50% - 50vw);
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
}
.logo-strip-track {
  display: flex; align-items: center;
  width: max-content;
  animation: logoScroll 34s linear infinite;
}
.logo-strip-wrap:hover .logo-strip-track { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .logo-strip-track { animation: none; }
}
@keyframes logoScroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.logo-chip {
  display: flex; align-items: center; gap: 7px;
  padding: 0 20px; height: 44px;
  white-space: nowrap;
  font-size: 13px; font-weight: 600;
  color: var(--muted); letter-spacing: .01em;
  opacity: .55;
  border-right: 1px solid var(--gray-200);
  transition: opacity .2s;
  user-select: none;
}
.logo-chip:hover { opacity: 1; }
.logo-chip-cross {
  width: 14px; height: 14px; flex-shrink: 0;
  fill: var(--blue); opacity: .5;
}

/* ──────────────────────────────────────────────
   SLIDE 2 — LA HISTORIA
────────────────────────────────────────────── */
.story-grid {
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
}
@media (max-width: 767px) {
  .story-grid { grid-template-columns:1fr; gap:28px; }
}

.story-quote {
  font-size: clamp(18px,2.4vw,30px); font-weight: 700;
  line-height: 1.25; color: var(--navy);
  position: relative; padding-left: 28px;
}
.story-quote::before {
  content: '"'; position: absolute; left: 0; top: -8px;
  font-size: 72px; line-height: 1; color: var(--blue);
  font-weight: 800; opacity: .3;
}

.memorial-card {
  background: linear-gradient(135deg, var(--blue-lt), rgba(78,223,241,.15));
  border: 1.5px solid rgba(0,123,255,.2);
  border-radius: 20px; padding: 32px; text-align: center;
}
.memorial-name  { font-size:20px;font-weight:700;color:var(--navy);margin-bottom:4px; }
.memorial-dates { font-size:14px;color:var(--muted);margin-bottom:20px; }
.memorial-body  { font-size:15px;color:var(--text);line-height:1.7; }

/* ──────────────────────────────────────────────
   SLIDE 3 — EL PROBLEMA
────────────────────────────────────────────── */
.problem-grid {
  display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;
}
@media (max-width: 767px) {
  .problem-grid { grid-template-columns:1fr; gap:24px; }
}
.stat-list { display:flex;flex-direction:column;gap:16px; }
.stat-item {
  display: flex; align-items: flex-start; gap: 20px;
  background: var(--white); border: 1.5px solid var(--gray-200);
  border-radius: 14px; padding: 20px 24px;
  box-shadow: 0 2px 12px rgba(6,5,92,.06);
}
.stat-num  { font-size:clamp(28px,3.5vw,40px);font-weight:800;color:var(--blue);line-height:1;white-space:nowrap; }
.stat-desc { font-size:14px;color:var(--muted);line-height:1.5;padding-top:4px; }

/* ── STAT COUNTER ANIMATIONS ── */
@keyframes statBounce {
  0%   { transform: scale(0.4) translateY(10px); opacity:0; }
  60%  { transform: scale(1.12) translateY(-4px); opacity:1; }
  80%  { transform: scale(0.95) translateY(2px); }
  100% { transform: scale(1) translateY(0); }
}
@keyframes statSlam {
  0%   { transform: scale(2.2); opacity:0; filter:blur(6px); }
  55%  { transform: scale(0.88); opacity:1; filter:blur(0); }
  75%  { transform: scale(1.06); }
  100% { transform: scale(1); }
}
/* Text-only stats (e.g. "1 de 3") bounce in */
.stat-num-text.stat-animated {
  display: inline-block;
  animation: statBounce .7s cubic-bezier(.34,1.56,.64,1) both;
}
/* Zero-value stat slams in */
.stat-slam.stat-animated {
  display: inline-block;
  animation: statSlam .65s cubic-bezier(.22,1,.36,1) both;
}
/* Count-up numbers just fade+slide via the existing slide-el animation */

/* ──────────────────────────────────────────────
   SLIDE 4 — QUÉ ES SAPHIR
────────────────────────────────────────────── */
.what-grid {
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;
}
@media (max-width: 900px) {
  .what-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 767px) {
  .what-grid { grid-template-columns:1fr 1fr; gap:10px; }
}
.what-card {
  border-radius: 14px; padding: 16px 18px;
  background: var(--white); border: 1.5px solid var(--gray-200);
  box-shadow: 0 2px 12px rgba(6,5,92,.05);
  transition: transform .2s, border-color .2s, box-shadow .2s;
}
.what-card:hover { transform:translateY(-4px);border-color:var(--blue);box-shadow:0 8px 30px rgba(0,123,255,.15); }
.what-icon {
  width:40px;height:40px;border-radius:10px;
  background:var(--blue-lt);display:flex;align-items:center;
  justify-content:center;font-size:20px;margin-bottom:10px;
}
.what-title { font-size:14px;font-weight:700;color:var(--navy);margin-bottom:6px; }
.what-desc  { font-size:12px;color:var(--muted);line-height:1.55; }

/* ──────────────────────────────────────────────
   SLIDE 5 — CÓMO FUNCIONA
────────────────────────────────────────────── */
.s5-header { margin-bottom:20px; }
.slide-title.s5-title { font-size:clamp(20px,2.6vw,34px); }
@media (min-width: 768px) {
  .s5-header { margin-bottom:10px; }
}
@media (min-width: 768px) and (max-height: 860px) {
  .s5-header { margin-bottom:4px; }
  .slide-title.s5-title { font-size:clamp(16px,1.8vw,26px); }
}
.flow-wrap {
  display:flex;align-items:flex-start;gap:0;
  width:100%;max-width:1000px;
}
@media (max-width: 767px) {
  .flow-wrap { flex-direction:column; gap:20px; align-items:stretch; }
  .flow-step:not(:last-child)::after { display:none; }
  .flow-step { flex-direction:row; text-align:left; align-items:flex-start; gap:14px; }
  .step-circle { margin-bottom:0; flex-shrink:0; }
  .step-icon { display:none; }
}
.flow-step {
  flex:1;display:flex;flex-direction:column;
  align-items:center;text-align:center;position:relative;
}
.flow-step:not(:last-child)::after {
  content:'';
  position:absolute;top:24px;left:calc(50% + 24px);
  right:calc(-50% + 24px);height:2px;
  border-top:2px dashed rgba(0,123,255,.3);
}
.step-circle {
  width:48px;height:48px;border-radius:50%;
  background:var(--blue);color:var(--white);
  display:flex;align-items:center;justify-content:center;
  font-size:18px;font-weight:700;margin-bottom:16px;margin-top:0;
  box-shadow:0 4px 16px rgba(0,123,255,.3);position:relative;z-index:1;
}
.step-icon  { font-size:24px;margin-bottom:10px;display:flex;align-items:center;justify-content:center; }

/* S5 — mini phone mockups with real screenshots */
.s5-phone {
  width:124px; height:248px; background:#0c0c16;
  border-radius:24px; border:2px solid rgba(255,255,255,.12);
  box-shadow:0 12px 40px rgba(0,0,0,.5), 0 0 22px rgba(0,123,255,.1), inset 0 1px 0 rgba(255,255,255,.06);
  padding:8px 7px 10px; margin-bottom:14px;
  overflow:hidden; position:relative; flex-shrink:0;
  display:flex; flex-direction:column;
  /* GPU layer: prevents antialiased border-radius from blurring contents */
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  will-change: transform;
}
.s5-pbar {
  display:flex; justify-content:space-between; align-items:center;
  font-size:6.5px; color:rgba(255,255,255,.4); margin-bottom:5px; flex-shrink:0;
}
.s5-screen {
  flex:1; border-radius:4px; overflow:hidden;
  background:rgba(255,255,255,.04); position:relative;
  display:flex; align-items:center; justify-content:center;
  /* own compositing layer so the image rasterises at full device-pixel resolution */
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.s5-screenshot {
  width:100%; height:100%; object-fit:cover; object-position:top center;
  display:block;
  filter: contrast(1.06) saturate(1.05);
  -webkit-user-drag: none;
  user-select: none;
  pointer-events: none;
}
.s5-ph-fallback {
  display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:5px;
  width:100%; height:100%; position:absolute; inset:0;
}
.s5-ph-icon { font-size:20px; opacity:.4; }
.s5-ph-lbl  { font-size:7px; color:rgba(255,255,255,.3); text-align:center; padding:0 4px; line-height:1.3; }
.s5-phome { width:28px; height:3px; border-radius:2px; background:rgba(255,255,255,.2); margin:6px auto 0; flex-shrink:0; }

/* S5 — device icon animations */
@keyframes s5-glow  { 0%,100%{box-shadow:0 0 0 2px rgba(0,123,255,.18);} 50%{box-shadow:0 0 0 7px rgba(0,123,255,.06);} }
@keyframes s5-dot   { 0%,100%{opacity:.2;transform:scale(.8);} 50%{opacity:1;transform:scale(1);} }
@keyframes s5-scan  { 0%{top:4px;opacity:.9;} 90%{opacity:.7;} 100%{top:calc(100% - 6px);opacity:0;} }
@keyframes s5-beam  { 0%,100%{opacity:0;} 5%,95%{opacity:1;} 50%{opacity:.5;} }
@keyframes s5-ecg   { from{stroke-dashoffset:80;} to{stroke-dashoffset:0;} }
@keyframes s5-lock  { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-2px);} }
@keyframes s5-chip  { 0%,100%{opacity:.4;} 50%{opacity:1;} }
.sdev {
  width:46px; height:46px; border-radius:11px;
  background:var(--blue-lt); border:1.5px solid rgba(0,123,255,.22);
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
  animation:s5-glow 2.4s ease-in-out infinite;
}
/* phone frame inner */
.sdev-phone-frame {
  width:26px; height:34px; border-radius:4px;
  border:2px solid rgba(0,95,204,.5);
  background:rgba(255,255,255,.6);
  display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:3px; padding:3px 3px;
}
.sdev-user { width:8px; height:8px; border-radius:50%; background:var(--blue); }
.sdev-bars { display:flex; flex-direction:column; gap:2px; width:100%; padding:0 1px; }
.sdev-bar  { height:2px; border-radius:1px; background:rgba(0,95,204,.3); }
.sdev-bar:nth-child(1){ width:100%; animation:s5-dot 1.8s ease infinite; }
.sdev-bar:nth-child(2){ width:70%; animation:s5-dot 1.8s ease infinite .3s; }
.sdev-bar:nth-child(3){ width:85%; animation:s5-dot 1.8s ease infinite .6s; }
/* shield lock */
.sdev-shield { position:relative; }
.sdev-shield svg { display:block; animation:s5-lock 2s ease-in-out infinite; }
/* qr build */
.sdev-qr-wrap { position:relative; }
.sdev-scan-line {
  position:absolute; left:0; right:0; height:2px;
  background:linear-gradient(90deg,transparent,rgba(0,123,255,.8),transparent);
  animation:s5-scan 1.8s linear infinite;
}
/* scanner beam */
.sdev-scan-beam {
  position:absolute; left:2px; right:2px; height:2px;
  background:linear-gradient(90deg,transparent,rgba(239,68,68,.9),transparent);
  animation:s5-scan 1.2s ease-in-out infinite;
}
.sdev-scan-corners::before,.sdev-scan-corners::after {
  content:''; position:absolute; width:8px; height:8px;
  border-color:rgba(0,123,255,.7); border-style:solid;
}
.sdev-scan-corners::before { top:0; left:0; border-width:2px 0 0 2px; }
.sdev-scan-corners::after  { bottom:0; right:0; border-width:0 2px 2px 0; }
/* ecg */
.sdev-screen {
  width:38px; height:26px; border-radius:4px;
  background:rgba(6,5,92,.08); border:1px solid rgba(0,123,255,.2);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.sdev-ecg-svg { display:block; }
.sdev-ecg-path { stroke-dasharray:80; stroke-dashoffset:80; animation:s5-ecg 2s linear infinite; }
.step-label { font-size:14px;font-weight:600;color:var(--navy);margin-bottom:6px; }
.step-desc  { font-size:12px;color:var(--muted);line-height:1.5;padding:0 8px; }
@media (max-width: 767px) {
  .step-label { font-size:14px; margin-bottom:4px; }
  .step-desc  { padding:0; font-size:13px; }
}

/* ──────────────────────────────────────────────
   SLIDE 5B — ASISTENTE IA
────────────────────────────────────────────── */
.sai-layout {
  display:flex; align-items:center; gap:48px;
  width:100%; max-width:1020px;
}
.sai-text { flex:1; min-width:0; }
.sai-phone-wrap { flex-shrink:0; display:flex; justify-content:center; }

/* Phone — 1.7× escala respecto al diseño base */
.sai-phone {
  width:340px; height:680px; background:#0c0c16;
  border-radius:50px; border:3px solid rgba(255,255,255,.14);
  box-shadow:0 28px 80px rgba(0,0,0,.55), 0 0 48px rgba(0,123,255,.13),
             inset 0 1px 0 rgba(255,255,255,.07);
  padding:14px 12px 17px;
  overflow:hidden; position:relative;
  display:flex; flex-direction:column;
  transform:translateZ(0); will-change:transform;
}
.sai-phone .s5-pbar { font-size:11px; }

/* Chat area */
.sai-chat-area {
  flex:1; background:#f0f2f7; border-radius:10px;
  display:flex; flex-direction:column; overflow:hidden;
}

/* Header azul — igual que el real */
.sai-chat-hdr {
  background: var(--sai-blue);
  padding:12px 14px; display:flex; align-items:center;
  gap:10px; flex-shrink:0;
}
.sai-hdr-icon {
  width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,.18);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.sai-hdr-icon svg { width:22px; height:22px; }
.sai-hdr-info { flex:1; min-width:0; }
.sai-chat-name   { font-size:13px; font-weight:700; color:#fff; line-height:1.2; }
.sai-chat-status {
  font-size:9px; color:rgba(255,255,255,.75);
  display:flex; align-items:center; gap:3px; margin-top:2px;
}
.sai-dot-live {
  width:6px; height:6px; border-radius:50%;
  background:#4ade80; flex-shrink:0;
  animation:sai-live-pulse 1.6s ease infinite;
}
@keyframes sai-live-pulse {
  0%,100% { opacity:1; transform:scale(1); }
  50%     { opacity:.45; transform:scale(.65); }
}
.sai-hdr-btns { display:flex; gap:5px; flex-shrink:0; }
.sai-hdr-btn {
  width:24px; height:24px; border-radius:50%;
  background:rgba(255,255,255,.2); color:#fff;
  font-size:15px; line-height:24px; text-align:center;
  font-weight:600; cursor:default;
}

/* Mensajes */
.sai-msgs {
  flex:1; overflow:hidden; padding:10px 10px 7px;
  display:flex; flex-direction:column; gap:8px;
}
/* Burbuja IA: logo + mensaje en fila */
.sai-bubble-ai {
  display:flex; align-items:flex-end; gap:7px;
  max-width:92%; align-self:flex-start;
}
.sai-bbl-logo {
  width:24px; height:24px; border-radius:50%;
  background:white;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; overflow:hidden;
  box-shadow:0 2px 6px rgba(0,123,255,.3);
}
.sai-bbl-logo img {
  width:15px; height:15px; object-fit:contain; display:block;
  -webkit-user-drag:none; user-select:none; pointer-events:none;
}
.sai-msg {
  font-size:12px; line-height:1.45;
  padding:9px 12px; border-radius:17px; word-break:break-word;
}
.sai-msg-u {
  max-width:80%; align-self:flex-end;
  background: var(--sai-blue);
  color:#fff; border-bottom-right-radius:5px;
}
.sai-msg-b {
  background:#fff; color:#1a1a2e;
  border:1px solid rgba(0,0,0,.07); border-bottom-left-radius:5px;
}

/* Typing indicator */
.slide.active .sai-typing-wrap.slide-el,
.slide.mobile-visible .sai-typing-wrap.slide-el {
  animation:sai-type-show 1.6s ease var(--delay,0ms) both !important;
}
.sai-typing {
  background:#fff; border:1px solid rgba(0,0,0,.07);
  border-radius:17px; border-bottom-left-radius:5px;
  padding:9px 14px; display:flex; align-items:center; gap:5px;
}
.sai-typing span {
  width:6px; height:6px; border-radius:50%;
  background:#b0b8c8; display:block;
  animation:sai-dot-bounce 1.1s ease infinite;
}
.sai-typing span:nth-child(2) { animation-delay:.18s; }
.sai-typing span:nth-child(3) { animation-delay:.36s; }

@keyframes sai-type-show {
  0%   { opacity:0; transform:translateY(5px) scale(.9); }
  12%  { opacity:1; transform:translateY(0) scale(1); }
  70%  { opacity:1; transform:translateY(0) scale(1); }
  100% { opacity:0; transform:translateY(-3px) scale(.92); }
}
@keyframes sai-dot-bounce {
  0%,55%,100% { transform:translateY(0); }
  28%         { transform:translateY(-5px); }
}

/* Chips de acción rápida — mismo diseño que saphir-ai__chip */
.sai-chips {
  display:flex; gap:5px; padding:7px 10px;
  flex-shrink:0; flex-wrap:wrap;
  border-top:1px solid rgba(0,0,0,.06); background:#f8f9fb;
}
.sai-chip {
  display:inline-flex; align-items:center; gap:3px;
  font-size:8px; font-weight:500;
  color:var(--sai-blue); background:#fff;
  border:1.2px solid var(--sai-blue);
  border-radius:999px; padding:3px 10px; white-space:nowrap;
}

/* Input bar */
.sai-inputbar {
  display:flex; align-items:center; gap:9px;
  padding:9px 10px; border-top:1px solid rgba(0,0,0,.07);
  background:#fff; flex-shrink:0;
}
.sai-input-icon { width:15px; height:15px; color:#9ca3af; flex-shrink:0; }
.sai-input-ph {
  flex:1; font-size:9px; color:#9ca3af;
  min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.sai-send-btn {
  width:27px; height:27px; border-radius:50%;
  background: var(--sai-blue);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.sai-send-btn svg { width:14px; height:14px; color:#fff; }

/* Adjunto PDF en burbuja de usuario */
.sai-attach-file {
  display:flex; align-items:center; gap:5px;
  background:rgba(255,255,255,.15); border-radius:7px;
  padding:5px 9px; margin-bottom:5px;
}
.sai-pdf-badge {
  background:#ef4444; color:#fff;
  font-size:7px; font-weight:700;
  padding:2px 5px; border-radius:3px; letter-spacing:.4px;
  flex-shrink:0;
}
.sai-attach-name {
  font-size:9px; color:rgba(255,255,255,.85);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  max-width:150px;
}

/* Lista de características */
.sai-feats { list-style:none; margin:18px 0 0; padding:0; display:flex; flex-direction:column; gap:13px; }
.sai-feat  { display:flex; align-items:flex-start; gap:12px; }
.sai-feat-icon  { font-size:19px; flex-shrink:0; line-height:1; margin-top:1px; }
.sai-feat-title { font-size:13px; font-weight:700; color:var(--navy); margin-bottom:2px; }
.sai-feat-desc  { font-size:11.5px; color:var(--muted); line-height:1.5; }

/* Disclaimer */
.sai-disclaimer {
  font-size:11px; color:var(--muted); margin-top:14px;
  padding:7px 10px; line-height:1.5;
  background:rgba(0,123,255,.04);
  border:1px solid rgba(0,123,255,.12); border-radius:8px;
}

/* Responsive */
@media (max-width:960px) {
  .sai-layout { flex-direction:column; align-items:center; gap:30px; text-align:center; }
  .sai-feats  { align-items:flex-start; }
  .sai-feat   { text-align:left; }
  .sai-phone-wrap { order:-1; }
  .sai-phone  { width:240px; height:480px; border-radius:36px; padding:10px 9px 12px; }
  .sai-phone .s5-pbar { font-size:8px; }
  .sai-chat-hdr { padding:8px 10px; gap:7px; }
  .sai-hdr-icon { width:26px; height:26px; }
  .sai-hdr-icon svg { width:15px; height:15px; }
  .sai-chat-name { font-size:9px; }
  .sai-chat-status { font-size:6.5px; }
  .sai-dot-live { width:4px; height:4px; }
  .sai-hdr-btn { width:17px; height:17px; font-size:11px; line-height:17px; }
  .sai-msgs { padding:7px 7px 5px; gap:5px; }
  .sai-bbl-logo { width:17px; height:17px; }
  .sai-bbl-logo img { width:11px; height:11px; }
  .sai-msg { font-size:8.5px; padding:6px 8px; border-radius:12px; }
  .sai-typing { padding:6px 10px; }
  .sai-typing span { width:4px; height:4px; }
  .sai-chips { gap:4px; padding:5px 7px; }
  .sai-chip { font-size:5.5px; padding:2px 7px; }
  .sai-inputbar { padding:6px 7px; gap:6px; }
  .sai-input-icon { width:11px; height:11px; }
  .sai-input-ph { font-size:6.5px; }
  .sai-send-btn { width:19px; height:19px; }
  .sai-send-btn svg { width:10px; height:10px; }
  .sai-pdf-badge { font-size:5px; padding:1px 4px; }
  .sai-attach-name { font-size:6.5px; max-width:110px; }
}
@media (max-width:480px) {
  .sai-phone { width:190px; height:380px; border-radius:28px; padding:8px 7px 10px; }
  .sai-phone .s5-pbar { font-size:6.5px; }
  .sai-chat-name { font-size:7.5px; }
  .sai-msg { font-size:7px; padding:5px 7px; }
}

/* ──────────────────────────────────────────────
   SLIDE 6 — DIFERENCIADORES
────────────────────────────────────────────── */
.diff-grid {
  display:grid;grid-template-columns:1fr 1fr;gap:18px;
}
@media (max-width: 767px) {
  .diff-grid { grid-template-columns:1fr; gap:12px; }
}
.diff-card {
  border-radius:16px;padding:24px 22px;
  display:flex;align-items:flex-start;gap:18px;
  background:var(--white);border:1.5px solid var(--gray-200);
  box-shadow:0 2px 10px rgba(6,5,92,.05);
  transition:border-color .2s,box-shadow .2s;
}
.diff-card:hover { border-color:var(--blue);box-shadow:0 6px 24px rgba(0,123,255,.12); }
.diff-num  { font-size:28px;font-weight:800;color:var(--blue);opacity:.25;line-height:1;flex-shrink:0; }
.diff-title{ font-size:15px;font-weight:700;color:var(--navy);margin-bottom:7px; }
.diff-body { font-size:13px;color:var(--muted);line-height:1.6; }

/* ──────────────────────────────────────────────
   SLIDE 7 — PARA QUIÉN ES
────────────────────────────────────────────── */
.audience-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:16px;
}
@media (max-width:1024px) {
  .audience-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:767px) {
  .audience-grid { grid-template-columns:1fr; gap:12px; }
}
.aud-card {
  border-radius:20px; padding:30px 22px 26px; text-align:center;
  background:var(--white); border:1.5px solid var(--gray-200);
  box-shadow:0 2px 14px rgba(6,5,92,.06);
  transition:transform .3s cubic-bezier(.22,.68,0,1.2), box-shadow .3s ease, border-color .3s ease;
  cursor:default;
}
.aud-card:hover {
  transform:translateY(-7px);
  box-shadow:0 22px 52px rgba(6,5,92,.13);
  border-color:var(--accent);
}
.aud-icon-wrap {
  width:62px; height:62px; border-radius:17px;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 20px;
  background:var(--accent-lt); color:var(--accent);
  transition:transform .35s cubic-bezier(.22,.68,0,1.2);
}
.aud-card:hover .aud-icon-wrap { transform:scale(1.12) rotate(-5deg); }
.aud-icon-wrap svg { width:27px; height:27px; }
.aud-title { font-size:15px; font-weight:700; color:var(--navy); margin-bottom:7px; }
.aud-sub   { font-size:12.5px; color:var(--muted); line-height:1.55; }
.aud-detail {
  font-size:12px; color:var(--muted); line-height:1.6;
  max-height:0; overflow:hidden; opacity:0;
  transition:max-height .4s ease, opacity .3s ease, margin-top .3s ease;
  margin-top:0;
}
.aud-card:hover .aud-detail { max-height:80px; opacity:.72; margin-top:11px; }

/* ──────────────────────────────────────────────
   SLIDE 8 — EL IMPACTO
────────────────────────────────────────────── */
.impact-grid { display:flex; flex-wrap:wrap; gap:6px 8px; align-items:flex-start; }

@keyframes chipIn {
  from { opacity:0; transform:translateY(14px) scale(.94); }
  to   { opacity:1; transform:translateY(0)    scale(1); }
}
@keyframes chipFloat {
  0%,100% { transform:translateY(0px); }
  50%     { transform:translateY(var(--fh, -6px)); }
}

.idea-chip {
  display: inline-flex; align-items: flex-start; gap: 6px;
  padding: 7px 11px; border-radius: 9px;
  background: var(--white); border: 1.5px solid var(--gray-200);
  box-shadow: 0 2px 6px rgba(6,5,92,.05);
  max-width: 200px;
  animation:
    chipIn  .45s cubic-bezier(.16,1,.3,1) var(--ci, 0s) both,
    chipFloat var(--fd, 4s) ease-in-out   var(--ff, 0s) infinite;
  transition: box-shadow .2s, border-color .2s;
}
.idea-chip:hover {
  border-color: var(--blue);
  box-shadow: 0 4px 16px rgba(0,123,255,.15);
}
.idea-chip.accent { background: var(--blue-lt); border-color: rgba(0,123,255,.2); }
.idea-chip.soft   { background: #f0fdf4;         border-color: rgba(34,197,94,.2); }
.idea-chip.warn   { background: #fff7ed;         border-color: rgba(251,146,60,.2); }
.idea-chip.wide   { max-width: 260px; }
.chip-em   { font-size:14px; flex-shrink:0; margin-top:1px; }
.chip-text { font-size:12px; font-weight:600; color:var(--navy); line-height:1.4; }

/* ──────────────────────────────────────────────
   SLIDE 9 — LA OPORTUNIDAD
────────────────────────────────────────────── */
.opp-grid {
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
}
@media (max-width: 767px) {
  .opp-grid { grid-template-columns:1fr; gap:24px; }
}
.opp-stats { display:flex;flex-direction:column;gap:20px; }
.cs-reasons-row {
  display:flex; flex-wrap:wrap; gap:20px; justify-content:center;
}
.cs-reasons-row .opp-stat { flex:1 1 260px; max-width:340px; }
.opp-stat  {
  padding:20px 24px;border-radius:14px;
  background:var(--white);border:1.5px solid var(--gray-200);
  box-shadow:0 2px 10px rgba(6,5,92,.05);
}
.opp-val  { font-size:clamp(26px,3.5vw,38px);font-weight:800;color:var(--blue);line-height:1;margin-bottom:4px; }
.opp-desc { font-size:13px;color:var(--muted); }

.opp-insight {
  position:relative;overflow:hidden;
  background:linear-gradient(140deg,#06055c 0%,#1a1090 55%,#0d0878 100%);
  border-radius:24px;padding:32px 28px;color:var(--white);
  border:1px solid rgba(255,255,255,.07);
  box-shadow:0 0 0 1px rgba(78,223,242,.12), 0 24px 48px rgba(6,5,92,.35);
}
.opp-insight::before {
  content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:28px 28px;
}
.opp-insight::after {
  content:'\201C';position:absolute;top:-24px;right:18px;
  font-size:180px;font-weight:900;font-family:Georgia,serif;line-height:1;
  color:rgba(255,255,255,.05);pointer-events:none;user-select:none;
}
.opp-insight-inner { position:relative; }
.opp-tag {
  display:inline-flex;align-items:center;gap:6px;margin-bottom:22px;
  background:rgba(78,223,242,.12);border:1px solid rgba(78,223,242,.28);
  border-radius:20px;padding:5px 14px;
  font-size:10px;letter-spacing:2px;text-transform:uppercase;
  color:#4edff2;font-weight:700;
}
.opp-tag::before {
  content:'';width:6px;height:6px;border-radius:50%;background:#4edff2;flex-shrink:0;
  box-shadow:0 0 6px #4edff2;
}
.opp-insight-title {
  font-size:clamp(20px,2.5vw,26px);font-weight:800;margin-bottom:14px;line-height:1.2;
  letter-spacing:-.3px;
}
.opp-insight-body  { font-size:14px;line-height:1.8;opacity:.72; }
.opp-insight-divider {
  margin-top:24px;height:1px;
  background:linear-gradient(90deg,rgba(78,223,242,.35),rgba(255,255,255,.06) 70%,transparent);
}

/* ──────────────────────────────────────────────
   SLIDE 10 — CIERRE
────────────────────────────────────────────── */
.close-wrap { flex-direction:column;text-align:center;align-items:center; }
.close-title {
  font-size: clamp(22px,3vw,40px);
  font-weight:800;line-height:1.08;
  letter-spacing:-.03em;color:var(--navy);margin-bottom:14px;
  text-align:center;
}
.close-title span { color:var(--blue); }

.close-quote {
  font-size:15px;font-style:italic;color:var(--muted);
  max-width:520px;line-height:1.65;margin:0 auto 28px;text-align:center;
}

.close-cta { display:flex;gap:12px;justify-content:center;flex-wrap:wrap; }
.btn-primary-solid {
  display:inline-block;text-decoration:none;
  padding:12px 30px;border-radius:32px;
  background:var(--blue);color:var(--white);
  font-family:var(--font);font-size:15px;font-weight:600;
  border:none;cursor:pointer;
  box-shadow:0 6px 24px rgba(0,123,255,.4);
  transition:all .2s;
}
.btn-primary-solid:hover {
  background:var(--blue-dk);
  box-shadow:0 8px 32px rgba(0,123,255,.55);
  transform:translateY(-2px);
}
.btn-outline-solid {
  display:inline-block;text-decoration:none;
  padding:12px 30px;border-radius:32px;
  background:var(--white);color:var(--navy);
  font-family:var(--font);font-size:15px;font-weight:600;
  border:1.5px solid var(--gray-200);cursor:pointer;
  box-shadow:0 2px 8px rgba(6,5,92,.08);
  transition:all .2s;
}
.btn-outline-solid:hover { border-color:var(--blue);color:var(--blue); }

.close-contact { margin-top:18px;font-size:13px;color:var(--muted);padding-bottom:8px; }
.close-contact a { color:var(--blue);text-decoration:none;font-weight:500; }

.live-badge {
  display:inline-flex;align-items:center;gap:8px;
  background:var(--white);border:1.5px solid var(--gray-200);
  border-radius:32px;padding:8px 18px;
  font-size:13px;font-weight:500;color:var(--text);
  box-shadow:0 2px 8px rgba(6,5,92,.06);margin-bottom:28px;
}
.live-dot {
  width:8px;height:8px;border-radius:50%;
  background:var(--green);flex-shrink:0;
  animation:live-pulse 2s ease-out infinite;
}
@keyframes live-pulse {
  0%   {box-shadow:0 0 0 0 rgba(34,197,94,.5);}
  70%  {box-shadow:0 0 0 8px rgba(34,197,94,0);}
  100% {box-shadow:0 0 0 0 rgba(34,197,94,0);}
}

/* ── LANGUAGE PICKER ── */
.lang-picker {
  position: fixed; top: 16px; right: 16px; z-index: 200;
}
.lang-picker select {
  appearance: none;
  background: var(--white);
  border: 1.5px solid var(--gray-200);
  border-radius: 10px;
  padding: 6px 32px 6px 12px;
  font-size: 13px; font-weight: 600;
  color: var(--navy);
  font-family: var(--font);
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(6,5,92,.08);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2306055c' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  transition: border-color .2s, box-shadow .2s;
}
.lang-picker select:hover { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0,123,255,.12); }
.lang-picker select:focus { outline: none; border-color: var(--blue); }

/* ── SLIDE SPINNER ── */
.slide-spinner {
  position: absolute; right: 56px; bottom: 56px;
  width: 72px; height: 72px;
  opacity: 0.18; pointer-events: none;
  z-index: 1;
}
@media (max-width: 767px) { .slide-spinner { display:none; } }

/* ── MOBILE HEADER SPACER ── */
.mobile-header-spacer {
  display: none;
  height: 56px;
}
@media (max-width: 767px) {
  .mobile-header-spacer { display: block; }
}

/* ── CS SLIDE 9 — LISTA DE ESPERA ── */
.cs-reason { display:flex; align-items:flex-start; gap:14px; }
.cs-reason-icon { font-size:22px; flex-shrink:0; line-height:1; margin-top:3px; }
.cs-reason-title { font-size:14px; font-weight:700; color:var(--text); margin-bottom:4px; }
.cs-reason-desc { font-size:13px; color:var(--muted); line-height:1.6; }
/* Video teaser */
.cs-video-wrap { width:100%; max-width:700px; margin:0 auto; }
.cs-video-box {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(6,5,92,.18);
  border: 1.5px solid var(--gray-200);
  aspect-ratio: 16/9;
  background: #000;
}
.cs-video-box video { width:100%; height:100%; object-fit:cover; display:block; }
.cs-preview-play-btn,
.cs-preview-mute-btn {
  position: absolute;
  bottom: 1.2rem;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 14px rgba(0,0,0,.15);
  transition: transform .2s ease, background .2s ease;
  z-index: 10;
}
.cs-preview-play-btn { right: 1.2rem; }
.cs-preview-mute-btn { right: 4.4rem; }
.cs-preview-fs-btn {
  position: absolute;
  top: 1.2rem;
  right: 1.2rem;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 14px rgba(0,0,0,.15);
  transition: transform .2s ease, background .2s ease;
  z-index: 10;
}
.cs-preview-fs-btn:hover { transform: scale(1.1); background: #fff; }
.cs-preview-fs-btn svg { width: 18px; height: 18px; color: #007bff; }
.cs-preview-play-btn:hover,
.cs-preview-mute-btn:hover { transform: scale(1.1); background: #fff; }
.cs-preview-play-btn svg,
.cs-preview-mute-btn svg { width: 18px; height: 18px; color: #007bff; }
.cs-video-caption { margin-top:16px; font-size:14px; color:var(--muted); }
.cs-form-row { display:flex; gap:8px; }
.cs-input {
  flex:1; padding:11px 14px; border-radius:10px;
  border:1.5px solid rgba(255,255,255,.18); background:rgba(255,255,255,.08);
  color:#fff; font-size:13px; font-family:inherit; outline:none;
  transition:border-color .2s;
}
.cs-input::placeholder { color:rgba(255,255,255,.35); }
.cs-input:focus { border-color:rgba(78,223,242,.55); }
.cs-btn {
  padding:11px 18px; border-radius:10px; border:none; cursor:pointer;
  background:#4edff2; color:#06055c; font-size:13px; font-weight:800;
  font-family:inherit; white-space:nowrap; transition:background .2s, transform .1s;
}
.cs-btn:hover { background:#82ecf7; }
.cs-btn:active { transform:scale(.97); }
.cs-btn:disabled { opacity:.6; cursor:not-allowed; }
.cs-success { font-size:13px; color:#4edff2; line-height:1.5; display:flex; align-items:center; gap:6px; }
.cs-counter { font-size:11px; color:rgba(255,255,255,.38); letter-spacing:.03em; }
.cs-counter strong { color:rgba(255,255,255,.62); }

/* ── WAITLIST FORM S10 — stacked limpio ── */
.wl-form { width:100%; max-width:400px; margin:24px auto 0; }
.wl-input-wrap { position:relative; margin-bottom:10px; }
.wl-input-clean {
  width:100%; box-sizing:border-box;
  padding:14px 44px 14px 16px; border-radius:12px;
  border:1.5px solid var(--gray-200); background:var(--white);
  color:var(--text); font-size:15px; font-family:inherit; outline:none;
  transition:border-color .2s, box-shadow .2s;
  box-shadow:0 1px 4px rgba(6,5,92,.06);
}
.wl-input-clean::placeholder { color:var(--muted); }
.wl-input-clean:focus { border-color:#4edff2; box-shadow:0 0 0 3px rgba(78,223,242,.12); }
.wl-input-clean.input-ok  { border-color:#4edff2; }
.wl-input-clean.input-err { border-color:#f87171; box-shadow:0 0 0 3px rgba(248,113,113,.12); }
.wl-email-ok {
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; border-radius:50%;
  background:#06055c; display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .22s, transform .22s;
  pointer-events:none;
}
.wl-email-ok.show { opacity:1; transform:translateY(-50%) scale(1.08); }
@keyframes wlShake {
  0%,100% { transform:translateX(0); }
  15%     { transform:translateX(-7px); }
  35%     { transform:translateX(7px); }
  55%     { transform:translateX(-5px); }
  75%     { transform:translateX(5px); }
}
.wl-input-clean.shake { animation:wlShake .38s ease; }
.wl-btn-clean {
  width:100%; padding:14px 24px; border-radius:12px;
  border:none; cursor:pointer;
  background:#06055c; color:#fff;
  font-size:15px; font-weight:700; font-family:inherit;
  box-shadow:0 4px 16px rgba(6,5,92,.22);
  transition:background .2s, transform .1s, box-shadow .2s;
}
.wl-btn-clean:hover { background:#1a1090; box-shadow:0 6px 22px rgba(6,5,92,.32); }
.wl-btn-clean:active { transform:scale(.98); }
.wl-btn-clean:disabled { opacity:.5; cursor:not-allowed; }
.wl-success-clean {
  display:flex; align-items:center; gap:8px; justify-content:center;
  font-size:14px; color:#06055c; font-weight:600; margin-top:14px;
}
.wl-counter-clean { font-size:12px; color:var(--muted); text-align:center; margin-top:10px; }
.wl-nospam { font-size:12px; color:var(--muted); text-align:center; margin-top:12px; }
@media (max-width:767px) { .cs-form-row { flex-direction:column; } }

/* ── S6C ── MÓDULOS SAPHIR ── */
@media (max-width:767px) {
  .slide[data-index="13"],
  .slide[data-index="8"]  { align-items:center; }
}
.cmods-grid {
  display:flex; flex-direction:column; gap:10px;
  width:100%; overflow:hidden;
}
.cmods-row { width:100%; overflow:hidden; }
.cmods-track {
  display:flex; gap:9px; width:max-content;
  will-change:transform;
}
.cmods-row-l .cmods-track { animation:marqueeLeft  38s linear infinite; }
.cmods-row-r .cmods-track { animation:marqueeRight 38s linear infinite; }
.cmods-row:hover .cmods-track { animation-play-state:paused; }
@keyframes marqueeLeft  { from { transform:translateX(0); }    to { transform:translateX(-50%); } }
@keyframes marqueeRight { from { transform:translateX(-50%); } to { transform:translateX(0); }    }
.cmods-card {
  flex:0 0 155px;
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(0,123,255,.12);
  border-radius:16px;
  padding:14px 13px 13px;
  position:relative; overflow:hidden;
  transition:transform .3s cubic-bezier(.22,.68,0,1.2), box-shadow .3s ease;
}
.cmods-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,var(--blue),var(--blue-dk));
  transform:scaleX(0); transition:transform .35s ease;
  border-radius:16px 16px 0 0;
}
.cmods-card:hover { transform:translateY(-4px); box-shadow:0 16px 40px rgba(0,123,255,.14); }
.cmods-card:hover::before { transform:scaleX(1); }
.cmods-icon {
  width:38px; height:38px; border-radius:11px;
  background:var(--blue-lt);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:.65rem; flex-shrink:0;
}
.cmods-icon svg { width:20px; height:20px; color:var(--blue); fill:currentColor; }
.cmods-title { font-weight:700; font-size:12.5px; color:var(--navy); line-height:1.3; }
.cmods-desc {
  font-size:10.5px; color:var(--muted); line-height:1.5; margin-top:4px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}

/* ── S6B ── PROTOCOLO SOS ── */
@keyframes sos-blob-float {
  0%   { transform:scale(1)   translate(0,0);      opacity:.32; }
  33%  { transform:scale(1.2) translate(12px,-8px); opacity:.16; }
  66%  { transform:scale(.88) translate(-6px,14px); opacity:.24; }
  100% { transform:scale(1)   translate(0,0);      opacity:.32; }
}
@keyframes sos-siren {
  0%,100% { opacity:.22; }
  50%      { opacity:.06; }
}
@keyframes sos-ring {
  0%   { transform:scale(1); opacity:.7; }
  100% { transform:scale(2.6); opacity:0; }
}
@keyframes sos-btn-glow {
  0%,100% { box-shadow:0 0 0 3px rgba(239,68,68,.4),0 4px 22px rgba(239,68,68,.5); }
  50%      { box-shadow:0 0 0 6px rgba(239,68,68,.6),0 8px 32px rgba(239,68,68,.9); }
}
@keyframes sos-screen-flash {
  0%,100% { opacity:0; }
  50%      { opacity:1; }
}
@keyframes sos-notif-in {
  from { opacity:0; transform:translateY(10px); }
  to   { opacity:1; transform:translateY(0); }
}
.slide[data-index="12"] {
  background:linear-gradient(135deg,#06030f 0%,#12040a 100%);
  overflow:hidden;
}
.slide[data-index="12"] .slide-title      { color:#fff; }
.slide[data-index="12"] .slide-title em   { color:#fca5a5; }
.slide[data-index="12"] .eyebrow          { color:#f87171; letter-spacing:3px; }
.slide[data-index="12"] .rule             { background:rgba(239,68,68,.6); }
/* blobs */
.sos-blob {
  position:absolute; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,rgba(239,68,68,.85) 0%,rgba(220,38,38,0) 68%);
}
.sos-blob-1 { width:480px;height:480px; top:-180px; right:-100px; animation:sos-blob-float 3.4s ease-in-out infinite; }
.sos-blob-2 { width:360px;height:360px; bottom:-120px; left:-80px; animation:sos-blob-float 2.9s ease-in-out infinite 1.2s; }
.sos-blob-3 { width:220px;height:220px; top:42%; left:36%; animation:sos-siren 1.6s ease-in-out infinite .4s; }
/* layout */
.sos-layout {
  display:flex; gap:28px; align-items:flex-start; width:100%; position:relative; z-index:1;
}
/* phone */
.sos-phone {
  flex:0 0 auto; width:188px;
  background:#0c0c16;
  border-radius:34px;
  border:2px solid rgba(255,255,255,.1);
  box-shadow:0 0 0 7px rgba(239,68,68,.07),0 24px 64px rgba(0,0,0,.55),0 0 50px rgba(239,68,68,.18);
  padding:14px 12px 18px;
  position:relative; overflow:hidden;
}
.sos-phone::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 50% 0%,rgba(239,68,68,.14) 0%,transparent 60%);
  animation:sos-screen-flash 1.6s ease-in-out infinite;
  pointer-events:none;
}
.sos-phone > * { position:relative; z-index:1; }
.sos-phone-bar {
  display:flex; justify-content:space-between;
  font-size:9.5px; color:rgba(255,255,255,.45); margin-bottom:9px; padding:0 3px;
}
.sos-loc-chip {
  display:flex; align-items:center; gap:5px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1);
  border-radius:20px; padding:3px 9px;
  font-size:9.5px; color:rgba(255,255,255,.7); margin-bottom:10px;
}
.sos-loc-dot { width:5px;height:5px;border-radius:50%;background:#4ade80;box-shadow:0 0 6px #4ade80;flex-shrink:0; }
.sos-num-detected { text-align:center; margin-bottom:12px; }
.sos-num-label {
  display:block; font-size:8.5px; color:rgba(255,255,255,.38);
  text-transform:uppercase; letter-spacing:.06em; margin-bottom:1px;
}
.sos-num-val {
  display:block; font-size:38px; font-weight:800; color:#fff; line-height:1;
  text-shadow:0 0 24px rgba(239,68,68,.85);
}
/* sos button */
.sos-btn-wrap {
  position:relative; display:flex; align-items:center; justify-content:center;
  height:84px; margin-bottom:10px;
}
.sos-ring {
  position:absolute; border-radius:50%;
  background:rgba(239,68,68,.28); pointer-events:none;
  width:54px; height:54px;
}
.sos-ring-1 { animation:sos-ring 2s ease-out infinite; }
.sos-ring-2 { animation:sos-ring 2s ease-out infinite .67s; }
.sos-ring-3 { animation:sos-ring 2s ease-out infinite 1.34s; }
.sos-btn-ph {
  position:relative; z-index:2;
  width:54px; height:54px; border-radius:50%;
  background:linear-gradient(145deg,#ef4444,#b91c1c);
  color:#fff; font-size:13px; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  cursor:default; letter-spacing:.04em;
  animation:sos-btn-glow 1.6s ease-in-out infinite;
}
/* notifications */
.sos-notif {
  display:flex; align-items:center; gap:8px;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1);
  border-radius:10px; padding:6px 9px; margin-bottom:5px;
  font-size:10.5px; color:#fff;
}
.sos-notif-em-icon { font-size:14px; flex-shrink:0; }
.sos-notif-title  { font-weight:600; line-height:1.2; }
.sos-notif-sub    { font-size:9px; color:rgba(255,255,255,.45); margin-top:1px; }
.sos-n-wa { border-color:rgba(37,211,102,.25); animation:sos-notif-in .35s ease both; }
.sos-n-em { border-color:rgba(59,130,246,.25);  animation:sos-notif-in .35s ease both .18s; }
.sos-n-vc { border-color:rgba(239,68,68,.3);    animation:sos-notif-in .35s ease both .36s; }
.sos-phone-home { width:44px;height:4px;border-radius:2px;background:rgba(255,255,255,.15);margin:6px auto 0; }
/* protocol steps */
.sos-protocol { flex:1; display:flex; flex-direction:column; gap:10px; }
.sos-step {
  display:flex; gap:11px; align-items:flex-start;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.07);
  border-left:3px solid rgba(239,68,68,.55);
  border-radius:12px; padding:11px 13px;
}
.sos-step-icon {
  font-size:18px; width:34px; height:34px; flex-shrink:0;
  background:rgba(239,68,68,.1); border-radius:9px;
  display:flex; align-items:center; justify-content:center;
}
.sos-step-title { font-size:12.5px; font-weight:700; color:#fff; margin-bottom:3px; }
.sos-step-desc  { font-size:11.5px; color:rgba(255,255,255,.55); line-height:1.45; }
.sos-channels { display:flex; gap:5px; flex-wrap:wrap; margin-top:7px; }
.sos-ch {
  display:inline-flex; align-items:center; gap:4px;
  border-radius:20px; padding:3px 9px; font-size:10.5px; font-weight:600;
}
.sos-ch-wa { background:rgba(37,211,102,.1); color:#4ade80; border:1px solid rgba(37,211,102,.22); }
.sos-ch-em { background:rgba(59,130,246,.1); color:#93c5fd; border:1px solid rgba(59,130,246,.22); }
.sos-ch-vc { background:rgba(239,68,68,.1);  color:#fca5a5; border:1px solid rgba(239,68,68,.22); }
.sos-langs { display:flex; gap:4px; flex-wrap:wrap; margin-top:7px; }
/* QR offline inside phone */
@keyframes sos-qr-pulse { 0%,100%{box-shadow:0 0 0 2px rgba(255,255,255,.1);} 50%{box-shadow:0 0 0 4px rgba(255,255,255,.04);} }
.sos-qr-offline-card {
  display:flex; align-items:center; gap:7px;
  background:rgba(255,255,255,.06);
  border:1px dashed rgba(255,255,255,.2);
  border-radius:8px; padding:5px 7px; margin-top:5px;
}
.sos-qr-mini-svg {
  width:30px; height:30px; flex-shrink:0;
  background:#fff; border-radius:3px; padding:2px;
  animation:sos-qr-pulse 2.5s ease-in-out infinite;
}
.sos-qr-offline-info { min-width:0; }
.sos-qr-offline-title { font-size:9px; font-weight:700; color:rgba(255,255,255,.82); line-height:1.2; }
.sos-qr-offline-sub   { font-size:7.5px; color:rgba(255,255,255,.38); margin-top:1px; line-height:1.3; }

.sos-offline-note {
  display:inline-flex; align-items:center; gap:5px; margin-top:8px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
  border-radius:20px; padding:3px 10px;
  font-size:9.5px; color:rgba(255,255,255,.38); letter-spacing:.03em;
  font-style:italic;
}
.sos-offline-note svg { color:rgba(255,255,255,.3); flex-shrink:0; }
.sos-langs span {
  background:rgba(255,255,255,.07); color:rgba(255,255,255,.65);
  border:1px solid rgba(255,255,255,.12); border-radius:5px;
  padding:2px 7px; font-size:9.5px; font-weight:700; letter-spacing:.04em;
}
.sos-slide-inner { position:relative; z-index:1; }
@media (max-width:700px) {
  .sos-layout { flex-direction:column; align-items:center; }
  .sos-phone  { width:172px; }
  .sos-num-val { font-size:30px; }
}

/* ── S7B ── SAPHIR PETS ── */
:root { --pets-green:#059669; --pets-lt:#d1fae5; --pets-mid:#ecfdf5; }
.pets-badge {
  display:inline-flex; align-items:center; gap:6px;
  background:var(--pets-lt); color:var(--pets-green);
  border:1.5px solid rgba(5,150,105,.25); border-radius:20px;
  padding:4px 14px; font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.07em; margin-bottom:10px;
}
.pets-hero {
  display:flex; gap:24px; align-items:stretch; width:100%;
  margin-top:4px;
}
.pets-visual {
  flex:0 0 auto; width:clamp(120px,18vw,180px);
  background:linear-gradient(140deg,var(--pets-lt) 0%,var(--blue-lt) 100%);
  border:1.5px solid rgba(5,150,105,.2); border-radius:20px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; padding:20px 12px;
}
.pets-visual-icon { font-size:clamp(40px,6vw,64px); line-height:1; }
.pets-visual-label {
  font-size:11px; font-weight:700; color:var(--pets-green);
  text-transform:uppercase; letter-spacing:.07em; text-align:center;
}
.pets-features {
  flex:1; display:grid; grid-template-columns:1fr 1fr; gap:10px;
  align-content:start;
}
.pets-feat {
  display:flex; align-items:flex-start; gap:10px;
  background:var(--white); border:1px solid var(--gray-200);
  border-radius:12px; padding:12px 14px;
  box-shadow:0 2px 8px rgba(6,5,92,.05);
  transition:border-color .2s, box-shadow .2s;
}
.pets-feat:hover { border-color:rgba(5,150,105,.3); box-shadow:0 4px 16px rgba(5,150,105,.1); }
.pets-feat-icon {
  width:36px; height:36px; flex-shrink:0; border-radius:10px;
  background:var(--pets-mid); border:1px solid rgba(5,150,105,.2);
  display:flex; align-items:center; justify-content:center; font-size:17px;
}
.pets-feat-title { font-size:13px; font-weight:700; color:var(--navy); margin-bottom:2px; }
.pets-feat-desc  { font-size:11.5px; color:var(--muted); line-height:1.45; }
.pets-qr-note {
  margin-top:10px; display:flex; align-items:center; gap:8px;
  font-size:12px; color:var(--muted);
}
.pets-qr-dot { width:6px; height:6px; border-radius:50%; background:var(--pets-green); flex-shrink:0; }
@media (max-width:700px) {
  .pets-hero { flex-direction:column; }
  .pets-visual { width:100%; flex-direction:row; padding:14px 20px; }
  .pets-features { grid-template-columns:1fr; }
}

/* ── S9-TEAM ── EQUIPO ── */
.team-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
  width:100%; max-width:720px; margin:0 auto;
}
.team-card {
  min-width:0; max-width:none;
  background:var(--white); border:1px solid var(--gray-200);
  border-radius:14px; padding:18px 14px 16px; text-align:center;
  box-shadow:var(--shadow);
  transition:transform .2s, box-shadow .2s, border-color .2s;
}
.team-card:hover {
  transform:translateY(-4px);
  box-shadow:var(--shadow-lg);
  border-color:rgba(0,123,255,.2);
}
.team-avatar {
  width:72px; height:72px; border-radius:50%;
  background:linear-gradient(135deg,var(--blue-lt) 0%,rgba(0,123,255,.18) 100%);
  border:2px solid var(--gray-200);
  margin:0 auto 12px; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.team-avatar img { width:100%; height:100%; object-fit:cover; display:block; -webkit-user-drag:none; user-select:none; pointer-events:none; }
.team-avatar-ph {
  font-size:26px; opacity:.45; user-select:none; pointer-events:none;
}
.team-role {
  display:inline-block; font-size:10px; font-weight:700;
  text-transform:uppercase; letter-spacing:.08em;
  color:var(--blue); background:var(--blue-mid);
  border-radius:20px; padding:3px 10px; margin-bottom:6px;
}
.team-name {
  font-size:14px; font-weight:700; color:var(--navy);
  margin-bottom:6px; line-height:1.3;
}
.team-desc {
  font-size:12px; color:var(--muted); line-height:1.55;
}
@media (max-width:1024px) {
  .team-grid { grid-template-columns:repeat(4,1fr); max-width:900px; }
}
@media (max-width:800px) {
  .team-grid { grid-template-columns:repeat(3,1fr); max-width:720px; }
}
@media (max-width:600px) {
  .team-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:440px) {
  .team-grid { grid-template-columns:1fr; }
  .team-avatar { width:60px; height:60px; }
}

/* ── CS FEAT CARDS (S9 columna derecha) ── */
.cs-feat-cards { display:flex; flex-direction:column; gap:14px; }
.cs-feat-card {
  display:flex; align-items:flex-start; gap:16px;
  padding:20px 22px; border-radius:14px;
  background:linear-gradient(135deg,rgba(6,5,92,.07) 0%,rgba(26,16,144,.05) 100%);
  border:1.5px solid rgba(78,223,242,.18);
  border-left:3px solid rgba(78,223,242,.55);
  transition:background .2s, border-color .2s;
}
.cs-feat-card:hover {
  background:linear-gradient(135deg,rgba(6,5,92,.13) 0%,rgba(26,16,144,.1) 100%);
  border-color:rgba(78,223,242,.38);
  border-left-color:#4edff2;
}
.cs-feat-icon {
  width:40px; height:40px; flex-shrink:0; border-radius:10px;
  background:rgba(78,223,242,.1); border:1px solid rgba(78,223,242,.22);
  display:flex; align-items:center; justify-content:center;
  font-size:18px; line-height:1;
}
.cs-feat-title { font-size:14px; font-weight:700; color:var(--text); margin-bottom:4px; }
.cs-feat-desc  { font-size:13px; color:var(--muted); line-height:1.6; }
.cs-feat-badge {
  display:inline-flex; align-items:center; gap:5px; margin-top:8px;
  background:rgba(78,223,242,.08); border:1px solid rgba(78,223,242,.2);
  border-radius:20px; padding:2px 10px;
  font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:#4edff2;
}