/*
 * 21-luma-cta.css - Bloque Luma como banner CTA oscuro y sobrio con acento dorado.
 * Se carga al final. Las reglas con !important solo neutralizan las de 12/13/14 que tambien lo usan
 * (!important siempre gana a una regla sin el, sin importar la especificidad).
 */

/* ===== Tarjeta ===== */
#lumaAccess.luma-access-large{
  display:block;
  min-height:0!important;
  padding:48px!important;
  border-radius:16px!important;
  border:1px solid #262626;
  background:#171717;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  box-shadow:0 1px 2px rgba(0,0,0,.3),0 20px 50px rgba(0,0,0,.28);
}
#lumaAccess.luma-access-large.visible:hover{
  transform:none;
  border-color:#333;
  box-shadow:0 1px 2px rgba(0,0,0,.3),0 24px 60px rgba(0,0,0,.34);
}
/* Sin brillo glass; el glow que sigue al mouse se mantiene, pero tenue */
#lumaAccess.luma-access-large::after{display:none}
#lumaAccess.luma-access-large::before{
  width:360px;height:360px;
  background:radial-gradient(circle,rgba(245,158,11,.07),transparent 70%);
}

/* ===== Contenido ===== */
#lumaAccess .luma-access-inner{display:block!important;gap:0!important}
#lumaAccess .luma-copy{
  align-items:flex-start!important;
  justify-content:flex-start;
  gap:24px;
  text-align:left;
}

#lumaAccess .luma-badge{
  gap:8px;
  padding:4px 12px;
  border-radius:999px;
  border:1px solid rgba(245,158,11,.4);
  background:rgba(245,158,11,.1);
  box-shadow:none;
  color:#fbbf24;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,'Liberation Mono',monospace;
  font-size:12px;
  line-height:1.6;
  letter-spacing:.2em;
  text-transform:uppercase;
}
#lumaAccess .luma-dot{width:6px;height:6px;background:#fbbf24;box-shadow:0 0 10px rgba(251,191,36,.6)}

#lumaAccess .luma-copy h2{
  margin:0!important;
  max-width:672px;
  color:#fff;
  font-family:Anton,Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  font-size:clamp(30px,5vw,48px);
  line-height:1.05;
  letter-spacing:.02em;
  text-transform:uppercase;
}

#lumaAccess .luma-copy p{
  margin:0;
  max-width:672px!important;
  color:#a3a3a3;
  font-size:18px;
  line-height:1.65;
}

/* ===== Botón ===== */
#lumaAccess .luma-button{
  align-self:flex-start!important;
  width:auto!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  gap:8px;
  padding:20px 24px;
  border-radius:999px;
  border:1px solid rgba(245,158,11,.5);
  background:transparent;
  box-shadow:none;
  color:#fcd34d;
  font-size:12px;
  font-weight:700;
  line-height:1;
  letter-spacing:.18em;
  text-transform:uppercase;
  transition:background-color .25s ease,color .25s ease,border-color .25s ease;
}
#lumaAccess .luma-button:hover,
#lumaAccess .luma-button:focus-visible{
  transform:none;
  background:rgba(245,158,11,.1);
  border-color:rgba(245,158,11,.5);
  box-shadow:none;
  color:#fde68a;
}
#lumaAccess .luma-icon{flex:none;transition:transform .25s ease}
#lumaAccess .luma-button:hover .luma-icon,
#lumaAccess .luma-button:focus-visible .luma-icon{transform:translate(2px,-2px)}

/* ===== Móvil ===== */
@media(max-width:699px){
  #lumaAccess.luma-access-large{padding:24px!important}
  #lumaAccess .luma-copy p{font-size:16px}
  #lumaAccess .luma-button{align-self:stretch!important;width:100%!important}
}

@media(prefers-reduced-motion:reduce){
  #lumaAccess .luma-icon{transition:none}
  #lumaAccess .luma-button:hover .luma-icon{transform:none}
}

/* nav CTA como link */
a.navcta{text-align:center}
