/* ═══════════════════════════════════════════════════════════════════
   LABMYSTIC — SANTUARIO OSCURO v4
   ═══════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&family=Outfit:wght@300;400;500;600&family=Cinzel:wght@400;500;600&display=swap');

/* ── Variables ──────────────────────────────────────────────────── */
:root {
  --lm-void:      #06050d;
  --lm-deep:      #0c0a1a;
  --lm-surface:   #111026;
  --lm-raised:    #1a1733;
  --lm-border:    #2d2850;
  --lm-border-l:  #4a4080;

  --lm-purple:    #8e43f0;
  --lm-purple-l:  #b06fff;
  --lm-purple-d:  #6020c8;
  --lm-purple-glow: rgba(142,67,240,0.20);
  --lm-purple-str:  rgba(142,67,240,0.50);

  --lm-gold:      #c9a55a;
  --lm-gold-l:    #e8c87a;
  --lm-gold-d:    #9a7a38;
  --lm-gold-glow: rgba(201,165,90,0.15);
  --lm-gold-str:  rgba(201,165,90,0.40);

  --lm-cream:     #f0ead8;
  --lm-cream-d:   #c8c0aa;
  --lm-muted:     #9e99b8;
  --lm-dim:       #5a5575;
  --lm-rose:      #c4697f;

  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'Outfit', system-ui, sans-serif;
  --font-caps:    'Cinzel', serif;

  --radius-sm:    6px;
  --radius-md:    12px;
  --radius-lg:    20px;
  --radius-pill:  999px;

  /* Astra */
  --ast-global-color-0: #8e43f0;
  --ast-global-color-1: #7c3aff;
  --ast-global-color-2: #f0ead8;
  --ast-global-color-3: #c8c0aa;
  --ast-global-color-4: #06050d;
  --ast-global-color-5: #f0ead8;
  --ast-global-color-6: #06050d;
  --ast-global-color-7: #1a1733;
  --ast-global-color-8: #0c0a1a;

  --e-global-color-primary:   #8e43f0;
  --e-global-color-secondary: #c9a55a;
  --e-global-color-text:      #f0ead8;
  --e-global-color-accent:    #b06fff;
}

/* ═══════════════════════════════════════════════════════════════════
   BASE OSCURA — máxima especificidad
   ═══════════════════════════════════════════════════════════════════ */

html { background: var(--lm-void) !important; }

body,
#page, .site,
.site-content, #content,
.ast-container,
.ast-page-builder-template,
.ast-page-builder-template .entry-content-wrap,
.ast-separate-container .entry-content-wrap,
.ast-content-area,
.content-area,
.ast-above-post-title,
.ast-breadcrumbs-wrapper,
.ast-separate-container,
.ast-separate-container #primary,
.ast-separate-container .entry-content,
.ast-page-builder-template #primary,
.ast-page-builder-template .site-content {
  background-color: var(--lm-deep) !important;
  color: var(--lm-cream-d) !important;
}

/* ── Astra header wrappers — eliminar fondo blanco lateral ───── */
.main-header-bar-wrap,
.main-header-bar,
.ast-primary-header-bar,
.ast-above-header,
.ast-below-header,
.ast-header-wrap,
.ast-mobile-header-wrap,
.ast-header-break-point .ast-mobile-header-section,
.ast-header-break-point .main-header-bar {
  background-color: transparent !important;
}

/* Asegurar que nada debajo del header sea blanco */
#masthead *:not(img):not(svg):not(path):not(canvas):not(video) {
  background-color: transparent !important;
}
#masthead a, #masthead nav, #masthead .ast-container,
#masthead .main-header-bar, #masthead .main-header-bar-wrap {
  background: transparent !important;
}

body {
  font-family: var(--font-body) !important;
  font-weight: 300 !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
  -webkit-font-smoothing: antialiased !important;
}

/* Grain */
body::before {
  content: '';
  position: fixed; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events: none; z-index: 9998; opacity: 0.5; mix-blend-mode: overlay;
}

/* ═══════════════════════════════════════════════════════════════════
   ★ SHAPE DIVIDERS — eliminar ondas blancas (problema principal)
   ═══════════════════════════════════════════════════════════════════ */

/* Los shape dividers de Elementor usan fill inline en el SVG path.
   !important en CSS externo sí overridea inline style sin !important. */
.elementor-shape,
.elementor-shape-top,
.elementor-shape-bottom {
  color: var(--lm-deep) !important;
  overflow: hidden;
}

.elementor-shape svg,
.elementor-shape-top svg,
.elementor-shape-bottom svg {
  fill: var(--lm-deep) !important;
}

.elementor-shape path,
.elementor-shape-fill,
.elementor-shape svg path,
.elementor-shape-top path,
.elementor-shape-bottom path {
  fill: var(--lm-deep) !important;
  stroke: none !important;
}

/* Variante cuando la sección vecina es más oscura */
.elementor-top-section:first-child .elementor-shape-bottom path,
.elementor-top-section:first-child .elementor-shape-bottom svg {
  fill: var(--lm-deep) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   FOOTER — override nuclear
   ═══════════════════════════════════════════════════════════════════ */

.site-footer,
#colophon,
#ast-fixed-footer,
.ast-footer-widget-area,
.footer-widget-area,
.ast-footer-below-widgets,
.ast-footer-widget-area-wrap,
.ast-footer-overlay,
footer,
footer *:not(a):not(span):not(strong):not(em):not(p) {
  background-color: var(--lm-void) !important;
}

.site-footer {
  border-top: 1px solid rgba(142,67,240,0.2) !important;
  position: relative;
  color: var(--lm-dim) !important;
}

.site-footer::before {
  content: '';
  position: absolute; top: 0; left: 50%;
  transform: translateX(-50%);
  width: 100px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--lm-purple), transparent);
}

