/* =========================================================
   Eiwa Design System v1.1 — PRO FRAMEWORK
   Bootstrap 5 + CSS Variables
   Layers: TOKENS → BASE → LAYOUT → COMPONENTS → UTILITIES
   Responsive: PC / Tablet / Mobile (IMPERATIVO)
   ========================================================= */

/* =========================================================
   LAYER 1) TOKENS / VARIABLES (Design Tokens)
   ========================================================= */
:root{
  /* Base */
  --bg-0:#050608;
  --bg-1:#0A1020;
  --txt-0:#F5F7FA;
  --txt-1:#A0A6B3;

  /* Eiwa energy */
  --Eiwa-g:#5CFF9D;
  --Eiwa-c:#2EF2E2;
  --Eiwa-grad:linear-gradient(90deg, var(--Eiwa-g) 0%, var(--Eiwa-c) 100%);
  --Eiwa-grad-g:linear-gradient(90deg, var(--Eiwa-g) 0%, var(--Eiwa-g) 100%);

  /* Borders */
  --stroke:rgba(245,247,250,.10);
  --stroke-2:rgba(245,247,250,.16);

  /* Shadows */
  --shadow-1:0 12px 40px rgba(0,0,0,.55);
  --shadow-cta:0 0 0 1px rgba(92,255,157,.20), 0 18px 60px rgba(46,242,226,.10);

  /* Radius */
  --r-s:10px;
  --r-m:14px;
  --r-l:18px;
  --r-xl:24px;
  --r-pill:999px;

  /* Spacing */
  --sec-y:92px;
  --sec-y-m:64px;

  /* Header height (ScrollSpy offset y anchors) */
  --header-h:72px;
  --header-h-m:64px;

  /* Motion */
  --t:240ms;
  --ease:cubic-bezier(.2,.8,.2,1);

  /* Typography */
  --font:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* =========================================================
   LAYER 2) BASE / RESET
   ========================================================= */
html{ scroll-behavior:smooth; }
html,body{ height:100%; }

body{
  font-family:var(--font);
  color:var(--txt-0);
  overflow-x:hidden;

  background:
    radial-gradient(1200px 700px at 70% 10%, rgba(46,242,226,.08), transparent 60%),
    radial-gradient(1000px 600px at 20% 30%, rgba(92,255,157,.06), transparent 55%),
    var(--bg-0);

  /* Compensación para navbar fixed */
  padding-top: var(--header-h);
}
@media (max-width: 991.98px){
  body{ padding-top: var(--header-h-m); }
}

a{ color:inherit; text-decoration:none; }

/* Anchor offset (no tapa header) */
section[id], header[id]{
  scroll-margin-top: calc(var(--header-h) + 18px);
}
@media (max-width: 991.98px){
  section[id], header[id]{
    scroll-margin-top: calc(var(--header-h-m) + 18px);
  }
}

/* =========================================================
   LAYER 3) LAYOUT (Sections / Rhythm)
   ========================================================= */
.aur-section{ padding: var(--sec-y) 0; }
@media (max-width: 991.98px){
  .aur-section{ padding: var(--sec-y-m) 0; }
}

.aur-section--alt{
  background: rgba(10,16,32,.22);
  border-top: 1px solid var(--stroke);
  border-bottom: 1px solid var(--stroke);
}

.aur-section__head{ max-width: 760px; }
.aur-kicker{
  display:inline-block;
  font-weight:700;
  letter-spacing:.18em;
  font-size:.72rem;
  text-transform: uppercase;
  color: rgba(46,242,226,.75);
  margin-bottom:.55rem;
}
.aur-section__sub{ max-width: 70ch; }

/* =========================================================
   LAYER 4) COMPONENTS
   ========================================================= */

/* -------------------------
   4.1 NAVBAR (Fixed + Scroll State)
   ------------------------- */
#EiwaNavbar{
  position: fixed !important;
  top:0; left:0; right:0;
  width:100%;
  z-index:2000 !important;
}

.aur-nav{
  height: var(--header-h);
  background: rgba(5,6,8,.72);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--stroke);
  transition: background var(--t) var(--ease), border-color var(--t) var(--ease), box-shadow var(--t) var(--ease);
}
@media (max-width: 991.98px){
  .aur-nav{ height: var(--header-h-m); }
}

.aur-nav.is-scrolled{
  background: rgba(8,12,20,.96) !important;
  border-bottom-color: rgba(245,247,250,.18) !important;
  box-shadow: 0 18px 70px rgba(0,0,0,.62);
}

.aur-nav .navbar-brand{
  color: var(--txt-0);
  letter-spacing: .2px;
}

.aur-nav .nav-link{
  color: rgba(245,247,250,.82);
  font-weight:500;
  padding: .55rem .75rem;
  transition: color var(--t) var(--ease), background var(--t) var(--ease);
}
.aur-nav .nav-link:hover{ color: var(--txt-0); }

.aur-nav.is-scrolled .nav-link{ color: rgba(245,247,250,.86); }
.aur-nav.is-scrolled .nav-link:hover{ color: rgba(245,247,250,.98); }

/* Active underline */
.aur-nav .nav-link.active{
  color: var(--txt-0);
  position:relative;
}
.aur-nav .nav-link.active::after{
  content:"";
  position:absolute;
  left:.75rem; right:.75rem;
  bottom:.35rem;
  height:2px;
  background: var(--Eiwa-grad);
  opacity:.7;
  border-radius: var(--r-pill);
}

/* Toggler */
.aur-nav .navbar-toggler{
  border: 1px solid rgba(245,247,250,.18);
  border-radius: 12px;
  padding: .35rem .55rem;
}
.aur-nav .navbar-toggler:focus{
  box-shadow: 0 0 0 3px rgba(46,242,226,.12);
}
.aur-nav .navbar-toggler-icon{ filter: invert(1); }

/* -------------------------
   4.2 BUTTONS (base + variants)
   ------------------------- */
.aur-btn{
  border-radius: var(--r-pill)!important;
  padding: .78rem 1.05rem!important;
  font-weight: 650!important;
  letter-spacing: .2px;
  white-space: nowrap;
  transition: transform var(--t) var(--ease), box-shadow var(--t) var(--ease), filter var(--t) var(--ease);
}
.aur-btn:hover{ transform: translateY(-1px); }

@media (max-width: 575.98px){
  .aur-btn{ width:100%; }
}

.aur-btn--primary{
  background: var(--Eiwa-grad)!important;
  color: #07110b!important;
  border: 0!important;
  box-shadow: var(--shadow-cta);
}
.aur-btn--primary:hover{ filter: brightness(1.03); }

.aur-btn--secondary{
  background: var(--Eiwa-grad-g)!important;
  color: #07110b!important;
  border: 0!important;
  box-shadow: var(--shadow-cta);

  height:auto !important;
  min-height:44px;
  padding:.62rem 1.0rem !important;
  font-weight:800 !important;
  letter-spacing:.2px;

  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.aur-btn--secondary:hover{ filter: brightness(1.03); }

.aur-btn--ghost{
  background: transparent!important;
  color: var(--txt-0)!important;
  border: 1px solid rgba(245,247,250,.18)!important;
}
.aur-btn--ghost:hover{
  border-color: rgba(46,242,226,.45)!important;
  box-shadow: 0 0 0 1px rgba(46,242,226,.12);
}

.aur-btn--link{
  color: var(--txt-0)!important;
  font-weight:650;
  position:relative;
  padding-bottom:.25rem;
  display:inline-block;
}
.aur-btn--link::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:0; height:2px;
  background: var(--Eiwa-grad);
  transition: width var(--t) var(--ease);
  opacity:.75;
  border-radius: var(--r-pill);
}
.aur-btn--link:hover::after{ width:100%; }

/* mini (footer “Ver”) */
.aur-btn--mini{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:54px;
  height:34px;
  padding:0 .85rem;
  border-radius: var(--r-pill);
  border: 1px solid rgba(245,247,250,.16);
  background: rgba(245,247,250,.04);
  color: rgba(245,247,250,.92) !important;
  font-weight:900;
  letter-spacing:.02em;
  transition: transform var(--t) var(--ease), border-color var(--t) var(--ease), box-shadow var(--t) var(--ease);
}
.aur-btn--mini:hover{
  transform: translateY(-1px);
  border-color: rgba(46,242,226,.38);
  box-shadow: 0 0 0 1px rgba(46,242,226,.10), 0 18px 60px rgba(46,242,226,.08);
}

/* -------------------------
   4.3 CARDS
   ------------------------- */
.aur-card{
  background: rgba(10,16,32,.55);
  border: 1px solid var(--stroke);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-1);
}
.aur-card--hover{
  transition: transform var(--t) var(--ease), border-color var(--t) var(--ease);
}
.aur-card--hover:hover{
  transform: translateY(-2px);
  border-color: rgba(92,255,157,.28);
}

/* Layer focus */
.aur-card--focus{
  border-color: rgba(46,242,226,.25) !important;
  box-shadow: 0 0 0 1px rgba(46,242,226,.08), 0 18px 70px rgba(46,242,226,.10);
}

/* -------------------------
   4.4 CHIPS
   ------------------------- */
.aur-chip{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.45rem .75rem;
  border-radius: var(--r-pill);
  background: rgba(245,247,250,.05);
  border:1px solid var(--stroke);
  color: rgba(245,247,250,.88);
  font-weight:700;
  font-size:.92rem;
  transition: border-color var(--t) var(--ease), transform var(--t) var(--ease);
}
.aur-chip:hover{
  transform: translateY(-1px);
  border-color: rgba(46,242,226,.28);
}
.aur-dot{
  width:.5rem; height:.5rem;
  border-radius:50%;
  background: var(--Eiwa-grad);
}

/* -------------------------
   4.5 Eiwa LINE (shimmer)
   ------------------------- */
