/* ============================================================
   Himmatgarh Palace — Light + Dark Editorial Theme
   Fonts: Playfair Display (display) / Inter (body)
   Images: Unsplash CDN with Picsum + gradient fallbacks
   ============================================================ */

:root {
    /* Dark palette (hero, amenities, CTA, footer) */
    --ink: #16130E;
    --ink-2: #1C1812;
    --ink-3: #241F17;
    --ink-deep: #100D09;
    --ivory: #F6F1E7;
    --ivory-dim: rgba(246, 241, 231, .68);
    --ivory-dim: rgba(246, 241, 231, .68);
    --ivory-faint: rgba(246, 241, 231, .45);
    --line-dark: rgba(246, 241, 231, .14);
    --line-dark-soft: rgba(246, 241, 231, .08);

    /* Light palette (about, rooms, testimonials) */
    --paper: #FFFFFF;
    --paper-2: #F5F5F6;
    --card: #FFFFFF;
    --ink-text: #1B1B1D;
    --body-text: #55555C;
    --muted-text: #83838C;
    --line-light: rgba(27, 27, 29, .14);
    --line-light-soft: rgba(27, 27, 29, .08);

    /* Brand colours (client palette) */
    --brand-yellow: #FCE512;
    --brand-coral: #E85F4C;
    --brand-yellow-soft: #FFF27A;
    --brand-coral-deep: #C2402C;

    /* Accent roles
       --gold*      => brand yellow, for DARK surfaces
       --gold-deep  => deep coral, for LIGHT surfaces (readable small text) */
    --gold: var(--brand-yellow);
    --gold-soft: var(--brand-yellow-soft);
    --gold-deep: var(--brand-coral-deep);
    --gold-dim: rgba(252, 229, 18, .40);
    --gold-dim-light: rgba(232, 95, 76, .42);

    /* Legacy aliases */
    --color-primary: var(--brand-yellow);
    --color-secondary: var(--brand-coral);
    --color-dark: var(--ink);
    --color-royal: var(--ink);
    --color-white: var(--ivory);

    /* Type */
    --font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --font-heading: var(--font-display);
    --font-body: 'Inter', 'Segoe UI', Arial, sans-serif;

    --fs-sm: 0.875rem;
    --fs-xs: 0.75rem;
    --fs-2xs: 0.6875rem;

    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 1rem;
    --space-4: 1.5rem;
    --space-5: 2.5rem;
    --space-6: 4rem;
    --space-7: 7rem;

    --radius-arch: 999px 999px 0 0;
    --radius-md: 16px;
    --radius-full: 999px;

    --ease: cubic-bezier(.4, 0, .2, 1);
    --transition: .4s var(--ease);
    --transition-fast: .25s var(--ease);

    --accent-tint: rgba(232, 95, 76, .12);

    --shadow-sm: 0 2px 14px rgba(20, 20, 24, .07);
    --shadow-md: 0 18px 44px rgba(20, 20, 24, .13);

    --z-header: 1000;
    --z-overlay: 1500;
    --z-loader: 2000;
    --z-scroll-top: 900;
}

:root,
[data-bs-theme="light"] {
    --bs-body-font-family: var(--font-body);
    --bs-body-color: var(--body-text);
    --bs-body-bg: var(--paper);
    --bs-link-color: var(--brand-coral-deep);
    --bs-link-hover-color: var(--brand-coral);
    --bs-link-decoration: none;
}

/* ------------------------------------------------------------
   Dark section scope — flips the light component palette.
   Add .is-dark to any section to render it on the dark theme.
   ------------------------------------------------------------ */
/* ------------------------------------------------------------
   Alternate light band. (.is-dark kept as a class name so existing
   markup keeps working, but it now renders as a soft light tone.)
   ------------------------------------------------------------ */
.is-dark {
    --paper: var(--paper-2);
    --card: #FFFFFF;
    background-color: var(--paper-2);
}

.is-dark .why-visit,
.is-dark .faq-item,
.is-dark .testi-card,
.is-dark .journey,
.is-dark .comfort,
.is-dark .tick-list li {
    background: #FFFFFF;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.75;
    color: var(--body-text);
    background-color: var(--paper);
    overflow-x: hidden;
}

html.nav-open,
html.is-loading {
    overflow: hidden;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    font-weight: 600;
    color: var(--ink-text);
    letter-spacing: .005em;
    margin: 0;
}

a {
    text-decoration: none;
    transition: color var(--transition-fast);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

ul {
    margin: 0;
}

button {
    font-family: inherit;
}

::selection {
    background: var(--gold);
    color: var(--ink);
}

.container {
    --bs-gutter-x: 3rem;
}

@media (max-width: 575.98px) {
    .container {
        --bs-gutter-x: 2.5rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}

/* ------------------------------------------------------------
   Skip link
   ------------------------------------------------------------ */
.skip-link {
    position: fixed;
    top: -100px;
    left: var(--space-3);
    background: var(--gold);
    color: var(--ink);
    font-weight: 600;
    font-size: var(--fs-sm);
    padding: var(--space-2) var(--space-4);
    z-index: calc(var(--z-loader) + 1);
    transition: top var(--transition-fast);
}

.skip-link:focus {
    top: var(--space-3);
}

/* ------------------------------------------------------------
   Loader (dark)
   ------------------------------------------------------------ */
.loader {
    position: fixed;
    inset: 0;
    z-index: var(--z-loader);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    background:
        radial-gradient(ellipse at 50% 35%, rgba(252, 229, 18, .07), transparent 55%),
        var(--ink-deep);
}

.loader__ornament {
    width: clamp(84px, 70px + 4vw, 120px);
    height: auto;
    margin-bottom: var(--space-2);
}

.loader__ornament .draw {
    fill: none;
    stroke: var(--gold);
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-dasharray: 600;
    stroke-dashoffset: 600;
    animation: loaderDraw 2.4s var(--ease) forwards;
}

.loader__ornament .draw--inner {
    stroke: var(--gold-dim);
    animation-delay: .35s;
}

.loader__ornament .mark {
    font-family: var(--font-display);
    font-size: 34px;
    font-weight: 600;
    fill: var(--ivory);
    opacity: 0;
    animation: loaderFadeUp 1s var(--ease) .9s forwards;
}

@keyframes loaderDraw {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes loaderFadeUp {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.loader__eyebrow {
    font-size: var(--fs-2xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .42em;
    color: var(--gold-soft);
    margin: 0;
    opacity: 0;
    animation: loaderFadeUp .9s var(--ease) .5s forwards;
}

.loader__name {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(2rem, 1.2rem + 3.6vw, 3.6rem);
    color: var(--ivory);
    letter-spacing: .04em;
    text-align: center;
    margin: 0;
    overflow: hidden;
}

.loader__rule {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    opacity: 0;
    animation: loaderFadeUp .9s var(--ease) .7s forwards;
}

.loader__rule::before,
.loader__rule::after {
    content: '';
    width: 56px;
    height: 1px;
    background: var(--line-dark);
}

.loader__rule i {
    color: var(--gold);
    font-size: .55rem;
}

.loader__bar {
    position: relative;
    width: 200px;
    height: 1px;
    margin-top: var(--space-3);
    background: var(--line-dark);
    overflow: hidden;
}

.loader__bar::after {
    content: '';
    position: absolute;
    inset: 0;
    width: 40%;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
    animation: loaderBar 1.4s var(--ease) infinite;
}

@keyframes loaderBar {
    0% {
        transform: translateX(-120%);
    }
    100% {
        transform: translateX(380%);
    }
}

/* ------------------------------------------------------------
   Header — transparent over dark hero, dark blur on scroll
   ------------------------------------------------------------ */
.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: var(--z-header);
    background: transparent;
    border-bottom: 1px solid transparent;
    transition: background var(--transition), border-color var(--transition);
}

/* Scrim so the transparent header stays legible over bright hero imagery */
.header::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 260px;
    background: linear-gradient(to bottom, rgba(16, 13, 9, .94) 0%, rgba(16, 13, 9, .72) 40%, rgba(16, 13, 9, .35) 72%, transparent 100%);
    pointer-events: none;
    transition: opacity var(--transition);
}

.header--scrolled::before {
    opacity: 0;
}

.header .topbar,
.header .main-nav {
    position: relative;
    z-index: 1;
}

.header--scrolled {
    background: color-mix(in srgb, var(--ink-deep) 90%, transparent);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    border-bottom-color: var(--line-dark-soft);
}

/* Topbar */
.topbar {
    border-bottom: 1px solid var(--line-dark-soft);
    font-size: var(--fs-xs);
    letter-spacing: .08em;
    max-height: 88px;
    overflow: hidden;
    transition: max-height var(--transition), opacity var(--transition);
}

.header--scrolled .topbar {
    max-height: 0;
    opacity: 0;
    border-bottom-color: transparent;
}

.topbar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding-block: .9rem;
}

.topbar__contact {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    list-style: none;
    padding: 0;
}

.topbar__contact-link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    color: rgba(246, 241, 231, .86);
    font-weight: 500;
    text-transform: uppercase;
}

.topbar__contact-link i {
    color: var(--gold);
    font-size: .7rem;
}

.topbar__contact-link:hover {
    color: var(--gold-soft);
}

.topbar__social {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    list-style: none;
    padding: 0;
}

.topbar__social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(246, 241, 231, .86);
    font-size: .85rem;
    transition: var(--transition-fast);
}

.topbar__social-link:hover {
    color: var(--gold);
    transform: translateY(-2px);
}

@media (max-width: 767.98px) {
    .topbar {
        display: none;
    }
}

/* Main nav */
.main-nav__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    padding-block: var(--space-4);
    transition: padding var(--transition);
}

.header--scrolled .main-nav__inner {
    padding-block: var(--space-3);
}

.main-nav__brand {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.main-nav__logo {
    height: 76px;
    width: auto;
    transition: height var(--transition);
}

.header--scrolled .main-nav__logo {
    height: 56px;
}

@media (max-width: 575.98px) {
    .main-nav__logo {
        height: 60px;
    }
}

.main-nav__toggle {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    width: 36px;
    height: 36px;
    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
    z-index: calc(var(--z-header) + 2);
}

.main-nav__toggle-line {
    display: block;
    width: 100%;
    height: 1.5px;
    background: var(--ivory);
    transition: var(--transition-fast);
}

.main-nav__toggle-line:nth-child(2) {
    width: 70%;
    align-self: flex-end;
}

html.nav-open .main-nav__toggle-line:nth-child(1) {
    transform: translateY(7.5px) rotate(45deg);
}

html.nav-open .main-nav__toggle-line:nth-child(2) {
    opacity: 0;
}

html.nav-open .main-nav__toggle-line:nth-child(3) {
    transform: translateY(-7.5px) rotate(-45deg);
}

.main-nav__menu-wrap {
    display: flex;
    align-items: center;
    gap: var(--space-5);
}

.main-nav__menu {
    display: flex;
    list-style: none;
    padding: 0;
    gap: clamp(.7rem, .35rem + .9vw, 1.5rem);
}

.main-nav__link {
    position: relative;
    display: inline-block;
    white-space: nowrap;
    padding-block: var(--space-2);
    font-size: clamp(.72rem, .66rem + .18vw, .82rem);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--ivory);
    text-shadow: 0 1px 12px rgba(16, 13, 9, .55);
}

.main-nav__link::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 1px;
    background: var(--gold);
    transition: width var(--transition-fast);
}

.main-nav__link:hover,
.main-nav__link--active {
    color: var(--brand-yellow);
}

.main-nav__link:hover::after,
.main-nav__link--active::after {
    width: 100%;
}

.main-nav__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    padding: .7rem 1.9rem;
    background: var(--brand-coral);
    border: 1px solid var(--brand-coral);
    color: var(--color-white);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .16em;
    transition: var(--transition-fast);
}

.main-nav__cta:hover {
    background: var(--brand-yellow);
    border-color: var(--brand-yellow);
    color: var(--ink);
}

/* Dropdown submenus */
.main-nav__item--has-sub {
    position: relative;
}

.main-nav__caret {
    font-size: .5rem;
    margin-left: .4rem;
    transition: transform var(--transition-fast);
}