.site-footer .widget-title, .footer-widget-area .widget-title {
  font-family: var(--font-caps) !important;
  font-size: 0.7rem !important; letter-spacing: 0.2em !important;
  color: var(--lm-purple-l) !important; text-transform: uppercase;
  margin-bottom: 20px !important;
  -webkit-text-fill-color: var(--lm-purple-l) !important;
  background: none !important;
}

.site-footer p, .site-footer li, .site-footer span, .site-footer div {
  color: var(--lm-dim) !important;
  background-color: transparent !important;
}

.site-footer a, .ast-footer-widget-area a {
  color: var(--lm-muted) !important; transition: color 0.2s ease !important;
}
.site-footer a:hover { color: var(--lm-purple-l) !important; }

.ast-footer-bottom-bar, .footer-bar-content {
  border-top: 1px solid var(--lm-border) !important;
  padding: 16px 0 !important;
  color: var(--lm-dim) !important;
  font-size: 0.78rem !important;
  font-family: var(--font-caps) !important;
  letter-spacing: 0.1em;
  background: transparent !important;
}

/* Email widget en footer con caja oscura */
.site-footer .elementor-widget-text-editor,
.site-footer .wp-widget-group__inner-blocks {
  background: var(--lm-surface) !important;
  border: 1px solid var(--lm-border) !important;
  border-radius: var(--radius-md) !important;
  padding: 20px 24px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   HEADER
   ═══════════════════════════════════════════════════════════════════ */

/* Forzar fondo oscuro en TODO el ancho del header y sus wrappers */
#masthead,
.site-header,
.main-header-bar-wrap,
.main-header-bar,
.ast-primary-header-bar,
.ast-above-header-bar,
.ast-below-header-bar,
.ast-header-break-point .site-header,
.ast-header-break-point .main-header-bar {
  background: rgba(6,5,13,0.88) !important;
  backdrop-filter: blur(20px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
  border-bottom: 1px solid rgba(142,67,240,0.25) !important;
  transition: background 0.4s ease, box-shadow 0.4s ease !important;
  width: 100% !important;
}

#masthead.scrolled {
  background: rgba(6,5,13,0.97) !important;
  box-shadow: 0 4px 40px rgba(0,0,0,0.7), 0 0 0 1px rgba(142,67,240,0.12) !important;
}

.site-title, .site-title a {
  font-family: var(--font-caps) !important;
  color: var(--lm-purple-l) !important;
  letter-spacing: 0.15em; font-size: 1.2rem;
  -webkit-text-fill-color: var(--lm-purple-l) !important;
  background: none !important;
}

.main-navigation a, .ast-nav-menu a, #site-navigation a {
  font-family: var(--font-caps) !important;
  font-size: 0.72rem !important; letter-spacing: 0.1em !important;
  color: var(--lm-muted) !important; text-transform: uppercase !important;
  padding: 8px 12px !important; transition: color 0.25s ease !important;
  position: relative;
}

.main-navigation a::after, .ast-nav-menu > li > a::after {
  content: ''; position: absolute; bottom: 2px; left: 50%;
  width: 0; height: 1px;
  background: var(--lm-purple);
  box-shadow: 0 0 6px var(--lm-purple-str);
  transition: width 0.3s ease, left 0.3s ease;
}
.main-navigation a:hover::after,
.ast-nav-menu > li:hover > a::after,
.ast-nav-menu > li.current-menu-item > a::after {
  width: calc(100% - 24px); left: 12px;
}
.main-navigation a:hover, .ast-nav-menu a:hover,
.current-menu-item > a,
.ast-nav-menu > li.current-menu-item > a {
  color: var(--lm-purple-l) !important;
}

.main-navigation .sub-menu, .ast-nav-menu .sub-menu {
  background: rgba(6,5,13,0.98) !important;
  border: 1px solid var(--lm-border) !important;
  border-top: 2px solid var(--lm-purple) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.8) !important;
  border-radius: 0 0 var(--radius-md) var(--radius-md) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   TIPOGRAFÍA
   ═══════════════════════════════════════════════════════════════════ */

h1, h2, h3, h4, h5, h6,
.elementor-heading-title,
.entry-title {
  font-family: var(--font-display) !important;
  color: var(--lm-cream) !important;
  -webkit-text-fill-color: var(--lm-cream);
  font-weight: 300 !important;
  line-height: 1.2 !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}

/* H1 — shimmer animado morado/crema */
h1,
.elementor-heading-title.elementor-size-xxl,
.elementor-heading-title.elementor-size-xl {
  background: linear-gradient(135deg,
    var(--lm-cream) 0%,
    var(--lm-purple-l) 40%,
    var(--lm-cream) 75%,
    var(--lm-gold-l) 100%) !important;
  background-size: 300% auto !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  animation: shimmer-h1 8s linear infinite !important;
  /* Tamaño responsivo — sin hyphenation para evitar cortes feos */
  font-size: clamp(1.8rem, 4vw, 4rem) !important;
  line-height: 1.15 !important;
  letter-spacing: 0.04em !important;
  hyphens: none !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
}

@keyframes shimmer-h1 { to { background-position: 300% center; } }

h2, .elementor-heading-title.elementor-size-large {
  font-size: clamp(1.5rem, 2.8vw, 2.6rem) !important;
  color: var(--lm-cream) !important;
  -webkit-text-fill-color: var(--lm-cream) !important;
  letter-spacing: 0.06em !important;
}

