/* ============================================================
   Qispi — base.css
   Variables, Reset, Loader
   ============================================================ */

/* ============================================================
   Qispi — styles.css  v2.1
   Los colores --ocean / --coral / --wave se sobreescriben
   dinámicamente desde Supabase (apartment_settings)
   ============================================================ */

/* ── VARIABLES BASE ── */
:root {
  --ocean:        #1e5f8c;
  --coral:        #e8734a;
  --wave:         #4ab3d6;
  --dark:         #0d1117;
  --ink:          #1a2030;
  --paper:        #f9f7f3;
  --border:       #e0dbd0;
  --text:         #3a4050;
  --muted:        #7a8090;
  --font-heading: 'Cormorant Garamond', serif;
  --font-body:    'Inter', sans-serif;
  --nav-h:        60px;
  --r:            14px;
  --shadow:       0 4px 20px rgba(0,0,0,.08);
  --shadow-lg:    0 12px 40px rgba(0,0,0,.13);
}

/* ── RESET ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--nav-h) + 1rem); }
body {
  font-family: var(--font-body);
  background: var(--paper);
  color: var(--text);
  line-height: 1.7;
  font-size: 16px;
}
body.loading { overflow: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; border: none; background: none; font: inherit; }

/* ── LOADER ── */
#pageLoader {
  position: fixed; inset: 0; z-index: 9999;
  background: var(--dark);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 1rem;
}
.pl-wave {
  font-size: 3rem;
  animation: wave-bob 1.4s ease-in-out infinite;
}
.pl-text {
  font-family: var(--font-body);
  font-size: .85rem;
  color: rgba(255,255,255,.35);
  letter-spacing: .1em;
}
@keyframes wave-bob {
  0%, 100% { transform: translateY(0) rotate(-5deg); }
  50%       { transform: translateY(-12px) rotate(5deg); }
}