/* The photographic plates: complete architecture, natural light, quiet captions. */
.opening{height:430svh}
.opening-frames>.opening-lead,.opening-frames>.opening-frame{opacity:0;transition:opacity .48s cubic-bezier(.22,.61,.36,1);will-change:opacity;transform:none}
.opening-frames>.is-current{opacity:1}
.opening-frames>.opening-frame{inset:76px 4% auto;width:92%;height:calc(100svh - 270px);object-fit:contain;object-position:center;transform:none}
.hero.photo-chapter{background:#f4f1e9;color:#263334}
.hero.photo-chapter .hero-overlay{opacity:0}
.hero-overlay{transition:opacity .42s}
.hero.photo-chapter .hero-topline{top:30px;color:#39433d}
.hero.photo-chapter .vertical-signature{color:#77796c;right:1.4%;font-size:11px}
.opening-caption{left:4%;right:4%;bottom:100px;max-width:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,.55fr);align-items:end;column-gap:8%;opacity:0;transform:translateY(8px);transition:opacity .35s,transform .35s;pointer-events:none}
.hero.photo-chapter .opening-caption{opacity:1;transform:none}
.opening-caption>span{grid-column:1;font-size:12px;letter-spacing:.2em;color:#6c725f}
.opening-caption h2{grid-column:1;margin:10px 0 0;font-size:clamp(34px,3.4vw,54px);line-height:1;letter-spacing:-.025em;max-width:none}
.opening-caption p{grid-column:2;grid-row:1 / span 2;margin:0 52px 2px 0;font-size:14px;line-height:1.65;color:#62665e;max-width:330px}
.opening-caption .opening-count{position:absolute;right:0;bottom:4px;font-family:var(--sans);font-size:12px;letter-spacing:.1em;color:#8f8067}
.hero.photo-chapter .hero-footer{bottom:22px;padding-top:14px;border-color:#b9b5a14f;color:#39433d}
.hero.photo-chapter .hero-footer button{color:#39433d}
.hero.photo-chapter .scroll-mark{background:#84775d66}
.hero.photo-chapter .scroll-mark:after{background:#84775d}
.hero.photo-chapter .opening-progress{background:#b9b5a133}
.hero.photo-chapter .opening-progress span{background:#948167}
.hero.photo-chapter .hero-copy{visibility:hidden}
.view-frame.loading:after{display:none}
#scene-image,#atelier-image,#light-image{transition:none;opacity:1!important}
#scene-image{background:#12201f}
#chapters img{width:64px;height:44px;object-fit:cover}
.story-large img{object-position:center}
@media(max-width:700px){
 .opening{height:400svh}
 .opening-frames>.opening-frame{inset:90px 18px auto;width:calc(100% - 36px);height:calc(100svh - 330px);min-height:220px;object-fit:contain}
 .hero.photo-chapter .hero-topline{top:35px;left:20px;right:20px;font-size:11px}
 .hero.photo-chapter .vertical-signature{display:none}
 .hero.photo-chapter .hero-topline:after{content:"Oliver Lloyd";font-family:var(--serif);font-size:22px;letter-spacing:-.04em;position:absolute;left:0;top:27px}
 .opening-caption{left:22px;right:22px;top:calc(50svh + 86px);bottom:auto;display:block;max-width:none}
 .opening-caption>span{font-size:11px}
 .opening-caption h2{font-size:clamp(30px,7vw,43px);margin-top:12px;max-width:100%}
 .opening-caption p{font-size:14px;line-height:1.55;margin:15px 42px 0 0;max-width:330px}
 .opening-caption .opening-count{font-size:11px;bottom:1px}
 .hero.photo-chapter .hero-footer{bottom:25px}
}
@media(prefers-reduced-motion:reduce){.opening{height:100svh}.opening-frames>*{transition:none!important}.opening-caption,.hero-overlay{transition:none}}

/* Intrinsic dimensions reserve the correct ratio, never a fixed rendered height. */
img{max-width:100%;height:auto}
.editorial-story .story-large img,
.editorial-story .story-aside figure img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;object-position:center}
@media(max-width:850px){
 .editorial-story{grid-template-columns:1fr;gap:40px}
 .editorial-story .story-aside{display:block;padding-top:0}
 .editorial-story .story-aside h2{max-width:580px}
 .editorial-story .story-aside>p{max-width:580px;margin-bottom:30px}
 .editorial-story .story-aside figure{margin-top:0}
 .editorial-story .story-aside figure figcaption{display:block}
}

/* One direct contact, carried from the opening into the reading controls. */
#private-desk{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap;font:400 14px/1.4 var(--sans);letter-spacing:.01em;border:0;border-bottom:1px solid #b49c72;padding:6px 0;color:inherit;background:none;text-decoration:none}
#private-desk:hover{border-bottom-color:currentColor}
.hero-footer>#private-desk{display:inline-flex;font-size:14px}
.agent-contact-details span{display:block;overflow-wrap:anywhere}
.agent-card .agent-contact-details{margin-top:24px;font-size:14px;line-height:2}
.folio .folio-contact-details{font-size:14px;overflow-wrap:anywhere}
.book-reader-top #private-desk{margin-left:auto;letter-spacing:0}
@media(max-width:700px){
 .visit-dock{gap:16px;padding:9px 16px;max-width:calc(100% - 32px)}
 .visit-dock .dock-monogram{display:none}
 .visit-dock #private-desk{display:inline-flex;font-size:14px}
 .book-reader-top>span{display:none}
 .book-reader-top #private-desk{margin-left:0}
}
@media(max-width:380px){.visit-dock #dock-sound{display:none}}
@media(max-width:380px){
 .authors{grid-template-columns:1fr;gap:18px}
 .authors>div{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
 .authors strong{margin-top:0}
}

/* The landscape opening remains a complete composition within the visible screen. */
@media(orientation:landscape) and (max-height:500px){
 .opening .hero{height:100svh;min-height:0}
 .masthead{height:70px}.masthead .brand{font-size:25px}.masthead .brand span{font-size:10px;margin-top:10px}
 .hero-topline{top:88px;font-size:10px}
 .hero-copy{top:118px;bottom:auto;left:4%;right:auto}
 .hero-copy>.eyebrow{display:none}
 .hero h1{font-size:clamp(42px,6vw,56px);line-height:.85}
 .hero-description{margin-top:12px;font-size:12px;display:block}
 .hero-description p{margin-top:4px;padding:0;border:0}
 .hero-footer,.hero.photo-chapter .hero-footer{bottom:12px;padding-top:8px;gap:12px;flex-wrap:nowrap}
 .vertical-signature,.scroll-cue{display:none}
 .opening-frames>.opening-frame{inset:52px auto auto 3%;width:59%;height:calc(100svh - 132px);min-height:0}
 .hero.photo-chapter .hero-topline{top:18px;left:3%;right:3%}
 .hero.photo-chapter .hero-topline:after{display:none}
 .opening-caption{left:66%;right:3%;top:75px;bottom:auto;display:block}
 .opening-caption h2{font-size:30px;margin-top:10px}
 .opening-caption p{font-size:12px;line-height:1.5;margin:12px 0 0}
 .opening-caption .opening-count{position:static;display:block;margin-top:12px}
}
/* Comfortable touch targets without adding visual weight to the controls. */
@media(max-width:900px){
 .scene-navigation button,.segmented button,.atelier-tabs button,.filters button,
 .book-reader-top button,.book-reader-bottom button,.book-reader-bottom select,
 .plan-dialog-top button,.lightbox-top button,.lightbox-bottom button,
 .visit-dock button{min-height:44px}
}
@media(prefers-reduced-motion:no-preference){.reveal{transition-duration:.6s}}
@media(max-width:700px){.plan-full.enlarged img{width:max(200%,1200px)}}

/* A personal introduction, set like an editorial signature. */
.agent-card{align-self:center;padding-top:30px}
.agent-identity{display:grid;grid-template-columns:124px minmax(0,1fr);align-items:center;gap:26px}
.agent-portrait{margin:0;padding:6px;border:1px solid #b49c7266}
.agent-portrait img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}
.agent-identity .eyebrow{font-size:11px;letter-spacing:.15em;color:#cbb996}
.agent-identity h3{font-size:clamp(36px,3.2vw,50px);line-height:1.04;margin:12px 0 0;letter-spacing:-.025em}
.agent-role{font-size:13px;line-height:1.65;color:#bdc6b7;margin:12px 0 0}
.agent-card .agent-contact-details{margin-top:27px;color:#e5e6d9;line-height:1.9}
.agent-socials{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 18px;margin-top:25px;padding-top:11px;border-top:1px solid #7987776b}
.agent-socials a{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:#d4c7ac;font-size:14px;line-height:1.4;text-decoration:none;text-underline-offset:6px}
.agent-socials a span{font-size:15px;color:#aa9570;transition:transform .2s}
.agent-socials a:hover{color:#fff5de;text-decoration:underline;text-decoration-thickness:1px}
.agent-socials a:hover span{transform:translate(2px,-2px)}
.agent-socials a:focus-visible{outline:1px solid #d4c7ac;outline-offset:5px}
@media(min-width:751px) and (max-width:1100px){.agent-identity{grid-template-columns:100px minmax(0,1fr);gap:20px}}
@media(max-width:380px){.agent-identity{grid-template-columns:100px minmax(0,1fr);gap:20px}.agent-identity h3{font-size:35px}.agent-socials{column-gap:10px}.agent-socials a{gap:7px;font-size:13px}}
@media(prefers-reduced-motion:reduce){.agent-socials a span{transition:none;transform:none!important}}