/* Custom styles & utilidades complementando Tailwind */
:root {
  --grad-brand: linear-gradient(135deg,#0891b2,#0f766e,#082f49); /* teal -> deep */
  --orange-primary: #e4552d; /* naranja del logo */
  --orange-light: #f97316; 
}

html {scroll-padding-top: 6rem;}

/* Loading Screen */
#loadingScreen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Chat input mejorado */
#chatInput {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

#chatInput:focus {
  box-shadow: 0 4px 16px rgba(20, 184, 166, 0.2);
  transform: translateY(-1px);
}

/* Selector de escenarios mejorado */
#scenarioSelect {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

#scenarioSelect:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

#scenarioSelect:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.3);
}

/* Textarea del chat */
#chatInput {
  scrollbar-width: thin;
}
#chatInput::-webkit-scrollbar {
  width: 6px;
}
#chatInput::-webkit-scrollbar-track {
  background: transparent;
}
#chatInput::-webkit-scrollbar-thumb {
  background: #94a3b8;
  border-radius: 4px;
}
#chatInput::-webkit-scrollbar-thumb:hover {
  background: #64748b;
}

/* Chat responsive */
#chatWindow{ z-index: 60; }
@media (max-width: 768px){
  #chatWindow{ border-radius: 0 !important; border-left: 0; border-right: 0; border-bottom: 0; }
  #chatWidget{ right: 1rem; bottom: 1rem; }
  /* Header fijo y área de mensajes scrolleable */
  #chatWindow > .bg-gradient-to-r{ position: sticky; top: 0; z-index: 2; padding-top: calc(max(env(safe-area-inset-top), 0.5rem) + 18px); }
  /* padding-bottom dinámico vía JS; sin hardcode */
  #chatMessages{ padding-bottom: 0 !important; }
}

/* Badge IA demo */
.ia-badge-small {
  font-size: 10px;
  letter-spacing: .05em;
  background: rgba(45,212,191,.15);
  color: #5eead4;
  padding: 3px 8px;
  border-radius: 6px;
  border: 1px solid rgba(45,212,191,.4);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-weight: 600;
  text-transform: uppercase;
}