.aur-line{
  height:2px;
  width: 100%;
  border-radius: var(--r-pill);
  background: var(--Eiwa-grad);
  opacity:.35;
  position:relative;
  overflow:hidden;
}
.aur-line::after{
  content:"";
  position:absolute;
  top:0; left:-40%;
  width:40%;
  height:100%;
  background: linear-gradient(90deg, transparent, rgba(245,247,250,.35), transparent);
  animation: aur-shimmer 5.5s linear infinite;
}
@keyframes aur-shimmer{
  0%{ left:-40%; }
  100%{ left:120%; }
}

/* -------------------------
   4.6 HERO (PRO)
   ------------------------- */
.aur-hero{ padding: 110px 0 80px; }
@media (max-width: 991.98px){
  .aur-hero{ padding: 90px 0 56px; }
}

.aur-hero--pro{
  padding: 120px 0 90px;
  position:relative;
}
@media (max-width: 991.98px){
  .aur-hero--pro{ padding: 96px 0 68px; }
}

.aur-hero__title{
  font-size: clamp(2.6rem, 4.1vw, 4.0rem);
  line-height: 1.0;
  letter-spacing: -0.03em;
}
.aur-hero__sub{
  font-size: 1.05rem;
  color: rgba(245,247,250,.78);
  line-height:1.65;
  max-width: 62ch;
}

/* Mesh */
.aur-mesh{
  position:relative;
  width:100%;
  min-height: 360px;
  border-radius: var(--r-xl);
  background:
    radial-gradient(closest-side at 60% 40%, rgba(46,242,226,.18), transparent 55%),
    radial-gradient(closest-side at 35% 65%, rgba(92,255,157,.14), transparent 58%),
    radial-gradient(circle at 50% 50%, rgba(245,247,250,.06), transparent 58%),
    linear-gradient(180deg, rgba(10,16,32,.35), rgba(5,6,8,.0));
  border: 1px solid var(--stroke);
  overflow:hidden;
}
@media (max-width: 575.98px){
  .aur-mesh{ min-height: 260px; }
}
.aur-mesh::before{
  content:"";
  position:absolute;
  inset:-40%;
  background: radial-gradient(circle, rgba(245,247,250,.12) 1px, transparent 2px);
  background-size: 18px 18px;
  transform: rotate(18deg);
  opacity:.18;
  animation: aur-meshFloat 12s var(--ease) infinite alternate;
}
.aur-mesh::after{
  content:"";
  position:absolute;
  inset:-20%;
  background: conic-gradient(from 180deg, rgba(92,255,157,.12), rgba(46,242,226,.12), rgba(92,255,157,.12));
  filter: blur(24px);
  opacity:.25;
  animation: aur-glowPulse 9s var(--ease) infinite alternate;
}
@keyframes aur-meshFloat{
  from{ transform: translate3d(-10px,-8px,0) rotate(18deg); }
  to{ transform: translate3d(10px,8px,0) rotate(18deg); }
}
@keyframes aur-glowPulse{
  from{ transform: translate3d(-10px, 0,0) scale(1); opacity:.18; }
  to{ transform: translate3d(10px, 0,0) scale(1.05); opacity:.26; }
}

/* Mesh PRO */
.aur-mesh--pro{
  min-height: 420px;
  border-radius: 28px;
  border-color: rgba(245,247,250,.12);
}
@media (max-width: 575.98px){
  .aur-mesh--pro{ min-height: 320px; }
}

/* Sidecard */
.aur-hero__visual{ position:relative; }
.aur-sidecard{
  position:absolute;
  right: 14px;
  bottom: 14px;
  max-width: 360px;
  border-radius: 18px;
  background: rgba(5,6,8,.70);
  border: 1px solid rgba(245,247,250,.14);
  backdrop-filter: blur(14px);
}
@media (max-width: 991.98px){
  .aur-sidecard{
    position: static;
    margin-top: 14px;
    max-width: 100%;
  }
}

/* Trust strip */
.aur-trust{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}
.aur-trust__item{
  padding:.42rem .7rem;
  border-radius: var(--r-pill);
  border:1px solid rgba(245,247,250,.14);
  background: rgba(245,247,250,.04);
  color: rgba(245,247,250,.86);
  font-weight:650;
  font-size:.92rem;
}

/* -------------------------
   4.7 NOTICE
   ------------------------- */
.aur-notice{
  background: rgba(46,242,226,.14);
  border-top: 1px solid rgba(46,242,226,.25);
  border-bottom: 1px solid rgba(46,242,226,.25);
  color: rgba(245,247,250,.92);
  padding: .65rem 0;
  font-size: .95rem;
}
.aur-notice--min{
  background: rgba(46,242,226,.10);
  border-top: 1px solid rgba(46,242,226,.20);
  border-bottom: 1px solid rgba(46,242,226,.20);
}

/* -------------------------
   4.8 MODALS + FORMS
   ------------------------- */
.modal-content{
  background: rgba(10,16,32,.92);
  border: 1px solid var(--stroke-2);
  border-radius: var(--r-xl);
  color: var(--txt-0);
  box-shadow: var(--shadow-1);
}
.modal-header{ border-bottom: 1px solid var(--stroke); }
.modal-footer{ border-top: 1px solid var(--stroke); }
.btn-close{ filter: invert(1); opacity:.85; }

.aur-modal{
  position:relative;
  overflow:hidden;
}
.aur-modal::before{
  content:"";
  position:absolute;
  left:0; top:0;
  width:100%; height:2px;
  background: var(--Eiwa-grad);
  opacity:.65;
}

.aur-input{
  background: rgba(5,6,8,.28) !important;
  border: 1px solid rgba(245,247,250,.14) !important;
  color: var(--txt-0) !important;
  border-radius: 14px !important;
  padding: .75rem .9rem !important;
}
.aur-input:focus{
  box-shadow: 0 0 0 4px rgba(46,242,226,.12) !important;
  border-color: rgba(46,242,226,.35) !important;
}

.aur-cta{
  border-color: rgba(245,247,250,.14);
  background: rgba(10,16,32,.58);
}

/* -------------------------
   4.9 FOOTER (PRO)
   ------------------------- */
.aur-footer{
  border-top: 1px solid var(--stroke);
  background: rgba(5,6,8,.65);
}

.aur-footer--pro{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(900px 420px at 18% 10%, rgba(46,242,226,.10), transparent 60%),
    radial-gradient(760px 420px at 85% 35%, rgba(92,255,157,.09), transparent 60%),
    rgba(5,6,8,.72);
}
.aur-footer--pro::before{
  content:"";
  position:absolute;
  inset:-20%;
  background: radial-gradient(circle, rgba(245,247,250,.10) 1px, transparent 2px);
  background-size: 22px 22px;
  transform: rotate(10deg);
  opacity:.10;
  pointer-events:none;
}
.aur-footer--pro::after{
  content:"";
  position:absolute;
  left:-20%;
  bottom:-40%;
  width:140%;
  height:70%;
  background: radial-gradient(closest-side, rgba(46,242,226,.18), transparent 68%);
  filter: blur(22px);
  opacity:.22;
  pointer-events:none;
}

.aur-footer__topline{
  height:2px;
  border-radius: var(--r-pill);
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(92,255,157,.75) 22%,
    rgba(46,242,226,.75) 55%,
    transparent 100%);
  opacity:.65;
  box-shadow: 0 0 0 1px rgba(245,247,250,.06);
}

.aur-footer__title{
  font-weight:900;
  letter-spacing:.16em;
  font-size:.72rem;
  text-transform:uppercase;
  color: rgba(46,242,226,.78);
  margin-bottom:.85rem;
}

.aur-footer__links a{
  display:block;
  padding:.38rem 0;
  color: rgba(245,247,250,.78);
  font-weight:650;
  transition: color var(--t) var(--ease), transform var(--t) var(--ease);
}
.aur-footer__links a:hover{
  color: rgba(245,247,250,.96);
  transform: translateX(2px);
}

.aur-footer__divider{ height:1px; background: rgba(245,247,250,.10); }

.aur-footer__eco{
  background:
    radial-gradient(520px 220px at 20% 0%, rgba(46,242,226,.12), transparent 62%),
    radial-gradient(520px 220px at 90% 70%, rgba(92,255,157,.10), transparent 62%),
    rgba(10,16,32,.62) !important;
  border-color: rgba(245,247,250,.14) !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 70px rgba(0,0,0,.55);
}
.aur-footer__bottom{
  border-top: 1px solid rgba(245,247,250,.10);
  display:flex;
  flex-wrap:wrap;
  gap:.75rem 1.25rem;
  align-items:center;
  justify-content:space-between;
}
.aur-footer__bottom .small{ color: rgba(245,247,250,.68) !important; }

@media (max-width: 991.98px){
  .aur-footer--pro{ padding-bottom: 3.25rem; }
}

/* -------------------------
   4.10 MOBILE MENU (WOW PANEL)
   ------------------------- */
.aur-collapse{ position: relative; }

@media (max-width: 991.98px){
  .aur-mobile-panel{
    margin-top: 12px;
    padding: 14px;
    border-radius: 18px;
    background:
      radial-gradient(800px 240px at 30% 0%, rgba(46,242,226,.18), transparent 60%),
      radial-gradient(720px 240px at 80% 40%, rgba(92,255,157,.14), transparent 60%),
      rgba(10,16,32,.78);
    border: 1px solid rgba(245,247,250,.14);
    backdrop-filter: blur(16px);
    box-shadow: 0 18px 70px rgba(0,0,0,.55);
  }

  .aur-nav .nav-link{
    padding: .78rem .85rem;
    border-radius: 12px;
  }
  .aur-nav .nav-link:hover{
    background: rgba(245,247,250,.06);
  }

  .aur-nav-cta .btn{ width: 100% !important; }

  .aur-toggler{
    border: 1px solid rgba(245,247,250,.18);
    border-radius: 14px;
    padding: .45rem .6rem;
    background:
      radial-gradient(120px 80px at 30% 30%, rgba(46,242,226,.16), transparent 60%),
      rgba(5,6,8,.55);
    backdrop-filter: blur(10px);
  }
}

/* =========================================================
   LAYER 5) UTILITIES (Eiwa helpers)
   ========================================================= */