h3, .elementor-heading-title.elementor-size-medium {
  font-size: clamp(1.1rem, 1.8vw, 1.6rem) !important;
  color: var(--lm-purple-l) !important;
  -webkit-text-fill-color: var(--lm-purple-l) !important;
}

h4 { color: var(--lm-cream-d) !important; -webkit-text-fill-color: var(--lm-cream-d) !important; }

/* Small headings inline en secciones con bg propio */
.elementor-heading-title.elementor-size-small {
  font-family: var(--font-caps) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.2em !important;
  color: var(--lm-gold) !important;
  -webkit-text-fill-color: var(--lm-gold) !important;
  background: none !important;
  animation: none !important;
  text-transform: uppercase;
}

p, .elementor-widget-text-editor p,
.elementor-text-editor, .elementor-widget-text-editor {
  font-family: var(--font-body) !important;
  color: var(--lm-cream-d) !important;
  font-weight: 300 !important; line-height: 1.85 !important;
}

/* Texto en secciones con image bg (hero) — más brillante */
.elementor-top-section:first-child p,
.elementor-top-section:first-child .elementor-widget-text-editor p {
  color: rgba(240,234,216,0.9) !important;
}

/* Quotes / cursiva */
em, i, blockquote, .elementor-blockquote {
  color: var(--lm-cream) !important;
  font-family: var(--font-display) !important;
  font-style: italic !important;
}

a { color: var(--lm-purple-l); transition: color 0.2s ease; }
a:hover { color: var(--lm-gold); }