.main-nav__sub {
    list-style: none;
    margin: 0;
    padding: var(--space-2) 0;
    background: var(--ink-deep);
    border: 1px solid var(--line-dark-soft);
    box-shadow: 0 22px 48px rgba(0, 0, 0, .5);
}

.main-nav__sub-link {
    display: block;
    padding: .65rem 1.5rem;
    font-size: var(--fs-xs);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--ivory-dim);
    white-space: nowrap;
    border-left: 2px solid transparent;
    transition: var(--transition-fast);
}

.main-nav__sub-link:hover {
    background: var(--ink-3);
    border-left-color: var(--brand-yellow);
    color: var(--brand-yellow);
}

@media (min-width: 1200px) {
    .main-nav__sub {
        position: absolute;
        top: calc(100% + 6px);
        left: -1rem;
        min-width: 250px;
        opacity: 0;
        visibility: hidden;
        transform: translateY(12px);
        transition: var(--transition-fast);
        z-index: 5;
    }

    .main-nav__item--has-sub:hover .main-nav__sub,
    .main-nav__item--has-sub:focus-within .main-nav__sub {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .main-nav__item--has-sub:hover .main-nav__caret {
        transform: rotate(180deg);
    }

    .main-nav__sub--wide {
        display: grid;
        grid-template-columns: repeat(2, minmax(210px, 1fr));
        left: auto;
        right: -1rem;
    }
}

@media (max-width: 1199.98px) {
    .main-nav__sub {
        display: none;
        background: transparent;
        border: 0;
        box-shadow: none;
        padding: var(--space-2) 0 var(--space-2) var(--space-3);
        border-left: 1px solid var(--line-dark-soft);
        margin-top: var(--space-2);
    }

    .main-nav__item--open .main-nav__sub {
        display: block;
    }

    .main-nav__item--open .main-nav__caret {
        transform: rotate(180deg);
    }

    .main-nav__sub-link {
        white-space: normal;
        padding: .5rem .75rem;
    }
}

.main-nav__overlay {
    position: fixed;
    inset: 0;
    background: color-mix(in srgb, black 65%, transparent);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--transition);
    z-index: calc(var(--z-header) - 1);
}

html.nav-open .main-nav__overlay {
    opacity: 1;
    pointer-events: auto;
}

@media (max-width: 1199.98px) {
    .main-nav__menu-wrap {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: min(360px, 88vw);
        background: var(--ink-deep);
        border-left: 1px solid var(--line-dark-soft);
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        gap: var(--space-6);
        padding: var(--space-6) var(--space-5);
        transform: translateX(100%);
        transition: transform var(--transition);
        overflow-y: auto;
        z-index: calc(var(--z-header) + 1);
    }

    html.nav-open .main-nav__menu-wrap {
        transform: translateX(0);
    }

    .main-nav__menu {
        flex-direction: column;
        gap: var(--space-3);
    }

    .main-nav__link {
        font-family: var(--font-display);
        font-size: 1.4rem;
        font-weight: 500;
        text-transform: none;
        letter-spacing: .02em;
        color: var(--ivory-dim);
    }

    .main-nav__link::after {
        display: none;
    }

    .main-nav__link:hover,
    .main-nav__link--active {
        color: var(--gold-soft);
    }
}

@media (min-width: 1200px) {
    .main-nav__toggle,
    .main-nav__overlay {
        display: none;
    }
}

/* ------------------------------------------------------------
   Shared section furniture
   Light sections use defaults; dark sections override local vars.
   ------------------------------------------------------------ */
.main-content {
    min-height: 40vh;
}

.section-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: var(--space-3);
    font-family: var(--font-body);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .3em;
    color: var(--eyebrow-color, var(--gold-deep));
    margin-bottom: var(--space-4);
}

.section-eyebrow::before {
    content: '';
    width: 40px;
    height: 1px;
    background: var(--eyebrow-line, var(--gold-dim-light));
}

.section-eyebrow--light {
    --eyebrow-color: var(--gold);
    --eyebrow-line: var(--gold-dim);
}

.section-title {
    font-family: var(--font-display);
    font-weight: 600;
    letter-spacing: .005em;
    line-height: 1.12;
    color: var(--title-color, var(--ink-text));
    font-size: clamp(2.2rem, 1.6rem + 2.6vw, 3.75rem);
    text-wrap: balance;
}

.section-title em {
    font-style: italic;
    font-weight: 500;
    color: var(--title-em-color, var(--gold-deep));
}

.section-desc {
    max-width: 58ch;
    font-size: 1rem;
    line-height: 1.85;
    color: var(--desc-color, var(--body-text));
    text-wrap: pretty;
}

.section-head {
    max-width: 760px;
    margin-inline: auto;
    text-align: center;
    margin-bottom: var(--space-6);
}

.section-head .section-eyebrow {
    justify-content: center;
}

.section-head .section-eyebrow::after {
    content: '';
    width: 40px;
    height: 1px;
    background: var(--eyebrow-line, var(--gold-dim-light));
}

.section-head .section-title {
    margin-bottom: var(--space-4);
}

.section-head .section-desc {
    margin-inline: auto;
}

/* ------------------------------------------------------------
   Hero slider — full screen, dark, real imagery
   ------------------------------------------------------------ */
.slider {
    position: relative;
    background: var(--ink);
}

.slider__slide {
    position: relative;
    min-height: 100svh;
    display: flex;
    align-items: flex-end;
    background-size: cover;
    background-position: center;
    background-color: var(--ink);
}

.slider__slide::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(to top, rgba(16, 13, 9, .72) 0%, rgba(16, 13, 9, .18) 45%, rgba(16, 13, 9, .28) 100%);
}

/* .slider__slide--1 {
    background-image:
        url('https://images.unsplash.com/photo-1520250497591-112f2f40a3f4?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-hero-1/1920/1080'),
        radial-gradient(ellipse at 70% 20%, #3A2F1E 0%, #221B10 45%, #14100A 100%);
}

.slider__slide--2 {
    background-image:
        url('https://images.unsplash.com/photo-1566073771259-6a8506099945?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-hero-2/1920/1080'),
        radial-gradient(ellipse at 25% 30%, #40331C 0%, #241D11 50%, #120E08 100%);
}

.slider__slide--3 {
    background-image:
        url('https://images.unsplash.com/photo-1547235001-d703406d3f17?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-hero-3/1920/1080'),
        radial-gradient(ellipse at 50% 15%, #2E2617 0%, #1A150D 55%, #0E0B07 100%);
} */

.slider__content {
    position: relative;
    z-index: 1;
    max-width: 860px;
    padding-block: var(--space-7) clamp(5rem, 4rem + 6vh, 9rem);
    color: var(--ivory);
}

.slider__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: var(--space-3);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .32em;
    color: var(--gold-soft);
    margin-bottom: var(--space-4);
}

.slider__eyebrow::before {
    content: '';
    width: 48px;
    height: 1px;
    background: var(--gold-dim);
}

.slider__title {
    font-family: var(--font-display);
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.08;
    color: var(--ivory);
    margin-bottom: var(--space-4);
    font-size: clamp(2.8rem, 1.9rem + 4.6vw, 5.5rem);
    text-wrap: balance;
    text-shadow: 0 2px 30px rgba(0, 0, 0, .35);
}

.slider__title em {
    font-style: italic;
    font-weight: 500;
    color: var(--gold-soft);
}

.slider__desc {
    font-size: 1.0625rem;
    line-height: 1.8;
    color: var(--ivory-dim);
    max-width: 52ch;
    margin-bottom: var(--space-5);
    text-wrap: pretty;
}

.slider__actions {
    display: flex;
    align-items: center;
    gap: var(--space-5);
    flex-wrap: wrap;
}

.slider__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1.05rem 2.9rem;
    background: var(--brand-coral);
    border: 1px solid var(--brand-coral);
    color: var(--color-white);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .2em;
    transition: var(--transition-fast);
}

.slider__cta:hover {
    background: var(--brand-yellow);
    border-color: var(--brand-yellow);
    color: var(--ink);
}

.slider__link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--ivory);
    padding-bottom: 4px;
    border-bottom: 1px solid var(--line-dark);
    transition: var(--transition-fast);
}

.slider__link i {
    font-size: .65rem;
    transition: transform var(--transition-fast);
}

.slider__link:hover {
    color: var(--gold-soft);
    border-color: var(--gold-dim);
}

.slider__link:hover i {
    transform: translateX(4px);
}

.slider__nav {
    position: absolute;
    bottom: clamp(2rem, 1.4rem + 2.5vh, 3.5rem);
    width: 52px;
    height: 52px;
    background: rgba(16, 13, 9, .3);
    border: 1px solid var(--line-dark);
    color: var(--ivory-dim);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    z-index: 2;
    cursor: pointer;
    transition: var(--transition-fast);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

.slider__nav:hover {
    background: var(--gold);
    color: var(--ink);
    border-color: var(--gold);
}

.slider__nav--prev {
    right: calc(var(--space-4) + 60px);
    left: auto;
}

.slider__nav--next {
    right: var(--space-4);
}

.slider__pagination.swiper-pagination {
    left: auto;
    right: var(--space-4);
    bottom: clamp(6rem, 5rem + 3vh, 8rem);
    width: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}

.slider__swiper .swiper-pagination-bullet {
    width: 24px;
    height: 2px;
    border-radius: 0;
    background: var(--ivory);
    opacity: .35;
    transition: var(--transition-fast);
    margin: 0 !important;
}

.slider__swiper .swiper-pagination-bullet-active {
    opacity: 1;
    width: 44px;
    background: var(--gold);
}

@media (max-width: 767.98px) {
    .slider__nav,
    .slider__pagination.swiper-pagination {
        display: none;
    }
}

/* ------------------------------------------------------------
   About — LIGHT editorial split, arch imagery
   ------------------------------------------------------------ */
.about {
    padding-block: var(--space-7);
    background: var(--paper);
}

.about__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    align-items: center;
}

@media (min-width: 992px) {
    .about__grid {
        grid-template-columns: .85fr 1.15fr;
        gap: clamp(4rem, 3rem + 4vw, 8rem);
    }
}

.about__media {
    position: relative;
    aspect-ratio: 4 / 5;
    max-width: 480px;
    margin-inline: auto;
    width: 100%;
}

.about__media-frame {
    position: absolute;
}

.about__media-frame--main {
    inset: 0;
    border-radius: var(--radius-arch);
    background-image:
        url('https://images.unsplash.com/photo-1524492412937-b28074a5d7da?q=80&w=900&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-about/900/1200'),
        radial-gradient(ellipse at 50% 30%, #C9B58F 0%, #A08A61 60%, #7C6A48 100%);
    background-size: cover;
    background-position: center;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}

.about__media-frame--main::after {
    content: '';
    position: absolute;
    inset: 14px;
    border-radius: inherit;
    border: 1px solid rgba(255, 255, 255, .55);
}

.about__media-frame--accent {
    inset: -22px auto auto -22px;
    width: 100%;
    height: 100%;
    border-radius: var(--radius-arch);
    border: 1px solid var(--gold-dim-light);
    z-index: -1;
}

.about__text {
    color: var(--body-text);
    font-size: 1.0625rem;
    line-height: 1.9;
    margin-bottom: var(--space-4);
    text-wrap: pretty;
}

.about__stats {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(2.5rem, 1.8rem + 3vw, 5rem);
    margin-block: var(--space-5);
    padding-block: var(--space-4);
    border-block: 1px solid var(--line-light-soft);
}

.about__stat {
    display: flex;
    flex-direction: column;
    gap: .15rem;
}

.about__stat-value {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(2rem, 1.7rem + 1.3vw, 3rem);
    line-height: 1.1;
    color: var(--gold-deep);
}

.about__stat-label {
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .13em;
    color: var(--muted-text);
    max-width: 18ch;
}

.about__link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-weight: 700;
    text-transform: uppercase;
    font-size: var(--fs-2xs);
    letter-spacing: .16em;
    color: var(--ink-text);
    border-bottom: 1px solid var(--line-light);
    padding-bottom: 4px;
    transition: var(--transition-fast);
}

.about__link i {
    font-size: .65rem;
    color: var(--gold-deep);
    transition: transform var(--transition-fast);
}