.aur-muted{ color:var(--txt-1)!important; }
.aur-text-g{ color: var(--Eiwa-g)!important; font-weight:650 !important; }
.aur-text-c{ color: var(--Eiwa-c)!important; font-weight:650 !important; }
.aur-text-w{ color: var(--txt-0)!important; }
.aur-text-soft{ color: rgba(245,247,250,.78) !important; }

.aur-brand-mark{
  width:14px; height:14px;
  border-radius:4px;
  background: var(--Eiwa-grad);
  box-shadow: 0 0 0 1px rgba(245,247,250,.10), 0 10px 30px rgba(46,242,226,.10);
  display:inline-block;
}

/* =========================================================
   LAYER 6) LEGACY ALIASES (No tocar HTML hoy)
   Mantiene compatibilidad con tu markup actual
   ========================================================= */

/* Layout aliases */
.section{ padding: var(--sec-y) 0; }
@media (max-width: 991.98px){
  .section{ padding: var(--sec-y-m) 0; }
}
.section-pro .section-head{ max-width: 760px; }
.section-sub{ max-width: 70ch; }
.section-alt{ background: rgba(10,16,32,.22); 
  /*border-top: 1px solid var(--stroke);
  border-bottom: 1px solid var(--stroke);*/
        border-top: 0 !important;
      border-bottom: 0 !important;
      outline: 0 !important;
      box-shadow: none !important;
}
.kicker{ display:inline-block; font-weight:700; letter-spacing:.18em; font-size:.72rem; text-transform:uppercase; color: rgba(46,242,226,.75); margin-bottom:.55rem; }

/* Navbar aliases */
.navbar-Eiwa{ /* legacy == aur-nav */
  height: var(--header-h);
  background: rgba(5,6,8,.72);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--stroke);
  transition: background var(--t) var(--ease), border-color var(--t) var(--ease), box-shadow var(--t) var(--ease);
}
@media (max-width: 991.98px){ .navbar-Eiwa{ height: var(--header-h-m); } }
.navbar-Eiwa.is-scrolled{
  background: rgba(8,12,20,.96) !important;
  border-bottom-color: rgba(245,247,250,.18) !important;
  box-shadow: 0 18px 70px rgba(0,0,0,.62);
}

/* Buttons aliases */
.btn-Eiwa{ /* legacy == aur-btn */
  border-radius: var(--r-pill)!important;
  padding: .78rem 1.05rem!important;
  font-weight: 650!important;
  letter-spacing: .2px;
  white-space: nowrap;
  transition: transform var(--t) var(--ease), box-shadow var(--t) var(--ease), filter var(--t) var(--ease);
}
.btn-Eiwa:hover{ transform: translateY(-1px); }
@media (max-width: 575.98px){ .btn-Eiwa{ width:100%; } }

.btn-Eiwa-primary{ background: var(--Eiwa-grad)!important; color:#07110b!important; border:0!important; box-shadow: var(--shadow-cta); }
.btn-Eiwa-primary:hover{ filter: brightness(1.03); }

.btn-Eiwa-secondary{
  background: var(--Eiwa-grad-g)!important;
  color: #07110b!important;
  border: 0!important;
  box-shadow: var(--shadow-cta);
  height:auto !important;
  min-height:44px;
  padding:.62rem 1.0rem !important;
  font-weight:800 !important;
  letter-spacing:.2px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.btn-Eiwa-secondary:hover{ filter: brightness(1.03); }

.btn-Eiwa-ghost{ background:transparent!important; color:var(--txt-0)!important; border:1px solid rgba(245,247,250,.18)!important; }
.btn-Eiwa-ghost:hover{ border-color: rgba(46,242,226,.45)!important; box-shadow: 0 0 0 1px rgba(46,242,226,.12); }

.btn-Eiwa-link{ color:var(--txt-0)!important; font-weight:650; position:relative; padding-bottom:.25rem; display:inline-block; }
.btn-Eiwa-link::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--Eiwa-grad); transition:width var(--t) var(--ease); opacity:.75; border-radius:var(--r-pill); }
.btn-Eiwa-link:hover::after{ width:100%; }

.btn-Eiwa-mini{ /* legacy == aur-btn--mini */
  display:inline-flex; align-items:center; justify-content:center;
  min-width:54px; height:34px; padding:0 .85rem;
  border-radius:var(--r-pill);
  border:1px solid rgba(245,247,250,.16);
  background: rgba(245,247,250,.04);
  color: rgba(245,247,250,.92)!important;
  font-weight:900; letter-spacing:.02em;
  transition: transform var(--t) var(--ease), border-color var(--t) var(--ease), box-shadow var(--t) var(--ease);
}
.btn-Eiwa-mini:hover{ transform: translateY(-1px); border-color: rgba(46,242,226,.38); box-shadow: 0 0 0 1px rgba(46,242,226,.10), 0 18px 60px rgba(46,242,226,.08); }

/* Cards aliases */
.card-Eiwa{ background: rgba(10,16,32,.55); border:1px solid var(--stroke); border-radius:var(--r-xl); box-shadow:var(--shadow-1); }
.card-Eiwa-hover{ transition: transform var(--t) var(--ease), border-color var(--t) var(--ease); }
.card-Eiwa-hover:hover{ transform: translateY(-2px); border-color: rgba(92,255,157,.28); }
.layer-focus{ border-color: rgba(46,242,226,.25)!important; box-shadow: 0 0 0 1px rgba(46,242,226,.08), 0 18px 70px rgba(46,242,226,.10); }

/* Chips aliases */
.chip-Eiwa{ display:inline-flex; align-items:center; gap:.5rem; padding:.45rem .75rem; border-radius:var(--r-pill); background:rgba(245,247,250,.05); border:1px solid var(--stroke); color:rgba(245,247,250,.88); font-weight:700; font-size:.92rem; transition:border-color var(--t) var(--ease), transform var(--t) var(--ease); }
.chip-Eiwa:hover{ transform: translateY(-1px); border-color: rgba(46,242,226,.28); }
.dot-Eiwa{ width:.5rem; height:.5rem; border-radius:50%; background: var(--Eiwa-grad); }

/* Line alias */
.Eiwa-line{ height:2px; width:100%; border-radius:var(--r-pill); background:var(--Eiwa-grad); opacity:.35; position:relative; overflow:hidden; }
.Eiwa-line::after{ content:""; position:absolute; top:0; left:-40%; width:40%; height:100%; background:linear-gradient(90deg, transparent, rgba(245,247,250,.35), transparent); animation: aur-shimmer 5.5s linear infinite; }

/* Hero aliases */
.hero{ padding:110px 0 80px; }
@media (max-width: 991.98px){ .hero{ padding:90px 0 56px; } }

.hero-pro{ padding:120px 0 90px; position:relative; }
@media (max-width: 991.98px){ .hero-pro{ padding:96px 0 68px; } }

.hero-title{ font-size: clamp(2.6rem, 4.1vw, 4.0rem); line-height:1.0; letter-spacing:-0.03em; }
.hero .sub{ font-size:1.05rem; color:rgba(245,247,250,.78); line-height:1.65; max-width:62ch; }

.Eiwa-mesh{ /* legacy == aur-mesh */ }
.Eiwa-mesh-pro{ min-height:420px; border-radius:28px; border-color: rgba(245,247,250,.12); }
@media (max-width: 575.98px){ .Eiwa-mesh-pro{ min-height:320px; } }
.hero-visual-wrap{ position:relative; }
.hero-sidecard{ position:absolute; right:14px; bottom:14px; max-width:360px; border-radius:18px; background:rgba(5,6,8,.70); border:1px solid rgba(245,247,250,.14); backdrop-filter: blur(14px); }
@media (max-width: 991.98px){ .hero-sidecard{ position:static; margin-top:14px; max-width:100%; } }
.hero-trust{ display:flex; flex-wrap:wrap; gap:.5rem; }
.trust-item{ padding:.42rem .7rem; border-radius:var(--r-pill); border:1px solid rgba(245,247,250,.14); background:rgba(245,247,250,.04); color:rgba(245,247,250,.86); font-weight:650; font-size:.92rem; }

/* Notice aliases */
.notice-Eiwa{ background: rgba(46,242,226,.14); border-top:1px solid rgba(46,242,226,.25); border-bottom:1px solid rgba(46,242,226,.25); color:rgba(245,247,250,.92); padding:.65rem 0; font-size:.95rem; }
.notice-min{ background: rgba(46,242,226,.10); border-top:1px solid rgba(46,242,226,.20); border-bottom:1px solid rgba(46,242,226,.20); }

/* Modal/form aliases */
.Eiwa-modal{ position:relative; overflow:hidden; }
.Eiwa-modal::before{ content:""; position:absolute; left:0; top:0; width:100%; height:2px; background: var(--Eiwa-grad); opacity:.65; }
.form-Eiwa{ background: rgba(5,6,8,.28)!important; border:1px solid rgba(245,247,250,.14)!important; color:var(--txt-0)!important; border-radius:14px!important; padding:.75rem .9rem!important; }
.form-Eiwa:focus{ box-shadow: 0 0 0 4px rgba(46,242,226,.12)!important; border-color: rgba(46,242,226,.35)!important; }
.cta-card-pro{ border-color: rgba(245,247,250,.14); background: rgba(10,16,32,.58); }

