/* ==========================================================================
   Public site — "Royal Gold + Black" guest-facing theme
   ========================================================================== */
:root {
    --gold: #d4af37;
    --gold-light: #f1d98b;
    --black: #0d0d0d;
    --surface: #17171a;
    --text-light: #f4f0e6;
    --text-muted: #a8a495;
    --border: #2a2a2e;
    font-family: Georgia, 'Times New Roman', serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--black); color: var(--text-light); font-family: -apple-system, "Segoe UI", Roboto, sans-serif; }
a { color: var(--gold-light); text-decoration: none; }
h1, h2, h3 { font-family: Georgia, 'Times New Roman', serif; }

.site-header { background: #000; border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 10; }
.site-header-inner { max-width: 1100px; margin: 0 auto; padding: 16px 24px; display: flex; justify-content: space-between; align-items: center; }
.site-brand { font-size: 1.3rem; color: var(--gold); font-weight: 700; letter-spacing: .02em; }
.site-nav a { margin-left: 22px; color: var(--text-muted); font-size: .9rem; }
.site-nav a:hover { color: var(--gold-light); }
.site-nav-cta { border: 1px solid var(--gold); border-radius: 20px; padding: 6px 16px; color: var(--gold) !important; }

.hero { background: radial-gradient(circle at top, #1c1c1c 0%, #000 75%); padding: 90px 24px; text-align: center; }
.hero h1 { font-size: 2.4rem; color: var(--gold); margin-bottom: 10px; }
.hero p { color: var(--text-muted); font-size: 1.05rem; max-width: 560px; margin: 0 auto 24px; }
.btn-gold { display: inline-block; background: var(--gold); color: #000; padding: 12px 28px; border-radius: 30px; font-weight: 700; }
.btn-gold:hover { background: var(--gold-light); color: #000; }
.btn-gold-outline { display: inline-block; border: 1px solid var(--gold); color: var(--gold) !important; padding: 11px 27px; border-radius: 30px; font-weight: 600; }

.section { max-width: 1100px; margin: 0 auto; padding: 56px 24px; }
.section h2 { color: var(--gold-light); font-size: 1.6rem; margin-bottom: 24px; text-align: center; }

.room-grid, .card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }
.room-card, .info-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.room-card img, .gallery-grid img { width: 100%; height: 190px; object-fit: cover; display: block; }
.room-card-body { padding: 18px; }
.room-card-body h3 { margin: 0 0 6px; color: var(--text-light); }
.room-card-price { color: var(--gold); font-weight: 700; font-size: 1.15rem; margin: 10px 0; }

.testimonial { background: var(--surface); border-left: 3px solid var(--gold); border-radius: 8px; padding: 20px; }
.testimonial .stars { color: var(--gold); margin-bottom: 8px; }

.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }

.site-footer { border-top: 1px solid var(--border); padding: 30px 24px; text-align: center; color: var(--text-muted); font-size: .85rem; }

.booking-form-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 26px; max-width: 640px; margin: 0 auto; }
.booking-form-card label { display: block; font-size: .82rem; color: var(--text-muted); margin: 12px 0 5px; }
.booking-form-card input, .booking-form-card select, .booking-form-card textarea {
    width: 100%; background: #0d0d0d; border: 1px solid var(--border); color: var(--text-light);
    padding: 10px 12px; border-radius: 6px; font-size: .92rem;
}
.form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

.site-alert { max-width: 1100px; margin: 16px auto 0; padding: 12px 20px; border-radius: 8px; font-size: .9rem; }
.site-alert-success { background: rgba(46,125,79,.15); border: 1px solid #2e7d4f; color: #85d6a5; }
.site-alert-error { background: rgba(177,56,43,.15); border: 1px solid #b1382b; color: #f2a89e; }

.page-content { max-width: 800px; margin: 0 auto; padding: 56px 24px; line-height: 1.7; }
.text-muted { color: var(--text-muted); }
