:root {
    --brand: #b8925a;
    --brand-dark: #977443;
    --ink: #1d2733;
    --soft: #f7f4ef;
}
body { font-family: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif; color: #333; }
h1, h2, h3, .brand-font { font-family: Georgia, "Times New Roman", serif; }
a { color: var(--brand-dark); }
.btn-brand { background: var(--brand); border-color: var(--brand); color: #fff; }
.btn-brand:hover, .btn-brand:focus { background: var(--brand-dark); border-color: var(--brand-dark); color: #fff; }
.btn-outline-brand { border-color: var(--brand); color: var(--brand-dark); }
.btn-outline-brand:hover { background: var(--brand); color: #fff; }
.text-brand { color: var(--brand) !important; }
.bg-soft { background: var(--soft); }
.bg-ink { background: var(--ink); }

.topbar { background: var(--ink); color: #cfd6de; font-size: .875rem; }
.topbar a { color: #cfd6de; text-decoration: none; }
.navbar-brand img { max-height: 46px; }
.navbar .nav-link { font-weight: 500; color: var(--ink); }
.navbar .nav-link.active, .navbar .nav-link:hover { color: var(--brand); }

.hero { position: relative; }
.hero .carousel-item { height: 78vh; min-height: 460px; }
.hero .carousel-item img { object-fit: cover; height: 100%; width: 100%; filter: brightness(.55); }
.hero .carousel-caption { bottom: 38%; }
.hero .carousel-caption h1 { font-size: clamp(2rem, 5vw, 3.6rem); text-shadow: 0 2px 10px rgba(0,0,0,.35); }

.search-box { background: #fff; border-radius: .75rem; box-shadow: 0 10px 40px rgba(0,0,0,.15); padding: 1.25rem; }
.hero .search-wrap { position: absolute; bottom: -60px; left: 0; right: 0; z-index: 5; }
.after-hero { padding-top: 100px; }

.page-header { background: linear-gradient(rgba(29,39,51,.7), rgba(29,39,51,.7)), url('../demo/slide-2.jpg') center/cover; color: #fff; padding: 70px 0 50px; }
.page-header h1 { font-size: 2.4rem; }
.page-header .breadcrumb a { color: #e5d3b3; }
.page-header .breadcrumb-item.active, .page-header .breadcrumb-item + .breadcrumb-item::before { color: #ddd; }

.section-title { text-align: center; margin-bottom: 2.5rem; }
.section-title small { color: var(--brand); text-transform: uppercase; letter-spacing: .15em; font-weight: 600; }
.section-title h2 { margin-top: .25rem; }

.room-card { border: 0; border-radius: .75rem; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,.07); transition: transform .2s, box-shadow .2s; height: 100%; }
.room-card:hover { transform: translateY(-4px); box-shadow: 0 10px 30px rgba(0,0,0,.12); }
.room-card .card-img-top { height: 230px; object-fit: cover; }
.room-card .price { font-size: 1.4rem; font-weight: 700; color: var(--brand-dark); }
.room-card .old-price { text-decoration: line-through; color: #999; font-size: .95rem; }
.room-meta { font-size: .9rem; color: #666; }
.room-meta i { color: var(--brand); }

.amenity { display: flex; align-items: center; gap: .6rem; padding: .4rem 0; }
.amenity i { color: var(--brand); font-size: 1.25rem; }
.amenity-box { background: #fff; border-radius: .75rem; padding: 1.5rem 1rem; text-align: center; height: 100%; box-shadow: 0 4px 15px rgba(0,0,0,.05); }
.amenity-box i { font-size: 2rem; color: var(--brand); }

.gallery-main { height: 440px; object-fit: cover; width: 100%; border-radius: .75rem; }
.gallery-thumb { height: 80px; object-fit: cover; width: 100%; border-radius: .5rem; cursor: pointer; opacity: .7; }
.gallery-thumb.active, .gallery-thumb:hover { opacity: 1; outline: 3px solid var(--brand); }

.sticky-panel { position: sticky; top: 90px; }
.summary-row { display: flex; justify-content: space-between; padding: .3rem 0; }
.summary-total { border-top: 2px solid #eee; margin-top: .5rem; padding-top: .6rem; font-size: 1.2rem; font-weight: 700; }

footer.site-footer { background: var(--ink); color: #b9c2cc; }
footer.site-footer a { color: #b9c2cc; text-decoration: none; }
footer.site-footer a:hover { color: #fff; }
footer.site-footer h5 { color: #fff; }

.whatsapp-float { position: fixed; right: 20px; bottom: 20px; width: 56px; height: 56px; border-radius: 50%; background: #25d366; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.8rem; box-shadow: 0 4px 15px rgba(0,0,0,.25); z-index: 1000; }
.whatsapp-float:hover { color: #fff; transform: scale(1.05); }

.auth-card { max-width: 460px; margin: 0 auto; }
.pre-line { white-space: pre-line; }