/* Markdown dentro de mensajes */
.prose-sm h1,.prose-sm h2,.prose-sm h3,.prose-sm h4 {color:#0f766e; font-weight:600; margin-top:.75rem; margin-bottom:.35rem; line-height:1.2;}
.prose-sm p {margin:0 0 .5rem 0;}
.prose-sm ul {list-style:disc; padding-left:1.1rem; margin:.4rem 0 .6rem;}
.prose-sm li {margin: .2rem 0;}
/* Por defecto en fondos claros */
.prose-sm code.md-inline-code {background:#f1f5f9; color:#0f172a; padding:2px 5px; border-radius:4px; font-size:.75rem;}
.prose-sm pre.md-code {background:#0f172a; color:#f1f5f9; padding:.75rem .9rem; border-radius:.75rem; overflow:auto; font-size:.7rem; line-height:1.3; border:1px solid #1e293b;}
.prose-sm a.md-link {color:#0d9488; text-decoration:underline;}
.prose-sm a.md-link:hover {color:#115e59;}
/* Evitar forzar negro: heredar del contexto (claro u oscuro) */
.prose-sm strong {color:inherit;}
/* Tablas GFM básicas */
.prose-sm table {width:100%; border-collapse:collapse; margin:.75rem 0; font-size:.85rem;}
.prose-sm thead th {text-align:left; font-weight:600; padding:.5rem .6rem; border-bottom:1px solid #e2e8f0; color:inherit;}
.prose-sm tbody td {padding:.45rem .6rem; border-bottom:1px solid #e2e8f0; color:inherit;}
/* Asegurar ajuste de líneas en celdas largas */
.prose-sm th, .prose-sm td { white-space: normal; word-break: break-word; }
/* En contenedores pequeños (chat), permitir scroll horizontal de tablas */
.chat-md table { display:block; overflow-x:auto; font-size:.78rem; }
.chat-md thead th { padding:.35rem .5rem; font-weight:600; }
.chat-md tbody td { padding:.3rem .5rem; }
.chat-md th, .chat-md td { line-height:1.2; }
.chat-md code.md-inline-code { font-size:.72rem; }
.chat-md pre.md-code { max-width: 100%; overflow:auto; font-size:.72rem; }

/* Overrides específicos para el panel de resultados IA (fondo oscuro) */
#aiResults { color:#fff; }
#aiResults .prose-sm h1,
#aiResults .prose-sm h2,
#aiResults .prose-sm h3,
#aiResults .prose-sm h4,
#aiResults .prose-sm h5,
#aiResults .prose-sm h6,
#aiResults .prose-sm p,
#aiResults .prose-sm li,
#aiResults .prose-sm strong,
#aiResults .prose-sm em { color:#fff !important; }
#aiResults .prose-sm ul { list-style:disc; padding-left:1.1rem; }
#aiResults .prose-sm a.md-link { color:#5eead4; }
#aiResults .prose-sm a.md-link:hover { color:#99f6e4; }
#aiResults .prose-sm code.md-inline-code { background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.12); }
#aiResults .prose-sm pre.md-code { background:#0f172a; color:#f1f5f9; border-color:#334155; }
/* Tablas en oscuro */
#aiResults .prose-sm thead th { border-bottom:1px solid rgba(255,255,255,.2); }
#aiResults .prose-sm tbody td { border-bottom:1px solid rgba(255,255,255,.12); }
#aiResults .prose-sm table { background:transparent; }
/* Scroll horizontal si la tabla supera el ancho */
#aiResults .prose-sm table { display:block; overflow-x:auto; }

@media (prefers-reduced-motion:no-preference) {
  [data-animate]{
    opacity:0;transform:translateY(25px);transition:opacity .7s ease,transform .7s ease;
  }
  [data-animate].in-view{opacity:1;transform:none;}
}

/* Slider */
/* Fuerza slider a ancho completo */
.slider {
  position: relative;
  width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  overflow: hidden;
}

.slides {
  position: relative;
  width: 100%;
  height: 100vh; /* Altura desktop */
}

/* Fuerza visibilidad para que Tailwind (grid) no pise display */
.slides .slide{
  display:none !important; 
  min-height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
}
.slides .slide.active{
  display:flex !important; 
  align-items: center;
  position: relative;
  opacity: 1;
}

/* Móvil: reducir altura del slider para evitar scroll excesivo */
@media (max-width: 640px){
  .slides{ height: 82vh; }
  .slides .slide{ min-height: 82vh; }
}

/* Tarjeta IA simplificada */
.ai-card{
  position:relative;
  padding:1.6rem 1.65rem 1.5rem;
  border-radius:1.5rem;
  background:linear-gradient(160deg,#0f172a 0%,#12324c 55%,#0f766e 120%);
  border:1px solid rgba(148,163,184,.18);
  color:#e2e8f0;
  box-shadow:0 20px 50px -28px rgba(15,23,42,.65);
  display:flex;
  flex-direction:column;
  gap:1.05rem;
}
.ai-card__header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;}
.ai-card__title{font-size:1.15rem;font-weight:700;color:#f8fafc;letter-spacing:-.01em;}
.ai-card__subtitle{text-transform:uppercase;font-size:.65rem;letter-spacing:.35em;color:rgba(191,219,254,.75);margin-top:.35rem;}
.ai-card__status{display:inline-flex;align-items:center;gap:.45rem;font-size:.75rem;color:#a5f3fc;font-weight:500;}
.ai-card__status-dot{width:.5rem;height:.5rem;border-radius:999px;background:#34d399;box-shadow:0 0 0 4px rgba(52,211,153,.18);}
.ai-card__status-dot--small{width:.4rem;height:.4rem;box-shadow:none;}
.ai-card__badges{display:flex;flex-wrap:wrap;gap:.6rem;font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:#cbd5f5;}
.ai-card__badges span{padding:.35rem .8rem;border-radius:999px;background:rgba(15,23,42,.4);border:1px solid rgba(148,163,184,.25);}
.ai-card__content{display:flex;flex-wrap:wrap;gap:1.25rem;align-items:stretch;}
.ai-card__metric{flex:1 1 220px;text-align:center;background:rgba(15,23,42,.32);border-radius:1.25rem;padding:1.15rem 1.1rem;border:1px solid rgba(148,163,184,.15);display:flex;flex-direction:column;align-items:center;gap:.9rem;min-width:220px;}
.ai-card__ring{position:relative;width:6.2rem;height:6.2rem;border-radius:50%;background:conic-gradient(#34d399 0deg 300deg,rgba(15,23,42,.35) 300deg 360deg);display:flex;align-items:center;justify-content:center;}
.ai-card__ring::before{content:"";position:absolute;inset:13px;border-radius:50%;background:radial-gradient(circle at 60% 40%,rgba(52,211,153,.25),rgba(15,23,42,.85) 65%);border:1px solid rgba(148,163,184,.22);box-shadow:0 0 0 3px rgba(15,23,42,.6),0 4px 12px -4px rgba(15,23,42,.8);}
.ai-card__ring div{position:relative;display:flex;flex-direction:column;align-items:center;gap:.25rem;transform:translateY(2px);} 
.ai-card__ring span{font-size:1.55rem;font-weight:700;color:#f8fafc;text-shadow:0 1px 2px rgba(0,0,0,.6);} 
.ai-card__ring small{text-transform:uppercase;font-size:.5rem;letter-spacing:.28em;color:rgba(191,219,254,.7);} 
.ai-card__stats{list-style:none;margin:0;padding:0;display:flex;justify-content:space-between;gap:.85rem;width:100%;font-size:.72rem;color:rgba(226,232,240,.85);}
.ai-card__stats li{flex:1;display:flex;flex-direction:column;gap:.25rem;background:rgba(15,23,42,.4);padding:.7rem;border-radius:.75rem;border:1px solid rgba(148,163,184,.18);}
.ai-card__stats span{font-size:.95rem;font-weight:700;color:#e0f2fe;}
.ai-card__stats small{font-size:.62rem;color:rgba(148,163,184,.82);}
.ai-card__stats--stack{flex-direction:column;gap:.5rem;}
.ai-card__stats--stack li{flex:none;flex-direction:row;align-items:center;gap:1rem;padding:.55rem .75rem;border-radius:.65rem;background:rgba(15,23,42,.5);} 
.ai-card__stats--stack li span{min-width:3.2rem;text-align:right;font-size:.85rem;}
.ai-card__stats--stack li small{flex:1;font-size:.6rem;letter-spacing:.03em;}
.ai-card__pipeline{flex:1 1 250px;background:rgba(15,23,42,.32);border-radius:1.15rem;padding:1.05rem 1.1rem;border:1px solid rgba(148,163,184,.15);display:flex;flex-direction:column;gap:.65rem;min-width:240px;}
.ai-card__pipeline h5{font-size:.83rem;font-weight:600;color:#cbd5f5;margin:0;letter-spacing:.02em;}
.ai-card__pipeline ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.75rem;font-size:.76rem;color:#e2e8f0;}
.ai-card__pipeline li{display:flex;align-items:flex-start;gap:.6rem;background:rgba(15,23,42,.45);padding:.7rem;border-radius:.85rem;border:1px solid rgba(148,163,184,.2);}
.ai-card__step-index{width:1.8rem;height:1.8rem;border-radius:.65rem;background:linear-gradient(135deg,#7c3aed,#22d3ee);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;color:#fff;flex-shrink:0;box-shadow:0 6px 14px -8px rgba(124,58,237,.6);}
.ai-card__step-copy{display:flex;flex-direction:column;gap:.35rem;flex:1;}
.ai-card__step-copy span{font-weight:600;color:#f8fafc;font-size:.78rem;letter-spacing:.01em;}
.ai-card__step-copy small{font-size:.66rem;color:rgba(203,213,225,.78);line-height:1.3;}
.ai-card__chip{align-self:flex-start;margin-top:.15rem;padding:.28rem .55rem;border-radius:.65rem;background:rgba(15,118,110,.28);border:1px solid rgba(45,212,191,.35);font-size:.6rem;color:#ccfbf1;letter-spacing:.12em;text-transform:uppercase;}
.ai-card__foot{font-size:.7rem;color:rgba(191,219,254,.8);display:flex;align-items:center;gap:.4rem;margin-top:.5rem;}

@media (max-width:768px){
  .ai-card{padding:1.75rem;}
  .ai-card__content{flex-direction:column;}
  .ai-card__stats{flex-direction:column;}
}
@media (max-width:640px){
  .ai-card__header{flex-direction:column;align-items:flex-start;}
  .ai-card__status{font-size:.7rem;}
  .ai-card__badges{gap:.4rem;}
}

/* Dots del slider */
#sliderDots .dot{width:.75rem;height:.75rem;border-radius:9999px;background:rgba(255,255,255,.4);border:1px solid rgba(255,255,255,.5);transition:transform .2s ease,background .2s ease;}
#sliderDots .dot.active{background:#fff;transform:scale(1.1);} 

/* Posición de controles del slider en móvil */
@media (max-width:640px){
  /* El contenedor ya está en bottom-8; agregamos margen seguro */
  .slider [aria-label="Cambiar slide"]{ margin-bottom: max(env(safe-area-inset-bottom), 16px); }
  /* Reducir tamaño de dots y botones en móvil */
  #sliderDots .dot{ width:.6rem; height:.6rem; }
  .btn-nav{ padding:.35rem .55rem; font-size:.85rem; }
  .slider-controls{ bottom: calc(1rem + max(env(safe-area-inset-bottom), 12px)); }
  /* Evitar que el botón flotante de chat tape los controles en móvil estrecho */
  #chatWidget{ bottom: 1.25rem; right: 1rem; }
}

/* Botones reutilizables (sin @apply para compatibilidad CDN) */
.btn-primary{display:inline-flex;align-items:center;gap:.5rem;background:#0d9488;color:#fff;padding:.9rem 1.5rem;border-radius:0.9rem;box-shadow:0 6px 16px -4px rgba(0,0,0,.25),0 0 0 1px rgba(13,148,136,.4);font-weight:600;font-size:.85rem;letter-spacing:.5px;transition:.25s;background-image:linear-gradient(to bottom right,#0d9488,#0f766e);} 
.btn-primary:hover{background:#0f766e;}
.btn-primary:focus{outline:none;box-shadow:0 0 0 4px rgba(45,212,191,.4);} 
.btn-outline{display:inline-flex;align-items:center;gap:.5rem;border:1px solid rgba(148,163,184,.7);color:#1e293b;padding:.9rem 1.5rem;border-radius:0.9rem;font-weight:600;font-size:.85rem;letter-spacing:.5px;transition:.25s;background:rgba(255,255,255,.6);backdrop-filter:blur(4px);} 
#hero .btn-outline{color:#fff;border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.1);} 
.btn-outline:hover{background:rgba(15,118,110,.08);color:#0f172a;} 
#hero .btn-outline:hover{background:rgba(255,255,255,.2);color:#fff;} 
.btn-outline:focus{outline:none;box-shadow:0 0 0 4px rgba(45,212,191,.4);} 
.btn-nav{padding:.5rem .75rem;border-radius:.6rem;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2);font-size:.8rem;}
.btn-nav:hover{background:rgba(255,255,255,.2);} 

.section{padding-top:6rem;padding-bottom:6rem;max-width:80rem;margin-inline:auto;padding-left:1.5rem;padding-right:1.5rem;}
@media (min-width:768px){.section{padding-left:2rem;padding-right:2rem;}}
.section-head{max-width:48rem;margin:0 auto 3.5rem;text-align:center;}
.title-section{font-size:2rem;font-weight:800;line-height:1.15;letter-spacing:-.02em;color:#0f172a;}@media (min-width:768px){.title-section{font-size:2.5rem;}}
.subtitle{margin-top:1rem;font-size:1.125rem;color:#475569;}

/* Servicios mejorados con iconos */
.service-card{position:relative;padding:2rem;border-radius:1.5rem;background:#fff;box-shadow:0 4px 20px -4px rgba(0,0,0,.1);border:1px solid #e2e8f0;transition:.4s;overflow:hidden;}
.service-card:hover{transform:translateY(-8px);box-shadow:0 12px 40px -8px rgba(13,148,136,.25);} 
.service-card.featured{background:linear-gradient(135deg,#0d9488,#0f766e);color:#fff;border:1px solid #0d9488;} 
.service-card.featured:hover{box-shadow:0 12px 40px -8px rgba(13,148,136,.4);} 
.service-icon{display:inline-flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;border-radius:1rem;background:linear-gradient(135deg,#0d9488,#0f766e);color:#fff;margin-bottom:1.5rem;box-shadow:0 4px 14px -4px rgba(13,148,136,.4);}
.service-card.featured .service-icon{background:rgba(255,255,255,.15);color:#fff;} 
.service-card h3{font-weight:700;font-size:1.25rem;margin-bottom:1rem;color:#0f172a;} 
.service-card.featured h3{color:#fff;} 
.service-card p{font-size:.9rem;line-height:1.5;color:#475569;margin-bottom:1.5rem;} 
.service-card.featured p{color:#ccfbf1;}
.service-badge{position:absolute;top:1rem;right:1rem;background:var(--orange-primary);color:#fff;font-size:.65rem;font-weight:700;padding:.25rem .75rem;border-radius:999px;letter-spacing:.5px;}
.service-badge.premium{background:linear-gradient(135deg,var(--orange-primary),var(--orange-light));animation:pulse 2s infinite;}

/* Nuevos estilos para servicios mejorados */
.service-features{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0;}
.feature-tag{background:rgba(255,255,255,.2);color:#fff;font-size:.7rem;font-weight:600;padding:.3rem .6rem;border-radius:.5rem;border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(4px);}
.service-card:not(.featured) .feature-tag{background:rgba(13,148,136,.1);color:#0d9488;border:1px solid rgba(13,148,136,.2);}

/* Gradientes específicos para iconos de servicios destacados */
.service-icon.bg-gradient-to-br{border-radius:1rem;box-shadow:0 4px 14px -4px rgba(0,0,0,.2);}

/* ESTILOS MEJORADOS PARA SERVICIOS DESTACADOS */
.premium-glow{position:relative;overflow:visible;box-shadow:0 8px 32px -8px rgba(13,148,136,.3);}
.premium-glow:hover{transform:translateY(-6px);box-shadow:0 16px 48px -12px rgba(13,148,136,.4);}

.service-header-decoration{position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,rgba(255,255,255,.3),rgba(255,255,255,.1),rgba(255,255,255,.3));border-radius:1.5rem 1.5rem 0 0;}
.service-header-decoration.emerald{background:linear-gradient(90deg,rgba(16,185,129,.6),rgba(6,182,212,.4),rgba(16,185,129,.6));}
.service-header-decoration.purple{background:linear-gradient(90deg,rgba(139,92,246,.6),rgba(6,182,212,.4),rgba(139,92,246,.6));}

.premium-pulse{animation:none;transition:all 0.3s ease;}
.premium-pulse:hover{transform:scale(1.05);}

.premium-title{color:#fff !important;font-size:1.25rem !important;font-weight:700 !important;margin-bottom:1.2rem !important;text-shadow:0 2px 4px rgba(0,0,0,.3);}

.enhanced-description{font-size:.9rem !important;line-height:1.6 !important;margin-bottom:1.2rem !important;color:rgba(255,255,255,.9) !important;}

.enhanced-features{margin:1.2rem 0 1.5rem 0 !important;}
.premium-tag{background:rgba(255,255,255,.2) !important;border:1px solid rgba(255,255,255,.3) !important;font-weight:600 !important;color:#fff !important;}

.service-stats{display:flex;gap:1.5rem;margin:1.5rem 0 1rem 0;padding:1rem 0;border-top:1px solid rgba(255,255,255,.2);}
.stat-item{text-align:center;flex:1;}
.stat-number{display:block;font-size:1.4rem;font-weight:800;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.3);}
.stat-label{font-size:.65rem;color:rgba(255,255,255,.8);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-top:.2rem;}

.glow-effect{animation:none;}
.service-badge.glow-effect{box-shadow:0 2px 8px rgba(228,85,45,.4);}
.service-badge.glow-effect:hover{box-shadow:0 4px 12px rgba(228,85,45,.6);}

.mockup-card{border-radius:1.25rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(6px);padding:3rem;text-align:center;color:#fff;font-size:1.4rem;font-weight:600;box-shadow:0 10px 25px -8px rgba(0,0,0,.6);animation:float 6s ease-in-out infinite;}
@keyframes float {0%,100%{transform:translateY(0);}50%{transform:translateY(-14px);} }

.ia-block{padding:2rem;border-radius:1.25rem;background:rgba(30,41,59,.55);border:1px solid #334155;backdrop-filter:blur(4px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);} 
.ia-block h3{font-size:1.25rem;font-weight:600;margin-bottom:.75rem;color:#fff;} 
.ia-block p{color:#cbd5e1;font-size:.85rem;line-height:1.5;}

/* Precios mejorados */
.price-card{position:relative;padding:2.5rem 2rem;margin-top:1.5rem;border-radius:1.5rem;background:#fff;display:flex;flex-direction:column;border:1px solid #e2e8f0;box-shadow:0 8px 25px -8px rgba(0,0,0,.12);transition:.4s;overflow:visible;} 
.price-card:hover{transform:translateY(-6px);box-shadow:0 20px 40px -12px rgba(0,0,0,.18);} 
.price-card.popular{outline:3px solid #14b8a6;transform:scale(1.05);background:linear-gradient(145deg,#fff 0%,#f0fdfa 100%);} 
.price-card.popular:hover{transform:scale(1.05) translateY(-6px);} 
.price-card.enterprise{border:2px solid var(--orange-primary);background:linear-gradient(145deg,#fff 0%,#fff7ed 100%);} 
.price-card .badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:#0d9488;color:#fff;font-size:.7rem;font-weight:700;padding:.4rem 1rem;border-radius:999px;letter-spacing:.5px;box-shadow:0 4px 12px -2px rgba(13,148,136,.4);z-index:10;} 
.enterprise-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--orange-primary);color:#fff;font-size:.7rem;font-weight:700;padding:.4rem 1rem;border-radius:999px;letter-spacing:.5px;box-shadow:0 4px 12px -2px rgba(228,85,45,.4);z-index:10;} 
.price-header{text-align:center;margin-bottom:2rem;} 
.price-card .plan{font-size:1.5rem;font-weight:800;margin-bottom:1rem;color:#0f172a;} 
.price-display{display:flex;align-items:baseline;justify-content:center;gap:.25rem;} 
.currency{font-size:1.5rem;font-weight:600;color:#64748b;} 
.amount{font-size:3rem;font-weight:900;color:#0d9488;} 
.price-card.enterprise .amount{color:var(--orange-primary);} 
.period{font-size:1rem;color:#64748b;} 
.features{flex:1;margin-bottom:2rem;font-size:.85rem;color:#475569;display:flex;flex-direction:column;gap:.75rem;list-style:none;padding:0;} 
.features li{display:flex;align-items:flex-start;gap:.75rem;} 
.check{color:#0d9488;font-weight:bold;flex-shrink:0;} 
.btn-price{display:inline-flex;justify-content:center;align-items:center;background:#0d9488;color:#fff;font-weight:700;font-size:.9rem;padding:1rem 1.5rem;border-radius:1rem;transition:.25s;letter-spacing:.5px;box-shadow:0 4px 14px -4px rgba(13,148,136,.4);} 
.btn-price:hover{background:#0f766e;transform:translateY(-2px);box-shadow:0 8px 20px -4px rgba(13,148,136,.5);} 

/* =============================
   Servicios: contraste + WOW
   ============================= */
/* Mejorar contraste general en tarjetas destacadas */
.service-card.featured{ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.service-card.featured h3{ color:#fff !important; text-shadow:0 1px 2px rgba(0,0,0,.35); }
.service-card.featured p{ color:rgba(255,255,255,.97) !important; text-shadow:0 1px 2px rgba(0,0,0,.25); }
.service-card.featured .stat-number{ color:#fff !important; text-shadow:0 1px 2px rgba(0,0,0,.3); }
.service-card.featured .stat-label{ color:rgba(255,255,255,.92) !important; letter-spacing:.6px; }
.service-card.featured .feature-tag{ background:rgba(255,255,255,.28) !important; border-color:rgba(255,255,255,.4) !important; color:#fff !important; }

/* Suavizar el gradiente del fondo para mayor legibilidad */
.service-card.featured{ background-image: linear-gradient(160deg, #0f8f86 0%, #0e7b73 55%, #0c5e57 100%) !important; border:1px solid rgba(255,255,255,.14); will-change: transform; }

/* WOW: efecto tilt + shine en hover */
.service-card.featured{ transform-style: preserve-3d; perspective: 1000px; }
.service-card.featured:hover{ transform: translateY(-8px) rotateX(2deg) rotateY(-2deg); }

/* Overlay sutil para mejorar contraste del texto sobre el gradiente */
.service-card.featured::before{
  content: ""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  background: linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.12) 100%);
}

/* Rayo de brillo que barre en hover (CSS only) */
.service-card.featured::after{
  content:""; position:absolute; inset:-25% -15%; pointer-events:none;
  background: linear-gradient(120deg, rgba(255,255,255,0) 46%, rgba(255,255,255,.22) 50%, rgba(255,255,255,0) 54%);
  transform: translateX(-140%) rotate(12deg);
  transition: transform .9s cubic-bezier(.2,.6,.2,1), opacity .3s ease;
  opacity:0; mix-blend-mode: screen; border-radius:2rem;
}
.service-card.featured:hover::after{ transform: translateX(140%) rotate(12deg); opacity:.55; }

/* Icono: realce suave en hover sin exceso */
.service-card.featured .service-icon{ box-shadow:0 10px 24px -12px rgba(0,0,0,.45); }
.service-card.featured:hover .service-icon{ transform: translateZ(10px) scale(1.03); }

/* Línea decorativa superior: más sutil y nítida */
.service-header-decoration{ height: 1px; opacity:.5; }

/* Desactivar brillo en dispositivos sin hover (móviles) */
@media (hover: none){
  .service-card.featured::after{ display:none; }
}

/* Accesibilidad: reducir animaciones si el usuario lo prefiere */
@media (prefers-reduced-motion: reduce){
  .service-card.featured:hover{ transform: translateY(-6px); }
  .service-card.featured::after{ display:none; }
  .service-card.featured, .service-card.featured *{ transition: none !important; animation: none !important; }
}
.price-card.enterprise .btn-price{background:var(--orange-primary);} 
.price-card.enterprise .btn-price:hover{background:#dc2626;} 
.btn-price:focus{outline:none;box-shadow:0 0 0 4px rgba(45,212,191,.4);} 

.heading{font-size:1.25rem;font-weight:600;margin-bottom:.5rem;color:#0f172a;}

/* Testimonios mejorados */
.testimonial-card{padding:2rem;background:#fff;border-radius:1.5rem;border:1px solid #e2e8f0;box-shadow:0 4px 20px -6px rgba(0,0,0,.08);position:relative;transition:.3s;} 
.testimonial-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px -8px rgba(0,0,0,.15);} 
.testimonial-card.featured{background:linear-gradient(135deg,#0d9488,#0f766e);color:#fff;border:1px solid #0d9488;} 
.testimonial-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;} 
.avatar{position:relative;} 
.avatar-img{width:3rem;height:3rem;border-radius:50%;background:linear-gradient(135deg,#0d9488,#0f766e);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;} 
.testimonial-card.featured .avatar-img{background:rgba(255,255,255,.2);} 
.avatar.verified::after{content:'✓';position:absolute;bottom:-2px;right:-2px;background:#22c55e;color:#fff;border-radius:50%;width:1rem;height:1rem;display:flex;align-items:center;justify-content:center;font-size:.6rem;} 

/* =============================
  Formulario: mensajes y éxito
  ============================= */
.form-msg{margin-top:.5rem;text-align:center;font-weight:600}
.form-msg.sending{color:#0f766e}
.form-msg.success{color:#16a34a}
.form-msg.error{color:#dc2626}
.form-msg.warning{color:#d97706}

.success-overlay{position:fixed;inset:0;background:rgba(2,6,23,.6);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;z-index:9998;opacity:0;transition:opacity .25s ease;}
.success-overlay.hidden{display:none}
.success-overlay.visible{opacity:1}
.success-modal{width:92%;max-width:420px;background:#fff;border-radius:1.25rem;padding:2rem 1.5rem;border:1px solid #e2e8f0;box-shadow:0 20px 60px -20px rgba(0,0,0,.35);text-align:center;}
.checkmark-container{width:86px;height:86px;margin:0 auto 1rem;position:relative}
.checkmark{width:86px;height:86px;display:block}
.checkmark-circle{stroke:#22c55e;stroke-width:3;stroke-miterlimit:10;stroke-dasharray:160;stroke-dashoffset:160;animation:stroke .6s ease-in-out forwards}
.checkmark-check{stroke:#22c55e;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:48;stroke-dashoffset:48;animation:draw .45s .3s ease-out forwards}
.success-title{font-size:1.25rem;font-weight:800;color:#0f172a;margin-top:.25rem}
.success-subtitle{font-size:.95rem;color:#475569;margin-top:.25rem}
.success-close{margin-top:1rem;background:#0d9488;color:#fff;font-weight:700;padding:.6rem 1rem;border-radius:.75rem;box-shadow:0 4px 12px -4px rgba(13,148,136,.4);}
.success-close:hover{background:#0f766e}

@keyframes stroke{to{stroke-dashoffset:0}}
@keyframes draw{to{stroke-dashoffset:0}}
.testimonial-info h4{font-weight:700;font-size:.95rem;margin:0;color:#0f172a;} 
.testimonial-card.featured .testimonial-info h4{color:#fff;} 
.testimonial-info span{font-size:.75rem;color:#64748b;} 
.testimonial-card.featured .testimonial-info span{color:#ccfbf1;} 
.rating{margin-left:auto;font-size:.8rem;} 
.testimonial-card p{font-size:.85rem;color:#475569;margin-bottom:1.5rem;line-height:1.6;} 
.testimonial-card.featured p{color:#ccfbf1;} 
.testimonial-metrics{display:flex;gap:.75rem;} 
.metric{background:#f1f5f9;color:#0d9488;font-size:.7rem;font-weight:700;padding:.35rem .75rem;border-radius:999px;} 
.testimonial-card.featured .metric{background:rgba(255,255,255,.15);color:#fff;} 
.testimonial-cta{margin-top:1rem;} 
.cta-link{color:#fff;font-weight:600;text-decoration:none;font-size:.9rem;} 
.cta-link:hover{text-decoration:underline;} 

/* Institucional mejorado */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:2rem;margin-bottom:4rem;} 
.stat-card{text-align:center;padding:2rem 1.5rem;background:#fff;border-radius:1.25rem;box-shadow:0 4px 20px -6px rgba(0,0,0,.1);border:1px solid #e2e8f0;} 
.stat-number{font-size:2.5rem;font-weight:900;color:#0d9488;margin-bottom:.5rem;} 
.stat-label{font-size:.9rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.5px;} 
.about-block{padding:1.5rem;background:#fff;border-radius:1.25rem;border:1px solid #e2e8f0;box-shadow:0 2px 12px -4px rgba(0,0,0,.08);} 
.about-icon{font-size:2.5rem;margin-bottom:1rem;} 
.values-list{display:flex;flex-direction:column;gap:1rem;margin-top:1rem;} 
.value-item{display:flex;align-items:flex-start;gap:1rem;} 
.value-icon{font-size:1.25rem;flex-shrink:0;} 
.timeline{position:relative;padding-left:2rem;} 
.timeline::before{content:'';position:absolute;left:.75rem;top:0;bottom:0;width:2px;background:linear-gradient(to bottom,#0d9488,var(--orange-primary));} 
.timeline-item{position:relative;margin-bottom:2rem;} 
.timeline-item::before{content:'';position:absolute;left:-2.25rem;top:.25rem;width:1rem;height:1rem;border-radius:50%;background:#fff;border:3px solid #0d9488;} 
.timeline-year{font-weight:800;color:var(--orange-primary);font-size:.9rem;margin-bottom:.5rem;} 
.timeline-content h4{font-weight:700;margin-bottom:.25rem;color:#0f172a;} 
.timeline-content p{font-size:.85rem;color:#64748b;} 
.social-coming-soon{text-align:center;padding:2rem;background:#fff;border-radius:1.25rem;border:1px solid #e2e8f0;box-shadow:0 2px 12px -4px rgba(0,0,0,.08);} 
.social-placeholder{display:flex;justify-content:center;gap:1rem;} 
.social-icon{font-size:1.5rem;opacity:.5;} 

/* Mobile nav animation */
@keyframes fadeIn {from {opacity:0;transform:translateY(-4px);} to {opacity:1;transform:none;} }
.animate-fade-in{animation:fadeIn .35s ease;}

/* Scrollspy style */
.nav-link.active{color:#0d9488;font-weight:600;}

/* Utility overrides */
footer a{transition: color .2s ease, opacity .2s ease;}

/* Form feedback */
#formMsg.success{color:#5eead4;}
#formMsg.error{color:#f43f5e;}

/* Chat Widget Styles */
#chatWidget {
  font-family: 'Inter', system-ui, sans-serif;
}

#chatMessages {
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}

#chatMessages::-webkit-scrollbar {
  width: 4px;
}

#chatMessages::-webkit-scrollbar-track {
  background: transparent;
}

#chatMessages::-webkit-scrollbar-thumb {
  background-color: #cbd5e1;
  border-radius: 2px;
}

#chatMessages::-webkit-scrollbar-thumb:hover {
  background-color: #94a3b8;
}

/* Mejorar visibility del input del chat */
#chatInput {
  box-shadow: 0 0 0 1px #d1d5db;
  transition: all 0.2s ease;
}

#chatInput:focus {
  box-shadow: 0 0 0 2px #0d9488;
  outline: none;
}

#chatInput::placeholder {
  color: #9ca3af;
  opacity: 1;
}

/* Mejorar el botón de envío */
#sendMessage {
  box-shadow: 0 2px 4px rgba(13, 148, 136, 0.2);
  transition: all 0.2s ease;
}

#sendMessage:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(13, 148, 136, 0.3);
}

.quick-option {
  border: 1px solid transparent;
}

.quick-option:hover {
  border-color: currentColor;
}

/* Animaciones para el chat */

/* --- Mascara para cubrir el texto de branding de ElevenLabs en el borde superior --- */
#elvra-overlay-mask{
  position: fixed;
  top: 0; right: 0;
  width: 420px; /* extender cobertura */
  height: 32px; /* coincide con la barra superior */
  pointer-events: none; /* no bloquear clics del widget ni otras UI */
  z-index: 9998; /* por debajo del loading (9999) pero encima del overlay del widget */
  /* Teal-700 para mezclar con la franja superior */
  background: linear-gradient(180deg, rgba(15,118,110,1) 0%, rgba(15,118,110,0.96) 65%, rgba(255,255,255,0) 100%);
  border-bottom-left-radius: 16px;
}

@media (min-width: 768px){
  #elvra-overlay-mask{ height: 36px; width: 480px; }
}

/* Deshabilita clics en el enlace de branding de ElevenLabs (fallback CSS) */
a[href="https://elevenlabs.io/conversational-ai"]{
  pointer-events: none !important;
  cursor: default !important;
}

/* Respeta preferencias de movimiento reducido y optimiza animaciones */
@media (prefers-reduced-motion: reduce){
  * { animation: none !important; transition: none !important; }
}
@keyframes slideUp {
  from {
    transform: translateY(10px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

#chatWindow {
  animation: slideUp 0.3s ease-out;
}

/* Pulso del botón de chat */
@keyframes chatPulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(13, 148, 136, 0.7);
  }
  50% {
    box-shadow: 0 0 0 10px rgba(13, 148, 136, 0);
  }
}

#chatToggle {
  animation: chatPulse 3s infinite;
}

@keyframes pulse {0%,100%{opacity:1;}50%{opacity:.5;}}