/* Dividers */
.elementor-widget-divider .elementor-divider-separator {
  border-color: var(--lm-purple-str) !important;
}
.elementor-widget-divider .elementor-divider__element {
  color: var(--lm-purple-l) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   SECCIONES — fondos inline overrides
   ═══════════════════════════════════════════════════════════════════ */

/* Secciones con inline bg claro → surface dark */
.elementor-section[style*="background-color: #F3F1F6"],
.elementor-section[style*="background-color:#F3F1F6"],
.elementor-section[style*="background-color: #f3f1f6"],
.elementor-section[style*="background-color: #ffffff"],
.elementor-section[style*="background-color: #FFFFFF"],
.elementor-section[style*="background-color: rgb(243"],
.elementor-section[style*="background-color: rgb(255, 255, 255)"],
.e-container[style*="background-color: #F3F1F6"],
.e-container[style*="background-color: #f3f1f6"],
.e-container[style*="background-color: #ffffff"],
.e-container[style*="background-color: #FFFFFF"],
.e-container[style*="background-color: rgb(255, 255, 255)"],
.elementor-inner-section[style*="background-color: #fff"],
.elementor-inner-section[style*="background-color: #ffffff"],
.elementor-inner-section[style*="background-color: #FFFFFF"],
.elementor-inner-section[style*="background-color: rgb(255"],
.elementor-column[style*="background-color: #ffffff"],
.elementor-column[style*="background-color: #FFFFFF"],
.elementor-column[style*="background-color: rgb(255, 255, 255)"] {
  background-color: var(--lm-surface) !important;
}

/* Degradado en hero para fundir */
.elementor-top-section:first-child {
  position: relative;
}
.elementor-top-section:first-child::after {
  content: '';
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 180px;
  background: linear-gradient(to top, var(--lm-deep), transparent);
  pointer-events: none; z-index: 2;
}

/* ═══════════════════════════════════════════════════════════════════
   BOTONES
   ═══════════════════════════════════════════════════════════════════ */

.elementor-button,
.elementor-button-wrapper .elementor-button,
.ast-button,
input[type="submit"],
.wp-block-button__link {
  font-family: var(--font-caps) !important;
  font-size: 0.7rem !important; letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  padding: 13px 36px !important; border-radius: var(--radius-pill) !important;
  font-weight: 500 !important;
  transition: all 0.35s cubic-bezier(0.4,0,0.2,1) !important;
  cursor: pointer !important; position: relative !important; overflow: hidden !important;
  background: linear-gradient(135deg, var(--lm-purple-d), var(--lm-purple)) !important;
  background-size: 200% auto !important;
  color: #fff !important; border: none !important;
  box-shadow: 0 4px 20px var(--lm-purple-glow) !important;
}

.elementor-button:hover,
.elementor-button-wrapper .elementor-button:hover,
input[type="submit"]:hover {
  background-position: right center !important;
  box-shadow: 0 6px 30px var(--lm-purple-str) !important;
  transform: translateY(-2px) !important; color: #fff !important;
}

/* Botón outline */
.elementor-button.elementor-button-link,
.elementor-button[style*="background: transparent"],
.elementor-button[style*="background:transparent"],
.elementor-button[style*="background-color: rgba(0, 0, 0, 0)"] {
  background: transparent !important;
  border: 1px solid var(--lm-purple-str) !important;
  color: var(--lm-purple-l) !important; box-shadow: none !important;
}
.elementor-button.elementor-button-link:hover {
  background: var(--lm-purple-glow) !important;
  border-color: var(--lm-purple) !important;
}

/* Ocultar íconos en botones de Elementor */
.elementor-button .elementor-button-icon,
.elementor-button-wrapper .elementor-button-icon {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════════════════
   CARDS & ICONOS
   ═══════════════════════════════════════════════════════════════════ */

.elementor-widget-icon-box .elementor-icon-box-wrapper,
.elementor-icon-box-wrapper,
.elementor-posts-container article {
  background: var(--lm-surface) !important;
  border: 1px solid var(--lm-border) !important;
  border-radius: var(--radius-lg) !important;
  padding: 32px !important;
  transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}

.elementor-icon-box-wrapper:hover,
.elementor-posts-container article:hover {
  transform: translateY(-4px) !important;
  border-color: var(--lm-purple) !important;
  box-shadow: 0 16px 50px rgba(0,0,0,0.5), 0 0 0 1px var(--lm-purple-glow) !important;
}

.elementor-icon i, .elementor-icon-box-icon i { color: var(--lm-purple-l) !important; }

.elementor-widget-image img {
  border-radius: var(--radius-md);
  transition: transform 0.4s ease;
}
.elementor-widget-image:hover img { transform: scale(1.02); }

/* ═══════════════════════════════════════════════════════════════════
   INSTAGRAM FEED
   ═══════════════════════════════════════════════════════════════════ */

#sbi_mod_error, .sbi-header-img-hover, .sb-instagram,
.sbi-header-outer, .sbi-header, .sbi-header-inner,
.sbi-header-text, .sbi-header-link,
[id^="sbi_"], [class^="sbi-"] {
  background: transparent !important;
  background-color: transparent !important;
}

.sbi-header-img {
  border: 2px solid var(--lm-purple-str) !important;
  border-radius: 50% !important;
}

.sbi-screenreader, .sbi-header-link,
.sbi-header-text p, .sbi-header-text a,
.sbi-header-text span {
  color: var(--lm-cream-d) !important;
}

.sbi-header-text .sbi-header-name {
  color: var(--lm-purple-l) !important;
  font-family: var(--font-caps) !important;
}

.sbi_follow_btn a, .sbi-follow-btn {
  background: linear-gradient(135deg, var(--lm-purple-d), var(--lm-purple)) !important;
  color: #fff !important;
  border-radius: var(--radius-pill) !important;
  font-family: var(--font-caps) !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.12em !important;
  border: none !important;
  padding: 10px 24px !important;
}

.sbi_photo_wrap img { border-radius: var(--radius-sm) !important; }

/* Fondo de la sección de Instagram */
.sbi-feed-container, .sbi, #sbi_images { background: transparent !important; }

/* ═══════════════════════════════════════════════════════════════════
   SSA — RESERVAS (v3 completo)
   ═══════════════════════════════════════════════════════════════════ */

/* Block availability (selector de fecha tipo semana) */
.ssa-block-availability,
.ssa-appointment-type-block,
[class*="ssa-block-availability"] {
  background: var(--lm-surface) !important;
  border: 1px solid var(--lm-border) !important;
  border-radius: var(--radius-lg) !important;
  padding: 24px !important;
  margin-bottom: 20px !important;
}

/* Cabecera del tipo de sesión */
.ssa-appointment-type-header,
.ssa-appointment-type-block-header {
  border-bottom: 1px solid var(--lm-border) !important;
  padding-bottom: 16px !important;
  margin-bottom: 16px !important;
}

.ssa-appointment-type-header h3,
.ssa-appointment-type-block h3,
.ssa-appointment-type-name,
.ssa-appointment-type-title {
  font-family: var(--font-display) !important;
  color: var(--lm-cream) !important;
  -webkit-text-fill-color: var(--lm-cream) !important;
  font-size: 1.2rem !important;
  background: none !important;
  animation: none !important;
}

/* Duración y zona horaria */
.ssa-appointment-type-duration,
.ssa-appointment-type-price,
.ssa-timezone-label,
[class*="ssa-timezone"],
[class*="ssa-duration"] {
  color: var(--lm-muted) !important;
  font-size: 0.82rem !important;
  font-family: var(--font-body) !important;
}

/* Botón de edición timezone */
.ssa-timezone-edit-button,
[class*="ssa-edit"] button {
  color: var(--lm-purple-l) !important;
  background: transparent !important;
  border: none !important;
}

/* ── Selector de fechas (semanas) ── */
.ssa-block-availability-dates,
.ssa-dates-wrap,
[class*="ssa-dates"] {
  background: transparent !important;
}

/* Las celdas de fecha — estas tienen background: white inline desde SSA */
.ssa-block-availability-date,
.ssa-date-cell,
[class*="ssa-date-cell"],
[class*="ssa-block-availability-date"] {
  background: var(--lm-raised) !important;
  border: 1px solid var(--lm-border) !important;
  border-radius: var(--radius-sm) !important;
  color: var(--lm-muted) !important;
  transition: all 0.25s ease !important;
}

/* Fecha disponible */
.ssa-block-availability-date.available,
.ssa-date-cell.available,
[class*="ssa-date-cell"][class*="available"],
[class*="ssa-block-availability-date"][class*="available"] {
  border-color: var(--lm-border-l) !important;
  color: var(--lm-cream-d) !important;
  cursor: pointer;
}

.ssa-block-availability-date.available:hover,
.ssa-date-cell.available:hover {
  background: var(--lm-purple-glow) !important;
  border-color: var(--lm-purple) !important;
  color: var(--lm-purple-l) !important;
}

/* Fecha seleccionada */
.ssa-block-availability-date.selected,
.ssa-date-cell.selected {
  background: var(--lm-purple) !important;
  border-color: var(--lm-purple) !important;
  color: #fff !important;
  box-shadow: 0 4px 15px var(--lm-purple-glow) !important;
}

/* Fecha no disponible */
.ssa-block-availability-date:not(.available),
.ssa-date-cell:not(.available) {
  opacity: 0.4 !important;
  color: var(--lm-dim) !important;
}

/* Texto dentro de celdas de fecha */
.ssa-block-availability-date *,
.ssa-date-cell * {
  color: inherit !important;
  background: transparent !important;
}

/* Flecha navegación semanas */
.ssa-block-availability-prev,
.ssa-block-availability-next,
[class*="ssa-nav"] button,
[class*="ssa-prev"], [class*="ssa-next"] {
  color: var(--lm-purple-l) !important;
  background: var(--lm-raised) !important;
  border: 1px solid var(--lm-border) !important;
  border-radius: 50% !important;
  width: 32px !important; height: 32px !important;
  transition: all 0.2s ease !important;
}
.ssa-block-availability-prev:hover,
.ssa-block-availability-next:hover {
  background: var(--lm-purple-glow) !important;
  border-color: var(--lm-purple) !important;
}

/* Slots de hora */
.ssa-slot, .ssa-time-slot, [class*="ssa-slot"] {
  background: var(--lm-raised) !important;
  border: 1px solid var(--lm-border) !important;
  border-radius: var(--radius-sm) !important;
  color: var(--lm-cream-d) !important;
  font-family: var(--font-body) !important;
  font-size: 0.85rem !important;
  transition: all 0.25s ease !important;
}
.ssa-slot:hover { border-color: var(--lm-purple-d) !important; background: var(--lm-purple-glow) !important; color: var(--lm-purple-l) !important; }
.ssa-slot.selected { background: var(--lm-purple) !important; border-color: var(--lm-purple) !important; color: #fff !important; }

/* Formulario SSA */
.ssa-booking-form, .ssa-appointment-type-list, .ssa-booking-form-wrap {
  background: var(--lm-surface) !important;
  border: 1px solid var(--lm-border) !important;
  border-radius: var(--radius-lg) !important;
  padding: 32px !important;
}

.ssa-booking-form input, .ssa-booking-form select, .ssa-booking-form textarea,
.ssa-form-field input, .ssa-form-field textarea {
  background: var(--lm-raised) !important; border: 1px solid var(--lm-border) !important;
  border-radius: var(--radius-sm) !important; color: var(--lm-cream) !important;
  font-family: var(--font-body) !important; padding: 12px 16px !important;
}
.ssa-booking-form input:focus, .ssa-booking-form textarea:focus {
  outline: none !important; border-color: var(--lm-purple-d) !important;
  box-shadow: 0 0 0 2px var(--lm-purple-glow) !important;
}
.ssa-booking-form input::placeholder, .ssa-booking-form textarea::placeholder { color: var(--lm-dim) !important; }
.ssa-form-label label, .ssa-field-label { font-family: var(--font-caps) !important; font-size: 0.68rem !important; letter-spacing: 0.18em; color: var(--lm-muted) !important; text-transform: uppercase; }

.ssa-button-submit, .ssa-booking-form button[type="submit"] {
  background: linear-gradient(135deg, var(--lm-purple-d), var(--lm-purple)) !important;
  color: #fff !important; font-family: var(--font-caps) !important;
  font-size: 0.72rem !important; letter-spacing: 0.18em !important;
  text-transform: uppercase !important; padding: 14px 36px !important;
  border-radius: var(--radius-pill) !important; border: none !important;
}
.ssa-button-submit:hover { box-shadow: 0 6px 25px var(--lm-purple-str) !important; transform: translateY(-2px) !important; }

/* ═══════════════════════════════════════════════════════════════════
   WPFORMS
   ═══════════════════════════════════════════════════════════════════ */

.wpforms-form label, .wpforms-field-label {
  font-family: var(--font-caps) !important; font-size: 0.68rem !important;
  letter-spacing: 0.18em !important; color: var(--lm-muted) !important;
  text-transform: uppercase; margin-bottom: 8px !important;
}
.wpforms-form input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]),
.wpforms-form select, .wpforms-form textarea {
  background: var(--lm-raised) !important; border: 1px solid var(--lm-border) !important;
  border-radius: var(--radius-sm) !important; color: var(--lm-cream) !important;
  font-family: var(--font-body) !important; font-size: 0.9rem !important;
  padding: 14px 16px !important; width: 100% !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
}
.wpforms-form input:focus, .wpforms-form textarea:focus {
  outline: none !important; border-color: var(--lm-purple-d) !important;
  box-shadow: 0 0 0 3px var(--lm-purple-glow) !important;
}
.wpforms-form input::placeholder, .wpforms-form textarea::placeholder { color: var(--lm-dim) !important; }
.wpforms-form textarea { min-height: 120px !important; resize: vertical !important; }

.wpforms-submit, .wpforms-form .wpforms-submit-container button[type="submit"] {
  background: linear-gradient(135deg, var(--lm-purple-d), var(--lm-purple)) !important;
  color: #fff !important; font-family: var(--font-caps) !important;
  font-size: 0.72rem !important; letter-spacing: 0.2em !important;
  text-transform: uppercase !important; padding: 14px 40px !important;
  border-radius: var(--radius-pill) !important; border: none !important; cursor: pointer !important;
}
.wpforms-submit:hover { box-shadow: 0 6px 25px var(--lm-purple-str) !important; transform: translateY(-2px) !important; }

.wpforms-confirmation-container-full {
  background: var(--lm-raised) !important; border: 1px solid var(--lm-purple-d) !important;
  border-radius: var(--radius-md) !important; padding: 24px !important; color: var(--lm-cream) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   TESTIMONIOS
   ═══════════════════════════════════════════════════════════════════ */

.elementor-testimonial-content {
  font-family: var(--font-display) !important; font-size: 1.1rem !important;
  font-style: italic !important; color: var(--lm-cream) !important; line-height: 1.8 !important;
}
.elementor-testimonial-content::before {
  content: '\201C'; font-family: var(--font-display); font-size: 3.5rem;
  color: var(--lm-purple-l); line-height: 0; vertical-align: -1.1rem;
  margin-right: 4px; opacity: 0.5;
}
.elementor-testimonial-name {
  font-family: var(--font-caps) !important; font-size: 0.7rem !important;
  letter-spacing: 0.2em !important; color: var(--lm-gold) !important; text-transform: uppercase !important;
  -webkit-text-fill-color: var(--lm-gold) !important; background: none !important;
}
.elementor-testimonial-job { color: var(--lm-muted) !important; font-size: 0.85rem !important; }

.elementor-swiper-button, .swiper-button-next, .swiper-button-prev {
  color: var(--lm-purple-l) !important;
  background: rgba(142,67,240,0.1) !important;
  border: 1px solid var(--lm-purple-str) !important;
  border-radius: 50% !important; width: 38px !important; height: 38px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   LISTAS
   ═══════════════════════════════════════════════════════════════════ */

.entry-content ul, .elementor-text-editor ul {
  list-style: none !important; padding-left: 0 !important;
}
.entry-content ul li, .elementor-text-editor ul li {
  padding-left: 22px; position: relative; margin-bottom: 8px;
  color: var(--lm-cream-d) !important;
}
.entry-content ul li::before, .elementor-text-editor ul li::before {
  content: '✦'; position: absolute; left: 0;
  color: var(--lm-purple-l); font-size: 0.55em; top: 0.35em;
}
.entry-content strong, .elementor-text-editor strong,
.entry-content b, .elementor-text-editor b {
  color: var(--lm-cream) !important; font-weight: 600 !important;
}

/* ═══════════════════════════════════════════════════════════════════
   REVEAL ANIMATION
   ═══════════════════════════════════════════════════════════════════ */

.lm-reveal {
  opacity: 0; transform: translateY(24px);
  transition: opacity 0.65s cubic-bezier(0.4,0,0.2,1), transform 0.65s cubic-bezier(0.4,0,0.2,1);
}
.lm-reveal.lm-visible { opacity: 1; transform: translateY(0); }
.lm-reveal-delay-1 { transition-delay: 0.07s; }
.lm-reveal-delay-2 { transition-delay: 0.14s; }
.lm-reveal-delay-3 { transition-delay: 0.21s; }
.lm-reveal-delay-4 { transition-delay: 0.28s; }

/* ═══════════════════════════════════════════════════════════════════
   CURSOR MÍSTICO
   ═══════════════════════════════════════════════════════════════════ */

@media (pointer: fine) {
  body { cursor: none; }
  a, button, .elementor-button, .ssa-slot, input, textarea, select { cursor: none; }
}

#lm-cursor-dot {
  position: fixed; width: 5px; height: 5px;
  border-radius: 50%; background: #fff;
  pointer-events: none; z-index: 99999;
  transform: translate(-50%,-50%);
  mix-blend-mode: difference;
}

#lm-cursor-glyph {
  position: fixed; font-size: 16px; line-height: 1;
  color: var(--lm-purple-l);
  pointer-events: none; z-index: 99998;
  transform: translate(-50%,-50%);
  transition: color 0.3s ease, font-size 0.3s ease, opacity 0.3s ease;
  opacity: 0.7; user-select: none;
  text-shadow: 0 0 10px var(--lm-purple-str), 0 0 25px var(--lm-purple-glow);
}
#lm-cursor-glyph.hovering {
  font-size: 22px; color: var(--lm-gold); opacity: 1;
  text-shadow: 0 0 15px var(--lm-gold-str), 0 0 35px var(--lm-gold-glow);
}

