/* =========================================================
   SENTRA HOTEL — Luxury theme layer (frontend)
   Loads after main.css / custom.css / color.php
   Palette: warm cream + ink + champagne gold
   Type: Cormorant Garamond (display) + Jost (UI / body)
   ========================================================= */

:root {
    --heading-font: 'Cormorant Garamond', 'Times New Roman', Georgia, serif;
    --body-font: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --lux-ink: #1C1814;
    --lux-ink-2: #2A241E;
    --lux-body: #5F584F;
    --lux-muted: #8B8278;
    --lux-gold: #AB8A62;
    --lux-gold-dark: #8E6D45;
    --lux-gold-soft: #C9B08A;
    --lux-cream: #FAF7F2;
    --lux-sand: #F3EEE5;
    --lux-line: #E4DCCF;
    --lux-radius: 2px;
}

/* ---------- Typography ---------- */
body {
    font-family: var(--body-font);
    color: var(--lux-body);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 0.01em;
    background-color: #fff;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--heading-font);
    color: var(--lux-ink);
    font-weight: 500;
    line-height: 1.18;
    letter-spacing: 0.005em;
}

h1 { font-weight: 400; }
h2 { font-weight: 500; }

a { font-family: var(--body-font); }

.h--font { font-family: var(--heading-font) !important; }
.p--font { font-family: var(--body-font) !important; }

/* Eyebrow / kicker above section titles */
.section-top-title,
.section-header .section-top-title {
    font-family: var(--body-font) !important;
    font-size: 0.75rem !important;
    font-weight: 500;
    letter-spacing: 0.34em;
    text-transform: uppercase;
    color: var(--lux-gold);
    display: inline-block;
    margin-bottom: 0.9rem;
}
.section-top-title::after {
    content: '';
    display: block;
    width: 44px;
    height: 1px;
    margin: 0.85rem auto 0;
    background-color: var(--lux-gold-soft);
}
.text-start .section-top-title::after,
.text-lg-start .section-top-title::after { margin-left: 0; }

.section-title {
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 1.12;
}
.section-header { margin-bottom: 3.25rem; }

.hero-section__title {
    font-weight: 400;
    letter-spacing: 0.02em;
    line-height: 1.1;
}

/* ---------- Buttons ---------- */
.btn {
    font-family: var(--body-font);
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    padding: 1rem 2.4rem;
    border-radius: var(--lux-radius);
    transition: all 0.35s ease;
}
.btn i { margin-right: 0.5rem; }
.btn--capsule { border-radius: var(--lux-radius); }

.btn--base {
    background-color: var(--lux-gold);
    border: 1px solid var(--lux-gold);
    color: #fff;
}
.btn--base:hover,
.btn--base:focus {
    background-color: var(--lux-gold-dark) !important;
    border-color: var(--lux-gold-dark);
    color: #fff;
}

.btn-outline--base {
    border: 1px solid var(--lux-gold);
    color: var(--lux-gold);
    background-color: transparent;
}
.btn-outline--base:hover {
    background-color: var(--lux-gold);
    color: #fff;
}

.btn--dark { background-color: var(--lux-ink); border-color: var(--lux-ink); }
.btn--dark:hover { background-color: var(--lux-ink-2); border-color: var(--lux-ink-2); }

/* ---------- Header ---------- */
.header__top { background-color: var(--lux-ink); }
.header__top,
.header__top a,
.header__top li { font-size: 0.8125rem; letter-spacing: 0.04em; }

/* One continuous bar edge to edge — the stock theme leaves a floating white
   box the width of the container, which reads as a mismatched panel. */
.header__bottom {
    background-color: rgba(250, 247, 242, 0.92) !important;
    -webkit-backdrop-filter: saturate(1.15) blur(10px);
    backdrop-filter: saturate(1.15) blur(10px);
    border-bottom: 1px solid var(--lux-line);
    transition: background-color 0.35s ease, box-shadow 0.35s ease;
}
.header__bottom .navbar,
.header__bottom .navbar-collapse,
.header__bottom .container { background-color: transparent !important; }

/* Solid + lifted once the page is scrolled */
.header.menu-fixed .header__bottom {
    background-color: #FAF7F2 !important;
    box-shadow: 0 1px 24px rgba(28, 24, 20, 0.08);
}

.header .nav-item .nav-link,
.header .menu > li > a,
.header .navbar-collapse ul > li > a {
    font-family: var(--body-font);
    font-size: 0.75rem !important;
    font-weight: 500;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--lux-ink);
}
.header .nav-item .nav-link:hover,
.header .nav-item .nav-link.active,
.header .navbar-collapse ul > li > a:hover,
.header .navbar-collapse ul > li > a.active { color: var(--lux-gold); }