/* Footer aliases */
.footer-Eiwa{ border-top:1px solid var(--stroke); background: rgba(5,6,8,.65); }
.footer-pro{ position:relative; overflow:hidden; background: radial-gradient(900px 420px at 18% 10%, rgba(46,242,226,.10), transparent 60%), radial-gradient(760px 420px at 85% 35%, rgba(92,255,157,.09), transparent 60%), rgba(5,6,8,.72); }
.footer-topline{ height:2px; border-radius:var(--r-pill); background: linear-gradient(90deg, transparent 0%, rgba(92,255,157,.75) 22%, rgba(46,242,226,.75) 55%, transparent 100%); opacity:.65; box-shadow: 0 0 0 1px rgba(245,247,250,.06); }
.footer-title{ font-weight:900; letter-spacing:.16em; font-size:.72rem; text-transform:uppercase; color: rgba(46,242,226,.78); margin-bottom:.85rem; }
.footer-links a{ display:block; padding:.38rem 0; color: rgba(245,247,250,.78); font-weight:650; transition: color var(--t) var(--ease), transform var(--t) var(--ease); }
.footer-links a:hover{ color: rgba(245,247,250,.96); transform: translateX(2px); }
.footer-divider{ height:1px; background: rgba(245,247,250,.10); }
.footer-ecosystem{ background: radial-gradient(520px 220px at 20% 0%, rgba(46,242,226,.12), transparent 62%), radial-gradient(520px 220px at 90% 70%, rgba(92,255,157,.10), transparent 62%), rgba(10,16,32,.62)!important; border-color: rgba(245,247,250,.14)!important; border-radius: 18px!important; box-shadow: 0 18px 70px rgba(0,0,0,.55); }
.footer-bottom{ border-top: 1px solid rgba(245,247,250,.10); display:flex; flex-wrap:wrap; gap:.75rem 1.25rem; align-items:center; justify-content:space-between; }
.footer-bottom .small{ color: rgba(245,247,250,.68)!important; }
@media (max-width: 991.98px){ .footer-pro{ padding-bottom:3.25rem; } }

/* Mobile menu aliases */
.Eiwa-collapse{ position:relative; }
@media (max-width: 991.98px){
  .Eiwa-mobile-panel{
    margin-top: 12px;
    padding: 14px;
    border-radius: 18px;
    background:
      radial-gradient(800px 240px at 30% 0%, rgba(46,242,226,.18), transparent 60%),
      radial-gradient(720px 240px at 80% 40%, rgba(92,255,157,.14), transparent 60%),
      rgba(10,16,32,.78);
    border: 1px solid rgba(245,247,250,.14);
    backdrop-filter: blur(16px);
    box-shadow: 0 18px 70px rgba(0,0,0,.55);
  }
  .Eiwa-nav-cta .btn{ width:100%!important; }
  .Eiwa-toggler{
    border: 1px solid rgba(245,247,250,.18);
    border-radius: 14px;
    padding: .45rem .6rem;
    background:
      radial-gradient(120px 80px at 30% 30%, rgba(46,242,226,.16), transparent 60%),
      rgba(5,6,8,.55);
    backdrop-filter: blur(10px);
  }
}


/* ---------- Brand mark (index.html usa brand-mark) ---------- */
.brand-mark{
  width:14px; height:14px;
  border-radius:4px;
  background: var(--Eiwa-grad);
  box-shadow: 0 0 0 1px rgba(245,247,250,.10), 0 10px 30px rgba(46,242,226,.10);
  display:inline-block;
}

/* ---------- Text helpers (index.html usa text-Eiwa-*) ---------- */
.text-muted-Eiwa{ color: rgba(245,247,250,.70) !important; }
.text-Eiwa-g{ color: var(--Eiwa-g) !important; font-weight: 650 !important; }
.text-Eiwa-c{ color: var(--Eiwa-c) !important; font-weight: 650 !important; }
.text-Eiwa-a{
  background: var(--Eiwa-grad);
  -webkit-background-clip: text;
  background-clip:text;
  color: transparent !important;
  font-weight: 800 !important;
}
.text-Eiwa-white{ color: var(--txt-0) !important; font-weight: 750 !important; }

/* ---------- Eyebrow wrapper (solo estética, no rompe nada) ---------- */
.eyebrow{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }

/* ---------- HERO mesh (tu CSS tenía .Eiwa-mesh vacío) ---------- */
.Eiwa-mesh{
  position:relative;
  width:100%;
  min-height: 360px;
  border-radius: var(--r-xl);
  background:
    radial-gradient(closest-side at 60% 40%, rgba(46,242,226,.18), transparent 55%),
    radial-gradient(closest-side at 35% 65%, rgba(92,255,157,.14), transparent 58%),
    radial-gradient(circle at 50% 50%, rgba(245,247,250,.06), transparent 58%),
    linear-gradient(180deg, rgba(10,16,32,.35), rgba(5,6,8,.0));
  border: 1px solid var(--stroke);
  overflow:hidden;
}
@media (max-width: 575.98px){
  .Eiwa-mesh{ min-height: 260px; }
}
.Eiwa-mesh::before{
  content:"";
  position:absolute;
  inset:-40%;
  background: radial-gradient(circle, rgba(245,247,250,.12) 1px, transparent 2px);
  background-size: 18px 18px;
  transform: rotate(18deg);
  opacity:.18;
  animation: aur-meshFloat 12s var(--ease) infinite alternate;
}
.Eiwa-mesh::after{
  content:"";
  position:absolute;
  inset:-20%;
  background: conic-gradient(from 180deg, rgba(92,255,157,.12), rgba(46,242,226,.12), rgba(92,255,157,.12));
  filter: blur(24px);
  opacity:.25;
  animation: aur-glowPulse 9s var(--ease) infinite alternate;
}

/* PRO variant ya existía, pero lo hago consistente */
.Eiwa-mesh-pro{
  min-height: 520px;
  border-radius: 28px;
  border-color: rgba(245,247,250,.12);
}
@media (max-width: 575.98px){
  .Eiwa-mesh-pro{ min-height: 320px; }
}

/* ---------- Step cards (index.html usa step-card / step-no) ---------- */
.step-card{ position:relative; overflow:hidden; }
.step-no{
  font-weight: 900;
  letter-spacing: .18em;
  font-size: .78rem;
  color: rgba(245,247,250,.72);
  margin-bottom: .55rem;
}
.step-card::before{
  content:"";
  position:absolute;
  left:0; top:0;
  width:100%; height:2px;
  background: var(--Eiwa-grad);
  opacity:.35;
}

/* ---------- Layer cards (por claridad visual, no afecta layout) ---------- */
.layer-card{ position:relative; }
.layer-card ul{ padding-left: 1.1rem; margin-bottom: 0; }
.layer-card li{ margin: .2rem 0; }

/* ---------- Buttons: tamaño SM usado en footer ---------- */
.btn-Eiwa-sm{
  padding: .58rem .9rem !important;
  font-size: .92rem !important;
}

/* ---------- Navbar links (mobile) para legacy navbar-Eiwa ---------- */
@media (max-width: 991.98px){
  .navbar-Eiwa .nav-link{
    padding: .78rem .85rem;
    border-radius: 12px;
  }
  .navbar-Eiwa .nav-link:hover{
    background: rgba(245,247,250,.06);
  }
}

/* ---------- Small safety: cards inside hero sidecard ---------- */
.hero-sidecard .small{ color: rgba(245,247,250,.68) !important; }


/* =========================================================
   Eiwa PRO PATCH — NAV LINKS + SCROLL NAVBAR
   ========================================================= */

/* Base: links visibles (desktop + mobile) */
#EiwaNavbar .nav-link,
.navbar-Eiwa .nav-link{
  color: var(--txt-0) !important;
  opacity: .86;
  font-weight: 600;
  transition: color var(--t) var(--ease), opacity var(--t) var(--ease), background var(--t) var(--ease);
}

/* Hover: Eiwa-c */
#EiwaNavbar .nav-link:hover,
.navbar-Eiwa .nav-link:hover{
  color: var(--Eiwa-c) !important;
  opacity: 1;
}

/* Active (ScrollSpy): Eiwa-g */
#EiwaNavbar .nav-link.active,
.navbar-Eiwa .nav-link.active{
  color: var(--Eiwa-g) !important;
  opacity: 1;
}

/* (Opcional pro) subrayado activo sutil con gradiente (mantiene tu look) */
#EiwaNavbar .nav-link.active::after,
.navbar-Eiwa .nav-link.active::after{
  content:"";
  position:absolute;
  left:.75rem; right:.75rem;
  bottom:.35rem;
  height:2px;
  background: var(--Eiwa-grad);
  opacity:.65;
  border-radius: var(--r-pill);
}

/* ---------------------------------------------------------
   Navbar al hacer scroll: nuevo fondo + sombra inferior
   (usa la clase .is-scrolled que ya activa Eiwa.js)
   --------------------------------------------------------- */
#EiwaNavbar.is-scrolled,
.navbar-Eiwa.is-scrolled{
  /*background: linear-gradient(180deg, rgba(46,242,226,.20), rgba(5,6,8,.55)) !important;*/
  background: rgba(46, 242, 226, .18) !important;     /* tu sugerencia */
  border-bottom-color: rgba(245,247,250,.16) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.40);           /* sombra inferior ligera */
  backdrop-filter: blur(14px);
}

/* En scroll, refuerzo un poco contraste del texto */
#EiwaNavbar.is-scrolled .nav-link,
.navbar-Eiwa.is-scrolled .nav-link{
  opacity: .92;
}

/* ---------------------------------------------------------
  Planeta girando (RESPONSIVE PRO)
  Para poner detrás
--------------------------------------------------------- */

/* contenedor detrás */
.Eiwa-globe-layer{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;

  display:grid;
  place-items:end center;          /* 👈 en móvil se ve mejor abajo */
  overflow:hidden;
  isolation:isolate;

  padding: clamp(8px, 2vw, 18px);  /* 👈 respiración responsive */
}

/* base común */
.Eiwa-globe{
  /* 👇 tamaño fluido: nunca se sale y se adapta */
  width: min(560px, 92vw);
  max-width: 92vw;

  height:auto;
  transform-origin:50% 50%;
  will-change:transform, filter, opacity;
  animation: EiwaSpin 14s linear infinite;

  /* 👇 bajamos un poco el planeta para que “abrace” la card */
  translate: 0 clamp(10px, 3vw, 26px);

  /* glow */
  filter:
    drop-shadow(0 0 18px rgba(46,242,226,.35))
    drop-shadow(0 0 34px rgba(92,255,157,.20));
}

/* capa base */
.Eiwa-globe.base{
  opacity:.92;
  filter:
    drop-shadow(0 0 16px rgba(46,242,226,.30))
    drop-shadow(0 0 30px rgba(92,255,157,.18));
}