#lm-cursor-ring {
  position: fixed; width: 34px; height: 34px;
  border-radius: 50%; border: 1px solid var(--lm-purple-str);
  pointer-events: none; z-index: 99997;
  transform: translate(-50%,-50%);
  transition: width 0.3s ease, height 0.3s ease, border-color 0.3s ease;
  animation: ring-pulse 3s ease-in-out infinite;
}
#lm-cursor-ring.hovering { width: 48px; height: 48px; border-color: var(--lm-gold-str); }

@keyframes ring-pulse {
  0%,100% { box-shadow: 0 0 0 0 var(--lm-purple-glow); }
  50%      { box-shadow: 0 0 0 6px transparent; }
}

/* ═══════════════════════════════════════════════════════════════════
   LOADER
   ═══════════════════════════════════════════════════════════════════ */

#lm-loader {
  position: fixed; inset: 0; background: var(--lm-void);
  z-index: 100000; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 18px;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}
#lm-loader.lm-loaded { opacity: 0; visibility: hidden; }

#lm-loader-sigil {
  font-size: 2rem; color: var(--lm-purple-l); display: block;
  text-shadow: 0 0 20px var(--lm-purple-str), 0 0 60px var(--lm-purple-glow);
  animation: sigil-spin 3s linear infinite;
}
#lm-loader-symbol {
  font-family: var(--font-caps); font-size: 1.1rem; letter-spacing: 0.4em;
  color: var(--lm-purple-l); text-shadow: 0 0 20px var(--lm-purple-str);
  animation: loader-glow 1s ease-in-out infinite alternate;
}
#lm-loader-bar-track { width: 90px; height: 1px; background: var(--lm-border); }
#lm-loader-bar {
  height: 100%;
  background: linear-gradient(90deg, var(--lm-purple), var(--lm-purple-l));
  box-shadow: 0 0 6px var(--lm-purple-str);
  animation: loader-fill 0.5s ease forwards;
}

