/* ══════════════════════════════════════════════════════════════════
   MOTEL DASHA · Liquid Glass layer — v1.0 (2026-07-06) — PREPARADO, NO DESPLEGADO
   Tema real del sitio: slate #647688/#3F4A57 + cream #D4A574 + fondo
   cálido #F4F2EF (twentytwentyfive block theme, clases dsh-* propias).
   Scope: header sticky (.dsh-header), card del hero (.dsh-hero-card),
   cards de suites (.dsh-suite-card), tiles info (.dsh-info-item).
   NO toca: botones .dsh-btn-red (CTA de marca), forms, floats
   (.dsh-cta-float, .dsh-maps-float), banner JARVIS.
   ══════════════════════════════════════════════════════════════════ */

:root{
  --lgd-blur: 28px;
  --lgd-ease: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ── Header sticky: glass slate translúcido (el hero refracta) ──── */
.dsh-header{
  background: rgba(100,118,136,.62) !important;
  -webkit-backdrop-filter: blur(var(--lgd-blur)) saturate(180%);
  backdrop-filter: blur(var(--lgd-blur)) saturate(180%);
  border-bottom: 1px solid rgba(255,255,255,.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14),
              0 8px 28px rgba(0,0,0,.18);
}

/* ── Card del hero: frost sobre el gradiente slate ──────────────── */
/* Ya usa blur(10px); se eleva a glass real manteniendo el texto
   oscuro legible (frost alto, no glass oscuro). */
.dsh-hero-card{
  background: rgba(255,255,255,.80) !important;
  -webkit-backdrop-filter: blur(32px) saturate(180%);
  backdrop-filter: blur(32px) saturate(180%);
  border: 1px solid rgba(255,255,255,.55);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9),
              0 8px 24px rgba(0,0,0,.15),
              0 30px 70px rgba(0,0,0,.28);
}

/* ── Cards de suites ─────────────────────────────────────────────── */
.dsh-suite-card{
  background: rgba(255,255,255,.62);
  -webkit-backdrop-filter: blur(var(--lgd-blur)) saturate(180%);
  backdrop-filter: blur(var(--lgd-blur)) saturate(180%);
  border: 1px solid rgba(255,255,255,.65);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85),
              0 4px 14px rgba(63,74,87,.08),
              0 18px 44px -16px rgba(63,74,87,.22);
  transition: transform .35s var(--lgd-ease), box-shadow .35s var(--lgd-ease),
              border-color .35s var(--lgd-ease);
}
.dsh-suite-card:hover{
  transform: translateY(-5px);
  border-color: rgba(212,165,116,.55); /* acento cream al hover */
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85),
              0 8px 22px rgba(63,74,87,.12),
              0 28px 60px -16px rgba(63,74,87,.30);
}

/* ── Tiles de info ───────────────────────────────────────────────── */
.dsh-info-item{
  background: rgba(255,255,255,.55);
  -webkit-backdrop-filter: blur(18px) saturate(170%);
  backdrop-filter: blur(18px) saturate(170%);
  border: 1px solid rgba(255,255,255,.6);
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8),
              0 4px 14px rgba(63,74,87,.07);
}

/* ── Móvil: blur reducido (performance) ─────────────────────────── */
@media (max-width: 640px){
  :root{ --lgd-blur: 12px; }
  .dsh-hero-card{ -webkit-backdrop-filter: blur(12px) saturate(170%);
                  backdrop-filter: blur(12px) saturate(170%); }
  .dsh-info-item{ -webkit-backdrop-filter: blur(10px) saturate(160%);
                  backdrop-filter: blur(10px) saturate(160%); }
  .dsh-suite-card:hover{ transform: none; }
}

/* ── Fallback sin backdrop-filter ───────────────────────────────── */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
  .dsh-header{ background: rgba(100,118,136,.97) !important; }
  .dsh-hero-card{ background: rgba(255,255,255,.97) !important; }
  .dsh-suite-card, .dsh-info-item{ background: rgba(255,255,255,.97); }
}

/* ── Movimiento reducido ────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce){
  .dsh-suite-card{ transition: none; }
  .dsh-suite-card:hover{ transform: none; }
}