.about__link:hover {
    color: var(--gold-deep);
    border-color: var(--gold-dim-light);
}

.about__link:hover i {
    transform: translateX(4px);
}

/* ------------------------------------------------------------
   Rooms — LIGHT, white gallery cards with arch imagery
   ------------------------------------------------------------ */
.rooms {
    padding-block: var(--space-7);
    background: var(--paper-2);
    border-block: 1px solid var(--line-light-soft);
}

.rooms__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
}

@media (min-width: 640px) {
    .rooms__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    .rooms__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: var(--space-4);
    }
}

.rooms__more {
    display: flex;
    justify-content: center;
    margin-top: var(--space-6);
}

.room-card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.room-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-md);
    border-color: var(--gold-dim-light);
}

.room-card__media {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background-color: var(--paper-2);
}

.room-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.1s var(--ease);
}

.room-card:hover .room-card__img {
    transform: scale(1.07);
}

.room-card__media::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(16, 13, 9, .55), transparent 45%);
    pointer-events: none;
}

.room-card__badge {
    position: absolute;
    left: var(--space-3);
    bottom: var(--space-3);
    z-index: 1;
    display: inline-flex;
    align-items: baseline;
    gap: .3rem;
    padding: .45rem .9rem;
    background: rgba(16, 13, 9, .55);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: 1px solid var(--gold-dim);
    color: var(--brand-yellow);
    font-family: var(--font-display);
    font-style: italic;
    font-size: 1rem;
}

.room-card__badge small {
    font-family: var(--font-body);
    font-style: normal;
    font-size: var(--fs-2xs);
    color: var(--ivory-dim);
    letter-spacing: .04em;
}

.room-card__body {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding: var(--space-4);
}

.room-card__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.35rem;
    color: var(--ink-text);
    margin-bottom: .35rem;
}

.room-card__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-3);
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--muted-text);
    margin-bottom: var(--space-3);
}

.room-card__meta span {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}

.room-card__meta i {
    color: var(--gold-deep);
    font-size: .7rem;
}

.room-card__desc {
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--body-text);
    margin-bottom: var(--space-3);
    text-wrap: pretty;
}

.room-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    margin-top: auto;
    padding-top: var(--space-3);
    border-top: 1px solid var(--line-light-soft);
}

.room-card__amenities {
    display: flex;
    gap: var(--space-2);
    list-style: none;
    padding: 0;
}

.room-card__amenities li {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid var(--line-light);
    border-radius: var(--radius-full);
    color: var(--gold-deep);
    font-size: .7rem;
    transition: var(--transition-fast);
}

.room-card:hover .room-card__amenities li {
    border-color: var(--gold-dim-light);
}

.room-card__link {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--ink-text);
    transition: var(--transition-fast);
}

.room-card__link i {
    font-size: .6rem;
    color: var(--gold-deep);
    transition: transform var(--transition-fast);
}

.room-card__link:hover {
    color: var(--gold-deep);
}

.room-card__link:hover i {
    transform: translateX(4px);
}

/* ------------------------------------------------------------
   Amenities — DARK band
   ------------------------------------------------------------ */
.amenities {
    padding-block: var(--space-7);
    background: var(--paper);
}

.amenities__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
}

@media (min-width: 768px) {
    .amenities__grid {
        grid-template-columns: repeat(4, 1fr);
        gap: var(--space-4);
    }
}

.amenity {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-3);
    padding: var(--space-5) var(--space-3);
    background: var(--card);
    border: 1px solid var(--line-light-soft);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    transition: var(--transition-fast);
}

.amenity:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
    border-color: var(--gold-dim-light);
}

.amenity__icon {
    width: 62px;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: var(--accent-tint);
    border-radius: var(--radius-full);
    color: var(--gold-deep);
    font-size: 1.25rem;
    transition: var(--transition-fast);
}

.amenity:hover .amenity__icon {
    background: var(--gold);
    color: var(--ink);
    transform: scale(1.06);
}

.amenity__label {
    font-size: var(--fs-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--ink-text);
    margin: 0;
}

/* ------------------------------------------------------------
   Testimonials — LIGHT, large serif quotes
   ------------------------------------------------------------ */
.testimonials {
    padding-block: var(--space-7);
    background: var(--paper-2);
    border-block: 1px solid var(--line-light-soft);
}

/* ------------------------------------------------------------
   CTA — DARK, desert imagery, framed
   ------------------------------------------------------------ */
.cta {
    position: relative;
    padding-block: var(--space-7);
    background: var(--paper-2);
    border-top: 1px solid var(--line-light-soft);
    overflow: hidden;
}

.cta::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 85% 50%, rgba(232, 95, 76, .07), transparent 55%);
    pointer-events: none;
}

.cta__grid {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    align-items: center;
}

@media (min-width: 992px) {
    .cta__grid {
        grid-template-columns: 1.1fr .9fr;
        gap: clamp(4rem, 3rem + 4vw, 7rem);
    }
}

.cta__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(2rem, 1.6rem + 2.2vw, 3.4rem);
    line-height: 1.14;
    color: var(--ink-text);
    margin-block: var(--space-3);
    text-wrap: balance;
}

.cta__title em {
    font-style: italic;
    font-weight: 500;
    color: var(--gold-deep);
}

.cta__desc {
    color: var(--body-text);
    font-size: 1rem;
    line-height: 1.8;
    max-width: 52ch;
    margin-bottom: var(--space-5);
    text-wrap: pretty;
}

.cta__actions {
    display: flex;
    align-items: center;
    gap: var(--space-5);
    flex-wrap: wrap;
}

.cta__perks {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-3) var(--space-4);
    list-style: none;
    padding: var(--space-4) 0 0;
    margin: var(--space-5) 0 0;
    border-top: 1px solid var(--line-light-soft);
    font-size: var(--fs-xs);
    color: var(--body-text);
}

.cta__perks li {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}

.cta__perks i {
    color: var(--gold-deep);
    font-size: .7rem;
}

.cta__media {
    position: relative;
    width: 100%;
    max-width: 440px;
    margin-inline: auto;
}

.cta__img {
    width: 100%;
    aspect-ratio: 4 / 4.6;
    object-fit: cover;
    border-radius: var(--radius-arch);
    display: block;
}

.cta__media::after {
    content: '';
    position: absolute;
    inset: 14px;
    border-radius: var(--radius-arch);
    border: 1px solid rgba(255, 255, 255, .6);
    pointer-events: none;
}

.cta__badge {
    position: absolute;
    left: clamp(-18px, -1vw, 8px);
    bottom: 32px;
    z-index: 1;
    display: flex;
    flex-direction: column;
    padding: .9rem 1.3rem;
    background: var(--gold);
    color: var(--ink);
    box-shadow: var(--shadow-md);
}

.cta__badge-value {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 1.7rem;
    line-height: 1.1;
}

.cta__badge-label {
    font-size: var(--fs-2xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .13em;
}

.cta__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1.05rem 2.9rem;
    background: var(--brand-coral);
    border: 1px solid var(--brand-coral);
    color: var(--color-white);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .2em;
    font-size: var(--fs-2xs);
    transition: var(--transition-fast);
}

.cta__cta:hover {
    background: var(--brand-yellow);
    border-color: var(--brand-yellow);
    color: var(--ink);
}

.cta__phone {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    color: var(--ink-text);
    font-weight: 600;
    font-size: var(--fs-sm);
    letter-spacing: .03em;
}

.cta__phone i {
    color: var(--gold-deep);
    font-size: .8rem;
}

.cta__phone:hover {
    color: var(--gold-deep);
}

/* ------------------------------------------------------------
   Footer — DARK
   ------------------------------------------------------------ */
.site-footer {
    background-image:
        linear-gradient(color-mix(in srgb, var(--ink-deep) 94%, transparent), color-mix(in srgb, var(--ink-deep) 97%, transparent)),
        url('../img/footer-bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: var(--ink-deep);
    border-top: 1px solid var(--line-dark-soft);
    color: var(--ivory-dim);
    padding-block: var(--space-7) var(--space-5);
}

.site-footer__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}

@media (min-width: 768px) {
    .site-footer__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    .site-footer__grid {
        grid-template-columns: 2fr 1fr 1fr 1.4fr;
        gap: var(--space-5);
    }
}

.site-footer__logo {
    height: 80px;
    width: auto;
    margin-bottom: var(--space-4);
}

.site-footer__desc {
    font-size: var(--fs-sm);
    line-height: 1.9;
    color: var(--ivory-dim);
    margin-bottom: var(--space-4);
    max-width: 34ch;
}

.site-footer__social {
    display: flex;
    gap: var(--space-2);
    list-style: none;
    padding: 0;
}

.site-footer__social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    border: 1px solid var(--line-dark);
    color: var(--ivory-dim);
    font-size: .85rem;
    transition: var(--transition-fast);
}

.site-footer__social-link:hover {
    background: var(--gold);
    border-color: var(--gold);
    color: var(--ink);
    transform: translateY(-3px);
}

.site-footer__title {
    font-family: var(--font-body);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .24em;
    color: var(--gold);
    margin-bottom: var(--space-4);
    position: relative;
    padding-bottom: var(--space-3);
}

.site-footer__title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 36px;
    height: 1px;
    background: var(--gold-dim);
}

.site-footer__links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.site-footer__link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--fs-sm);
    color: var(--ivory-dim);
    transition: var(--transition-fast);
}

.site-footer__link-icon {
    color: var(--gold-dim);
    font-size: .55rem;
    transition: var(--transition-fast);
}

.site-footer__link:hover {
    color: var(--gold-soft);
    transform: translateX(4px);
}

.site-footer__link:hover .site-footer__link-icon {
    color: var(--gold);
}

.site-footer__contact {
    list-style: none;
    margin: 0 0 var(--space-4);
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.site-footer__contact-item {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    font-size: var(--fs-sm);
    line-height: 1.7;
}

.site-footer__contact-item i {
    color: var(--gold);
    font-size: .8rem;
    margin-top: .35em;
}

.site-footer__contact-link {
    color: var(--ivory-dim);
}

.site-footer__contact-link:hover {
    color: var(--gold-soft);
}

/* Footer bottom + awards */
.footer-bottom {
    background: var(--ink-deep);
    border-top: 1px solid var(--line-dark-soft);
}

.footer_awards {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--space-5);
    padding-block: var(--space-4);
    border-bottom: 1px solid var(--line-dark-soft);
}

.footer_awards__item_inner img {
    max-height: 56px;
    width: auto;
}

.footer-bottom__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-4);
    padding-block: var(--space-3);
    font-size: var(--fs-xs);
    letter-spacing: .07em;
    color: var(--ivory-dim);
}

.footer-bottom__text {
    margin: 0;
}

.footer-bottom__credit {
    margin: 0;
    color: var(--ivory-faint);
}

.footer-bottom__credit a {
    color: var(--gold);
    font-weight: 600;
    transition: var(--transition-fast);
}

.footer-bottom__credit a:hover {
    color: var(--gold-soft);
}

@media (max-width: 575.98px) {
    .footer-bottom__inner {
        justify-content: center;
        text-align: center;
    }
}

/* ------------------------------------------------------------
   Scroll top
   ------------------------------------------------------------ */
.scroll-top {
    position: fixed;
    right: var(--space-4);
    bottom: var(--space-4);
    width: 48px;
    height: 48px;
    background: var(--brand-coral);
    border: 1px solid var(--brand-coral);
    color: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .85rem;
    box-shadow: var(--shadow-md);
    opacity: 0;
    visibility: hidden;
    transform: translateY(16px);
    transition: var(--transition);
    z-index: var(--z-scroll-top);
    cursor: pointer;
}

.scroll-top--visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.scroll-top:hover {
    background: var(--brand-yellow);
    border-color: var(--brand-yellow);
    color: var(--ink);
    transform: translateY(-4px);
}

/* ------------------------------------------------------------
   Recognition strip — TripAdvisor awards (light)
   ------------------------------------------------------------ */
.recognition {
    padding-block: var(--space-6);
    background: var(--paper-2);
    border-block: 1px solid var(--line-light-soft);
}

.recognition .section-head {
    margin-bottom: var(--space-5);
}

.recognition .section-title {
    font-size: clamp(1.7rem, 1.4rem + 1.4vw, 2.5rem);
}

