/* Layout: one-page hotel site. Light warm-earthy is the default for every visitor; dark only via the toggle.
     Floating frosted nav · asymmetric hero · rooms · Nirmala (dark band) · meeting · reservation form · footer · floating WhatsApp. */
  :root {
    --bg: 246 243 238;  --surface: 255 253 249; --sunk: 238 233 225;
    --ink: 22 25 38;    --muted: 110 103 95;    --line: 216 208 197;
    --gold: 162 128 58; --champagne: 222 204 168;
    --deep: 22 25 38;   --ondeep: 246 243 238;
    --ok: 54 120 84;    --bad: 168 64 52;
    --night: 0;
  }
  :root[data-theme="dark"] {
    --bg: 16 17 22; --surface: 26 27 34; --sunk: 21 22 28; --ink: 236 231 222; --muted: 160 152 141; --line: 58 57 62;
    --gold: 205 172 104; --champagne: 98 84 58; --deep: 236 231 222; --ondeep: 16 17 22; --ok: 120 190 150; --bad: 230 130 115; --night: 1;
    color-scheme: dark;
  }
  html { scroll-behavior: smooth; scroll-padding-top: 7.5rem; }
  @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
  body { background: rgb(var(--bg)); color: rgb(var(--ink)); font-family: "Plus Jakarta Sans", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
  h1, h2, h3 { text-wrap: balance; }

  .nav-link { position: relative; }
  .nav-link::after { content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 1px; background: rgb(var(--gold)); transform: scaleX(0); transform-origin: left; transition: transform 300ms ease; }
  .nav-link:hover::after, .nav-link:focus-visible::after, .nav-link.is-active::after { transform: scaleX(1); }

  #site-header { top: env(safe-area-inset-top, 0px); }
  #site-header .bar { transition: padding 400ms ease, box-shadow 400ms ease, background-color 400ms ease; }
  .brand-mark { transition: height 400ms ease; }
  #site-header.is-scrolled .brand-mark { height: 2.4rem; }
  #site-header.is-scrolled .bar { padding-top: .55rem; padding-bottom: .55rem; box-shadow: 0 14px 34px -22px rgb(var(--ink) / .45); background-color: rgb(var(--surface) / .86); }

  .frame { position: relative; overflow: hidden; isolation: isolate; }
  .frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s cubic-bezier(.2,.7,.2,1), opacity 700ms ease; }
  .group:hover .frame img, .frame:hover img { transform: scale(1.035); }
  .img-night { opacity: var(--night); }
  .img-day { opacity: calc(1 - var(--night)); }

  @media (prefers-reduced-motion: no-preference) {
    .rise { animation: rise 900ms cubic-bezier(.2,.7,.2,1) both; }
    .d1 { animation-delay: 60ms } .d2 { animation-delay: 160ms } .d3 { animation-delay: 260ms } .d4 { animation-delay: 360ms } .d5 { animation-delay: 500ms }
    @keyframes rise { from { transform: translateY(14px); opacity: .001; } to { transform: none; opacity: 1; } }
    .float { animation: float 7s ease-in-out infinite; }
    @keyframes float { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-6px) } }
  }

  #mobile-sheet { visibility: hidden; transition: visibility 0s linear 450ms; }
  #mobile-sheet.open { visibility: visible; transition-delay: 0s; }
  #mobile-sheet .scrim { opacity: 0; transition: opacity 400ms ease; }
  #mobile-sheet.open .scrim { opacity: 1; }
  #mobile-sheet .panel { transform: translateX(100%); transition: transform 450ms cubic-bezier(.2,.8,.2,1); }
  #mobile-sheet.open .panel { transform: none; }
  @media (prefers-reduced-motion: reduce) { #mobile-sheet .panel, #mobile-sheet .scrim { transition: none; } }

  :focus-visible { outline: 1.5px solid rgb(var(--gold)); outline-offset: 3px; border-radius: 4px; }
  .tnum { font-variant-numeric: tabular-nums; }
  .lang-btn[aria-pressed="true"] { background: rgb(var(--deep)); color: rgb(var(--ondeep)); }
  .lang-btn[aria-pressed="false"] { color: rgb(var(--muted)); }

  /* Night band (Nirmala) — always dark, independent of theme */
  .band-night { --b-bg: 18 19 25; --b-ink: 236 231 222; --b-muted: 164 156 145; --b-line: 255 255 255; background: rgb(var(--b-bg)); color: rgb(var(--b-ink)); }

  /* Form */
  .field { display: grid; gap: .45rem; min-width: 0; }
  .field label { font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: rgb(var(--muted)); }
  .input { width: 100%; min-width: 0; border-radius: .75rem; border: 1px solid rgb(var(--line)); background: rgb(var(--surface)); color: rgb(var(--ink)); padding: .8rem .95rem; font-size: .95rem; transition: border-color 250ms ease, box-shadow 250ms ease; }
  .input::placeholder { color: rgb(var(--muted) / .7); }
  .input:focus { outline: none; border-color: rgb(var(--gold)); box-shadow: 0 0 0 3px rgb(var(--gold) / .15); }
  .input[aria-invalid="true"] { border-color: rgb(var(--bad)); }
  select.input { appearance: none; background-image: linear-gradient(45deg, transparent 50%, rgb(var(--muted)) 50%), linear-gradient(135deg, rgb(var(--muted)) 50%, transparent 50%); background-position: calc(100% - 18px) 52%, calc(100% - 13px) 52%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 2.2rem; }
  .err { font-size: .78rem; color: rgb(var(--bad)); }

  .g-chip[aria-pressed="true"] { background: rgb(var(--deep)); color: rgb(var(--ondeep)); border-color: rgb(var(--deep)); }
  .g-chip[aria-pressed="false"] { color: rgb(var(--muted)); }
  .g-chip[aria-pressed="false"]:hover { color: rgb(var(--ink)); border-color: rgb(var(--gold)); }
  #lb-img { transition: opacity 250ms ease; }
  [hidden] { display: none !important; }
  /* Floating WhatsApp */
  #wa-float { right: max(16px, env(safe-area-inset-right, 0px)); bottom: calc(16px + env(safe-area-inset-bottom, 0px)); }