/* Hazaar Dastaan — editorial 3D hospitality. Flex layouts. All authored sizing is in px. */
:root {
    --ink: #21221e;
    --muted: #65645c;
    --cream: #f6f2ea;
    --parchment: #eae4d7;
    --paper: #fffcf7;
    --gold: #c4a77a;
    --line: #d8d2c5;
    --forest: #202a25;
    --forest-deep: #151d1b;
    --serif: 'Cormorant Garamond', Georgia, serif;
    --sans: 'DM Sans', Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; min-width: 320px; background: var(--cream); color: var(--ink); font: 400 15px/25px var(--sans); -webkit-font-smoothing: antialiased; }
body.menu-is-open { overflow: hidden; }
a { text-decoration: none; color: inherit; }
button { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--gold); outline-offset: 5px; }
img { max-width: 100%; height: auto; display: block; }
img:not([src]), img[src=''] { opacity: 0; }
::selection { background: #c2a479; color: #171a16; }
.hd-wrap { width: auto; max-width: 1360px; margin: 0 auto; padding-left: 58px; padding-right: 58px; }
.section-space { padding-top: 146px; padding-bottom: 146px; }
.skip-link { position: absolute; top: -90px; left: 12px; z-index: 1000; background: #fff; color: #111; padding: 12px 18px; }
.skip-link:focus { top: 12px; }
.eyebrow { display: inline-flex; align-items: center; gap: 14px; font: 600 10px/18px var(--sans); letter-spacing: 3px; text-transform: uppercase; }
.eyebrow::before { content: ''; width: 29px; height: 1px; background: currentColor; opacity: .75; }
.dark-eyebrow { color: #8c6e47; }
.eyebrow-gold { color: var(--gold); }
.display-heading { margin: 22px 0 0; color: #262820; font: 400 70px/72px var(--serif); letter-spacing: -1.7px; }
.body-lead { margin: 28px 0 0; font: 400 16px/29px var(--sans); color: #68655f; }
.hd-btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; min-width: 220px; padding: 9px 10px 9px 23px; border: 1px solid transparent; font: 600 11px/18px var(--sans); letter-spacing: 1.4px; text-transform: uppercase; transition: background .3s, border-color .3s, color .3s, transform .3s; white-space: nowrap; }
.hd-btn:hover { transform: translateY(-3px); }
.hd-btn-circle { width: 38px; height: 38px; border-radius: 50px; display: inline-flex; align-items: center; justify-content: center; font: 400 19px/19px var(--sans); transition: transform .3s, background .3s; }
.hd-btn:hover .hd-btn-circle { transform: rotate(45deg); }
.hd-btn-light { background: #f6f0e5; color: #26302b; }
.hd-btn-light .hd-btn-circle { background: #e5dccc; }
.hd-btn-light:hover { background: #fff; }
.hd-btn-dark { background: var(--forest); color: #fff8eb; }
.hd-btn-dark .hd-btn-circle { background: #3a453e; }
.hd-btn-dark:hover { background: #344339; }
.hd-btn-transparent { border-color: #b6aea0; color: #fff; }
.hd-btn-transparent .hd-btn-circle { background: #f6efe5; color: var(--forest); }
.hd-btn-transparent:hover { background: #fff5e517; }
.text-link { display: inline-flex; align-items: center; gap: 22px; padding: 0 0 8px; border-bottom: 1px solid #8d7a65; color: #3c3932; font: 600 11px/18px var(--sans); letter-spacing: 1.2px; text-transform: uppercase; transition: gap .25s, color .25s; }
.text-link:hover { gap: 30px; color: #a4764a; }
.text-link span { font: 400 18px/16px var(--sans); }
.text-link-light { color: #fff9ef; border-color: #cebc9f; }
.text-link-light:hover { color: #fff; }
.hd-progress { position: fixed; inset: 0 0 auto 0; height: 2px; z-index: 99; pointer-events: none; }
.hd-progress span { display: block; height: 2px; width: 0; background: #dbbd8d; transition: width .13s linear; }
/* Navigation */
.site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 90; color: #fff; transition: background .35s, box-shadow .35s; }
.site-header.is-scrolled, body.menu-is-open .site-header { background: #1a2522f3; box-shadow: 0 12px 35px #131c1960; }
.header-inner { max-width: 1510px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 26px; padding: 23px 48px; min-height: 90px; border-bottom: 1px solid #ffffff35; }
.site-header.is-scrolled .header-inner { min-height: 72px; padding-top: 12px; padding-bottom: 12px; border-color: transparent; }
.wordmark { display: inline-flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 4px; flex-shrink: 0; min-width: 200px; }
.wordmark-image { display: block; height: 51px; width: auto; max-width: 230px; object-fit: contain; }
.wordmark-main { font: 500 25px/24px var(--serif); letter-spacing: 3.4px; white-space: nowrap; }
.wordmark-sub { font: 500 8px/12px var(--sans); letter-spacing: 4.2px; color: #e3cfae; }
.main-nav { display: flex; align-items: center; justify-content: center; gap: 34px; margin-left: auto; }
.main-nav a { position: relative; color: #f5efe7; font: 500 10px/18px var(--sans); letter-spacing: 1.2px; white-space: nowrap; transition: color .25s; }
.main-nav a::after { content: ''; position: absolute; bottom: -8px; left: 0; right: 0; height: 1px; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform .3s; }
.main-nav a:hover { color: #e7cfa7; }
.main-nav a:hover::after { transform: scaleX(1); }
.header-actions { display: flex; align-items: center; gap: 18px; }
.header-book { display: inline-flex; align-items: center; gap: 16px; border: 1px solid #d1b789ad; padding: 8px 9px 8px 18px; font: 600 10px/18px var(--sans); letter-spacing: 1.15px; text-transform: uppercase; white-space: nowrap; transition: background .3s; }
.header-book:hover { background: #d0b48b25; }
.book-arrow { display: flex; align-items: center; justify-content: center; width: 29px; height: 29px; background: #d2bb99; color: #19241e; font: 500 17px/20px var(--sans); }
.menu-toggle, .nav-mobile-book { display: none; }
/* Hero */
.hd-hero { position: relative; display: flex; align-items: center; overflow: hidden; min-height: 830px; color: #f9f4e9; background: #21332e; isolation: isolate; perspective: 1200px; }
.hero-photography, .hero-photo-shade, .depth-canvas, .hero-architectural-outline { position: absolute; inset: 0; }
.hero-photography { z-index: -3; overflow: hidden; }
.hero-base-photo { position: absolute; left: 0; top: 0; min-width: 100%; min-height: 100%; width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.08); will-change: transform; filter: saturate(.7); }
.hero-photo-shade { background: linear-gradient(90deg, #131f1df0 0%, #17251fe0 42%, #1b24218a 78%, #21221a7d 100%), linear-gradient(0deg, #151d1be9 0%, transparent 46%, #111b1c7a 100%); }
.depth-canvas { z-index: -1; opacity: .75; pointer-events: none; }
.hero-architectural-outline { z-index: -1; opacity: .15; pointer-events: none; background: radial-gradient(circle at 85% 55%, transparent 0, transparent 240px, #d3b681 241px, transparent 242px, transparent 271px, #d3b681 272px, transparent 273px); }
.hero-content { width: 100%; position: relative; display: flex; align-items: center; padding-top: 115px; padding-bottom: 105px; z-index: 2; }
.hero-copy { flex: 1 1 670px; max-width: 770px; position: relative; z-index: 5; }
.hero-eyebrow { color: #e4c99f; }
.hero-heading { margin: 29px 0 24px; font: 400 97px/86px var(--serif); letter-spacing: -3.3px; }
.hero-heading .hd-line-reveal { display: block; overflow: hidden; padding-bottom: 7px; }
.hero-heading .hd-line-reveal > span, .hero-heading .hd-line-reveal > em { display: block; font: inherit; transform: translateY(0); opacity: 1; transition: transform 1.15s cubic-bezier(.19, 1, .22, 1), opacity .9s ease; }
.hero-heading .hd-line-reveal:nth-child(2) > em { font-style: italic; color: #e5c596; }
.hero-heading .hd-line-reveal:nth-child(3) > span { font: 400 47px/54px var(--serif); letter-spacing: -.9px; }
body.hd-ready .hero-heading .hd-line-reveal > span, body.hd-ready .hero-heading .hd-line-reveal > em { transform: translateY(0); opacity: 1; }
body.hd-ready .hero-heading .hd-line-reveal:nth-child(2) > em { transition-delay: .16s; }
body.hd-ready .hero-heading .hd-line-reveal:nth-child(3) > span { transition-delay: .32s; }
.hero-description { max-width: 470px; color: #e0e0d6; font: 400 14px/26px var(--sans); }
.hero-ctas { display: flex; align-items: center; gap: 34px; margin-top: 35px; }
.hero-sculpture { flex: 0 0 400px; height: 510px; position: relative; margin-left: -30px; transform-style: preserve-3d; }
.hero-detail-frame { position: absolute; left: 85px; top: 56px; width: 300px; height: 395px; padding: 12px; background: #f7eddf17; border: 1px solid #c6b18b80; backdrop-filter: blur(3px); box-shadow: 0 27px 70px #0008; transform: rotateY(-17deg) rotateX(4deg) translateZ(35px); overflow: hidden; }
.hero-detail-img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.85); }
.hero-orbit { position: absolute; border: 1px solid #e7d3aa56; border-radius: 500px; pointer-events: none; transform-style: preserve-3d; }
.hero-orbit-outer { left: 5px; top: 18px; width: 430px; height: 430px; transform: rotateY(-47deg) rotateZ(18deg); animation: heroOrbit 19s linear infinite; }
.hero-orbit-inner { left: 44px; top: 58px; width: 345px; height: 345px; transform: rotateY(52deg) rotateX(28deg); animation: heroOrbitOther 24s linear infinite; }
.hero-symbol { position: absolute; top: 1px; right: 0; display: flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid #d1b98f; width: 98px; height: 98px; border-radius: 100px; background: #17332ca8; box-shadow: 0 0 40px #e8c7982b; color: #e4cda6; font: 400 38px/38px var(--serif); transform: translateZ(100px); }
.hero-symbol-dot { font: 400 13px/18px var(--sans); }
.hero-art-caption { position: absolute; left: -12px; bottom: 31px; display: flex; flex-direction: column; gap: 8px; color: #e8d5b5; font: 600 9px/13px var(--sans); letter-spacing: 2.4px; transform: translateZ(85px); }
.hero-art-caption span { padding-left: 30px; }
.hero-bottom { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: 25px; padding-top: 23px; padding-bottom: 24px; border-top: 1px solid #ffffff31; color: #f4e1c8; font: 600 9px/17px var(--sans); letter-spacing: 2.2px; }
.hero-scroll { display: flex; align-items: center; gap: 20px; }
.hero-scroll-line { position: relative; width: 39px; height: 1px; background: #d9c7a9; }
.hero-scroll-line::after { content: ''; position: absolute; top: -3px; left: 0; width: 7px; height: 7px; border-radius: 30px; background: #e6cca4; animation: scrollTick 2.5s ease-in-out infinite; }
.hero-index { display: flex; align-items: center; gap: 12px; }
.index-rule { width: 29px; height: 1px; background: #d4b98f; }
@keyframes heroOrbit { from { transform: rotateY(-47deg) rotateZ(18deg); } to { transform: rotateY(313deg) rotateZ(18deg); } }
@keyframes heroOrbitOther { from { transform: rotateY(52deg) rotateX(28deg); } to { transform: rotateY(-308deg) rotateX(28deg); } }
@keyframes scrollTick { 0% { left: 0; } 55% { left: 32px; } 100% { left: 0; } }
/* Story */
.s-story { background: var(--cream); overflow: hidden; }
.story-layout { display: flex; align-items: center; gap: 120px; }
.story-copy { flex: 1 1 500px; }
.story-copy .display-heading { max-width: 580px; }
.story-copy .body-lead { max-width: 535px; }
.story-annotation { display: flex; align-items: flex-start; gap: 22px; border-top: 1px solid var(--line); margin-top: 47px; padding-top: 27px; max-width: 490px; }
.annotation-icon { color: #ad845b; font: 400 40px/47px var(--serif); }
.story-annotation strong { display: block; color: #a47c53; font: 700 10px/18px var(--sans); letter-spacing: 2.2px; }
.story-annotation p { margin: 10px 0 0; color: #67665e; font: 400 14px/25px var(--sans); }
.story-art { position: relative; flex: 0 1 500px; height: 650px; perspective: 1000px; }
.story-photo-frame { position: absolute; top: 45px; left: 40px; right: 0; bottom: 54px; overflow: hidden; z-index: 2; box-shadow: 0 32px 55px #2b291e2b; transform-style: preserve-3d; will-change: transform; }
.story-photo-frame img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.16,1,.3,1); }
.story-photo-frame:hover img { transform: scale(1.06); }
.story-art-ring { position: absolute; border: 1px solid #bd97718e; top: 0; left: 0; width: 280px; height: 280px; border-radius: 280px; }
.story-art-caption { position: absolute; bottom: 5px; right: 0; color: #957b5c; font: 600 10px/15px var(--sans); letter-spacing: 4px; }
.story-art-caption span { margin: 0 7px; }
.story-art-watermark { position: absolute; bottom: 20px; left: 0; color: #cfc5b4; font: 400 130px/130px var(--serif); }
/* rooms */
.s-rooms { background: var(--parchment); overflow: hidden; padding-bottom: 100px; }
.rooms-heading-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 60px; }
.rooms-heading-row .display-heading { max-width: 680px; }
.rooms-heading-side { max-width: 390px; }
.rooms-heading-side p { margin: 0 0 25px; color: #64645b; font: 400 15px/27px var(--sans); }
.room-gallery { position: relative; margin-top: 60px; }
.room-stage { position: relative; display: flex; align-items: center; justify-content: center; gap: 22px; width: auto; height: 640px; perspective: 1400px; transform-style: preserve-3d; }
.room-panel { position: relative; flex: 0 0 28%; height: 540px; background: #2a332f; overflow: hidden; color: #fff; cursor: pointer; box-shadow: 0 30px 50px #2526212e; transition: transform .95s cubic-bezier(.2,.7,.2,1), opacity .7s, filter .7s, box-shadow .6s; }
.room-gallery.hd-initialized .room-panel { position: absolute; width: 500px; height: 580px; flex: none; top: 15px; left: 0; right: 0; margin: auto; transform-style: preserve-3d; }
.room-gallery.hd-initialized .room-panel[data-position='center'] { transform: translateX(0) rotateY(0deg) translateZ(120px); opacity: 1; filter: brightness(1); z-index: 4; cursor: default; }
.room-gallery.hd-initialized .room-panel[data-position='left'] { transform: translateX(-420px) rotateY(24deg) scale(.83); opacity: .57; filter: brightness(.7); z-index: 2; }
.room-gallery.hd-initialized .room-panel[data-position='right'] { transform: translateX(420px) rotateY(-24deg) scale(.83); opacity: .57; filter: brightness(.7); z-index: 2; }
.room-gallery.hd-initialized .room-panel[data-position='left']:hover, .room-gallery.hd-initialized .room-panel[data-position='right']:hover { opacity: .82; filter: brightness(.95); }
.room-photo-wrap, .room-photo-overlay { position: absolute; inset: 0; }
.room-photo-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s; }
.room-panel:hover .room-photo-wrap img { transform: scale(1.05); }
.room-photo-overlay { background: linear-gradient(0deg, #101610da, transparent 57%, #161c185c); }
.room-card-top, .room-card-bottom { position: absolute; left: 32px; right: 32px; display: flex; justify-content: space-between; gap: 12px; text-shadow: 0 2px 15px #0009; }
.room-card-top { top: 28px; font: 600 10px/15px var(--sans); letter-spacing: 1.6px; }
.room-card-bottom { bottom: 31px; flex-direction: column; }
.room-card-bottom h3 { margin: 0 0 7px; font: 400 46px/49px var(--serif); }
.room-card-features { display: flex; flex-wrap: wrap; gap: 15px; color: #eee4d7; font: 600 9px/16px var(--sans); letter-spacing: 1.4px; }
.room-card-features span + span::before { content: '✦'; margin-right: 15px; color: #d9b88e; }
.room-details { display: flex; align-items: flex-end; justify-content: space-between; gap: 70px; margin-top: 11px; }
.room-details-copy { max-width: 550px; min-height: 77px; }
.room-detail { display: none; }
.room-detail.is-active { display: block; animation: detailIn .5s ease both; }
.room-detail p { margin: 0 0 12px; color: #67635b; font: 400 14px/25px var(--sans); }
.room-detail .text-link { font-size: 10px; }
.room-pagination { display: flex; align-items: center; gap: 18px; }
.circle-arrow { display: flex; align-items: center; justify-content: center; border: 1px solid #8d8d7c; background: transparent; color: #3e443c; width: 47px; height: 47px; border-radius: 50px; cursor: pointer; font: 400 20px/20px var(--sans); transition: background .25s, color .25s, transform .25s; }
.circle-arrow:hover { background: var(--forest); color: #fff; transform: rotate(-15deg); }
.room-counter { color: #7d7369; font: 600 11px/17px var(--sans); letter-spacing: 2px; }
.room-counter [data-room-current] { color: #282a25; font-size: 16px; }
.room-price-guide { display: flex; align-items: center; gap: 10px; margin-top: 17px; color: #807464; font: 600 9px/16px var(--sans); letter-spacing: 1px; }
.room-rate { display: none; color: #4a4b3e; font: 500 20px/24px var(--serif); }
.room-rate.is-active { display: inline; }
@keyframes detailIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
/* Evening feature */
.s-immersive { position: relative; min-height: 780px; display: flex; align-items: center; overflow: hidden; background: #2d2720; color: #fff; }
.immersive-photo, .immersive-shade { position: absolute; inset: 0; }
.immersive-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.12); will-change: transform; }
.immersive-shade { background: linear-gradient(90deg, #17221fe3 0%, #1b201dc4 42%, #1d232383 80%), linear-gradient(0deg, #111a17b3 0%, transparent 60%); }
.immersive-content { position: relative; z-index: 2; width: 100%; padding-top: 145px; padding-bottom: 110px; }
.immersive-heading { max-width: 1050px; margin: 32px 0 38px; font: 400 97px/97px var(--serif); letter-spacing: -1.6px; }
.immersive-heading span, .immersive-heading em { display: block; font: inherit; }
.immersive-heading em { font-style: italic; color: #e5c698; margin-left: 95px; }
.immersive-content-bottom { display: flex; align-items: center; gap: 55px; margin-top: 50px; }
.immersive-content-bottom p { max-width: 425px; margin: 0; color: #e6e1d5; font: 400 15px/29px var(--sans); }
.immersive-vertical-label { position: absolute; right: 15px; top: 200px; color: #f3dbb6; opacity: .7; writing-mode: vertical-rl; font: 600 9px/13px var(--sans); letter-spacing: 3px; }
/* Experiences accordion + 3D photo swap */
.s-experiences { background: #f8f5ee; overflow: hidden; }
.experiences-intro { display: flex; flex-direction: column; align-items: center; text-align: center; }
.experiences-intro .display-heading { max-width: 850px; }
.experiences-intro .body-lead { max-width: 670px; }
.experience-layout { display: flex; align-items: center; gap: 105px; margin-top: 77px; }
.experience-list { flex: 1 1 560px; }
.experience-item { border-top: 1px solid #d2cabc; }
.experience-item:last-child { border-bottom: 1px solid #d2cabc; }
.experience-toggle { width: 100%; border: 0; padding: 24px 0; background: transparent; display: flex; align-items: center; gap: 23px; color: #2b2e27; cursor: pointer; text-align: left; }
.experience-number { align-self: flex-start; margin-top: 8px; color: #aa936d; font: 600 10px/16px var(--sans); }
.experience-title-wrap { flex: 1; display: flex; flex-direction: column; gap: 7px; }
.experience-title-wrap strong { font: 400 30px/32px var(--serif); transition: color .25s; }
.experience-title-wrap small { color: #898276; font: 500 10px/17px var(--sans); letter-spacing: 1px; text-transform: uppercase; }
.experience-arrow { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 1px solid #d2cbbd; border-radius: 50px; color: #95785a; font: 400 21px/21px var(--sans); transition: transform .3s, background .3s, color .3s; }
.experience-item.is-selected .experience-title-wrap strong { color: #987047; }
.experience-item.is-selected .experience-arrow { transform: rotate(45deg); background: var(--forest); color: #fff; }
.experience-description { max-height: 0; opacity: 0; overflow: hidden; margin-left: 37px; transition: max-height .45s ease, opacity .35s ease, padding .35s ease; }
.experience-item.is-selected .experience-description { max-height: 160px; padding-bottom: 26px; opacity: 1; }
.experience-description p { max-width: 480px; margin: 0; color: #68675e; font: 400 14px/24px var(--sans); }
.experience-visual { flex: 0 1 505px; perspective: 1100px; }
.experience-visual-frame { position: relative; width: auto; height: 580px; background: var(--forest); box-shadow: 0 25px 60px #242c2240; transform-style: preserve-3d; will-change: transform; }
.experience-visual-frame::after { position: absolute; content: ''; left: -15px; right: 15px; top: 15px; bottom: -15px; border: 1px solid #b08b60; pointer-events: none; }
.experience-photo { position: absolute; inset: 0; overflow: hidden; opacity: 0; transform: scale(1.14) rotateY(7deg); transition: opacity .65s ease, transform 1.1s cubic-bezier(.2,.8,.2,1); }
.experience-photo.is-selected { opacity: 1; transform: scale(1) rotateY(0); z-index: 2; }
.experience-photo img { width: 100%; height: 100%; object-fit: cover; }
.experience-photo-corner { position: absolute; right: -19px; bottom: -19px; z-index: 5; width: 58px; height: 58px; border-radius: 60px; background: #b89972; color: #fff; display: flex; justify-content: center; align-items: center; font: 400 32px/32px var(--serif); }
.experience-visual-foot { margin-top: 32px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #8d7b67; font: 600 10px/16px var(--sans); letter-spacing: 1.2px; }
/* Philosophy */
.s-philosophy { background: #e9e0d3; overflow: hidden; }
.philosophy-layout { display: flex; align-items: center; gap: 115px; }
.philosophy-art { flex: 0 1 505px; min-width: 0; position: relative; padding-top: 58px; padding-left: 35px; padding-bottom: 43px; }
.philosophy-photo { position: relative; height: 590px; overflow: hidden; background: #6b5140; }
.philosophy-photo img { width: 100%; height: 100%; object-fit: cover; }
.philosophy-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, #0f19112e, transparent 63%); }
.philosophy-art::before { content: ''; position: absolute; top: 0; left: 0; width: 245px; height: 245px; border: 1px solid #af9472; border-radius: 250px; }
.philosophy-seal { position: absolute; right: -36px; bottom: 4px; width: 124px; height: 124px; display: flex; align-items: center; justify-content: center; gap: 9px; border-radius: 125px; background: #22332c; border: 6px solid #e9e0d3; color: #dfc598; font: 500 23px/25px var(--serif); }
.philosophy-seal span { font: 500 39px/40px var(--serif); }
.philosophy-copy { flex: 1 1 520px; }
.philosophy-copy .display-heading { max-width: 600px; }
.philosophy-copy .body-lead { max-width: 600px; }
.philosophy-copy blockquote { margin: 39px 0 33px; padding-left: 28px; border-left: 2px solid #ae8c63; max-width: 600px; color: #967752; font: italic 400 31px/38px var(--serif); }
/* Location */
.s-location { position: relative; display: flex; min-height: 730px; align-items: center; background: var(--forest-deep); color: #f6f1e8; overflow: hidden; }
.location-photo { position: absolute; top: 0; bottom: 0; left: 42%; right: 0; opacity: .38; }
.location-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #17231f 0%, #1b272286 65%, #17231f40 100%); }
.location-photo img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.1); }
.location-content { position: relative; z-index: 2; display: flex; align-items: flex-end; width: 100%; gap: 100px; padding-top: 120px; padding-bottom: 120px; }
.location-main { flex: 1 1 670px; }
.location-main .display-heading { color: #f9f4e9; max-width: 700px; }
.location-main .body-lead { color: #d4d8cc; max-width: 570px; }
.location-info { flex: 0 1 365px; }
.location-metrics { display: flex; gap: 28px; padding-bottom: 32px; border-bottom: 1px solid #e0d4bd6b; }
.location-metrics > div { flex: 1; display: flex; flex-direction: column; gap: 5px; }
.location-metrics strong { color: #ead6b8; font: 400 46px/48px var(--serif); }
.location-metrics span { color: #d5d0bf; font: 600 9px/16px var(--sans); letter-spacing: 1px; }
.location-address { padding-top: 28px; }
.location-address p { margin: 13px 0 21px; color: #e8e5d8; font: 400 14px/25px var(--sans); }
/* CTA */
.s-cta { background: #f6f1e7; overflow: hidden; }
.cta-layout { display: flex; align-items: center; gap: 105px; }
.cta-copy { flex: 1 1 690px; }
.cta-copy .display-heading { max-width: 780px; font-size: 79px; line-height: 79px; }
.cta-copy .body-lead { max-width: 460px; margin-bottom: 34px; }
.cta-art { position: relative; flex: 0 1 390px; height: 485px; }
.cta-art-arch { position: absolute; left: 32px; right: 16px; top: 24px; bottom: 0; overflow: hidden; border-radius: 230px 230px 0 0; background: #957d68; }
.cta-art-arch img { width: 100%; height: 100%; object-fit: cover; }
.cta-art-arch::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,#0f251f42,transparent 63%); }
.cta-art-ring { position: absolute; left: 0; top: 0; width: 280px; height: 280px; border-radius: 300px; border: 1px solid #bd9d72; transform: rotateX(64deg) rotateY(14deg); pointer-events: none; }
.cta-art-marker { position: absolute; bottom: -17px; right: -1px; display: flex; justify-content: center; align-items: center; width: 87px; height: 87px; border-radius: 100px; background: #24372c; color: #dbc6a3; font: 400 48px/48px var(--serif); }
/* Footer */
.site-footer { position: relative; color: #f4ece0; background: #1b2520; overflow: hidden; padding-top: 87px; }
.footer-top { position: relative; display: flex; align-items: flex-start; justify-content: space-between; gap: 90px; padding-bottom: 76px; border-bottom: 1px solid #e0d7c036; z-index: 1; }
.footer-brand { max-width: 600px; }
.footer-brand h2 { margin: 20px 0; font: 400 64px/64px var(--serif); letter-spacing: -1px; }
.footer-brand p { max-width: 440px; margin: 0; color: #c4c6ba; font: 400 14px/25px var(--sans); }
.footer-actions { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; margin-top: 38px; }
.footer-small-label { color: #c6a476; font: 600 10px/18px var(--sans); letter-spacing: 1.9px; }
.footer-contact { display: flex; align-items: center; gap: 20px; font: 400 22px/30px var(--serif); transition: color .25s; }
.footer-contact:hover { color: #d5af80; }
.footer-contact span { font: 400 16px/16px var(--sans); }
.footer-bottom { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-top: 28px; padding-bottom: 35px; color: #c5c3b6; font: 500 9px/16px var(--sans); letter-spacing: 1.4px; }
.footer-bottom a { color: #ebdbbf; }
.footer-bottom a span { font-size: 13px; margin-left: 5px; }
.footer-outline { height: 100px; color: #ffffff07; white-space: nowrap; text-align: center; font: 500 162px/162px var(--serif); letter-spacing: 20px; transform: translateY(24px); user-select: none; pointer-events: none; }
/* Show content by default. Only observer-registered nodes become pending. */
.hd-reveal { opacity: 1; transform: none; transition: transform .9s cubic-bezier(.2,.75,.2,1), opacity .9s ease; }
.hd-motion .hd-reveal.hd-pending { opacity: 0; transform: translateY(26px); }
.hd-motion .hd-reveal.hd-visible { opacity: 1; transform: none; }
.hd-motion .hero-content .hd-reveal { transition-delay: .35s; }
.hd-motion .hero-content .hero-description { transition-delay: .55s; }
.hd-motion .hero-content .hero-ctas { transition-delay: .7s; }
.hd-missing-acf, .fallback-main { min-height: 660px; padding-top: 190px; padding-bottom: 150px; }
.hd-missing-acf { display: flex; align-items: center; flex-direction: column; justify-content: center; padding-left: 30px; padding-right: 30px; }
.hd-missing-acf h1, .fallback-main h1 { font: 400 70px/78px var(--serif); }
.fallback-entry { margin-top: 30px; }
.fallback-content { max-width: 900px; }
/* Responsive 1200 */
@media (max-width: 1200px) {
    .hd-wrap { padding-left: 40px; padding-right: 40px; }
    .main-nav { gap: 19px; }
    .wordmark { min-width: 170px; }
    .wordmark-main { font-size: 22px; letter-spacing: 2.2px; }
    .header-inner { padding-left: 32px; padding-right: 32px; }
    .hero-heading { font-size: 86px; line-height: 79px; }
    .hero-sculpture { flex-basis: 310px; transform: scale(.82); transform-origin: center; margin-left: -45px; }
    .story-layout, .philosophy-layout { gap: 70px; }
    .experience-layout, .cta-layout { gap: 65px; }
    .display-heading { font-size: 61px; line-height: 64px; }
    .experience-visual-frame { height: 530px; }
    .room-gallery.hd-initialized .room-panel[data-position='left'] { transform: translateX(-330px) rotateY(24deg) scale(.76); }
    .room-gallery.hd-initialized .room-panel[data-position='right'] { transform: translateX(330px) rotateY(-24deg) scale(.76); }
}
@media (max-width: 990px) {
    .section-space { padding-top: 108px; padding-bottom: 108px; }
    .hd-wrap { padding-left: 30px; padding-right: 30px; }
    .main-nav { display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; padding: 125px 38px 50px; background: #1a2823; flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 24px; overflow-y: auto; }
    body.menu-is-open .main-nav { display: flex; }
    .main-nav a { font: 400 38px/46px var(--serif); letter-spacing: .5px; }
    .nav-mobile-book { display: inline-flex; padding-top: 23px; color: #dfbb8e !important; border-top: 1px solid #b6ae9955; }
    .header-book { display: inline-flex; }
    .menu-toggle { display: flex; position: relative; z-index: 3; flex-direction: column; justify-content: center; gap: 7px; background: none; border: 0; width: 36px; height: 36px; padding: 3px; cursor: pointer; }
    .menu-toggle span { display: block; height: 1px; width: 29px; background: #fff; transition: transform .3s; }
    body.menu-is-open .menu-toggle span:first-child { transform: translateY(4px) rotate(45deg); }
    body.menu-is-open .menu-toggle span:last-child { transform: translateY(-4px) rotate(-45deg); }
    .hd-hero { min-height: 795px; }
    .hero-content { padding-top: 145px; }
    .hero-heading { font-size: 79px; line-height: 70px; }
    .hero-heading .hd-line-reveal:nth-child(3) > span { font-size: 39px; line-height: 46px; }
    .hero-sculpture { position: absolute; right: -60px; opacity: .5; transform: scale(.72); }
    .hero-copy { flex-basis: 650px; }
    .story-layout { gap: 48px; }
    .story-art { flex-basis: 360px; height: 500px; }
    .story-photo-frame { left: 25px; top: 35px; bottom: 35px; }
    .story-art-watermark { font-size: 80px; }
    .display-heading { font-size: 55px; line-height: 57px; }
    .rooms-heading-row { gap: 25px; }
    .room-stage { height: 570px; }
    .room-gallery.hd-initialized .room-panel { width: 450px; height: 525px; }
    .room-gallery.hd-initialized .room-panel[data-position='left'] { transform: translateX(-290px) rotateY(26deg) scale(.75); }
    .room-gallery.hd-initialized .room-panel[data-position='right'] { transform: translateX(290px) rotateY(-26deg) scale(.75); }
    .s-immersive { min-height: 700px; }
    .immersive-heading { font-size: 74px; line-height: 76px; }
    .immersive-heading em { margin-left: 40px; }
    .experience-layout { gap: 40px; }
    .experience-visual-frame { height: 500px; }
    .experience-title-wrap strong { font-size: 25px; line-height: 28px; }
    .philosophy-layout { gap: 65px; }
    .philosophy-art { flex-basis: 320px; padding-left: 0; }
    .philosophy-photo { height: 500px; }
    .location-content { gap: 50px; }
    .location-metrics strong { font-size: 36px; }
    .cta-layout { gap: 50px; }
    .cta-copy .display-heading { font-size: 58px; line-height: 61px; }
    .cta-art { flex-basis: 300px; height: 430px; }
    .footer-brand h2 { font-size: 54px; line-height: 55px; }
}
@media (max-width: 700px) {
    html { scroll-padding-top: 70px; }
    body { font-size: 14px; line-height: 24px; }
    .section-space { padding-top: 82px; padding-bottom: 82px; }
    .hd-wrap { padding-left: 22px; padding-right: 22px; }
    .header-inner { min-height: 70px; padding: 13px 21px; }
    .site-header.is-scrolled .header-inner { min-height: 65px; padding: 11px 21px; }
    .wordmark { min-width: 0; }
    .wordmark-main { font-size: 22px; line-height: 21px; letter-spacing: 1.5px; }
    .wordmark-sub { font-size: 7px; letter-spacing: 2.7px; }
    .wordmark-image { height: 40px; max-width: 170px; }
    .header-book { display: none; }
    .main-nav { padding-top: 109px; }
    .main-nav a { font-size: 35px; line-height: 44px; }
    .hd-hero { min-height: 790px; align-items: flex-end; }
    .hero-base-photo { object-position: 61% center; }
    .hero-photo-shade { background: linear-gradient(0deg, #13231ff5 0%, #15251fd5 62%, #15251fb0 100%); }
    .hero-architectural-outline { opacity: .08; }
    .hero-content { padding-top: 165px; padding-bottom: 100px; }
    .hero-copy { min-width: 0; }
    .hero-eyebrow { font-size: 9px; line-height: 16px; letter-spacing: 1.9px; }
    .hero-heading { margin: 28px 0 23px; font-size: 67px; line-height: 61px; letter-spacing: -1.9px; }
    .hero-heading .hd-line-reveal:nth-child(3) > span { font-size: 32px; line-height: 38px; letter-spacing: -.3px; }
    .hero-description { font-size: 13px; line-height: 24px; max-width: 475px; }
    .hero-ctas { flex-wrap: wrap; gap: 21px; margin-top: 27px; }
    .hero-sculpture { opacity: .18; right: -155px; top: 155px; transform: scale(.65); }
    .hero-bottom { padding-top: 17px; padding-bottom: 20px; }
    .hero-coordinates { display: none; }
    .hero-index { font-size: 8px; }
    .display-heading { font-size: 48px; line-height: 49px; letter-spacing: -.7px; }
    .story-layout { flex-direction: column; align-items: stretch; gap: 30px; }
    .story-copy, .story-art { flex: auto; }
    .story-copy .body-lead { max-width: 580px; }
    .story-annotation { margin-top: 30px; }
    .story-art { height: 460px; }
    .story-photo-frame { left: 23px; right: 5px; top: 28px; bottom: 30px; }
    .story-art-ring { width: 175px; height: 175px; }
    .story-art-caption { font-size: 8px; letter-spacing: 2px; }
    .story-art-watermark { display: none; }
    .rooms-heading-row { flex-direction: column; align-items: flex-start; gap: 18px; }
    .rooms-heading-side { max-width: 570px; }
    .rooms-heading-side p { margin-bottom: 17px; }
    .room-gallery { margin-top: 32px; }
    .room-stage { height: 520px; }
    .room-gallery.hd-initialized .room-panel { width: 360px; height: 470px; top: 15px; }
    .room-gallery.hd-initialized .room-panel[data-position='left'] { transform: translateX(-245px) rotateY(26deg) scale(.7); opacity: .35; }
    .room-gallery.hd-initialized .room-panel[data-position='right'] { transform: translateX(245px) rotateY(-26deg) scale(.7); opacity: .35; }
    .room-card-top, .room-card-bottom { left: 22px; right: 22px; }
    .room-card-bottom h3 { font-size: 40px; line-height: 42px; }
    .room-card-features { font-size: 8px; letter-spacing: .7px; gap: 7px; }
    .room-card-features span + span::before { margin-right: 7px; }
    .room-details { flex-direction: column; align-items: flex-start; gap: 20px; }
    .room-details-copy { min-height: 70px; }
    .room-pagination { align-self: flex-end; }
    .room-price-guide { margin-top: 20px; }
    .s-rooms { padding-bottom: 75px; }
    .s-immersive { min-height: 690px; }
    .immersive-content { padding-top: 115px; padding-bottom: 90px; }
    .immersive-heading { margin-top: 25px; font-size: 60px; line-height: 61px; letter-spacing: -1.2px; }
    .immersive-heading em { margin-left: 0; }
    .immersive-content-bottom { flex-direction: column; align-items: flex-start; gap: 28px; margin-top: 23px; }
    .immersive-vertical-label { display: none; }
    .experiences-intro { align-items: flex-start; text-align: left; }
    .experience-layout { flex-direction: column-reverse; align-items: stretch; margin-top: 45px; gap: 30px; }
    .experience-list, .experience-visual { flex: auto; }
    .experience-visual-frame { height: 400px; }
    .experience-visual-foot { font-size: 9px; }
    .experience-toggle { padding: 20px 0; }
    .experience-title-wrap strong { font-size: 27px; line-height: 30px; }
    .experience-description { margin-left: 30px; }
    .philosophy-layout { flex-direction: column; align-items: stretch; gap: 35px; }
    .philosophy-art { flex: auto; padding: 25px 30px 5px 0; }
    .philosophy-photo { height: 490px; }
    .philosophy-seal { right: -10px; bottom: -15px; width: 98px; height: 98px; }
    .philosophy-seal span { font-size: 31px; }
    .philosophy-copy { flex: auto; }
    .philosophy-copy blockquote { margin-top: 30px; font-size: 28px; line-height: 34px; }
    .s-location { min-height: 0; }
    .location-photo { left: 0; opacity: .21; }
    .location-content { flex-direction: column; align-items: stretch; padding-top: 93px; padding-bottom: 93px; gap: 40px; }
    .location-main, .location-info { flex: auto; }
    .location-metrics { justify-content: flex-start; }
    .location-metrics > div { flex: 0 1 190px; }
    .cta-layout { flex-direction: column; align-items: stretch; gap: 47px; }
    .cta-copy { flex: auto; }
    .cta-copy .display-heading { font-size: 55px; line-height: 56px; }
    .cta-art { flex: auto; max-width: 470px; height: 450px; }
    .site-footer { padding-top: 70px; }
    .footer-top { flex-direction: column; gap: 25px; padding-bottom: 55px; }
    .footer-brand h2 { font-size: 55px; line-height: 55px; }
    .footer-actions { margin-top: 0; }
    .footer-bottom { flex-wrap: wrap; justify-content: flex-start; column-gap: 30px; row-gap: 16px; }
    .footer-outline { height: 65px; font-size: 79px; line-height: 79px; letter-spacing: 5px; }
}
@media (max-width: 420px) {
    .hero-heading { font-size: 55px; line-height: 53px; }
    .hero-heading .hd-line-reveal:nth-child(3) > span { font-size: 29px; line-height: 36px; }
    .hd-btn { min-width: 200px; }
    .display-heading { font-size: 43px; line-height: 45px; }
    .room-gallery.hd-initialized .room-panel { width: 297px; height: 435px; }
    .room-stage { height: 480px; }
    .room-gallery.hd-initialized .room-panel[data-position='left'] { transform: translateX(-210px) rotateY(26deg) scale(.7); }
    .room-gallery.hd-initialized .room-panel[data-position='right'] { transform: translateX(210px) rotateY(-26deg) scale(.7); }
    .immersive-heading { font-size: 48px; line-height: 51px; }
    .experience-visual-frame { height: 330px; }
    .philosophy-photo { height: 420px; }
    .cta-copy .display-heading { font-size: 49px; line-height: 51px; }
    .cta-art { height: 400px; }
    .footer-brand h2 { font-size: 49px; line-height: 51px; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    .js .hd-reveal, .hero-heading .hd-line-reveal > span, .hero-heading .hd-line-reveal > em { opacity: 1 !important; transform: none !important; }
    .depth-canvas { display: none; }
}

/* Local photographic-slot artwork is visible without JS or external image hosts. */
.hero-photography { background: #1c302b url('../img/architecture.svg') center center / cover no-repeat; }
.story-photo-frame, .philosophy-photo, .cta-art-arch { background: #614632 url('../img/architecture.svg') center center / cover no-repeat; }
.room-photo-wrap, .hero-detail-frame { background: #795c43 url('../img/room.svg') center center / cover no-repeat; }
.immersive-photo, .experience-photo, .location-photo { background: #273b34 url('../img/courtyard.svg') center center / cover no-repeat; }
img.hd-fallback-image { filter: saturate(.9); }

/* Stage the hero animation only after JavaScript has actually started. */
body.hd-animating-hero:not(.hd-ready) .hero-heading .hd-line-reveal > span,
body.hd-animating-hero:not(.hd-ready) .hero-heading .hd-line-reveal > em { opacity: .01; transform: translateY(115px); }