/* capa brillo */
.Eiwa-globe.shine{
  position:absolute;
  opacity:.65;
  mix-blend-mode: screen;

  -webkit-mask-image: radial-gradient(circle at 35% 40%,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,.55) 28%,
    rgba(0,0,0,.15) 48%,
    rgba(0,0,0,0) 68%);
  mask-image: radial-gradient(circle at 35% 40%,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,.55) 28%,
    rgba(0,0,0,.15) 48%,
    rgba(0,0,0,0) 68%);

  filter:
    brightness(1.35)
    saturate(1.25)
    drop-shadow(0 0 20px rgba(46,242,226,.55))
    drop-shadow(0 0 36px rgba(92,255,157,.35));

  animation:
    EiwaSpin 14s linear infinite,
    EiwaBreathe 6.5s ease-in-out infinite;
}

/* rotación */
@keyframes EiwaSpin{
  from{ transform: rotate(0deg); }
  to  { transform: rotate(360deg); }
}

/* micro movimiento del brillo */
@keyframes EiwaBreathe{
  0%,100%{ transform: translateX(-6px) translateY(-4px) rotate(0deg); opacity:.62; }
  50%    { transform: translateX(8px)  translateY(6px)  rotate(0deg); opacity:.74; }
}

/* reduce motion */
@media (prefers-reduced-motion: reduce){
  .Eiwa-globe{ animation:none; }
}

/* =========================
   Breakpoints (solo tamaño/posición)
   ========================= */

/* móviles */
@media (max-width: 576px){
  .Eiwa-globe-layer{
    place-items:end center;
    padding: 10px;
  }
  .Eiwa-globe{
    width: min(420px, 96vw);
    translate: 0 18px;           /* 👈 baja más en móvil */
    opacity: .95;
    top: 56px;
    position: fixed;
  }
}

/* tablets */
@media (min-width: 577px) and (max-width: 992px){
  .Eiwa-globe{
    width: min(520px, 86vw);
    translate: 0 18px;
  }
}

/* pantallas grandes */
@media (min-width: 1200px){
  .Eiwa-globe{
    width: min(620px, 44vw);     /* 👈 en desktop se ve más “pro” */
    translate: 0 10px;
  }
}

/* capas arriba */
.sensacion-final-card{ position:relative; z-index:2; }
.tu-seccion-o-card-wrapper{ position:relative; z-index:1; }




  /*-- MINI PATCH (solo login) -->
  /* esta vista no tiene navbar */

  .Eiwa-auth{
    min-height: 100vh;
    display:flex;
    align-items:center;
    position:relative;
    overflow:hidden;
    isolation:isolate;
  }

  /* un “halo” tipo infraestructura, sin recargar */
  .Eiwa-auth::before{
    content:"";
    position:absolute;
    inset:-30%;
    background:
      radial-gradient(900px 520px at 25% 20%, rgba(46,242,226,.12), transparent 60%),
      radial-gradient(780px 520px at 70% 45%, rgba(92,255,157,.10), transparent 62%),
      radial-gradient(560px 360px at 55% 85%, rgba(245,247,250,.06), transparent 60%);
    filter: blur(0px);
    opacity:.9;
    pointer-events:none;
    z-index:0;
  }

  /* input-group icon look (sin duplicar eiwa.css) */
  .Eiwa-ig{
    border-radius: 14px;
    overflow:hidden;
    border: 1px solid rgba(245,247,250,.14);
    background: rgba(5,6,8,.22);
    transition: border-color var(--t) var(--ease), box-shadow var(--t) var(--ease);
  }
  .Eiwa-ig:focus-within{
    border-color: rgba(46,242,226,.35);
    box-shadow: 0 0 0 4px rgba(46,242,226,.12);
  }
  .Eiwa-ig .input-group-text{
    background: transparent;
    border: 0;
    color: rgba(245,247,250,.82);
    padding: .75rem .85rem;
  }
  .Eiwa-ig .aur-input{
    border:0 !important;
    background: transparent !important;
    box-shadow:none !important;
    padding: .75rem .9rem !important;
  }
  .Eiwa-ig .aur-input:focus{ box-shadow:none !important; }

  .Eiwa-auth-card{
    /*max-width: 600 520 */
    max-width: 600px;
    width: 100%;
  }

  /* micro detalle de marca */
  .Eiwa-logo{
    display:flex;
    align-items:center;
    gap:.7rem;
  }
  .Eiwa-logo__mark{
    width:42px;
    height:42px;
    border-radius: 14px;
    background: var(--Eiwa-grad);
    box-shadow: 0 0 0 1px rgba(245,247,250,.12), 0 18px 60px rgba(46,242,226,.10);
    display:grid;
    place-items:center;
    color:#07110b;
    font-weight:1000;
    letter-spacing:.06em;
    user-select:none;
  }
  .Eiwa-logo__title{
    font-weight:900;
    letter-spacing:.02em;
    line-height:1.05;
  }

  /* que el planeta no tape el card en móvil */
  @media (max-width: 991.98px){
    .Eiwa-auth{ padding: 28px 0; }
  }

  /* =========================================================
   Eiwa LOGIN PATCH — planeta más sutil + texto móvil pro
   (NO duplica eiwa.css, solo overrides específicos)
   ========================================================= */

/* 1) El planeta: menos nítido, más “ambiental”, no tapa el card */
.Eiwa-globe{
  width: min(560px, 92vw);
  max-width: 92vw;
  height:auto;

  transform-origin:50% 50%;
  will-change:transform, filter, opacity;
  animation: EiwaSpin 14s linear infinite;

  /* lo bajamos un poco, pero sin invadir el formulario */
  translate: 0 clamp(16px, 3.6vw, 34px);

  /* ✅ menos nítido: blur + menor contraste + menor opacidad */
    opacity: .18;
    filter:
      blur(3.8px)
      saturate(0.9)
      contrast(0.88)
      brightness(0.92)
      drop-shadow(0 0 8px rgba(46,242,226,.12))
      drop-shadow(0 0 14px rgba(92,255,157,.08));
    translate: 0 26px;
}

/* Si activas la capa shine más adelante, que sea aún más sutil */
.Eiwa-globe.shine{
  opacity: .18 !important;
  filter:
    blur(4px)
    brightness(1.15)
    saturate(1.05)
    drop-shadow(0 0 14px rgba(46,242,226,.22));
}

/* “Velo” para que el planeta se perciba pero no compita con el card */
.Eiwa-globe-layer::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(closest-side at 55% 78%,
    rgba(5,6,8,.35) 0%,
    rgba(5,6,8,.55) 44%,
    rgba(5,6,8,.72) 72%,
    rgba(5,6,8,.86) 100%);
  pointer-events:none;
}

/* 2) Mobile/Tablet: texto izquierdo más pequeño + layout más natural */
@media (max-width: 991.98px){
  /* reduce “peso visual” del bloque izquierdo */
  .Eiwa-auth .aur-hero__title{
    font-size: clamp(1.75rem, 6.2vw, 2.25rem) !important;
    line-height: 1.05;
  }
  .Eiwa-auth .aur-hero__sub{
    font-size: .98rem;
    max-width: 56ch;
  }

  /* el planeta baja y se apaga más en móvil para no tapar */
  .Eiwa-globe{
    opacity: .18;
    filter:
      blur(3.8px)
      saturate(0.9)
      contrast(0.88)
      brightness(0.92)
      drop-shadow(0 0 8px rgba(46,242,226,.12))
      drop-shadow(0 0 14px rgba(92,255,157,.08));
    translate: 0 26px;
  }
}

/* 3) Móvil pequeño: aún más compacto (como tu imagen 2) */
@media (max-width: 575.98px){
  .Eiwa-auth{ padding: 22px 0; }

  .Eiwa-auth .aur-hero__title{
    font-size: clamp(1.55rem, 7.4vw, 2.0rem) !important;
    letter-spacing: -0.02em;
  }
  .Eiwa-auth .aur-hero__sub{
    font-size: .95rem;
    line-height: 1.55;
  }

  /* planeta casi “fantasma” */
  .Eiwa-globe{ opacity: .14; }
}

.Eiwa-planeta-opaco{
  opacity: .5!important;
  filter: blur(0px)
    saturate(0.9)
    contrast(0.88)
    brightness(0.92)
    drop-shadow(0 0 8px rgba(46,242,226,.12))
    drop-shadow(0 0 14px rgba(92,255,157,.08));
  translate: 0 26px!important;
}

/* SOLO INDEX: planeta nítido (override sin tocar eiwa.css) */
.Eiwa-planeta-nitido{
  opacity: 1 !important;
  filter: none !important;
  translate: 0 0 !important;
  mix-blend-mode: normal !important;
}

/* Si el "velo" del contenedor lo oscurece, anúlalo SOLO en index */
.Eiwa-globe-layer::after{
  content: none !important;
}


@media (max-width: 991.98px){
  .Eiwa-auth .aur-hero__title{
    font-size: clamp(1.65rem, 6.6vw, 2.2rem) !important;
    line-height: 1.05;
  }
  .Eiwa-auth .aur-hero__sub{
    font-size: .98rem;
    line-height: 1.55;
  }
}

/* Card un poco más compacta que login */
.Eiwa-reset-card{ max-width: 560px; width:100%; }

