:root {
  --platform-scale: 1;
}

/* Mobile-first por defecto. Ajustes sutiles para desktop */
html[data-platform="desktop"] {
  --platform-scale: 1.08;
}

/* Contenedor y espaciados */
[data-platform="desktop"] .container { width: min(1280px, 88vw); }
[data-platform="desktop"] .site-header .container { padding: 14px 0; }

/* Hero */
[data-platform="desktop"] .hero-bg { height: 520px; }

/* Búsqueda */
[data-platform="desktop"] .search-bar { gap: 12px; }

/* Tarjetas */
[data-platform="desktop"] .card img { height: 180px; }

/* FAB (menú flotante) */
[data-platform="desktop"] .fab { right: 24px; bottom: 24px; }
[data-platform="desktop"] .fab-btn { width: 56px; height: 56px; font-size: 22px; }

/* Optimización específica para móviles: tamaños táctiles y fluidez */
html[data-platform="mobile"] {
  --touch-target: 44px; /* mínimo recomendado por Apple/Google */
}
[data-platform="mobile"] .container { width: 94vw; }
[data-platform="mobile"] .btn { min-height: var(--touch-target); font-size: 16px; }
[data-platform="mobile"] input,
[data-platform="mobile"] select,
[data-platform="mobile"] textarea { min-height: var(--touch-target); font-size: 16px; }
[data-platform="mobile"] .nav-link { min-height: var(--touch-target); padding: 6px 8px; }
[data-platform="mobile"] .tab { padding: 10px 0; }
[data-platform="mobile"] .grid { gap: 14px; }
[data-platform="mobile"] .fab { bottom: calc(16px + env(safe-area-inset-bottom, 0px)); }
[data-platform="mobile"] .fab-btn { width: 56px; height: 56px; font-size: 22px; }
[data-platform="mobile"] .fab-item { height: var(--touch-target); }

@media (prefers-reduced-motion: reduce) {
  [data-platform="mobile"] * { transition: none !important; animation: none !important; }
}

/* Menú flotante invitado (estilo claro y accesible) */
.fab { position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 1000; display: grid; gap: 8px; justify-items: end; }
.fab-btn { width: 48px; height: 48px; border-radius: 50%; border: 0; background: #111827; color: #fff; box-shadow: 0 10px 24px rgba(0,0,0,0.28); cursor: pointer; display: grid; place-items: center; font-size: 20px; }
.fab-btn:focus-visible { outline: 3px solid rgba(255,255,255,0.35); outline-offset: 2px; }
.fab-menu { display: none; background: #000; color: #fff; border: 1px solid rgba(255,255,255,0.18); border-radius: 12px; box-shadow: 0 14px 28px rgba(0,0,0,0.45); padding: 8px; transform: scale(0.98); opacity: 0.98; transition: transform 180ms ease, opacity 180ms ease; transform-origin: 90% 100%; }
.fab.open .fab-menu { display: grid; gap: 6px; transform: scale(1.05); opacity: 1; }
.fab-item { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 10px; border-radius: 8px; background: transparent; color: #fff; border: 0; cursor: pointer; text-decoration: none; font-weight: 600; }
.fab-item:hover { background: rgba(255,255,255,0.12); }
@media (prefers-reduced-motion: reduce) {
  .fab-menu { transition: none; transform: none; opacity: 1; }
  .fab.open .fab-menu { transform: none; }
}

/* Aviso visual sutil periódico en el botón del menú (sin sonido) */
@keyframes guest-fab-glow {
  0% { box-shadow: 0 0 0 0 rgba(255,255,255,0.45); }
  50% { box-shadow: 0 0 0 12px rgba(255,255,255,0.18); }
  100% { box-shadow: 0 0 0 0 rgba(255,255,255,0.0); }
}
.fab-btn.fab-alert { animation: guest-fab-glow 1800ms ease; }