.header .logo img,
.footer-logo img { max-height: 54px; width: auto; }

/* ---------- Sections & surfaces ---------- */
.section--bg, .section--bg2 { background-color: var(--lux-cream); }

.custom--card,
.card,
.widget,
.sidebar-widget,
.room-booking-sidebar,
.user-sidebar,
.contact-info-wrapper,
.service-card,
.testimonial-card,
.gallery-card,
.blog-post {
    border-radius: var(--lux-radius);
}

.custom--card,
.widget,
.sidebar-widget {
    border: 1px solid var(--lux-line);
    box-shadow: none;
}

.custom--card .card-header {
    background-color: var(--lux-cream);
    border-bottom: 1px solid var(--lux-line);
}

/* ---------- Room cards ---------- */
.room-card__thumb { border-radius: var(--lux-radius); }
.room-card__thumb img { transition: transform 0.9s cubic-bezier(.2,.7,.2,1); }
.room-card:hover .room-card__thumb img { transform: scale(1.06); }

.room-card__content {
    background-color: #fff;
    border: 1px solid var(--lux-line);
    border-radius: var(--lux-radius);
    box-shadow: none;
}
.room-card__content .room-card__title,
.room-card__content h4,
.room-card__content h5 { font-family: var(--heading-font); font-weight: 500; }

.room-card__utilities li,
.single-room__meta li { font-size: 0.8125rem; letter-spacing: 0.03em; }

/* ---------- Forms ---------- */
.form--control,
.form-control,
.form-select {
    border-radius: var(--lux-radius);
    border: 1px solid var(--lux-line);
    background-color: #fff;
    color: var(--lux-ink);
    font-family: var(--body-font);
    letter-spacing: 0.02em;
    height: 50px;
    box-shadow: none;
}
.form--control:focus,
.form-control:focus,
.form-select:focus {
    border-color: var(--lux-gold);
    box-shadow: 0 0 0 3px rgba(171, 138, 98, 0.12);
    outline: none;
}
label, .form-label {
    font-size: 0.75rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--lux-muted);
    font-weight: 500;
}

/* ---------- Tables ---------- */
.custom--table thead th,
.table thead th {
    font-family: var(--body-font);
    font-size: 0.6875rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--lux-ink);
    background-color: var(--lux-cream);
    font-weight: 600;
}
.custom--table td, .table td { color: var(--lux-body); }

/* ---------- Badges ---------- */
.badge {
    border-radius: var(--lux-radius);
    font-size: 0.6875rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 500;
    padding: 0.4em 0.75em;
}
.badge--base, .bg--base { background-color: var(--lux-gold) !important; }
.text--base { color: var(--lux-gold) !important; }
.border--base { border-color: var(--lux-gold) !important; }

/* ---------- Footer ---------- */
.footer-section { background-color: var(--lux-ink); }
.footer-section,
.footer-section p,
.footer-section li,
.footer-section a { color: rgba(250, 247, 242, 0.62); }
.footer-section a:hover { color: var(--lux-gold-soft); }
.footer-widget__title {
    font-family: var(--body-font);
    font-size: 0.75rem;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: #fff;
    font-weight: 500;
}
.footer-section__bottom { border-top: 1px solid rgba(250, 247, 242, 0.1); }
.footer-line { background-color: rgba(250, 247, 242, 0.1); }

/* ---------- Breadcrumb / inner hero ---------- */
.inner-hero .page-breadcrumb li,
.page-breadcrumb li,
.page-breadcrumb li a {
    font-size: 0.75rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

/* ---------- Pagination ---------- */
.pagination .page-link {
    border-radius: var(--lux-radius);
    border: 1px solid var(--lux-line);
    color: var(--lux-ink);
    font-size: 0.8125rem;
}
.pagination .page-item.active .page-link,
.pagination .page-link:hover {
    background-color: var(--lux-gold);
    border-color: var(--lux-gold);
    color: #fff;
}

/* ---------- Misc polish ---------- */
::selection { background-color: var(--lux-gold); color: #fff; }

.overlay, .base--overlay::before { background-color: rgba(28, 24, 20, 0.45); }

.slick-arrow, .icon-btn {
    border-radius: var(--lux-radius);
    border: 1px solid var(--lux-line);
}
.slick-arrow:hover { background-color: var(--lux-gold); border-color: var(--lux-gold); color: #fff; }

hr { border-color: var(--lux-line); opacity: 1; }

.text--muted, .text--small { color: var(--lux-muted) !important; }

.preloader { background-color: var(--lux-cream); }