/* Original brand motion: owned photography, original arch geometry, no external runtime. */

.site-header { transition: background-color 280ms, box-shadow 280ms; }
.site-header.is-scrolled { background: var(--paper-light); box-shadow: 0 5px 22px rgba(43,42,35,.055); }
.site-header::after { content: ""; position: absolute; inset: auto 0 -1px; height: 2px; background: var(--gold); transform: scaleX(var(--reading-progress,0)); transform-origin: left; pointer-events: none; }
.hero { padding-top: 40px; }
.hero-intro { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(260px,1fr); gap: 36px; align-items: center; margin-bottom: 39px; }
.hero h1 { font-size: clamp(38px,4.65vw,67px); line-height: 1.27; }
.title-line { display: block; }
.hero-identity .action-row { margin-top: 30px; }
.brand-motion { position: relative; width: min(100%,380px); height: 270px; justify-self: end; perspective: 850px; transform: rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); transition: transform 350ms var(--ease); transform-style: preserve-3d; pointer-events: auto; }
.motion-arch { position: absolute; inset: 0; width: 100%; height: 100%; stroke: #baa477; stroke-width: 1; }
.motion-arch path { stroke-dasharray: 1; stroke-dashoffset: 0; }
.motion-arch path:last-child { opacity: .4; }
.motion-card { position: absolute; left: 50%; top: 53%; width: 139px; height: 190px; border: 1px solid #d4c5a6; border-radius: 8px; overflow: hidden; background: var(--paper-light); box-shadow: 0 15px 28px rgba(59,45,20,.11); backface-visibility: hidden; }
.motion-card>img { width: 100%; height: 100%; object-fit: cover; }
.motion-card-left { transform: translate(calc(-50% - 77px),calc(-50% + 10px)) rotate(-15deg); }
.motion-card-left>img { object-position: 49% 50%; }
.motion-card-right { transform: translate(calc(-50% + 77px),calc(-50% + 10px)) rotate(15deg); }
.motion-card-brand { display: grid; place-items: center; transform: translate(-50%,-50%) rotate(-1deg); background: #efe8d9; }
.motion-card-brand>img { width: 83%; height: auto; object-fit: contain; }

.hero-photo.scroll-scene>img,.space-feature .scroll-scene>img { transform: translate3d(0,var(--scene-y,0px),0) scale(var(--scene-scale,1)); transition: none; }
.page-intro { padding-top: 65px; padding-bottom: 44px; min-height: 185px; display: flex; align-items: center; }
.page-intro h1 { font-size: clamp(40px,4.5vw,65px); }
.section-heading { align-items: center; }
.section-heading>div { justify-self: end; }
.story-copy .button { margin-top: 35px; }
.story-copy h2,.space-detail h2,.lounge-grid h2 { line-height: 1.25; }
.space-detail { grid-template-columns: .6fr 1.4fr; }
.lounge-grid .text-link { margin-top: 27px; }
.closing-line h2 { font-size: clamp(23px,2.3vw,31px); }
.filter-row { min-height: 65px; }
.filters { width: 100%; gap: 34px; }
.filters button { position: relative; border-bottom: 0; }
.filters button::after { content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform 300ms var(--ease); }
.filters button[aria-pressed=true]::after { transform: scaleX(1); }
.gallery-photo img { transition: transform 550ms var(--ease); }
.gallery-photo:hover img { transform: scale(1.025); }
.photo-expand { transition: background-color 250ms, transform 300ms var(--ease); }
.photo-button:hover .photo-expand { transform: translate(2px,-2px); }
.button { transition: background-color 250ms, color 250ms, transform 250ms var(--ease); }
.button:active { transform: translateY(1px); }

@media(max-width:1000px) and (min-width:721px) {
 .hero-intro { grid-template-columns: minmax(0,1.5fr) minmax(220px,1fr); gap: 20px; }
 .hero h1 { font-size: clamp(36px,4.7vw,49px); }
 .brand-motion { height: 225px; }
 .motion-card { width: 114px; height: 160px; }
 .motion-card-left { transform: translate(calc(-50% - 56px),calc(-50% + 8px)) rotate(-15deg); }
 .motion-card-right { transform: translate(calc(-50% + 56px),calc(-50% + 8px)) rotate(15deg); }
 .hero-identity .action-row { gap: 18px; }
}
@media(max-width:720px) {
 .hero { padding-top: 33px; }
 .hero-intro { grid-template-columns: 1fr; gap: 13px; margin-bottom: 22px; }
 .hero h1 { font-size: clamp(29px,8.2vw,48px); line-height: 1.3; }
 .hero-identity .action-row { margin-top: 24px; gap: 18px; }
 .brand-motion { width: 265px; height: 176px; justify-self: center; margin-top: 3px; }
 .motion-card { width: 94px; height: 132px; top: 53%; border-radius: 6px; box-shadow: 0 9px 17px rgba(59,45,20,.1); }
 .motion-card-left { transform: translate(calc(-50% - 54px),calc(-50% + 7px)) rotate(-14deg); }
 .motion-card-right { transform: translate(calc(-50% + 54px),calc(-50% + 7px)) rotate(14deg); }
 .page-intro { min-height: 140px; padding-block: 35px; }
 .page-intro h1 { font-size: 38px; }
 .section-heading { display: flex; gap: 20px; flex-wrap: wrap; margin-bottom: 30px; }
 .section-heading>div { margin-top: 0; }
 .section-heading h2 { font-size: 32px; }
 .story-copy .button { margin-top: 24px; }
 .space-detail { display: flex; }
 .closing-line { display: flex; flex-wrap: wrap; align-items: center; }
 .closing-line h2 { font-size: 24px; }
 .filters { gap: 5px 23px; }
 .hero-photo.scroll-scene>img,.space-feature .scroll-scene>img { transform: none; }
}
@media(prefers-reduced-motion:reduce) {
 .site-header::after { display: none; }
 .brand-motion,.motion-card,.motion-arch path,.scroll-scene>img { animation: none!important; }
 .brand-motion { transform: none!important; }
 .hero-photo.scroll-scene>img,.hero-photo:hover>img,.space-feature .scroll-scene>img,.photo-button:hover img,.gallery-photo:hover img { transform: none!important; }
}