/* Botón con ícono sin “romper” el aur-btn */
.Eiwa-btn-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
}



      /* ====== MINI PATCH (solo registro) — prefijo Eiwa- ====== */

      /* Transición Step 1/2 */
      .Eiwa-steps{ position:relative; }
      .Eiwa-step{
        display:none;
        opacity:0;
        transform: translateY(10px);
        transition: opacity var(--t) var(--ease), transform var(--t) var(--ease);
      }
      .Eiwa-step.Eiwa-step--active{
        display:block;
        opacity:1;
        transform: translateY(0);
      }

      /* Header de pasos */
      .Eiwa-stepper{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:.75rem;
        margin-bottom: 1rem;
      }
      .Eiwa-stepper__left{
        display:flex;
        align-items:center;
        gap:.6rem;
        flex-wrap:wrap;
      }
      .Eiwa-stepper__pill{
        display:inline-flex;
        align-items:center;
        gap:.5rem;
        padding:.38rem .7rem;
        border-radius: var(--r-pill);
        border: 1px solid rgba(245,247,250,.14);
        background: rgba(245,247,250,.04);
        color: rgba(245,247,250,.86);
        font-weight: 800;
        font-size: .86rem;
        letter-spacing:.02em;
      }
      .Eiwa-stepper__dot{
        width:.55rem;height:.55rem;border-radius:50%;
        background: var(--Eiwa-grad);
        box-shadow: 0 0 0 1px rgba(245,247,250,.10);
      }
      .Eiwa-progress{
        height: 8px;
        border-radius: var(--r-pill);
        overflow:hidden;
        background: rgba(245,247,250,.08);
        border: 1px solid rgba(245,247,250,.10);
      }
      .Eiwa-progress > span{
        display:block;
        height:100%;
        width: 50%;
        background: var(--Eiwa-grad);
        transition: width var(--t) var(--ease);
      }


      /* Keycap chips (requisitos) */
      .Eiwa-keycaps{
        display:flex;
        flex-wrap:wrap;
        gap:.5rem;
        margin-top:.55rem;
      }
      .Eiwa-keycap{
        display:inline-flex;
        align-items:center;
        gap:.5rem;
        padding:.42rem .68rem;
        border-radius: 12px;
        border: 1px solid rgba(245,247,250,.14);
        background: rgba(245,247,250,.04);
        color: rgba(245,247,250,.80);
        font-weight: 800;
        font-size: .84rem;
        letter-spacing:.01em;
        transition: transform var(--t) var(--ease), border-color var(--t) var(--ease), background var(--t) var(--ease);
      }
      .Eiwa-keycap i{ opacity:.9; }
      .Eiwa-keycap.Eiwa-keycap--ok{
        border-color: rgba(46,242,226,.32);
        background: rgba(46,242,226,.10);
        color: rgba(245,247,250,.92);
        transform: translateY(-1px);
        box-shadow: 0 0 0 1px rgba(46,242,226,.08), 0 18px 50px rgba(46,242,226,.08);
      }

      /* Aviso de dominio */
      .Eiwa-domain-note{
        border: 1px solid rgba(245,247,250,.12);
        background: rgba(10,16,32,.35);
        border-radius: 14px;
        padding: .75rem .85rem;
      }

      /* Responsive: botones de navegación de steps */
      @media (max-width: 575.98px){
        .Eiwa-stepper{ align-items:flex-start; flex-direction:column; }
      }

            /* Glow PRO (nítido): borde + halo suave sin “fog” */
      .Eiwa-card-glowpro{
        position:relative;
        overflow:hidden;
      }

      .Eiwa-card-glowpro::before{
        content:"";
        position:absolute;
        inset:-2px;
        background: linear-gradient(90deg, rgba(92,255,157,.35), rgba(46,242,226,.35));
        opacity:.18;
        filter: blur(10px);
        pointer-events:none;
      }
      .Eiwa-card-glowpro::after{
        content:"";
        position:absolute;
        inset:0;
        border-radius: var(--r-xl);
        box-shadow:
          0 0 0 1px rgba(46,242,226,.14),
          0 18px 70px rgba(46,242,226,.10);
        pointer-events:none;
      }

      

      /* Botón ojo */
      .Eiwa-eye{
        cursor:pointer;
        user-select:none;
      }
      .Eiwa-eye:active{ transform: translateY(1px); }

      /* Estado validación */
      .Eiwa-hint{
        border: 1px solid rgba(245,247,250,.12);
        background: rgba(10,16,32,.35);
        border-radius: 14px;
        padding: .75rem .85rem;
      }
      .Eiwa-hint strong{ font-weight:900; }

            /* Usa el layout auth que ya tienes en eiwa.css (no navbar) */
      .Eiwa-auth--code .Eiwa-auth-card{ max-width: 560px; width:100%; }

      /* Espaciado + grid cómodo, sin duplicar estilos existentes */
      .Eiwa-auth--code .Eiwa-cta-note{
        border: 1px solid rgba(245,247,250,.12);
        background: rgba(10,16,32,.35);
        border-radius: 14px;
        padding: .75rem .85rem;
      }

      /* Ajuste fino del header (cuando está muy compacto en móvil) */
      @media (max-width: 575.98px){
        .Eiwa-auth--code .Eiwa-logo__mark{
          width:40px;
          height:40px;
          border-radius: 14px;
         }
      }

      .Eiwa-vh-fix{
  min-height: 100svh;   /* viewport estable moderno */
}

/* Fallbacks por compatibilidad */
@supports not (height: 100svh){
  .Eiwa-vh-fix{
    min-height: 100vh;
  }
}

    /* Contenedor de página tipo “info” */
    .Eiwa-info-wrap{
        position:relative;
        isolation:isolate;
        overflow-x:hidden; /* mantiene limpio el fondo/parallax */
        overflow-y:auto;   /* permite scroll vertical */
    }

    /* Fondo “infra” con parallax por capas */
    .Eiwa-parallax-layer{
      position:absolute;
      inset:0;
      pointer-events:none;
      z-index:0;
    }
    .Eiwa-parallax-layer::before{
      content:"";
      position:absolute;
      inset:-20%;
      background:
        radial-gradient(1100px 520px at 15% 20%, rgba(46,242,226,.14), transparent 60%),
        radial-gradient(980px 560px at 82% 35%, rgba(92,255,157,.10), transparent 62%),
        radial-gradient(720px 420px at 55% 85%, rgba(245,247,250,.06), transparent 60%);
      opacity:.95;
      transform: translate3d(0,var(--Eiwa-par-1,0px),0);
      transition: transform 40ms linear;
    }
    .Eiwa-parallax-layer::after{
      content:"";
      position:absolute;
      inset:-30%;
      background:
        radial-gradient(circle, rgba(245,247,250,.12) 1px, transparent 2px);
      background-size: 22px 22px;
      transform: rotate(10deg) translate3d(0,var(--Eiwa-par-2,0px),0);
      opacity:.10;
      transition: transform 40ms linear;
    }

    /* Sección con “fixed vibe” (parallax clásico) */
    .Eiwa-parallax-fixed{
      background-attachment: fixed;
      background-image:
        radial-gradient(900px 420px at 25% 10%, rgba(46,242,226,.12), transparent 62%),
        radial-gradient(900px 520px at 85% 40%, rgba(92,255,157,.10), transparent 62%),
        linear-gradient(180deg, rgba(10,16,32,.22), rgba(5,6,8,.0));
    }
    @media (max-width: 991.98px){
      .Eiwa-parallax-fixed{ background-attachment: scroll; }
    }


    .aur-section,
    .aur-section--alt{
      border-top: 0 !important;
      border-bottom: 0 !important;
      outline: 0 !important;
      box-shadow: none !important;
    }

        /* “Orb” decorativa (parallax por JS) */
    .Eiwa-orb{
      position:absolute;
      width: clamp(220px, 22vw, 420px);
      aspect-ratio: 1/1;
      border-radius: 999px;
      filter: blur(0px);
      opacity:.55;
      z-index:0;
      transform: translate3d(0,var(--Eiwa-par-3,0px),0);
      background:
        radial-gradient(circle at 35% 30%, rgba(46,242,226,.35), transparent 55%),
        radial-gradient(circle at 70% 65%, rgba(92,255,157,.25), transparent 60%),
        radial-gradient(circle at 50% 50%, rgba(245,247,250,.10), transparent 62%);
    }
    .Eiwa-orb--a{ top: -80px; left:-60px; }
    .Eiwa-orb--b{ bottom:-120px; right:-70px; opacity:.45; }

    /* Layout “hero info” más vertical (sin duplicar eiwa.css) */
    .Eiwa-info-hero{
      position:relative;
      z-index:1;
      padding: 130px 0 70px;
    }
    @media (max-width: 991.98px){
      .Eiwa-info-hero{ padding: 108px 0 52px; }
    }

    /* Badges mini (reusa chips) */
    .Eiwa-info-badges{
      display:flex;
      flex-wrap:wrap;
      gap:.55rem;
      margin-top: 1rem;
    }

        .Eiwa-stat{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap: 1rem;
    }
    .Eiwa-stat__kpi{
      font-size: clamp(1.6rem, 2.6vw, 2.25rem);
      font-weight: 950;
      letter-spacing: -0.02em;
      line-height: 1;
    }
    .Eiwa-stat__label{
      color: rgba(245,247,250,.70);
      font-weight: 750;
      margin-top:.25rem;
    }

    /* FAQ pro */
    .Eiwa-faq .accordion-item{
      background: rgba(10,16,32,.45);
      border: 1px solid rgba(245,247,250,.10);
      border-radius: 18px;
      overflow:hidden;
      box-shadow: var(--shadow-1);
    }
    .Eiwa-faq .accordion-button{
      background: transparent;
      color: rgba(245,247,250,.92);
      font-weight: 850;
      padding: 1.05rem 1.1rem;
    }
    .Eiwa-faq .accordion-button:focus{
      box-shadow: 0 0 0 4px rgba(46,242,226,.10);
    }
    .Eiwa-faq .accordion-button:not(.collapsed){
      color: var(--Eiwa-c);
      background: rgba(245,247,250,.02);
    }
    .Eiwa-faq .accordion-body{
      color: rgba(245,247,250,.78);
      line-height:1.65;
      padding: 0 1.1rem 1.1rem;
    }

    /* Detalle “grid lines” suave en una sección */
    .Eiwa-gridline{
      position:relative;
      overflow:hidden;
    }
    .Eiwa-gridline::before{
      content:"";
      position:absolute;
      inset:-40%;
      background:
        linear-gradient(90deg, rgba(245,247,250,.06) 1px, transparent 1px),
        linear-gradient(180deg, rgba(245,247,250,.06) 1px, transparent 1px);
      background-size: 34px 34px;
      opacity:.08;
      transform: translate3d(0,var(--Eiwa-par-2,0px),0);
      pointer-events:none;
    }




        /* =========================================================
   FONDOS CON IMÁGENES (SIN CAMBIAR CLASES)
   - Cambia las URLs por tus imágenes en /assets/img/...
   ========================================================= */

