/* ===== The Royal Castle — shared styles ===== */
:root{
  --gold:#C9A24B; --gold-light:#E7C873; --maroon:#6E1523; --maroon-deep:#4A0E18;
  --cream:#F5EFE2; --ink:#140C0A; --panel:#1E1512;
}
html{ -webkit-font-smoothing:antialiased; }
body{ background:var(--ink); color:var(--cream); font-family:Poppins, sans-serif; overflow-x:hidden; }

/* ---- Light / Dark surfaces ---- */
.surface{ background:var(--ink); }
html:not(.dark) body{ background:var(--ivory); color:#2a1a17; }
html:not(.dark) .surface{ background:var(--ivory); }
html:not(.dark) .panel-bg{ background:#fff; }
.panel-bg{ background:var(--panel); }

/* ---- Glassmorphism nav ---- */
.glass{
  background:rgba(20,12,10,0.55);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border-bottom:1px solid rgba(201,162,75,0.22);
}
html:not(.dark) .glass{
  background:rgba(251,247,239,0.7);
  border-bottom:1px solid rgba(110,21,35,0.15);
}
.glass-card{
  background:rgba(30,21,18,0.55);
  backdrop-filter:blur(10px);
  border:1px solid rgba(201,162,75,0.18);
}
html:not(.dark) .glass-card{
  background:rgba(255,255,255,0.7);
  border:1px solid rgba(110,21,35,0.12);
}

/* ---- Gold text + rules ---- */
.text-goldgrad{
  background:linear-gradient(100deg,#E7C873 0%,#C9A24B 40%,#A67C2E 60%,#E7C873 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.rule-gold{ height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); }
.divider-orn{ display:flex; align-items:center; gap:1rem; color:var(--gold); }
.divider-orn::before,.divider-orn::after{ content:""; flex:1; height:1px; background:linear-gradient(90deg,transparent,rgba(201,162,75,.5)); }
.divider-orn::after{ background:linear-gradient(90deg,rgba(201,162,75,.5),transparent); }

/* ---- Parallax ---- */
.parallax{ background-attachment:fixed; background-position:center; background-size:cover; }
@media (max-width:768px){ .parallax{ background-attachment:scroll; } }

/* ---- Reveal on scroll ---- */
.reveal{ opacity:0; transform:translateY(38px); transition:opacity .9s cubic-bezier(.16,.84,.44,1), transform .9s cubic-bezier(.16,.84,.44,1); }
.reveal.in{ opacity:1; transform:none; }
.reveal[data-d="1"]{ transition-delay:.12s } .reveal[data-d="2"]{ transition-delay:.24s }
.reveal[data-d="3"]{ transition-delay:.36s } .reveal[data-d="4"]{ transition-delay:.48s }

/* ---- Buttons ---- */
.btn-gold{
  background:linear-gradient(100deg,#E7C873,#C9A24B 55%,#A67C2E);
  color:#2a0c11; font-weight:600; letter-spacing:.04em;
  box-shadow:0 10px 30px -10px rgba(201,162,75,.6);
  transition:transform .25s, box-shadow .25s, filter .25s;
}
.btn-gold:hover{ transform:translateY(-2px); filter:brightness(1.06); box-shadow:0 16px 40px -12px rgba(201,162,75,.8); }
.btn-ghost{ border:1px solid var(--gold); color:var(--gold); transition:background .25s,color .25s; }
.btn-ghost:hover{ background:var(--gold); color:#2a0c11; }

/* ---- Card hover ---- */
.lift{ transition:transform .4s cubic-bezier(.16,.84,.44,1), box-shadow .4s; }
.lift:hover{ transform:translateY(-8px); box-shadow:0 30px 60px -25px rgba(0,0,0,.7); }

/* ---- Media zoom ---- */
.media-zoom img{ transition:transform .8s cubic-bezier(.16,.84,.44,1); }
.media-zoom:hover img{ transform:scale(1.08); }

/* ---- Gallery tile zoom badge (site-wide standard: 40px, bottom-right,
   hover on desktop, always on touch). Wrapper + badge are added by main.js. */
.gwrap{ position:relative; break-inside:avoid; }
.gzoom{ position:absolute; bottom:10px; right:10px; width:40px; height:40px; border-radius:9999px;
  display:grid; place-items:center; background:rgba(255,255,255,.92); color:#4A0E18;
  pointer-events:none; opacity:0; transform:scale(.7); z-index:3;
  box-shadow:0 6px 16px -6px rgba(0,0,0,.55); transition:opacity .3s var(--ease,ease), transform .3s var(--ease,ease); }
.gzoom svg{ width:18px; height:18px; }
.gwrap:hover .gzoom{ opacity:1; transform:none; }
@media (hover:none),(max-width:640px){ .gzoom{ opacity:1; transform:none; } }

/* ---- Amenity tag ---- */
.amen-pill{ border:1px solid rgba(201,162,75,.28); transition:.3s; }
.amen-pill:hover{ background:var(--gold); color:#2a0c11; border-color:var(--gold); transform:translateY(-3px); }

/* ---- Lightbox ---- */
#lightbox{ background:rgba(10,6,5,.94); backdrop-filter:blur(6px); }
.no-scroll{ overflow:hidden; }

/* ---- Marquee ---- */
@keyframes marquee{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
.marquee-track{ animation:marquee 26s linear infinite; }

/* ---- Scrollbar ---- */
::-webkit-scrollbar{ width:10px } ::-webkit-scrollbar-thumb{ background:linear-gradient(var(--gold),var(--maroon)); border-radius:8px }
::-webkit-scrollbar-track{ background:var(--ink) }

::selection{ background:var(--gold); color:#2a0c11; }
.hero-vignette{ background:radial-gradient(120% 90% at 50% 30%, transparent 30%, rgba(20,12,10,.55) 78%, rgba(20,12,10,.95) 100%); }

/* ---- Interior page hero ---- */
.page-hero{ position:relative; overflow:hidden; }
.crumb a:hover{ color:var(--gold); }

/* ============================================================
   PAGE PRELOADER  ·  Crown Rising — a gold crown draws itself and
   is set with gems, then the wordmark and a gold rule appear.
   Shown once per visit; fades out when the page has loaded.
   ============================================================ */
html.rc-lock, html.rc-lock body{ overflow:hidden; }

#rc-loader{
  position:fixed; inset:0; z-index:99999;
  display:grid; place-items:center;
  background:radial-gradient(130% 150% at 50% 20%, #3a121b, var(--ink));
  opacity:1; visibility:visible;
  transition:opacity .7s ease, visibility .7s ease;
}
#rc-loader.rc-hidden{ opacity:0; visibility:hidden; pointer-events:none; }
#rc-loader.rc-hidden .rcl-stack{ transform:scale(1.04); transition:transform .7s ease; }

.rcl-stack{ display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:clamp(14px,2.6vw,26px); width:min(80vw,460px); }

.rcl-crown{ width:34%; max-width:150px; height:auto; overflow:visible; }
.rcl-crown .out{ fill:none; stroke:var(--gold); stroke-width:2.5; stroke-linejoin:round; stroke-linecap:round;
  stroke-dasharray:1; stroke-dashoffset:1; animation:rclDraw 1.1s ease .2s forwards; }
@keyframes rclDraw{ to{ stroke-dashoffset:0; } }
.rcl-crown .fillc{ fill:var(--gold); opacity:0; animation:rclFill .7s ease 1.2s forwards; }
@keyframes rclFill{ to{ opacity:.5; } }
.rcl-crown .gem{ fill:#fff3cf; opacity:0; transform-box:fill-box; transform-origin:center; transform:scale(0);
  animation:rclGem .5s cubic-bezier(.34,1.6,.6,1) forwards; }
.rcl-crown .g1{ animation-delay:1.35s; } .rcl-crown .g2{ animation-delay:1.5s; } .rcl-crown .g3{ animation-delay:1.65s; }
@keyframes rclGem{ to{ transform:scale(1); opacity:1; } }

.rcl-wm{ width:100%; aspect-ratio:2005 / 517; opacity:0;
  background:linear-gradient(120deg, var(--gold), var(--gold-light) 52%, var(--gold));
  -webkit-mask:url('../img/the-royal-castle.png') center / contain no-repeat;
  mask:url('../img/the-royal-castle.png') center / contain no-repeat;
  animation:rclShow .9s ease 1.5s forwards; }
@keyframes rclShow{ to{ opacity:1; } }

.rcl-rule{ width:56%; height:2px; transform:scaleX(0);
  background:linear-gradient(90deg, transparent, var(--gold), transparent);
  animation:rclRule .9s ease 2s forwards; }
@keyframes rclRule{ to{ transform:scaleX(1); } }

@media (prefers-reduced-motion:reduce){
  #rc-loader *{ animation:none !important; }
  .rcl-crown .out{ stroke-dashoffset:0; } .rcl-crown .fillc{ opacity:.5; }
  .rcl-crown .gem{ opacity:1; transform:none; } .rcl-wm{ opacity:1; } .rcl-rule{ transform:scaleX(1); }
}

/* ============================================================
   FORM THANK-YOU PANEL — success state for #enquiryForm
   Fades the form out, shows an animated tick, then restores.
   Light-on-dark to sit on the maroon glass card.
   ============================================================ */
.apk-hiding{opacity:0;transition:opacity .35s ease}
.apk-thanks{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;min-height:340px;padding:40px 28px;opacity:0;transition:opacity .35s ease}
.apk-thanks[hidden]{display:none}
.apk-thanks.is-shown{opacity:1}
.apk-thanks__check{width:74px;height:74px}
.apk-thanks__check svg{width:100%;height:100%;display:block}
.apk-thanks__circle{fill:none;stroke:#C9A24B;stroke-width:2.5;stroke-dasharray:151;stroke-dashoffset:151}
.apk-thanks__tick{fill:none;stroke:#E7C873;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40}
.apk-thanks.is-shown .apk-thanks__circle{animation:apkThanksCircle .5s ease forwards}
.apk-thanks.is-shown .apk-thanks__tick{animation:apkThanksTick .35s .45s ease forwards}
@keyframes apkThanksCircle{to{stroke-dashoffset:0}}
@keyframes apkThanksTick{to{stroke-dashoffset:0}}
.apk-thanks__title{font-family:"Cormorant Garamond",Georgia,serif;font-weight:700;color:#E7C873;font-size:1.9rem;margin:0}
.apk-thanks__msg{font-family:"Poppins",system-ui,sans-serif;color:#F5EFE2;opacity:.85;font-size:.98rem;line-height:1.6;margin:0;max-width:34ch}
@media (prefers-reduced-motion:reduce){.apk-hiding,.apk-thanks{transition:none}.apk-thanks__circle,.apk-thanks__tick{animation:none;stroke-dashoffset:0}}