/* ============================================================
   VERDANT CROWN CASINO HOTEL — shared stylesheet
   A single committed nocturnal-jade aesthetic (not OS-theme adaptive):
   the brand looks the same for every guest, day or night.
   ============================================================ */

:root{
  color-scheme: dark;
  /* jade family — primary brand ground */
  --jade-950:#0a1e19;
  --jade-900:#0f2b23;
  --jade-800:#13392f;
  --jade-700:#1c4d40;
  --jade-600:#296656;
  --jade-500:#39816d;

  /* copper family — warm structural accent */
  --copper-600:#9c5424;
  --copper-500:#b5672f;
  --copper-400:#cd8951;
  --copper-300:#e0ab7c;

  /* brass — reserved for rare highlights (chip motif, ratings) */
  --brass-400:#c9a227;
  --brass-300:#dcbe57;

  /* warm stone neutrals for light passages inside the dark brand */
  --stone-50:#f7f5ef;
  --stone-100:#efeade;
  --stone-200:#e3ddcc;

  --ink-900:#12201b;
  --ink-700:#33453c;

  --paper:#f6f3ea;
  --line: rgba(246,243,234,0.14);
  --line-strong: rgba(246,243,234,0.28);

  --bg: var(--jade-950);
  --surface: var(--jade-900);
  --surface-raised: var(--jade-800);
  --text: var(--paper);
  --text-dim: rgba(246,243,234,0.68);
  --text-faint: rgba(246,243,234,0.46);
  --accent: var(--copper-400);
  --accent-strong: var(--copper-500);

  --font-display: "Bodoni Moda", "Times New Roman", serif;
  --font-body: "Sora", "Segoe UI", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", monospace;
}

*{ box-sizing:border-box; }
html,body{ height:auto; }
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  padding-left:max(16px, env(safe-area-inset-left,0px));
  padding-right:max(16px, env(safe-area-inset-right,0px));
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
[hidden]{ display:none !important; }
[x-cloak]{ display:none !important; }
a{ color:inherit; text-decoration:none; }
::selection{ background:var(--copper-500); color:var(--paper); }

::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:var(--jade-950); }
::-webkit-scrollbar-thumb{ background:var(--jade-600); border-radius:0; }

:focus-visible{ outline:2px solid var(--copper-300); outline-offset:3px; }

h1,h2,h3,h4{ font-family:var(--font-display); font-weight:600; margin:0; text-wrap:balance; }
p{ margin:0; }

.eyebrow{
  font-family:var(--font-mono);
  font-size:0.72rem;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--accent);
}

.rule{ height:1px; background:var(--line); border:0; margin:0; }
.rule-strong{ height:1px; background:var(--line-strong); border:0; margin:0; }

.container{ max-width:1180px; margin-inline:auto; padding-inline:clamp(16px,4vw,48px); }

/* ---------- header / nav ---------- */
.site-header{
  position:sticky;
  top:env(safe-area-inset-top,0px);
  z-index:50;
  background:rgba(10,30,25,0.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.brand-mark{
  font-family:var(--font-display);
  font-weight:700;
  letter-spacing:0.01em;
  font-size:1.15rem;
  line-height:1;
}
.brand-mark small{
  display:block;
  font-family:var(--font-mono);
  font-size:0.58rem;
  letter-spacing:0.28em;
  color:var(--accent);
  text-transform:uppercase;
  margin-top:5px;
}
.nav-link{
  position:relative;
  font-family:var(--font-mono);
  font-size:0.78rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--text-dim);
  padding-block:6px;
}
.nav-link::after{
  content:"";
  position:absolute; left:0; right:100%; bottom:0;
  height:1px; background:var(--accent);
  transition:right .25s ease;
}
.nav-link:hover, .nav-link.is-active{ color:var(--paper); }
.nav-link:hover::after, .nav-link.is-active::after{ right:0; }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:var(--font-mono);
  font-size:0.76rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  padding:0.85rem 1.5rem;
  border:1px solid var(--accent);
  transition:background .2s ease, color .2s ease, border-color .2s ease;
  white-space:nowrap;
}
.btn-solid{ background:var(--accent-strong); color:var(--jade-950); border-color:var(--accent-strong); }
.btn-solid:hover{ background:var(--copper-300); border-color:var(--copper-300); }
.btn-outline{ background:transparent; color:var(--paper); }
.btn-outline:hover{ background:var(--accent); color:var(--jade-950); }

/* ---------- cards ---------- */
.card{
  background:var(--surface);
  border:1px solid var(--line);
}
.card-hover{ transition:transform .35s ease, border-color .35s ease; }
.card-hover:hover{ transform:translateY(-4px); border-color:var(--line-strong); }

.ph{ /* photo frame */
  position:relative;
  overflow:hidden;
  background:var(--jade-900);
}
.ph img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.ph:hover img{ transform:scale(1.045); }
.ph::after{
  content:"";
  position:absolute; inset:0;
  box-shadow:inset 0 0 0 1px var(--line);
  pointer-events:none;
}

.corner-tag{
  position:absolute; top:0; left:0;
  font-family:var(--font-mono);
  font-size:0.62rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--paper);
  background:rgba(10,30,25,0.72);
  padding:0.4rem 0.65rem;
  border-bottom-right-radius:2px;
}

.stat-num{ font-family:var(--font-display); font-weight:700; font-size:clamp(2rem,4vw,3rem); color:var(--paper); }

.tag-chip{
  display:inline-flex; align-items:center; gap:.4rem;
  font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--jade-950); background:var(--brass-400);
  padding:0.3rem 0.6rem;
}

.quote-mark{ font-family:var(--font-display); font-size:3rem; color:var(--accent); line-height:0.5; }

/* marquee ticker */
.ticker-track{ display:flex; width:max-content; animation:ticker 32s linear infinite; }
@media (prefers-reduced-motion: reduce){ .ticker-track{ animation:none; } }
@keyframes ticker{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/* section divider chip stack (decorative, casino motif, restrained use) */
.chip-stack{ display:flex; }
.chip-stack span{
  width:14px; height:14px; border-radius:50%;
  border:2px dashed var(--jade-950);
  margin-left:-5px;
}
.chip-stack span:first-child{ margin-left:0; }

/* footer */
.site-footer{ background:var(--jade-950); border-top:1px solid var(--line); }
.footer-heading{ font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--accent); }

/* form controls (contact page) */
.field{
  width:100%;
  background:transparent;
  border:1px solid var(--line-strong);
  color:var(--paper);
  font-family:var(--font-body);
  font-size:0.95rem;
  padding:0.85rem 1rem;
}
.field::placeholder{ color:var(--text-faint); }
.field:focus{ border-color:var(--accent); outline:none; }
.field-label{ font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-dim); }

/* utility */
.balance{ text-wrap:balance; }
.serif-italic{ font-style:italic; font-weight:400; }