/* 1) Variables de imágenes (reemplaza por tus rutas reales) */
:root{
  --aur-bg-hero: url("../img/Eiwa/bg-hero.jpg");
  --aur-bg-vision: url("../img/Eiwa/bg-vision.jpg");
  --aur-bg-flow: url("../img/Eiwa/bg-flow.jpg");
  --aur-bg-arch: url("../img/Eiwa/bg-arch.jpg");
  --aur-bg-faq: url("../img/Eiwa/bg-faq.jpg");
  --aur-bg-contact: url("../img/Eiwa/bg-contact.jpg");
  --aur-bg-cta: url("../img/Eiwa/bg-cta.jpg");
}

/* 2) Base: fondos full + sin repetir */
#top,
#vision,
#como-funciona,
#arquitectura,
#faq,
#contacto,
#empezar{
  position: relative;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

/* 3) Overlay premium para legibilidad (sirve para todas las secciones) */
#top::before,
#vision::before,
#como-funciona::before,
#arquitectura::before,
#faq::before,
#contacto::before,
#empezar::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  /* Oscurece + agrega “glow” Eiwa sin matar la foto */
  background:
    radial-gradient(900px 520px at 18% 22%, rgba(46,242,226,.18), transparent 60%),
    radial-gradient(980px 560px at 82% 35%, rgba(92,255,157,.14), transparent 62%),
    linear-gradient(180deg, rgba(5,6,8,.78), rgba(5,6,8,.92));
}

/* 4) Asegura que el contenido quede por encima del overlay */
#top > .container,
#vision > .container,
#como-funciona > .container,
#arquitectura > .container,
#faq > .container,
#contacto > .container,
#empezar > .container{
  position: relative;
  z-index: 1;
}

/* 5) Asignación de imágenes por sección */
#top{
  background-image: var(--aur-bg-hero);
}
#vision{
  background-image: var(--aur-bg-vision);
}
#como-funciona{
  background-image: var(--aur-bg-flow);
}
#arquitectura{
  background-image: var(--aur-bg-arch);
}
#faq{
  background-image: var(--aur-bg-faq);
}
#contacto{
  background-image: var(--aur-bg-contact);
}
#empezar{
  background-image: var(--aur-bg-cta);
}

/* 6) Efecto “parallax suave” en escritorio (sin romper móviles) */
@media (min-width: 992px){
  #top,
  #vision,
  #como-funciona,
  #arquitectura,
  #faq,
  #contacto,
  #empezar{
    background-attachment: fixed;
  }
}
@media (max-width: 991.98px){
  #top,
  #vision,
  #como-funciona,
  #arquitectura,
  #faq,
  #contacto,
  #empezar{
    background-attachment: scroll;
  }
}

.Eiwa-parallax-layer{
  opacity: .35;
}

/* =========================================================
   Eiwa VIDEO SHOWCASE — minimal new classes (Eiwa-*)
   ========================================================= */

.Eiwa-video-stage{ position:relative; overflow:hidden; }
.Eiwa-video-stage::after{
  content:"";
  position:absolute;
  inset:-30%;
  background:
    radial-gradient(800px 420px at 20% 15%, rgba(46,242,226,.12), transparent 60%),
    radial-gradient(760px 420px at 85% 65%, rgba(92,255,157,.10), transparent 60%);
  opacity:.65;
  pointer-events:none;
}

/* Frame principal tipo “glass video” */
.Eiwa-video-frame{
  position:relative;
  display:block;
  width:100%;
  border: 1px solid rgba(46,242,226,.22);
  border-radius: 26px;
  overflow:hidden;
  background: rgba(5,6,8,.45);
  box-shadow: 0 0 0 1px rgba(245,247,250,.08), 0 22px 70px rgba(0,0,0,.55);
  cursor:pointer;
  padding:0;
  text-align:left;
  transition: transform var(--t) var(--ease), border-color var(--t) var(--ease), box-shadow var(--t) var(--ease);
}
.Eiwa-video-frame:hover{
  transform: translateY(-2px);
  border-color: rgba(92,255,157,.30);
  box-shadow: 0 0 0 1px rgba(46,242,226,.12), 0 28px 90px rgba(0,0,0,.62);
}

.Eiwa-video-bg{
  width:100%;
  height: clamp(260px, 36vw, 460px);
  object-fit: cover;
  display:block;
  filter: saturate(1.08) contrast(1.02);
  transform: scale(1.03);
}

/* overlays premium */
.Eiwa-video-vignette{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(5,6,8,.25), rgba(5,6,8,.78));
}
.Eiwa-video-grid{
  position:absolute; inset:-40%;
  background:
    linear-gradient(90deg, rgba(245,247,250,.06) 1px, transparent 1px),
    linear-gradient(180deg, rgba(245,247,250,.06) 1px, transparent 1px);
  background-size: 34px 34px;
  opacity:.08;
  transform: translate3d(0,var(--Eiwa-par-2,0px),0);
}

/* Play button pro */
.Eiwa-video-play{
  position:absolute;
  left:50%; top:50%;
  translate:-50% -50%;
  width: 86px; height: 86px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  background: rgba(5,6,8,.55);
  border: 1px solid rgba(245,247,250,.16);
  backdrop-filter: blur(14px);
  box-shadow: 0 0 0 1px rgba(46,242,226,.12), 0 18px 60px rgba(46,242,226,.10);
}
.Eiwa-video-play i{
  font-size: 2.6rem;
  line-height:1;
  background: var(--Eiwa-grad);
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
  transform: translateX(2px);
}

/* Meta */
.Eiwa-video-meta{
  position:absolute;
  left: 14px;
  right: 14px;
  bottom: 14px;
  display:flex;
  gap:.55rem;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-start;
}
.Eiwa-video-pill{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding: .45rem .7rem;
  border-radius: 999px;
  border: 1px solid rgba(245,247,250,.14);
  background: rgba(5,6,8,.50);
  color: rgba(245,247,250,.88);
  font-weight: 800;
  font-size: .88rem;
  backdrop-filter: blur(12px);
}

/* Panel playlist */
.Eiwa-video-panel{ position:relative; overflow:hidden; }
.Eiwa-video-panel::before{
  content:"";
  position:absolute;
  inset:-35%;
  background: radial-gradient(closest-side at 35% 20%, rgba(46,242,226,.12), transparent 65%);
  opacity:.55;
  pointer-events:none;
}

/* Item playlist */
.Eiwa-video-item{
  width:100%;
  display:flex;
  gap:.9rem;
  align-items:center;
  text-align:left;
  padding:.75rem .75rem;
  border-radius: 18px;
  border: 1px solid rgba(245,247,250,.12);
  background: rgba(245,247,250,.03);
  transition: transform var(--t) var(--ease), border-color var(--t) var(--ease), background var(--t) var(--ease);
}
.Eiwa-video-item:hover{
  transform: translateY(-1px);
  border-color: rgba(46,242,226,.28);
  background: rgba(46,242,226,.06);
}
.Eiwa-video-thumb{
  width: 92px;
  height: 64px;
  border-radius: 14px;
  overflow:hidden;
  border: 1px solid rgba(245,247,250,.14);
  background: rgba(5,6,8,.45);
  position:relative;
  flex: 0 0 auto;
}
.Eiwa-video-thumb img{
  width:100%; height:100%;
  object-fit: cover;
  display:block;
}
.Eiwa-video-badge{
  position:absolute;
  right:8px; bottom:8px;
  width:28px; height:28px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  background: rgba(5,6,8,.55);
  border: 1px solid rgba(245,247,250,.14);
  backdrop-filter: blur(10px);
}
.Eiwa-video-badge i{
  font-size: 1.05rem;
  color: var(--Eiwa-c);
}

.Eiwa-video-text{ display:flex; flex-direction:column; gap:.2rem; min-width:0; }
.Eiwa-video-title{
  font-weight: 950;
  letter-spacing: -0.01em;
  color: rgba(245,247,250,.94);
  white-space: nowrap;
  overflow:hidden;
  text-overflow: ellipsis;
}
.Eiwa-video-desc{
  font-size: .92rem;
  white-space: nowrap;
  overflow:hidden;
  text-overflow: ellipsis;
}

/* Modal video ratio */
.Eiwa-video-modal{
  position:relative;
  width:100%;
  aspect-ratio: 16/9;
  background: rgba(0,0,0,.55);
}
.Eiwa-video-modal iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

/* Responsive refinements */
@media (max-width: 575.98px){
  .Eiwa-video-play{ width:72px; height:72px; }
  .Eiwa-video-play i{ font-size: 2.2rem; }
  .Eiwa-video-thumb{ width:86px; height:60px; }
}


/* Player embebido dentro del frame (sin modal) */
.Eiwa-video-frame--player{
  position: relative;
}

.Eiwa-video-iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  opacity:0;
  pointer-events:none;
  transition: opacity var(--t) var(--ease);
}

/* Cuando está reproduciendo: iframe visible y overlays fuera */
.Eiwa-video-frame--player.is-playing .Eiwa-video-iframe{
  opacity:1;
  pointer-events:auto;
}

.Eiwa-video-frame--player.is-playing .Eiwa-video-bg,
.Eiwa-video-frame--player.is-playing .Eiwa-video-play,
.Eiwa-video-frame--player.is-playing .Eiwa-video-vignette,
.Eiwa-video-frame--player.is-playing .Eiwa-video-grid{
  opacity:0;
  transition: opacity var(--t) var(--ease);
}

.Eiwa-video-fallback{
  position:absolute;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  z-index:5;
}