.recognition__row {
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--space-4);
}

.recognition__item {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 260px;
    min-height: 160px;
    padding: var(--space-4) var(--space-5);
    background: var(--card);
    border: 1px solid var(--line-light-soft);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    transition: var(--transition-fast);
}

.recognition__item:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
    border-color: var(--gold-dim-light);
}

.recognition__item > div {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.recognition__item .TA_links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.recognition__item .TA_links li {
    display: flex;
    align-items: center;
    justify-content: center;
}

.recognition__item img {
    max-height: 170px;
    max-width: 100%;
    width: auto;
    height: auto;
}

/* ------------------------------------------------------------
   Page hero (subpages)
   ------------------------------------------------------------ */
.page-hero {
    position: relative;
    min-height: clamp(380px, 52vh, 560px);
    display: flex;
    align-items: flex-end;
    background-size: cover;
    background-position: center;
    background-color: var(--ink);
}

.page-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(16, 13, 9, .72) 0%, rgba(16, 13, 9, .28) 55%, rgba(16, 13, 9, .38) 100%);
}

.page-hero--about {
    background-image:
        url('https://images.unsplash.com/photo-1571896349842-33c89424de2d?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-ph-about/1920/900'),
        radial-gradient(ellipse at 60% 20%, #3A2F1E 0%, #221B10 50%, #14100A 100%);
}

.page-hero--faq {
    background-image:
        url('https://images.unsplash.com/photo-1547235001-d703406d3f17?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-ph-faq/1920/900'),
        radial-gradient(ellipse at 40% 25%, #40331C 0%, #241D11 50%, #120E08 100%);
}

.page-hero--contact {
    background-image:
        url('https://images.unsplash.com/photo-1524492412937-b28074a5d7da?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-ph-contact/1920/900'),
        radial-gradient(ellipse at 55% 20%, #3A2F1E 0%, #221B10 50%, #14100A 100%);
}

.page-hero--testimonials {
    background-image:
        url('https://images.unsplash.com/photo-1520250497591-112f2f40a3f4?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-ph-testi/1920/900'),
        radial-gradient(ellipse at 50% 25%, #2E2617 0%, #1A150D 50%, #0E0B07 100%);
}

.page-hero__content {
    position: relative;
    z-index: 1;
    padding-block: clamp(8rem, 6rem + 8vh, 11rem) var(--space-6);
    color: var(--ivory);
}

.page-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: var(--space-3);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .32em;
    color: var(--gold-soft);
    margin-bottom: var(--space-3);
}

.page-hero__eyebrow::before {
    content: '';
    width: 48px;
    height: 1px;
    background: var(--gold-dim);
}

.page-hero__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(2.4rem, 1.8rem + 3vw, 4.25rem);
    line-height: 1.08;
    color: var(--ivory);
    margin-bottom: var(--space-3);
    text-wrap: balance;
}

.page-hero__title em {
    font-style: italic;
    font-weight: 500;
    color: var(--gold-soft);
}

.breadcrumb-nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2);
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--ivory-faint);
}

.breadcrumb-nav a {
    color: var(--ivory-dim);
}

.breadcrumb-nav a:hover {
    color: var(--gold-soft);
}

.breadcrumb-nav li + li::before {
    content: '·';
    margin-right: var(--space-2);
    color: var(--gold-dim);
}

/* ------------------------------------------------------------
   Content sections on subpages
   ------------------------------------------------------------ */
.content-section {
    padding-block: var(--space-7);
    background: var(--paper);
}

.content-section--alt {
    background: var(--paper-2);
    border-block: 1px solid var(--line-light-soft);
}

/* Feature blocks (about page) */
.features__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
}

@media (min-width: 768px) {
    .features__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.feature {
    padding: var(--space-5) var(--space-4);
    background: var(--card);
    border: 1px solid var(--line-light-soft);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    transition: var(--transition-fast);
}

.feature:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
    border-color: var(--gold-dim-light);
}

.feature__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border: 1px solid var(--gold-dim-light);
    border-radius: var(--radius-full);
    color: var(--gold-deep);
    font-size: 1.05rem;
    margin-bottom: var(--space-3);
}

.feature__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.25rem;
    color: var(--ink-text);
    margin-bottom: var(--space-2);
}

.feature__text {
    font-size: var(--fs-sm);
    line-height: 1.8;
    color: var(--body-text);
    margin: 0;
}

/* ------------------------------------------------------------
   FAQ accordion (native details/summary)
   ------------------------------------------------------------ */
.faq-list {
    max-width: 820px;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.faq-item {
    background: var(--card);
    border: 1px solid var(--line-light-soft);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    transition: var(--transition-fast);
}

.faq-item[open] {
    border-color: var(--gold-dim-light);
}

.faq-item__q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-4);
    cursor: pointer;
    list-style: none;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.15rem;
    color: var(--ink-text);
    transition: color var(--transition-fast);
}

.faq-item__q::-webkit-details-marker {
    display: none;
}

.faq-item__q:hover {
    color: var(--gold-deep);
}

.faq-item__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border: 1px solid var(--gold-dim-light);
    border-radius: var(--radius-full);
    color: var(--gold-deep);
    font-size: .7rem;
    transition: var(--transition-fast);
}

.faq-item[open] .faq-item__icon {
    background: var(--gold);
    border-color: var(--gold);
    color: var(--ink);
    transform: rotate(45deg);
}

.faq-item__a {
    padding: 0 var(--space-4) var(--space-4);
    font-size: var(--fs-sm);
    line-height: 1.85;
    color: var(--body-text);
}

.faq-item__a p {
    margin: 0;
}

/* ------------------------------------------------------------
   Contact page
   ------------------------------------------------------------ */
/* Info cards across the top */
.contact-info {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-3);
    margin-bottom: var(--space-7);
}

@media (min-width: 640px) {
    .contact-info {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1200px) {
    .contact-info {
        grid-template-columns: repeat(4, 1fr);
        gap: var(--space-4);
    }
}

.contact-info__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-3);
    padding: var(--space-5) var(--space-4);
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    transition: var(--transition-fast);
}

.contact-info__card:hover {
    border-color: var(--gold-dim-light);
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.contact-info__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 58px;
    height: 58px;
    background: var(--accent-tint);
    border-radius: var(--radius-full);
    color: var(--gold-deep);
    font-size: 1.15rem;
    transition: var(--transition-fast);
}

.contact-info__card:hover .contact-info__icon {
    background: var(--brand-yellow);
    color: var(--ink);
}

.contact-info__title {
    font-family: var(--font-body);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .18em;
    color: var(--muted-text);
    margin-bottom: .2rem;
}

.contact-info__value {
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--ink-text);
    margin: 0;
}

.contact-info__value a {
    color: var(--ink-text);
}

.contact-info__value a:hover {
    color: var(--gold-deep);
}

/* Enquiry form — centred and narrow */
.contact-form {
    max-width: 720px;
    margin-inline: auto;
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    padding: clamp(1.75rem, 1.2rem + 2.4vw, 3.5rem);
}

.contact-form__head {
    text-align: center;
    margin-bottom: var(--space-5);
}

.contact-form__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(1.6rem, 1.4rem + 1vw, 2.2rem);
    color: var(--ink-text);
    margin-bottom: var(--space-2);
}

.contact-form__sub {
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--body-text);
    margin: 0;
}

.contact-form .btn-gold {
    width: 100%;
    margin-top: var(--space-2);
}

.contact-form__note {
    text-align: center;
    font-size: var(--fs-2xs);
    color: var(--muted-text);
    margin: var(--space-3) 0 0;
}

.contact-form .form-label {
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--muted-text);
    margin-bottom: .4rem;
}

.contact-form .form-control,
.contact-form .form-select {
    font-family: var(--font-body);
    font-size: var(--fs-sm);
    color: var(--ink-text);
    background: var(--paper);
    border: 1px solid var(--line-light);
    border-radius: 8px;
    padding: .75rem 1rem;
    transition: var(--transition-fast);
}

.contact-form .form-control:focus,
.contact-form .form-select:focus {
    background: var(--card);
    border-color: var(--brand-coral);
    box-shadow: 0 0 0 3px rgba(232, 95, 76, .18);
    outline: 0;
}

.contact-form .form-control::placeholder {
    color: var(--muted-text);
}

.btn-gold {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: 1rem 2.75rem;
    background: var(--brand-coral);
    border: 1px solid var(--brand-coral);
    color: var(--color-white);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .2em;
    cursor: pointer;
    transition: var(--transition-fast);
}

.btn-gold:hover {
    background: var(--brand-yellow);
    border-color: var(--brand-yellow);
    color: var(--ink);
}

.contact-map {
    width: 100%;
    border-radius: 0;
    overflow: hidden;
    border-block: 1px solid var(--line-light-soft);
    line-height: 0;
}

.contact-map iframe {
    display: block;
    width: 100%;
    height: clamp(360px, 46vh, 540px);
    border: 0;
    filter: saturate(.9);
}

/* ------------------------------------------------------------
   Testimonials page grid
   ------------------------------------------------------------ */
.testi-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
}

@media (min-width: 768px) {
    .testi-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1200px) {
    .testi-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.testi-card {
    display: flex;
    flex-direction: column;
    padding: var(--space-5) var(--space-4);
    background: var(--card);
    border: 1px solid var(--line-light-soft);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    transition: var(--transition-fast);
}

.testi-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
    border-color: var(--gold-dim-light);
}

.testi-card__stars {
    color: var(--gold-deep);
    font-size: .65rem;
    letter-spacing: .4em;
    margin-bottom: var(--space-3);
}

.testi-card__quote {
    font-family: var(--font-display);
    font-style: italic;
    font-size: 1.1rem;
    line-height: 1.65;
    color: var(--ink-text);
    margin: 0 0 var(--space-4);
    text-wrap: pretty;
}

.testi-card__author {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-top: auto;
}

.testi-card__avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid var(--gold-dim-light);
    background: var(--paper);
    color: var(--gold-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-display);
    font-size: 1rem;
    flex-shrink: 0;
}

.testi-card__avatar--img {
    background-size: cover;
    background-position: center;
    color: transparent;
    border-color: var(--gold-dim-light);
}

.testi-card__name {
    display: block;
    font-weight: 600;
    color: var(--ink-text);
    font-size: var(--fs-sm);
}

.testi-card__place {
    display: block;
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--muted-text);
}

/* ------------------------------------------------------------
   About page — story blocks, pull quote, journeys, why, commitments
   ------------------------------------------------------------ */
.story__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
}

@media (min-width: 768px) {
    .story__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-6);
    }
}

.story-block {
    border-top: 1px solid var(--brand-coral);
    padding-top: var(--space-4);
}

.story-block__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.5rem;
    color: var(--ink-text);
    margin-bottom: var(--space-3);
}

.story-block__text {
    font-size: var(--fs-sm);
    line-height: 1.9;
    color: var(--body-text);
    margin-bottom: var(--space-3);
    text-wrap: pretty;
}

.story-block__text:last-child {
    margin-bottom: 0;
}

.pull-quote {
    padding-block: var(--space-6);
    background: var(--paper-2);
    text-align: center;
}

.pull-quote__label {
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .34em;
    color: var(--gold-deep);
    margin-bottom: var(--space-3);
}

.pull-quote__text {
    font-family: var(--font-display);
    font-style: italic;
    font-weight: 500;
    font-size: clamp(1.6rem, 1.3rem + 1.6vw, 2.5rem);
    line-height: 1.4;
    color: var(--ink-text);
    max-width: 800px;
    margin-inline: auto;
    text-wrap: balance;
}

.pull-quote__text span {
    color: var(--gold-deep);
}

.pull-quote__sub {
    margin-top: var(--space-3);
    font-size: var(--fs-sm);
    color: var(--body-text);
    max-width: 60ch;
    margin-inline: auto;
}

.journeys__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
}

@media (min-width: 992px) {
    .journeys__grid {
        grid-template-columns: repeat(4, 1fr);
        gap: var(--space-4);
    }
}

.journey {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-3);
    padding: var(--space-5) var(--space-3);
    background: var(--card);
    border: 1px solid var(--line-light-soft);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    transition: var(--transition-fast);
}