@keyframes loader-fill { from { width: 0; } to { width: 100%; } }
@keyframes loader-glow {
  from { text-shadow: 0 0 8px var(--lm-purple-str); }
  to   { text-shadow: 0 0 25px var(--lm-purple-l), 0 0 50px var(--lm-purple-glow); }
}
@keyframes sigil-spin { to { transform: rotate(360deg); } }

/* ═══════════════════════════════════════════════════════════════════
   MISC
   ═══════════════════════════════════════════════════════════════════ */

*:focus-visible { outline: 2px solid var(--lm-purple); outline-offset: 3px; border-radius: 2px; }
#ast-scroll-top { background: var(--lm-purple) !important; color: #fff !important; border-radius: 50% !important; }

.ast-breadcrumbs-wrapper span, .ast-breadcrumbs a {
  color: var(--lm-dim) !important; font-size: 0.75rem; font-family: var(--font-caps); letter-spacing: 0.1em;
}

::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: var(--lm-void); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--lm-purple), var(--lm-purple-d));
  border-radius: var(--radius-pill);
}

::selection { background: var(--lm-purple); color: #fff; }

@media (max-width: 768px) {
  #lm-cursor-dot, #lm-cursor-glyph, #lm-cursor-ring { display: none !important; }
  body { cursor: auto !important; }
  a, button, input { cursor: pointer !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   PARALLAX — todas las páginas
   ═══════════════════════════════════════════════════════════════════ */

/* Efecto parallax en secciones con imagen de fondo en desktop */
@media (min-width: 769px) {
  .elementor-section[style*="background-image"],
  .e-container[style*="background-image"],
  .elementor-top-section[style*="background-image"] {
    background-attachment: fixed !important;
    background-size: cover !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   HERO OVERLAY — todas las páginas (no solo index)
   Garantiza overlay oscuro aunque Elementor tenga config diferente
   ═══════════════════════════════════════════════════════════════════ */

/* Overlay base en TODA sección que tenga imagen de fondo */
.elementor-section[style*="background-image"] .elementor-background-overlay,
.elementor-top-section[style*="background-image"] .elementor-background-overlay {
  background-color: rgba(6,5,13,0.52) !important;
  opacity: 1 !important;
}

/* Hero de primer nivel en cualquier página */
.elementor-top-section:first-child .elementor-background-overlay {
  background-color: rgba(6,5,13,0.55) !important;
  opacity: 1 !important;
}

/* Heading en hero: siempre legible */
.elementor-top-section:first-child .elementor-widget-heading h1,
.elementor-top-section:first-child .elementor-widget-heading h2,
.elementor-top-section:first-child .elementor-heading-title {
  text-shadow: 0 2px 30px rgba(0,0,0,0.8), 0 0 60px rgba(0,0,0,0.5) !important;
}

/* Fusión hero→content en TODAS las páginas */
.elementor-top-section:first-child {
  position: relative;
}
.elementor-top-section:first-child::after {
  content: '';
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 160px;
  background: linear-gradient(to top, var(--lm-deep), transparent);
  pointer-events: none; z-index: 3;
}

/* ── Hero fallback para páginas sin imagen de fondo ──────────── */
/* Aplica un gradiente místico en la primera sección si no tiene bg-image */
.elementor-top-section:first-child:not([style*="background-image"]) {
  background: linear-gradient(160deg,
    #0c0520 0%,
    #130e2e 30%,
    #1a0a3a 55%,
    #0c0a1a 100%) !important;
  min-height: 55vh;
  display: flex;
  align-items: center;
}

/* Decoración de brillo en hero sin imagen */
.elementor-top-section:first-child:not([style*="background-image"])::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 70% 60% at 50% 0%, rgba(142,67,240,0.18) 0%, transparent 70%),
    radial-gradient(ellipse 40% 40% at 80% 50%, rgba(201,165,90,0.06) 0%, transparent 60%);
  pointer-events: none; z-index: 1;
}

/* Texto hero en páginas sin imagen — centrado y bien visible */
.elementor-top-section:first-child:not([style*="background-image"]) .elementor-widget-heading h1,
.elementor-top-section:first-child:not([style*="background-image"]) .elementor-widget-heading h2,
.elementor-top-section:first-child:not([style*="background-image"]) .elementor-heading-title {
  position: relative; z-index: 2;
  text-align: center !important;
}

/* ═══════════════════════════════════════════════════════════════════
   SSA IFRAME — estilos fallback para cuando el iframe no es accesible
   ═══════════════════════════════════════════════════════════════════ */

/* Contenedor del iframe SSA */
.ssa-booking-iframe-outer,
[class*="ssa-iframe"],
[id*="ssa-iframe"] {
  background: var(--lm-surface) !important;
  border: 1px solid var(--lm-border) !important;
  border-radius: var(--radius-lg) !important;
  min-height: 400px;
}

iframe[src*="ssa"],
iframe[name*="ssa"],
iframe[id*="ssa"],
iframe[title*="appointment"],
iframe[title*="cita"],
iframe[title*="Appointment"] {
  background: var(--lm-surface) !important;
  border: none !important;
  border-radius: var(--radius-md) !important;
  width: 100% !important;
}

/* ═══════════════════════════════════════════════════════════════════
   MOBILE — alinear con la vista desktop
   ═══════════════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
  /* Header móvil — mismo glass oscuro */
  #masthead,
  .site-header,
  .main-header-bar-wrap,
  .main-header-bar,
  .ast-primary-header-bar,
  .ast-header-break-point .site-header,
  .ast-header-break-point .main-header-bar,
  .ast-mobile-header-wrap,
  .ast-header-break-point .ast-mobile-header-section {
    background: rgba(6,5,13,0.92) !important;
    backdrop-filter: blur(20px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
    border-bottom: 1px solid rgba(142,67,240,0.25) !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Menú hamburguesa móvil */
  .ast-menu-toggle,
  .menu-toggle,
  button.ast-menu-toggle {
    color: var(--lm-purple-l) !important;
    background: transparent !important;
    border: 1px solid rgba(142,67,240,0.4) !important;
    border-radius: 6px !important;
    padding: 6px 10px !important;
  }

  /* Menú desplegable móvil */
  .ast-mobile-popup-content,
  .ast-header-break-point .main-navigation ul,
  .ast-header-break-point .main-navigation,
  .ast-header-break-point #site-navigation,
  .ast-header-break-point .ast-header-navigation-1 ul,
  .nav-menu, .sub-menu {
    background: rgba(6,5,13,0.97) !important;
    border: 1px solid rgba(142,67,240,0.2) !important;
  }

  .ast-header-break-point .main-navigation a,
  .ast-header-break-point .ast-nav-menu a,
  .nav-menu > li > a,
  .sub-menu > li > a {
    color: var(--lm-muted) !important;
    border-bottom: 1px solid rgba(142,67,240,0.1) !important;
    padding: 12px 20px !important;
    font-family: var(--font-caps) !important;
    font-size: 0.78rem !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
  }
  .ast-header-break-point .main-navigation a:hover,
  .nav-menu > li > a:hover {
    color: var(--lm-purple-l) !important;
    background: rgba(142,67,240,0.08) !important;
  }
}

@media (max-width: 768px) {
  /* ── Tipografía responsiva ───────────────────────────────────── */
  h1,
  .elementor-heading-title.elementor-size-xxl,
  .elementor-heading-title.elementor-size-xl {
    font-size: clamp(1.8rem, 8vw, 3rem) !important;
    letter-spacing: 0.03em !important;
  }

  h2, .elementor-heading-title.elementor-size-large {
    font-size: clamp(1.3rem, 5.5vw, 2rem) !important;
  }

  h3, .elementor-heading-title.elementor-size-medium {
    font-size: clamp(1rem, 4vw, 1.4rem) !important;
  }

  p, .elementor-widget-text-editor p {
    font-size: 0.95rem !important;
    line-height: 1.75 !important;
  }

  /* ── Hero en móvil ──────────────────────────────────────────── */
  /* Secciones con imagen de fondo — NO parallax en móvil (iOs bug) */
  .elementor-section[style*="background-image"],
  .e-container[style*="background-image"],
  .elementor-top-section[style*="background-image"] {
    background-attachment: scroll !important;
    background-size: cover !important;
    background-position: center center !important;
  }

  /* Hero primera sección */
  .elementor-top-section:first-child {
    min-height: 50vh !important;
  }

  /* Gradiente de fusión más corto en móvil */
  .elementor-top-section:first-child::after {
    height: 80px !important;
  }

  /* Hero sin imagen — gradiente místico */
  .elementor-top-section:first-child:not([style*="background-image"]) {
    min-height: 40vh !important;
    padding: 60px 20px 40px !important;
  }

  /* Overlay en hero más oscuro en móvil para legibilidad */
  .elementor-top-section:first-child .elementor-background-overlay,
  .elementor-section[style*="background-image"] .elementor-background-overlay {
    background-color: rgba(6,5,13,0.65) !important;
    opacity: 1 !important;
  }

  /* ── Layout general ─────────────────────────────────────────── */
  .elementor-section,
  .elementor-top-section,
  .e-container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Columnas en móvil — apiladas con buen padding */
  .elementor-column {
    padding: 10px 8px !important;
  }

  /* ── Cards / cajas ──────────────────────────────────────────── */
  .elementor-widget-image-box .elementor-image-box-wrapper,
  .elementor-widget-icon-box .elementor-icon-box-wrapper,
  .elementor-widget-flip-box .elementor-flip-box {
    padding: 20px !important;
  }

  /* ── Botones ────────────────────────────────────────────────── */
  .elementor-button,
  .elementor-button-wrapper .elementor-button,
  input[type="submit"] {
    padding: 12px 28px !important;
    font-size: 0.68rem !important;
    letter-spacing: 0.15em !important;
    width: 100% !important;
    text-align: center !important;
  }

  /* ── Formulario de contacto ──────────────────────────────────── */
  .wpforms-field input,
  .wpforms-field textarea,
  .wpforms-field select {
    font-size: 16px !important; /* evita zoom en iOS */
  }

  /* ── SSA iframe ─────────────────────────────────────────────── */
  .ssa-booking-iframe-outer,
  [class*="ssa-iframe"],
  [id*="ssa-iframe"] {
    border-radius: 10px !important;
    min-height: 500px;
  }

  iframe[id*="ssa"],
  iframe[src*="ssa"] {
    border-radius: 10px !important;
    min-height: 500px !important;
  }

  /* ── Imágenes ───────────────────────────────────────────────── */
  .elementor-widget-image img {
    border-radius: var(--radius-md) !important;
    width: 100% !important;
    height: auto !important;
  }

  /* ── Shape dividers en móvil ────────────────────────────────── */
  .elementor-shape {
    display: none !important; /* en móvil las ondas suelen quedar mal */
  }

  /* ── Starfield canvas — no en móvil bajo rendimiento ────────── */
  #lm-starfield {
    opacity: 0.3 !important;
  }

  /* ── Logo ───────────────────────────────────────────────────── */
  .site-logo img,
  .custom-logo,
  .ast-site-logo img {
    max-height: 50px !important;
    width: auto !important;
  }

  /* ── Scroll reveal — menos delay en móvil ───────────────────── */
  .lm-reveal { opacity: 1 !important; transform: none !important; }
}

@media (max-width: 480px) {
  h1,
  .elementor-heading-title.elementor-size-xxl,
  .elementor-heading-title.elementor-size-xl {
    font-size: clamp(1.6rem, 9vw, 2.2rem) !important;
  }

  /* Sección hero primera — menos altura en móvil pequeño */
  .elementor-top-section:first-child {
    min-height: 38vh !important;
  }

  .elementor-section,
  .elementor-top-section {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}