.Eiwa-video-fallback-inner{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.85rem 1.05rem;
  border-radius:999px;
  background: rgba(10,18,24,.72);
  border: 1px solid rgba(92,255,157,.25);
  color:#e9fff1;
  box-shadow: 0 20px 55px rgba(0,0,0,.45);
  backdrop-filter: blur(10px);
}

.Eiwa-video-frame--player.is-fallback .Eiwa-video-fallback{
  display:flex;
}


/* =========================
   Eiwa VIDEO — PRO PATCH
   - Playlist scroll elegante
   - Fade + glow en cambios
   - Fallback overlay
   ========================= */

/* 1) Playlist scroll interno */
.Eiwa-playlist-scroll{
  max-height: 520px;
  overflow: auto;
  padding-right: 6px;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
}
@media (max-width: 991.98px){
  .Eiwa-playlist-scroll{ max-height: 420px; }
}

/* Scrollbar pro (Chrome/Edge/Safari) */
.Eiwa-playlist-scroll::-webkit-scrollbar{ width: 10px; }
.Eiwa-playlist-scroll::-webkit-scrollbar-track{ background: rgba(255,255,255,.06); border-radius: 999px; }
.Eiwa-playlist-scroll::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, rgba(95,255,200,.55), rgba(95,255,200,.18));
  border-radius: 999px;
  border: 2px solid rgba(0,0,0,.35);
}
.Eiwa-playlist-scroll::-webkit-scrollbar-thumb:hover{
  background: linear-gradient(180deg, rgba(95,255,200,.75), rgba(95,255,200,.28));
}

/* Firefox */
.Eiwa-playlist-scroll{
  scrollbar-width: thin;
  scrollbar-color: rgba(95,255,200,.45) rgba(255,255,255,.06);
}

/* =========================
   Eiwa PLAYLIST — PRO UX
   - search + categories
   - playing/selected badges
   - focus ring keyboard
   ========================= */

.Eiwa-playlist-controls{
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}

.Eiwa-search{
  position: relative;
}
.Eiwa-search i{
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  opacity: .75;
  pointer-events: none;
}
.Eiwa-search input{
  width: 100%;
  border-radius: 14px;
  padding: 10px 12px 10px 38px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.92);
  outline: none;
}
.Eiwa-search input::placeholder{ color: rgba(255,255,255,.55); }
.Eiwa-search input:focus{
  border-color: rgba(95,255,200,.28);
  box-shadow: 0 0 0 4px rgba(95,255,200,.08);
}

/* chips categoria */
.Eiwa-filters{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.Eiwa-filter-chip{
  appearance: none;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.86);
  border-radius: 999px;
  padding: 7px 10px;
  font-weight: 700;
  font-size: .82rem;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.Eiwa-filter-chip .dot{
  width: 7px; height: 7px;
  border-radius: 99px;
  background: rgba(95,255,200,.75);
  box-shadow: 0 0 0 3px rgba(95,255,200,.10);
}
.Eiwa-filter-chip.is-active{
  border-color: rgba(95,255,200,.35);
  background: linear-gradient(180deg, rgba(95,255,200,.16), rgba(95,255,200,.06));
}

/* Indicadores por item */
.Eiwa-video-item{
  position: relative;
}
.Eiwa-item-badge{
  position: absolute;
  right: 10px;
  top: 10px;
  z-index: 2;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: .76rem;
  font-weight: 800;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.35);
  color: rgba(255,255,255,.88);
  display: none;
  gap: 8px;
  align-items: center;
}
.Eiwa-video-item.is-selected .Eiwa-item-badge{
  display: inline-flex;
}
.Eiwa-video-item.is-playing .Eiwa-item-badge{
  display: inline-flex;
  border-color: rgba(95,255,200,.30);
  background: rgba(0,0,0,.52);
}
.Eiwa-item-badge .pulse{
  width: 7px; height: 7px;
  border-radius: 99px;
  background: rgba(95,255,200,.9);
  box-shadow: 0 0 0 4px rgba(95,255,200,.12);
  animation: EiwaPulse 1.2s infinite ease-in-out;
}
@keyframes EiwaPulse{
  0%,100%{ transform: scale(1); opacity: .85; }
  50%{ transform: scale(1.35); opacity: 1; }
}

/* Focus keyboard */
.Eiwa-video-item:focus-visible{
  outline: none;
  box-shadow: 0 0 0 4px rgba(95,255,200,.10), 0 0 0 1px rgba(95,255,200,.35);
}

/* Item oculto por filtros */
.Eiwa-video-item.is-hidden{ display: none !important; }

/* Estado en header derecha */
.Eiwa-playlist-status{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.82);
  font-weight: 800;
  font-size: .78rem;
}
.Eiwa-playlist-status .dot{
  width: 7px; height: 7px; border-radius: 99px;
  background: rgba(95,255,200,.75);
  box-shadow: 0 0 0 3px rgba(95,255,200,.10);
}

/* 2) Animación: fade + glow */
.Eiwa-video-frame--player{
  position: relative;
  overflow: hidden;
}

/* Cover visible por defecto */
.Eiwa-video-frame--player .Eiwa-video-bg{
  opacity: 1;
  transition: opacity .35s ease, transform .45s ease;
  transform: scale(1);
}

/* Iframe oculto por defecto */
.Eiwa-video-frame--player .Eiwa-video-iframe{
  opacity: 0;
  transition: opacity .35s ease;
}

/* Cuando está reproduciendo */
.Eiwa-video-frame--player.is-playing .Eiwa-video-bg{
  opacity: 0;
  transform: scale(1.02);
  pointer-events: none;
}
.Eiwa-video-frame--player.is-playing .Eiwa-video-iframe{
  opacity: 1;
}

/* Glow al cambiar */
.Eiwa-video-frame--player.is-switching{
  box-shadow:
    0 0 0 1px rgba(95,255,200,.22),
    0 0 22px rgba(95,255,200,.18),
    0 0 55px rgba(95,255,200,.10);
  transition: box-shadow .45s ease;
}

/* 3) Fallback: mostrar botón solo cuando haya problema */
.Eiwa-video-fallback{
  position: absolute;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
  z-index: 6;
  text-decoration: none;
}

.Eiwa-video-frame--player.is-fallback .Eiwa-video-fallback{
  display: flex;
}

.Eiwa-video-fallback-inner{
  display: inline-flex;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 999px;
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(95,255,200,.28);
  box-shadow: 0 18px 45px rgba(0,0,0,.35);
  color: #eafff7;
  font-weight: 700;
}
.Eiwa-video-fallback-inner:hover{
  background: rgba(0,0,0,.70);
}

/* 4) Playlist active estado (si no existe ya) */
.Eiwa-video-item.is-active{
  outline: 1px solid rgba(95,255,200,.35);
  box-shadow: 0 0 0 1px rgba(95,255,200,.10), 0 16px 40px rgba(0,0,0,.22);
}

/* =========================
   Eiwa PLAYLIST — PRO UX
   - search + categories
   - playing/selected badges
   - focus ring keyboard
   ========================= */

.Eiwa-playlist-controls{
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}

.Eiwa-search{
  position: relative;
}
.Eiwa-search i{
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  opacity: .75;
  pointer-events: none;
}
.Eiwa-search input{
  width: 100%;
  border-radius: 14px;
  padding: 10px 12px 10px 38px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.92);
  outline: none;
}
.Eiwa-search input::placeholder{ color: rgba(255,255,255,.55); }
.Eiwa-search input:focus{
  border-color: rgba(95,255,200,.28);
  box-shadow: 0 0 0 4px rgba(95,255,200,.08);
}

/* chips categoria */
.Eiwa-filters{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.Eiwa-filter-chip{
  appearance: none;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.86);
  border-radius: 999px;
  padding: 7px 10px;
  font-weight: 700;
  font-size: .82rem;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.Eiwa-filter-chip .dot{
  width: 7px; height: 7px;
  border-radius: 99px;
  background: rgba(95,255,200,.75);
  box-shadow: 0 0 0 3px rgba(95,255,200,.10);
}
.Eiwa-filter-chip.is-active{
  border-color: rgba(95,255,200,.35);
  background: linear-gradient(180deg, rgba(95,255,200,.16), rgba(95,255,200,.06));
}

/* Indicadores por item */
.Eiwa-video-item{
  position: relative;
}
.Eiwa-item-badge{
  position: absolute;
  right: 10px;
  top: 10px;
  z-index: 2;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: .76rem;
  font-weight: 800;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.35);
  color: rgba(255,255,255,.88);
  display: none;
  gap: 8px;
  align-items: center;
}
.Eiwa-video-item.is-selected .Eiwa-item-badge{
  display: inline-flex;
}
.Eiwa-video-item.is-playing .Eiwa-item-badge{
  display: inline-flex;
  border-color: rgba(95,255,200,.30);
  background: rgba(0,0,0,.52);
}
.Eiwa-item-badge .pulse{
  width: 7px; height: 7px;
  border-radius: 99px;
  background: rgba(95,255,200,.9);
  box-shadow: 0 0 0 4px rgba(95,255,200,.12);
  animation: EiwaPulse 1.2s infinite ease-in-out;
}
@keyframes EiwaPulse{
  0%,100%{ transform: scale(1); opacity: .85; }
  50%{ transform: scale(1.35); opacity: 1; }
}

/* Focus keyboard */
.Eiwa-video-item:focus-visible{
  outline: none;
  box-shadow: 0 0 0 4px rgba(95,255,200,.10), 0 0 0 1px rgba(95,255,200,.35);
}

/* Item oculto por filtros */
.Eiwa-video-item.is-hidden{ display: none !important; }

/* Estado en header derecha */
.Eiwa-playlist-status{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.82);
  font-weight: 800;
  font-size: .78rem;
}
.Eiwa-playlist-status .dot{
  width: 7px; height: 7px; border-radius: 99px;
  background: rgba(95,255,200,.75);
  box-shadow: 0 0 0 3px rgba(95,255,200,.10);
}


 /* Colors - text*/

 .color-text-aux1{
    color: aqua;
 }

  .color-text-aux2{
      color: white !important;
  }