.journey:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
    border-color: var(--gold-dim-light);
}

.journey__icon {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--accent-tint);
    border-radius: var(--radius-full);
    color: var(--gold-deep);
    font-size: 1.05rem;
    transition: var(--transition-fast);
}

.journey:hover .journey__icon {
    background: var(--gold);
    color: var(--ink);
}

.journey__label {
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--ink-text);
    margin: 0;
}

.why__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
}

@media (min-width: 768px) {
    .why__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: var(--space-6);
    }
}

.why-item {
    position: relative;
    border-top: 2px solid var(--brand-coral);
    padding-top: var(--space-4);
}

.why-item__num {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 3rem;
    line-height: 1;
    color: rgba(232, 95, 76, .30);
    margin-bottom: var(--space-3);
}

.why-item__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.45rem;
    color: var(--ink-text);
    margin-bottom: var(--space-2);
}

.why-item__text {
    font-size: var(--fs-sm);
    line-height: 1.85;
    color: var(--body-text);
    margin: 0;
}

.commitments {
    padding-block: var(--space-7);
    background: var(--paper-2);
}

.commitments__list {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-3);
    max-width: 900px;
    margin-inline: auto;
    list-style: none;
    padding: 0;
}

@media (min-width: 768px) {
    .commitments__list {
        grid-template-columns: repeat(2, 1fr);
    }
}

.commitments__list li {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-4);
    background: var(--card);
    border: 1px solid var(--line-light-soft);
    border-radius: var(--radius-md);
    color: var(--body-text);
    font-size: var(--fs-sm);
    line-height: 1.7;
    transition: var(--transition-fast);
}

.commitments__list li:hover {
    border-color: var(--gold-dim-light);
    background: var(--card);
}

.commitments__list i {
    color: var(--gold-deep);
    font-size: .6rem;
    margin-top: .5em;
    flex-shrink: 0;
}

.legacy {
    max-width: 760px;
    margin: var(--space-6) auto 0;
    text-align: center;
    color: var(--body-text);
    font-size: var(--fs-sm);
    line-height: 1.9;
}

.legacy__welcome {
    font-family: var(--font-display);
    font-style: italic;
    font-weight: 500;
    font-size: clamp(1.3rem, 1.1rem + 1vw, 1.8rem);
    color: var(--gold-deep);
    margin-top: var(--space-4);
    line-height: 1.5;
}

/* ------------------------------------------------------------
   Gallery — masonry
   ------------------------------------------------------------ */
.page-hero--gallery {
    background-image:
        url('https://images.unsplash.com/photo-1566073771259-6a8506099945?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-ph-gallery/1920/900'),
        radial-gradient(ellipse at 55% 25%, #3A2F1E 0%, #221B10 50%, #14100A 100%);
}

.gallery-masonry {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
}

@media (min-width: 640px) {
    .gallery-masonry {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    .gallery-masonry {
        grid-template-columns: repeat(3, 1fr);
    }
}

.gallery-item {
    position: relative;
    display: block;
    cursor: pointer;
    break-inside: avoid;
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    background: var(--paper-2);
}

.gallery-item img {
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
    transition: transform 1.1s var(--ease);
}

.gallery-item:hover img {
    transform: scale(1.06);
}

.gallery-item__cap {
    position: absolute;
    inset: auto 0 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: var(--space-4);
    background: linear-gradient(to top, rgba(16, 13, 9, .82), transparent);
    color: var(--ivory);
    font-size: var(--fs-2xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .16em;
    opacity: 0;
    transform: translateY(10px);
    transition: var(--transition);
}

.gallery-item__cap i {
    color: var(--gold);
    font-size: .75rem;
}

.gallery-item:hover .gallery-item__cap {
    opacity: 1;
    transform: translateY(0);
}

@media (hover: none) {
    .gallery-item__cap {
        opacity: 1;
        transform: none;
    }
}

/* ------------------------------------------------------------
   Lightbox
   ------------------------------------------------------------ */
.lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(1rem, 3vw, 3rem);
    background: rgba(16, 13, 9, .92);
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s var(--ease), visibility .3s var(--ease);
}

.lightbox.is-open {
    opacity: 1;
    visibility: visible;
}

.lightbox__figure {
    margin: 0;
    max-width: min(1100px, 100%);
    max-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
}

.lightbox__img {
    max-width: 100%;
    max-height: 82vh;
    width: auto;
    height: auto;
    border-radius: var(--radius-sm);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .55);
    object-fit: contain;
}

.lightbox__cap {
    color: var(--ivory);
    font-size: var(--fs-sm);
    letter-spacing: .1em;
    text-transform: uppercase;
    text-align: center;
}

.lightbox__btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 3rem;
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    color: var(--ivory);
    font-size: 1.1rem;
    cursor: pointer;
    transition: var(--transition);
}

.lightbox__btn:hover {
    background: var(--gold);
    color: var(--ink);
    border-color: var(--gold);
}

.lightbox__btn--prev { left: clamp(.75rem, 2vw, 2rem); }
.lightbox__btn--next { right: clamp(.75rem, 2vw, 2rem); }

.lightbox__close {
    position: absolute;
    top: clamp(.75rem, 2vw, 1.75rem);
    right: clamp(.75rem, 2vw, 1.75rem);
    transform: none;
}

@media (max-width: 640px) {
    .lightbox__btn--prev { left: .5rem; }
    .lightbox__btn--next { right: .5rem; }
}

/* ------------------------------------------------------------
   Explore Jaisalmer — attraction rows
   ------------------------------------------------------------ */
.page-hero--explore {
    background-image:
        url('https://images.unsplash.com/photo-1571896349842-33c89424de2d?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-ph-explore/1920/900'),
        radial-gradient(ellipse at 50% 25%, #3A2F1E 0%, #221B10 50%, #14100A 100%);
}

.page-hero--tours {
    background-image:
        url('https://images.unsplash.com/photo-1520250497591-112f2f40a3f4?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-ph-tours/1920/900'),
        radial-gradient(ellipse at 45% 25%, #40331C 0%, #241D11 50%, #120E08 100%);
}

.intro-lead {
    max-width: 62ch;
    font-size: 1.0625rem;
    line-height: 1.9;
    color: var(--body-text);
    margin-bottom: var(--space-4);
    text-wrap: pretty;
}

.attraction {
    padding-block: var(--space-6);
    background: var(--paper);
}

/* ---- Place index (jump grid) ---- */
.place-index {
    margin-top: var(--space-6);
    padding-top: var(--space-6);
    border-top: 1px solid var(--line-light-soft);
}

.place-index__head {
    text-align: center;
    margin-bottom: var(--space-5);
}

.place-index__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
}

@media (min-width: 768px) {
    .place-index__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1200px) {
    .place-index__grid {
        grid-template-columns: repeat(5, 1fr);
        gap: var(--space-3);
    }
}

.place-card {
    position: relative;
    display: block;
    border-radius: var(--radius-md);
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: var(--ink);
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.place-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.place-card img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1s var(--ease);
}

.place-card:hover img {
    transform: scale(1.08);
}

.place-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(16, 13, 9, .92), rgba(16, 13, 9, .25) 70%);
}

.place-card__body {
    position: absolute;
    inset: auto 0 0 0;
    z-index: 1;
    padding: var(--space-3);
}

.place-card__name {
    display: block;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: .98rem;
    line-height: 1.25;
    color: var(--ivory);
}

.place-card__dist {
    display: block;
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--brand-yellow);
    margin-top: .2rem;
}

/* ---- Attraction feature ---- */
.attraction__figure {
    position: relative;
    aspect-ratio: 4 / 3;
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--ink);
    box-shadow: var(--shadow-md);
    margin-bottom: var(--space-5);
}

.attraction__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.4s var(--ease);
}

@media (min-width: 768px) {
    .attraction__figure {
        aspect-ratio: 16 / 9;
    }
}

@media (min-width: 1200px) {
    .attraction__figure {
        aspect-ratio: 21 / 8;
    }
}

.attraction__figure:hover .attraction__img {
    transform: scale(1.03);
}

.attraction__figure::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(16, 13, 9, .78) 0%, rgba(16, 13, 9, .3) 45%, rgba(16, 13, 9, .1) 100%);
    pointer-events: none;
}

.attraction__caption {
    position: absolute;
    inset: auto 0 0 0;
    z-index: 1;
    padding: clamp(1.25rem, 1rem + 2vw, 2.75rem);
}

.attraction__distance {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .5rem 1rem;
    margin-bottom: var(--space-3);
    background: rgba(16, 13, 9, .55);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: 1px solid var(--gold-dim);
    color: var(--brand-yellow);
    font-size: var(--fs-2xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .12em;
}

.attraction__distance i {
    font-size: .7rem;
}

.attraction__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(1.9rem, 1.4rem + 2.4vw, 3.4rem);
    line-height: 1.1;
    color: var(--ivory);
    margin: 0;
    text-wrap: balance;
    text-shadow: 0 2px 24px rgba(0, 0, 0, .5);
}

/* Body text flows in two columns on wide screens to tame the length */
.attraction__body {
    margin-bottom: var(--space-5);
}

@media (min-width: 1200px) {
    .attraction__body {
        column-count: 2;
        column-gap: clamp(2.5rem, 2rem + 2vw, 4.5rem);
    }
}

.attraction__text {
    font-size: var(--fs-sm);
    line-height: 1.9;
    color: var(--body-text);
    margin: 0 0 var(--space-3);
    text-wrap: pretty;
    break-inside: avoid;
}

.attraction__text:first-child::first-letter {
    float: left;
    font-family: var(--font-display);
    font-size: 3.4rem;
    line-height: .82;
    font-weight: 600;
    color: var(--gold-deep);
    padding: .1em .12em 0 0;
}

.why-visit {
    margin: 0;
    padding: var(--space-5);
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
}

.why-visit__title {
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .2em;
    color: var(--gold-deep);
    margin-bottom: var(--space-4);
}

.why-visit__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: .7rem var(--space-5);
}

@media (min-width: 768px) {
    .why-visit__list {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1200px) {
    .why-visit__list {
        grid-template-columns: repeat(3, 1fr);
    }
}

.why-visit__list li {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    font-size: var(--fs-sm);
    line-height: 1.6;
    color: var(--body-text);
}

.why-visit__list i {
    color: var(--gold-deep);
    font-size: .7rem;
    margin-top: .45em;
    flex-shrink: 0;
}

.attraction__closing {
    max-width: 70ch;
    margin: var(--space-5) auto 0;
    padding-top: var(--space-4);
    border-top: 1px solid var(--gold-dim-light);
    text-align: center;
    font-family: var(--font-display);
    font-style: italic;
    font-size: clamp(1.05rem, 1rem + .5vw, 1.35rem);
    line-height: 1.6;
    color: var(--ink-text);
    text-wrap: pretty;
}

/* ------------------------------------------------------------
   Educational tours page
   ------------------------------------------------------------ */
.tour-split {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
    align-items: start;
}

@media (min-width: 992px) {
    .tour-split {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-6);
    }
}

.tick-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--space-2);
}

.tick-list li {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    background: var(--card);
    border: 1px solid var(--line-light-soft);
    border-radius: var(--radius-md);
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--body-text);
    transition: var(--transition-fast);
}

.tick-list li:hover {
    border-color: var(--gold-dim-light);
    transform: translateX(4px);
}

.tick-list i {
    color: var(--gold-deep);
    font-size: .75rem;
    margin-top: .4em;
    flex-shrink: 0;
}

.offer-panel {
    max-width: 900px;
    margin-inline: auto;
    margin-top: clamp(2.5rem, 1.8rem + 3vw, 4.5rem);
    text-align: center;
    padding: clamp(2.5rem, 2rem + 3vw, 4.5rem) clamp(1.5rem, 1rem + 3vw, 4rem);
    border: 1px solid var(--gold-dim-light);
    background: var(--card);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
}

.offer-panel__value {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(2.4rem, 2rem + 2.4vw, 4rem);
    line-height: 1;
    color: var(--gold-deep);
    margin-bottom: var(--space-2);
}

.offer-panel__text {
    font-size: 1rem;
    line-height: 1.85;
    color: var(--body-text);
    max-width: 60ch;
    margin-inline: auto;
    margin-bottom: var(--space-4);
}

.offer-panel .btn-gold {
    margin-inline: auto;
}

.offer-panel__badge {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .55rem 1.2rem;
    border: 1px solid var(--gold-dim-light);
    color: var(--gold-deep);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .18em;
    margin-bottom: var(--space-5);
}

/* Recognition row nested inside another section */
.recognition__inner {
    margin-top: var(--space-7);
    padding-top: var(--space-6);
    border-top: 1px solid var(--line-light-soft);
}

.recognition__inner .section-head {
    margin-bottom: var(--space-5);
}

.recognition__inner .section-title {
    font-size: clamp(1.7rem, 1.4rem + 1.4vw, 2.4rem);
}

/* ------------------------------------------------------------
   FAQ category navigation + grouped sections
   ------------------------------------------------------------ */
.faq-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-2);
    max-width: 900px;
    margin-inline: auto;
}

.faq-nav__link {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .65rem 1.25rem;
    border: 1px solid var(--line-light);
    border-radius: var(--radius-full);
    font-size: var(--fs-2xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--ink-text);
    transition: var(--transition-fast);
}

.faq-nav__link i {
    color: var(--gold-deep);
    font-size: .75rem;
    transition: var(--transition-fast);
}

.faq-nav__link:hover {
    background: var(--brand-coral);
    border-color: var(--brand-coral);
    color: var(--color-white);
    transform: translateY(-3px);
}

.faq-nav__link:hover i {
    color: var(--color-white);
}

.faq-cat__head {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    max-width: 820px;
    margin: 0 auto var(--space-5);
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--line-light-soft);
}

.faq-cat__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    background: var(--accent-tint);
    border-radius: var(--radius-full);
    color: var(--gold-deep);
    font-size: 1.05rem;
}

.faq-cat__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(1.5rem, 1.3rem + 1vw, 2.1rem);
    color: var(--ink-text);
    margin: 0;
    line-height: 1.2;
}

.faq-cat__count {
    display: block;
    font-family: var(--font-body);
    font-size: var(--fs-2xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--muted-text);
    margin-top: .2rem;
}

.faq-still {
    max-width: 720px;
    margin: var(--space-6) auto 0;
    text-align: center;
    padding: var(--space-5);
    border: 1px solid var(--gold-dim-light);
    border-radius: var(--radius-md);
    background: var(--card);
}

.faq-still__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.5rem;
    color: var(--ink-text);
    margin-bottom: var(--space-2);
}

.faq-still__text {
    font-size: var(--fs-sm);
    line-height: 1.8;
    color: var(--body-text);
    margin-bottom: var(--space-4);
}

/* ------------------------------------------------------------
   Heritage Comforts — 3-up facility strip
   ------------------------------------------------------------ */
.comforts {
    padding-block: var(--space-7);
    background: var(--paper);
}

.comforts__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
}

@media (min-width: 768px) {
    .comforts__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.comfort {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-3);
    padding: var(--space-6) var(--space-4);
    background: var(--card);
    border: 1px solid var(--line-light-soft);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    transition: var(--transition);
}

.comfort::before {
    content: '';
    position: absolute;
    inset: auto 0 0 0;
    height: 3px;
    background: var(--brand-coral);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform var(--transition);
}

.comfort:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-md);
    border-color: var(--gold-dim-light);
}

.comfort:hover::before {
    transform: scaleX(1);
}

.comfort__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 74px;
    height: 74px;
    background: var(--accent-tint);
    border-radius: var(--radius-full);
    color: var(--gold-deep);
    font-size: 1.6rem;
    transition: var(--transition-fast);
}

.comfort:hover .comfort__icon {
    background: var(--brand-yellow);
    color: var(--ink);
    transform: scale(1.07);
}

.comfort__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.4rem;
    color: var(--ink-text);
    margin: 0;
}

.comfort__text {
    font-size: var(--fs-sm);
    line-height: 1.8;
    color: var(--body-text);
    margin: 0;
    max-width: 34ch;
    text-wrap: pretty;
}

/* ------------------------------------------------------------
   Palace Amenities & Features — 4 image feature cards
   ------------------------------------------------------------ */
.palace-features {
    padding-block: var(--space-7);
    background: var(--paper);
}

.palace-features__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-3);
}

@media (min-width: 640px) {
    .palace-features__grid {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 300px;
    }

    .pfeature:nth-child(1) {
        grid-column: span 2;
    }
}

/* Bento layout: one hero tile, one wide tile, two square tiles */
@media (min-width: 1200px) {
    .palace-features__grid {
        grid-template-columns: repeat(4, 1fr);
        grid-auto-rows: 260px;
        gap: var(--space-4);
    }

    .pfeature:nth-child(1) {
        grid-column: span 2;
        grid-row: span 2;
    }

    .pfeature:nth-child(2) {
        grid-column: span 2;
    }

    .pfeature:nth-child(3),
    .pfeature:nth-child(4) {
        grid-column: span 1;
    }
}

.pfeature {
    position: relative;
    display: block;
    border-radius: var(--radius-md);
    overflow: hidden;
    min-height: 300px;
    box-shadow: var(--shadow-sm);
    background: var(--ink);
    transition: var(--transition);
}

/* inset hairline frame */
.pfeature__frame {
    position: absolute;
    inset: 14px;
    z-index: 2;
    border: 1px solid rgba(246, 241, 231, .22);
    border-radius: 6px;
    pointer-events: none;
    transition: var(--transition);
}

.pfeature:hover .pfeature__frame {
    inset: 10px;
    border-color: var(--gold-dim);
}

.pfeature:nth-child(1) .pfeature__title {
    font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.3rem);
}

.pfeature:nth-child(1) .pfeature__text {
    max-width: 46ch;
    font-size: 1rem;
}

.pfeature:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-md);
}

.pfeature__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.2s var(--ease);
}

.pfeature:hover .pfeature__img {
    transform: scale(1.08);
}

.pfeature::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(16, 13, 9, .94) 0%, rgba(16, 13, 9, .6) 45%, rgba(16, 13, 9, .18) 100%);
    transition: var(--transition);
}

.pfeature:hover::after {
    background: linear-gradient(to top, rgba(16, 13, 9, .96) 0%, rgba(16, 13, 9, .72) 55%, rgba(16, 13, 9, .3) 100%);
}

.pfeature__body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    height: 100%;
    min-height: inherit;
    padding: var(--space-4);
}

.pfeature__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border: 1px solid var(--gold-dim);
    border-radius: var(--radius-full);
    color: var(--brand-yellow);
    font-size: 1.05rem;
    margin-bottom: var(--space-3);
    transition: var(--transition-fast);
}

.pfeature:hover .pfeature__icon {
    background: var(--brand-yellow);
    border-color: var(--brand-yellow);
    color: var(--ink);
}

.pfeature__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.35rem;
    line-height: 1.25;
    color: var(--ivory);
    margin-bottom: var(--space-2);
}

.pfeature__text {
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--ivory-dim);
    margin: 0 0 var(--space-3);
    text-wrap: pretty;
}

.pfeature__more {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--brand-yellow);
}

.pfeature__more i {
    font-size: .6rem;
    transition: transform var(--transition-fast);
}

.pfeature:hover .pfeature__more i {
    transform: translateX(4px);
}

/* Closing line under each attraction */
.attraction__closing {
    margin-top: var(--space-4);
    padding-left: var(--space-4);
    border-left: 2px solid var(--gold-dim-light);
    font-family: var(--font-display);
    font-style: italic;
    font-size: 1.05rem;
    line-height: 1.7;
    color: var(--ink-text);
    text-wrap: pretty;
}

/* ------------------------------------------------------------
   Video testimonials
   ------------------------------------------------------------ */
.video-reviews {
    margin-top: var(--space-7);
    padding-top: var(--space-6);
    border-top: 1px solid var(--line-light-soft);
}

.video-reviews__head {
    text-align: center;
    max-width: 680px;
    margin: 0 auto var(--space-5);
}

.video-reviews__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
}

@media (min-width: 640px) {
    .video-reviews__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    .video-reviews__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.vreview {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--ink);
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    text-align: left;
    transition: var(--transition);
}

.vreview:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
}

.vreview__media {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
}

.vreview__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.1s var(--ease);
}

.vreview__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #000;
    display: block;
}

.vreview__meta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .25rem;
    padding: var(--space-3) var(--space-3) var(--space-4);
    text-align: center;
}

.vreview__meta .vreview__stars {
    position: static;
    color: var(--gold);
    font-size: .7rem;
    letter-spacing: .3em;
}

.vreview__meta .vreview__name {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.05rem;
    color: var(--ivory);
}

.vreview__meta .vreview__place {
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--ivory-faint);
}

.vreview:hover .vreview__img {
    transform: scale(1.06);
}

.vreview__media::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(16, 13, 9, .88), rgba(16, 13, 9, .18));
    transition: var(--transition);
    pointer-events: none;
}

/* When a native video player is used, drop the overlay so the controls work. */
.vreview__media:has( .vreview__video )::after {
    display: none;
}

.vreview__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 66px;
    height: 66px;
    border-radius: var(--radius-full);
    background: var(--brand-coral);
    color: var(--color-white);
    font-size: 1.1rem;
    padding-left: 4px;
    transition: var(--transition-fast);
}

.vreview__play::before {
    content: '';
    position: absolute;
    inset: -10px;
    border-radius: inherit;
    border: 1px solid rgba(246, 241, 231, .4);
    animation: vpulse 2.4s var(--ease) infinite;
}

@keyframes vpulse {
    0% { transform: scale(.9); opacity: .9; }
    70% { transform: scale(1.25); opacity: 0; }
    100% { transform: scale(1.25); opacity: 0; }
}

.vreview:hover .vreview__play {
    background: var(--brand-yellow);
    color: var(--ink);
    transform: translate(-50%, -50%) scale(1.08);
}

.vreview__caption {
    position: absolute;
    inset: auto 0 0 0;
    z-index: 2;
    padding: var(--space-4);
}

.vreview__stars {
    color: var(--brand-yellow);
    font-size: .6rem;
    letter-spacing: .35em;
    margin-bottom: .4rem;
}

.vreview__name {
    display: block;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.15rem;
    color: var(--ivory);
    line-height: 1.3;
}

.vreview__place {
    display: block;
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .13em;
    color: var(--ivory-faint);
}

.vreview__frame {
    width: 100%;
    aspect-ratio: 16 / 10;
    border: 0;
    display: block;
    background: var(--ink-deep);
    object-fit: cover;
    border-radius: var(--radius-md);
}

/* ------------------------------------------------------------
   Pre-footer strip — recognition + newsletter (light, sitewide)
   ------------------------------------------------------------ */
.prefooter {
    padding-block: var(--space-6);
    background: var(--paper-2);
    border-top: 1px solid var(--line-light-soft);
}

.prefooter__head {
    text-align: center;
    margin-bottom: var(--space-5);
}

.prefooter__label {
    display: inline-flex;
    align-items: center;
    gap: var(--space-3);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .26em;
    color: var(--gold-deep);
    margin-bottom: var(--space-2);
}

.prefooter__label::before,
.prefooter__label::after {
    content: '';
    width: 34px;
    height: 1px;
    background: var(--gold-dim-light);
}

.prefooter__awards {
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--space-4);
}

.prefooter__award {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 1 240px;
    min-height: 186px;
    padding: var(--space-2);
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
    transition: var(--transition-fast);
}

.prefooter__award:hover {
    border-color: var(--gold-dim-light);
    transform: translateY(-3px);
    box-shadow: var(--shadow-sm);
}

.prefooter__award > div {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.prefooter__award .TA_links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.prefooter__award img {
    max-height: 170px;
    max-width: 100%;
    width: auto;
    height: auto;
}

.prefooter__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(1.4rem, 1.2rem + .9vw, 1.9rem);
    line-height: 1.2;
    color: var(--ink-text);
    margin: 0;
}

.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* ------------------------------------------------------------
   Rooms page
   ------------------------------------------------------------ */
.page-hero--rooms {
    background-image:
        url('https://images.unsplash.com/photo-1611892440504-42a792e24d32?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-ph-rooms/1920/900'),
        radial-gradient(ellipse at 50% 25%, #3A2F1E 0%, #221B10 50%, #14100A 100%);
}

.room-stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
    max-width: 900px;
    margin: var(--space-5) auto 0;
}

@media (min-width: 768px) {
    .room-stats {
        grid-template-columns: repeat(4, 1fr);
        gap: var(--space-4);
    }
}

.room-stat {
    text-align: center;
    padding: var(--space-4) var(--space-2);
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
}

.room-stat__value {
    display: block;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(1.7rem, 1.4rem + 1.2vw, 2.4rem);
    line-height: 1.1;
    color: var(--gold-deep);
}

.room-stat__label {
    display: block;
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .13em;
    color: var(--muted-text);
    margin-top: .25rem;
}

/* Room feature rows */
.room-feature {
    padding-block: var(--space-7);
    background: var(--paper);
}

.room-feature__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
    align-items: center;
}

@media (min-width: 992px) {
    .room-feature__grid {
        grid-template-columns: 1.05fr .95fr;
        gap: clamp(3rem, 2rem + 3vw, 5rem);
    }

    .room-feature--reverse .room-feature__media {
        order: 2;
    }
}

.room-feature__media {
    position: relative;
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    background: var(--paper-2);
}

.room-feature__img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    transition: transform 1.3s var(--ease);
}

.room-feature__media:hover .room-feature__img {
    transform: scale(1.04);
}

.room-feature__tag {
    position: absolute;
    top: var(--space-3);
    left: var(--space-3);
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .5rem 1rem;
    background: var(--brand-yellow);
    color: var(--ink);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .14em;
}

.room-feature__count {
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .22em;
    color: var(--gold-deep);
    margin-bottom: var(--space-2);
}

.room-feature__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(1.8rem, 1.5rem + 1.6vw, 2.8rem);
    line-height: 1.15;
    color: var(--ink-text);
    margin-bottom: var(--space-3);
    text-wrap: balance;
}

.room-feature__text {
    font-size: var(--fs-sm);
    line-height: 1.9;
    color: var(--body-text);
    margin-bottom: var(--space-4);
    text-wrap: pretty;
}

.room-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3) var(--space-5);
    padding-block: var(--space-3);
    margin-bottom: var(--space-4);
    border-block: 1px solid var(--line-light-soft);
}

.room-meta__item {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--body-text);
}

.room-meta__item i {
    color: var(--gold-deep);
    font-size: .8rem;
}

.room-feats {
    list-style: none;
    margin: 0 0 var(--space-4);
    padding: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: .55rem var(--space-4);
}

@media (min-width: 576px) {
    .room-feats {
        grid-template-columns: repeat(2, 1fr);
    }
}

.room-feats li {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    font-size: var(--fs-sm);
    line-height: 1.6;
    color: var(--body-text);
}

.room-feats i {
    color: var(--gold-deep);
    font-size: .7rem;
    margin-top: .45em;
    flex-shrink: 0;
}

/* In-room amenity chips */
.inroom__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
}

@media (min-width: 768px) {
    .inroom__grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (min-width: 1200px) {
    .inroom__grid {
        grid-template-columns: repeat(6, 1fr);
    }
}

.inroom {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-2);
    padding: var(--space-4) var(--space-2);
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
    transition: var(--transition-fast);
}

.inroom:hover {
    transform: translateY(-4px);
    border-color: var(--gold-dim-light);
    box-shadow: var(--shadow-sm);
}

.inroom i {
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--accent-tint);
    border-radius: var(--radius-full);
    color: var(--gold-deep);
    font-size: .95rem;
    transition: var(--transition-fast);
}

.inroom:hover i {
    background: var(--brand-yellow);
    color: var(--ink);
}

.inroom span {
    font-size: var(--fs-2xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .09em;
    color: var(--ink-text);
}

/* Policies */
.policy__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-3);
    max-width: 900px;
    margin-inline: auto;
}

@media (min-width: 768px) {
    .policy__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.policy {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-4);
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
}

.policy i {
    color: var(--gold-deep);
    font-size: .9rem;
    margin-top: .25em;
    flex-shrink: 0;
}

.policy__title {
    font-weight: 700;
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--ink-text);
    margin-bottom: .25rem;
}

.policy__text {
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--body-text);
    margin: 0;
}

/* ------------------------------------------------------------
   Palace Amenities & Features — split showcase (light)
   ------------------------------------------------------------ */
.amenity-feature {
    padding-block: var(--space-7);
    background: var(--paper);
}

.amenity-feature__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    align-items: center;
}

@media (min-width: 992px) {
    .amenity-feature__grid {
        grid-template-columns: 1fr 1fr;
        gap: clamp(3rem, 2rem + 3vw, 5rem);
    }
}

/* Stacked, offset image collage */
.amenity-feature__media {
    position: relative;
    aspect-ratio: 5 / 5;
    max-width: 540px;
    width: 100%;
    margin-inline: auto;
}

.amenity-feature__img {
    position: absolute;
    border-radius: var(--radius-md);
    object-fit: cover;
    box-shadow: var(--shadow-md);
}

.amenity-feature__img--main {
    inset: 0 0 18% 0;
    width: 74%;
    height: 82%;
    z-index: 1;
}

.amenity-feature__img--sub {
    right: 0;
    bottom: 0;
    width: 52%;
    height: 46%;
    border: 5px solid var(--card);
    z-index: 2;
}

.amenity-feature__badge {
    position: absolute;
    top: var(--space-4);
    right: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 108px;
    height: 108px;
    border-radius: 50%;
    background: var(--brand-yellow);
    color: var(--ink);
    text-align: center;
    box-shadow: var(--shadow-md);
}

.amenity-feature__badge b {
    font-family: var(--font-display);
    font-size: 1.9rem;
    line-height: 1;
}

.amenity-feature__badge span {
    font-size: var(--fs-2xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .12em;
    margin-top: .2rem;
}

.amenity-feature__list {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-3);
    margin-top: var(--space-5);
}

@media (min-width: 576px) {
    .amenity-feature__list {
        grid-template-columns: repeat(2, 1fr);
    }
}

.afeature {
    display: block;
    padding: var(--space-4);
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.afeature:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
    border-color: var(--gold-dim-light);
}

.afeature__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: var(--radius-full);
    background: var(--accent-tint);
    color: var(--gold-deep);
    font-size: 1.15rem;
    margin-bottom: var(--space-3);
    transition: var(--transition-fast);
}

.afeature:hover .afeature__icon {
    background: var(--brand-yellow);
    color: var(--ink);
}

.afeature__title {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.2rem;
    color: var(--ink-text);
    margin-bottom: .4rem;
}

.afeature__title i {
    font-size: .6rem;
    color: var(--gold-deep);
    opacity: 0;
    transform: translateX(-4px);
    transition: var(--transition-fast);
}

.afeature:hover .afeature__title i {
    opacity: 1;
    transform: translateX(0);
}

.afeature__text {
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--body-text);
    margin: 0;
}

/* ------------------------------------------------------------
   Contact page — split panel
   ------------------------------------------------------------ */
.contact-hero {
    padding-block: var(--space-7);
    background: var(--paper);
}

.contact-panel {
    display: grid;
    grid-template-columns: 1fr;
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-md);
    overflow: hidden;
}

@media (min-width: 992px) {
    .contact-panel {
        grid-template-columns: .85fr 1.15fr;
    }
}

/* left: dark-ivory info rail over a desert photo */
.contact-rail {
    position: relative;
    padding: clamp(2rem, 1.5rem + 3vw, 3.5rem);
    color: var(--ivory);
    background:
        linear-gradient(rgba(16, 13, 9, .84), rgba(16, 13, 9, .9)),
        url('https://images.unsplash.com/photo-1524492412937-b28074a5d7da?q=80&w=900&auto=format&fit=crop') center/cover,
        var(--ink);
}

.contact-rail__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .26em;
    color: var(--brand-yellow);
    margin-bottom: var(--space-3);
}

.contact-rail__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(1.7rem, 1.4rem + 1.4vw, 2.4rem);
    line-height: 1.2;
    color: var(--ivory);
    margin-bottom: var(--space-3);
}

.contact-rail__text {
    font-size: var(--fs-sm);
    line-height: 1.8;
    color: var(--ivory-dim);
    margin-bottom: var(--space-5);
}

.contact-rail__list {
    list-style: none;
    margin: 0 0 var(--space-5);
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.contact-rail__item {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
}

.contact-rail__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    border-radius: var(--radius-full);
    border: 1px solid var(--gold-dim);
    color: var(--brand-yellow);
    font-size: .85rem;
}

.contact-rail__label {
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--ivory-faint);
    margin-bottom: .15rem;
}

.contact-rail__value {
    font-size: var(--fs-sm);
    line-height: 1.55;
    color: var(--ivory);
    margin: 0;
}

.contact-rail__value a {
    color: var(--ivory);
    word-break: break-word;
}

.contact-rail__value a:hover {
    color: var(--brand-yellow);
}

.contact-rail__social {
    display: flex;
    gap: var(--space-2);
    list-style: none;
    padding: 0;
    margin: 0;
}

.contact-rail__social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    border: 1px solid var(--line-dark);
    color: var(--ivory-dim);
    font-size: .85rem;
    transition: var(--transition-fast);
}

.contact-rail__social a:hover {
    background: var(--brand-yellow);
    border-color: var(--brand-yellow);
    color: var(--ink);
    transform: translateY(-3px);
}

/* right: form */
.contact-panel__form {
    padding: clamp(2rem, 1.5rem + 3vw, 3.5rem);
}

.contact-panel__form .contact-form__head {
    text-align: left;
    margin-bottom: var(--space-4);
}

/* ------------------------------------------------------------
   Blog listing + article
   ------------------------------------------------------------ */
.page-hero--blog {
    background-image:
        url('https://images.unsplash.com/photo-1512918728675-ed5a9ecdebfd?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-ph-blog/1920/900'),
        radial-gradient(ellipse at 50% 25%, #3A2F1E 0%, #221B10 50%, #14100A 100%);
}

/* Featured post */
.blog-featured {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    margin-bottom: var(--space-6);
    transition: var(--transition);
}

.blog-featured:hover {
    box-shadow: var(--shadow-md);
    border-color: var(--gold-dim-light);
}

@media (min-width: 900px) {
    .blog-featured {
        grid-template-columns: 1.15fr 1fr;
        align-items: stretch;
    }
}

.blog-featured__media {
    position: relative;
    overflow: hidden;
    min-height: 260px;
}

.blog-featured__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.3s var(--ease);
}

.blog-featured:hover .blog-featured__img {
    transform: scale(1.05);
}

.blog-featured__flag {
    position: absolute;
    top: var(--space-3);
    left: var(--space-3);
    padding: .45rem 1rem;
    background: var(--brand-yellow);
    color: var(--ink);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .14em;
}

.blog-featured__body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(1.75rem, 1.2rem + 2.4vw, 3.25rem);
}

.blog-featured__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(1.6rem, 1.3rem + 1.6vw, 2.5rem);
    line-height: 1.18;
    color: var(--ink-text);
    margin: var(--space-2) 0 var(--space-3);
    text-wrap: balance;
}

.blog-featured__title a { color: inherit; }
.blog-featured__title a:hover { color: var(--gold-deep); }

.blog-featured__excerpt {
    font-size: var(--fs-sm);
    line-height: 1.85;
    color: var(--body-text);
    margin-bottom: var(--space-4);
    text-wrap: pretty;
}

/* Post meta line */
.post-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-4);
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--muted-text);
}

.post-meta span {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}

.post-meta i { color: var(--gold-deep); font-size: .75rem; }

.post-cat {
    color: var(--gold-deep);
    font-weight: 700;
}

/* Blog grid */
.blog-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
}

@media (min-width: 640px) {
    .blog-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 992px) {
    .blog-grid { grid-template-columns: repeat(3, 1fr); }
}

.post-card {
    display: flex;
    flex-direction: column;
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.post-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-md);
    border-color: var(--gold-dim-light);
}

.post-card__media {
    position: relative;
    aspect-ratio: 3 / 2;
    overflow: hidden;
}

.post-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.1s var(--ease);
}

.post-card:hover .post-card__img { transform: scale(1.07); }

.post-card__date {
    position: absolute;
    top: var(--space-3);
    left: var(--space-3);
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1;
    padding: .55rem .7rem;
    background: rgba(16, 13, 9, .62);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: 1px solid var(--gold-dim);
    color: var(--ivory);
}

.post-card__date b {
    font-family: var(--font-display);
    font-size: 1.25rem;
}

.post-card__date span {
    font-size: .6rem;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--brand-yellow);
    margin-top: .2rem;
}

.post-card__body {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding: var(--space-4);
}

.post-card__cat {
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--gold-deep);
    margin-bottom: var(--space-2);
}

.post-card__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.3rem;
    line-height: 1.25;
    color: var(--ink-text);
    margin-bottom: var(--space-2);
}

.post-card__title a { color: inherit; }
.post-card__title a:hover { color: var(--gold-deep); }

.post-card__excerpt {
    font-size: var(--fs-sm);
    line-height: 1.75;
    color: var(--body-text);
    margin-bottom: var(--space-3);
    text-wrap: pretty;
}

.post-card__more {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    margin-top: auto;
    padding-top: var(--space-3);
    border-top: 1px solid var(--line-light-soft);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--ink-text);
    transition: var(--transition-fast);
}

.post-card__more i { font-size: .6rem; color: var(--gold-deep); transition: transform var(--transition-fast); }
.post-card__more:hover { color: var(--gold-deep); }
.post-card__more:hover i { transform: translateX(4px); }

/* Pagination */
.pagination-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-6);
}

.pagination-nav a,
.pagination-nav span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    padding: 0 var(--space-3);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--ink-text);
    background: var(--card);
    transition: var(--transition-fast);
}

.pagination-nav a:hover {
    border-color: var(--brand-coral);
    color: var(--brand-coral);
}

.pagination-nav .is-current {
    background: var(--brand-coral);
    border-color: var(--brand-coral);
    color: var(--color-white);
}

/* ---- Article (blog-details) ---- */
.article-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(2.5rem, 2rem + 3vw, 4.5rem);
}

@media (min-width: 992px) {
    .article-layout {
        grid-template-columns: minmax(0, 1fr) 320px;
        align-items: start;
    }
}

.article__figure {
    position: relative;
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    margin-bottom: var(--space-5);
}

.article__figure img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.article__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-4);
    padding-bottom: var(--space-4);
    margin-bottom: var(--space-4);
    border-bottom: 1px solid var(--line-light-soft);
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--muted-text);
}

.article__meta span { display: inline-flex; align-items: center; gap: .45rem; }
.article__meta i { color: var(--gold-deep); }

.article__body { color: var(--body-text); }

.article__body h2 {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(1.5rem, 1.3rem + 1vw, 2rem);
    color: var(--ink-text);
    margin: var(--space-5) 0 var(--space-3);
}

.article__body h3 {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.3rem;
    color: var(--ink-text);
    margin: var(--space-4) 0 var(--space-2);
}

.article__body p {
    font-size: 1.0625rem;
    line-height: 1.9;
    margin: 0 0 var(--space-4);
    text-wrap: pretty;
}

.article__body ul {
    margin: 0 0 var(--space-4);
    padding: 0;
    list-style: none;
    display: grid;
    gap: .6rem;
}

.article__body ul li {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    font-size: var(--fs-sm);
    line-height: 1.7;
}

.article__body ul li::before {
    content: '\f005';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    color: var(--gold-deep);
    font-size: .7rem;
    margin-top: .35em;
}

.article__body blockquote {
    margin: var(--space-5) 0;
    padding: var(--space-4) var(--space-5);
    border-left: 3px solid var(--brand-coral);
    background: var(--paper-2);
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    font-family: var(--font-display);
    font-style: italic;
    font-size: 1.25rem;
    line-height: 1.6;
    color: var(--ink-text);
}

.article__tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: var(--space-5);
    padding-top: var(--space-4);
    border-top: 1px solid var(--line-light-soft);
}

.article__tags a {
    padding: .4rem .9rem;
    background: var(--paper-2);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-full);
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--body-text);
    transition: var(--transition-fast);
}

.article__tags a:hover {
    background: var(--brand-coral);
    border-color: var(--brand-coral);
    color: var(--color-white);
}

.article__share {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-4);
}

.article__share span {
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--muted-text);
}

.article__share a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    border: 1px solid var(--line-light);
    color: var(--ink-text);
    transition: var(--transition-fast);
}

.article__share a:hover {
    background: var(--brand-coral);
    border-color: var(--brand-coral);
    color: var(--color-white);
    transform: translateY(-3px);
}

/* Author box */
.author-box {
    display: flex;
    gap: var(--space-4);
    align-items: center;
    margin-top: var(--space-6);
    padding: var(--space-5);
    background: var(--paper-2);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
}

.author-box__avatar {
    flex-shrink: 0;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    border: 1px solid var(--gold-dim-light);
    background: var(--card);
    color: var(--gold-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-display);
    font-size: 1.6rem;
}

.author-box__name {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.2rem;
    color: var(--ink-text);
    margin-bottom: .2rem;
}

.author-box__role {
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--gold-deep);
    margin-bottom: var(--space-2);
}

.author-box__text {
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--body-text);
    margin: 0;
}

/* Sidebar */
.sidebar { display: grid; gap: var(--space-5); }

.widget {
    background: var(--card);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-md);
    padding: var(--space-5);
}

.widget__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.25rem;
    color: var(--ink-text);
    margin-bottom: var(--space-4);
    padding-bottom: var(--space-2);
    border-bottom: 1px solid var(--line-light-soft);
}

.search-box { display: flex; gap: var(--space-2); }

.search-box input {
    flex: 1 1 auto;
    min-width: 0;
    padding: .75rem 1rem;
    font-family: var(--font-body);
    font-size: var(--fs-sm);
    color: var(--ink-text);
    background: var(--paper);
    border: 1px solid var(--line-light);
    border-radius: 8px;
}

.search-box input:focus {
    outline: 0;
    border-color: var(--brand-coral);
    box-shadow: 0 0 0 3px rgba(232, 95, 76, .18);
}

.search-box button {
    flex-shrink: 0;
    width: 46px;
    border: 0;
    border-radius: 8px;
    background: var(--brand-coral);
    color: var(--color-white);
    cursor: pointer;
    transition: var(--transition-fast);
}

.search-box button:hover { background: var(--brand-yellow); color: var(--ink); }

.mini-post {
    display: flex;
    gap: var(--space-3);
    padding-block: var(--space-3);
    border-bottom: 1px solid var(--line-light-soft);
}

.mini-post:last-child { border-bottom: 0; padding-bottom: 0; }
.mini-post:first-child { padding-top: 0; }

.mini-post__img {
    flex-shrink: 0;
    width: 74px;
    height: 64px;
    border-radius: 8px;
    object-fit: cover;
}

.mini-post__date {
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--gold-deep);
    margin-bottom: .2rem;
}

.mini-post__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: .98rem;
    line-height: 1.3;
    color: var(--ink-text);
}

.mini-post__title a { color: inherit; }
.mini-post__title a:hover { color: var(--gold-deep); }

.cat-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }

.cat-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .7rem 1rem;
    border: 1px solid var(--line-light);
    border-radius: 8px;
    font-size: var(--fs-sm);
    color: var(--body-text);
    transition: var(--transition-fast);
}

.cat-list a:hover {
    border-color: var(--gold-dim-light);
    color: var(--gold-deep);
    transform: translateX(4px);
}

.cat-list span {
    font-size: var(--fs-2xs);
    color: var(--muted-text);
}

.tag-cloud { display: flex; flex-wrap: wrap; gap: var(--space-2); }

.tag-cloud a {
    padding: .4rem .9rem;
    background: var(--paper-2);
    border: 1px solid var(--line-light);
    border-radius: var(--radius-full);
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--body-text);
    transition: var(--transition-fast);
}

.tag-cloud a:hover { background: var(--brand-coral); border-color: var(--brand-coral); color: var(--color-white); }

.widget--cta {
    background:
        linear-gradient(rgba(16, 13, 9, .82), rgba(16, 13, 9, .9)),
        url('https://images.unsplash.com/photo-1547235001-d703406d3f17?q=80&w=700&auto=format&fit=crop') center/cover, var(--ink);
    text-align: center;
    color: var(--ivory);
}

.widget--cta .widget__title { color: var(--ivory); border-color: var(--line-dark-soft); }

.widget--cta p {
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--ivory-dim);
    margin-bottom: var(--space-4);
}

/* ------------------------------------------------------------
   404 — page not found
   ------------------------------------------------------------ */
.error-page {
    position: relative;
    min-height: 100svh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(6rem, 5rem + 6vh, 9rem) 0 var(--space-6);
    text-align: center;
    overflow: hidden;
    background-color: var(--ink);
    background-image:
        linear-gradient(rgba(16, 13, 9, .78), rgba(16, 13, 9, .9)),
        url('https://images.unsplash.com/photo-1547235001-d703406d3f17?q=80&w=1920&auto=format&fit=crop'),
        url('https://picsum.photos/seed/hp-404/1920/1080');
    background-size: cover;
    background-position: center;
}

.error-page::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 50% 40%, rgba(252, 229, 18, .08), transparent 60%);
    pointer-events: none;
}

.error__inner {
    position: relative;
    z-index: 1;
    max-width: 680px;
    padding-inline: var(--space-4);
    color: var(--ivory);
}

.error__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: var(--space-3);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .34em;
    color: var(--brand-yellow);
    margin-bottom: var(--space-4);
}

.error__eyebrow::before,
.error__eyebrow::after {
    content: '';
    width: 40px;
    height: 1px;
    background: var(--gold-dim);
}

.error__code {
    font-family: var(--font-display);
    font-weight: 600;
    line-height: .9;
    letter-spacing: .02em;
    font-size: clamp(6rem, 4rem + 16vw, 13rem);
    color: var(--ivory);
    margin: 0;
    text-shadow: 0 8px 60px rgba(0, 0, 0, .5);
}

.error__code span {
    color: var(--brand-yellow);
    font-style: italic;
    font-weight: 500;
}

.error__rule {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    margin-block: var(--space-3) var(--space-4);
}

.error__rule::before,
.error__rule::after {
    content: '';
    width: 60px;
    height: 1px;
    background: var(--line-dark);
}

.error__rule i {
    color: var(--brand-yellow);
    font-size: .6rem;
}

.error__title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(1.7rem, 1.4rem + 1.6vw, 2.6rem);
    line-height: 1.2;
    color: var(--ivory);
    margin-bottom: var(--space-3);
    text-wrap: balance;
}

.error__title em {
    font-style: italic;
    font-weight: 500;
    color: var(--gold-soft);
}

.error__text {
    font-size: 1.0625rem;
    line-height: 1.8;
    color: var(--ivory-dim);
    max-width: 52ch;
    margin-inline: auto;
    margin-bottom: var(--space-5);
    text-wrap: pretty;
}

.error__actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-4);
    flex-wrap: wrap;
    margin-bottom: var(--space-6);
}

.error__link-outline {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: 1.05rem 2.4rem;
    border: 1px solid var(--gold-dim);
    color: var(--ivory);
    font-size: var(--fs-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .18em;
    transition: var(--transition-fast);
}

.error__link-outline i { font-size: .7rem; color: var(--brand-yellow); }

.error__link-outline:hover {
    border-color: var(--brand-yellow);
    color: var(--brand-yellow);
}

.error__suggest {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-3);
}

.error__suggest-label {
    width: 100%;
    font-size: var(--fs-2xs);
    text-transform: uppercase;
    letter-spacing: .2em;
    color: var(--ivory-faint);
    margin-bottom: var(--space-2);
}

.error__suggest a {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .55rem 1.1rem;
    border: 1px solid var(--line-dark);
    border-radius: var(--radius-full);
    font-size: var(--fs-2xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--ivory-dim);
    transition: var(--transition-fast);
}

.error__suggest a:hover {
    background: var(--brand-yellow);
    border-color: var(--brand-yellow);
    color: var(--ink);
    transform: translateY(-3px);
}

.error__brand {
    position: absolute;
    top: var(--space-5);
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

.error__brand img { height: 66px; width: auto; }