.detail-page { --paper:#f0f0f0; --detail-body:clamp(15px,1.041667vw,26.667px); --detail-title:clamp(34px,4.166667vw,106.667px); background:var(--paper); color:var(--navy) }
.detail-page .site-header { color:var(--white) }
.detail-main { position:relative; overflow:clip }
.detail-main>.page-grid { z-index:3 }
.detail-main>.page-grid i { background:rgba(130,141,153,.12) }
.detail-main section { position:relative }
.detail-script { font:400 clamp(26px,2.083333vw,53.333px)/1.3 var(--script); font-synthesis:none; text-transform:none }
.detail-hero { height:56.25vw; min-height:640px; color:var(--white) }
.detail-hero-image,.detail-hero-shade { position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.events-page .detail-hero-image { object-position:center 49% }
.cross-page .detail-hero-image { transform:scaleX(-1); object-position:center }
.detail-hero-shade { background:linear-gradient(90deg,rgba(2,29,70,.55),rgba(2,29,70,.05) 80%),rgba(0,0,0,.12) }
.cross-page .detail-hero-shade { background:linear-gradient(90deg,transparent 25%,rgba(2,29,70,.68)),rgba(0,0,0,.06) }
.detail-hero-content { position:relative; z-index:4; text-align:center; padding:22.4vw 4% 0 }
.detail-hero h1 { font-size:var(--detail-title); line-height:1.2 }
.detail-hero-subtitle { color:var(--gold); margin-top:.3vw }
.detail-hero-intro { margin-top:3.125vw; font:300 var(--detail-body)/2 var(--sans) }
.detail-enquire { margin-top:2.5vw; min-width:13.333333vw; min-height:3.75vw }
.cross-page .detail-hero-intro { margin-top:5.208333vw }
.detail-roundel { position:absolute; z-index:5; bottom:-1.041667vw; left:calc(50% - 1.041667vw); width:2.083333vw; height:2.083333vw }
.detail-offerings { display:grid; grid-template-columns:32.552083vw 41.197917vw; gap:6.770833vw; padding:11.71875vw 10.625vw 0 8.854167vw; min-height:56.40625vw; align-items:start }
.detail-explainer { position:relative; font:300 var(--detail-body)/2 var(--sans); color:#252525 }
.detail-explore-heading { position:relative; color:var(--navy); margin-bottom:2.6vw; font-size:clamp(26px,2.083333vw,53.333px) }
.detail-title-heading { position:relative }
.detail-explainer>p+p { margin-top:2.1vw }
.explore-curve { position:absolute; top:calc(100% - .575em); left:3.90625vw; width:8.489583vw; height:.625vw }
.offering-list { display:grid; gap:.729167vw }
.offering { background:#dcdcdc; scroll-margin-top:30px; overflow:clip; overflow-anchor:none }
.offering summary { min-height:4.166667vw; padding:.9vw 2.1875vw; list-style:none; display:flex; align-items:center; gap:1vw; justify-content:space-between; cursor:pointer }
.offering summary::-webkit-details-marker { display:none }
.offering summary:focus-visible { outline:2px solid var(--gold); outline-offset:-4px }
.offering-title { display:block; font:400 clamp(19px,1.5625vw,40px)/1.3 var(--serif); text-transform:uppercase }
.offering-toggle { width:12px; height:12px; position:relative; flex:none }
.offering-toggle::before,.offering-toggle::after { content:''; position:absolute; width:100%; height:1px; left:0; top:50%; background:currentColor; transition:transform .3s }
.offering-toggle::after { transform:rotate(90deg) }
.offering[open]:not(.is-closing) .offering-toggle::after { transform:rotate(0deg) }
.offering-panel { overflow:hidden }
.offering-body { padding:1.770833vw 2.1875vw 2.239583vw; font:300 clamp(14px,.9375vw,24px)/1.666667 var(--sans); text-align:justify; min-height:12.135417vw }
.events-page .offering:nth-child(2) .offering-body,.events-page .offering:nth-child(3) .offering-body { min-height:12.239583vw }
.events-page .offering:nth-child(4) .offering-body { min-height:12.96875vw }
.events-page .offering:nth-child(5) .offering-body { min-height:13.385417vw }
.cross-page .offering-body { min-height:13.90625vw }
.cross-page .offering:nth-child(2) .offering-body { min-height:14.375vw }
.cross-page .offering:nth-child(3) .offering-body { min-height:13.802083vw }
.cross-page .offering:nth-child(4) .offering-body { min-height:15.364583vw }
.cross-page .offering-list { gap:.677083vw }
.cross-page .detail-offerings { padding-bottom:10vw }
.experience-heading { height:23.333333vw; padding:10.8vw 5% 0; text-align:center }
.experience-heading h2,.detail-closing h2 { font-size:clamp(32px,3.125vw,80px); line-height:1.5 }
.detail-flourish { position:relative; width:28.958333vw; margin:-.25vw 0 0 41.666667% }
.detail-curve { display:block; width:100%; height:auto; overflow:visible }
.experience-heading .detail-flourish { margin-left:48.854167vw; margin-top:-.85vw }
.curve-pen { fill:none; stroke:white; stroke-width:20; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1; stroke-dashoffset:var(--curve-undrawn,0) }
.curve-roundel { position:absolute; width:2.083333vw; height:2.083333vw; right:-.65vw; top:-4.4vw }
.project-accordion { display:flex; flex-direction:column; height:114.583333vw; background:var(--navy); overflow:hidden; isolation:isolate; overflow-anchor:none }
.project-panel { position:relative; flex:3 1 0; min-height:0; overflow:hidden; transition:flex-grow .8s cubic-bezier(.25,1,.5,1) }
.project-panel.is-active { flex-grow:4 }
.project-image { position:absolute; left:0; top:50%; width:100%; height:20.833333vw; min-height:100%; object-fit:cover; transform:translateY(-50%); pointer-events:none }
.project-panel::after { content:''; position:absolute; inset:0; background:rgba(0,0,0,.66); transition:background .6s; pointer-events:none }
.project-panel.is-active::after { background:rgba(0,0,0,.22) }
.project-trigger { position:absolute; z-index:1; inset:0; width:100%; height:100%; border:0; background:none }
.project-trigger:focus-visible { outline-offset:-6px }
.project-caption { position:absolute; z-index:2; left:5%; right:5%; top:50%; text-align:center; color:white; transform:translateY(-25%); transition:transform .7s; pointer-events:none }
.project-title { display:flex; gap:1vw; justify-content:center; align-items:center; font:300 clamp(20px,1.666667vw,42.667px)/1.4 var(--sans); opacity:.62; transition:opacity .6s }
.project-panel.is-active .project-title { opacity:1 }
.project-panel.is-active .project-caption { transform:translateY(-50%) }
.project-link { display:inline-flex; justify-content:center; align-items:center; border:1px solid rgba(255,255,255,.8); border-radius:99px; min-width:10.208333vw; min-height:3.125vw; margin-top:1.5vw; padding:.35vw 2.3vw; font:300 clamp(14px,1.041667vw,26.667px)/1.5 var(--sans); opacity:0; visibility:hidden; transform:translateY(18px); transition:opacity .45s,transform .6s,visibility .45s,background .3s; pointer-events:auto }
.project-panel.is-active .project-link { opacity:1; visibility:visible; transform:none }
.project-link:hover { background:rgba(255,255,255,.18) }
.detail-closing { min-height:50.78125vw; padding:10.416667vw 9% 8vw; text-align:center }
.detail-closing .gold { color:var(--gold) }
.detail-closing>.detail-script { margin:2.3vw auto 0; max-width:77%; font-size:clamp(20px,1.25vw,32px); line-height:1.5 }
.detail-outline { min-height:3.75vw; min-width:24.270833vw; padding:.6vw 2vw; border:1px solid #a9b3c3; margin-top:5vw; font-size:clamp(16px,1.25vw,32px) }
.detail-outline:hover { background:var(--navy); border-color:var(--navy); color:white }
.door-left,.door-right { position:absolute; top:11.15vw; width:9.05vw; height:auto; opacity:.14; pointer-events:none }
.door-left { left:0 }
.door-right { right:0 }
.cross-feature { position:relative; width:100%; height:56.25vw }
.cross-feature img { width:100%; height:100%; object-fit:cover }
.cross-page .detail-closing { min-height:42.760417vw; padding-top:7.55vw }
.cross-page .detail-closing .detail-flourish { margin-top:-.15vw; margin-left:46% }
.cross-page .detail-closing>.detail-script { margin-top:2.5vw }
.cross-page .detail-outline { margin-top:4.7vw; min-width:22.55vw }
.cross-page .door-left,.cross-page .door-right { top:8.7vw }
.detail-line { display:block; overflow:hidden; padding-bottom:.18em; margin-bottom:-.18em }
.detail-line>span { display:block }
.detail-motion-ready .detail-line>span { opacity:0; transform:translate3d(0,105%,0) }
.detail-motion-ready [data-detail-reveal]:not(.offering) { opacity:0 }
.detail-motion-ready [data-hero-copy] { animation:detail-copy-arrival 1.4s cubic-bezier(.16,1,.3,1) both; animation-delay:var(--hero-delay,0s) }
@keyframes detail-copy-arrival { from { opacity:0; translate:0 110px } to { opacity:1; translate:0 0 } }
@media(max-width:900px) {
  .detail-page { --detail-body:17px; --detail-title:clamp(34px,6vw,54px) }
  .detail-hero { height:100svh; min-height:680px; max-height:1100px }
  .detail-hero-content { padding:30svh 7% 0 }
  .detail-hero h1 { line-height:1.3 }
  .detail-hero-subtitle { margin-top:18px; font-size:30px }
  .detail-hero-intro,.cross-page .detail-hero-intro { margin-top:35px; line-height:1.65 }
  .detail-hero-intro br { display:none }
  .detail-enquire { min-height:52px; min-width:190px; margin-top:32px }
  .detail-roundel { width:34px; height:34px; left:calc(50% - 17px); bottom:-17px }
  .detail-offerings { display:block; padding:100px 7% 0; min-height:0 }
  .detail-explainer { max-width:600px; line-height:1.85 }
  .detail-explore-heading { font-size:36px; margin-bottom:36px }
  .detail-explore-heading>.detail-script { font-size:inherit }
  .detail-explainer>p+p { margin-top:25px }
  .explore-curve { top:calc(100% - .6em); left:65px; width:140px; height:10.3px }
  .offering-list { margin-top:55px; gap:12px }
  .offering summary { min-height:76px; padding:18px 22px; gap:20px }
  .offering-title { font-size:21px; line-height:1.4 }
  .offering-body { padding:18px 22px 32px; font-size:17px; text-align:left; line-height:1.75 }
  .cross-page .offering-list { gap:12px }
  .cross-page .detail-offerings { padding-bottom:90px }
  .experience-heading { height:auto; padding:100px 7% 85px }
  .experience-heading h2,.detail-closing h2 { font-size:clamp(28px,5vw,42px); line-height:1.5 }
  .detail-flourish { width:57%; margin:8px 0 0 30% }
  .experience-heading .detail-flourish { margin:8px 0 0 30% }
  .curve-roundel { width:26px; height:26px; right:-12px; top:-30px }
  .project-accordion { height:1660px }
  .project-image { height:440px }
  .project-panel { flex-grow:1 }
  .project-panel.is-active { flex-grow:1.65 }
  .project-title { font-size:21px; gap:8px; flex-wrap:wrap }
  .project-link { margin-top:20px; padding:6px 25px; font-size:16px }
  .detail-closing { min-height:0; padding:100px 7% 110px }
  .detail-closing h2 br { display:none }
  .detail-closing h2 .gold { display:block }
  .detail-closing>.detail-script { margin:35px auto 0; max-width:92%; font-size:24px }
  .detail-closing>.detail-script br { display:none }
  .detail-outline { min-height:55px; min-width:260px; padding:12px 20px; margin-top:45px; font-size:18px }
  .door-left,.door-right { top:110px; width:12%; opacity:.12 }
  .cross-feature { height:70vw }
  .cross-page .detail-closing { min-height:0; padding-top:90px }
  .cross-page .detail-closing .detail-flourish { margin:8px 0 0 33% }
  .cross-page .detail-closing>.detail-script { margin-top:38px }
  .cross-page .detail-outline { min-width:260px; margin-top:45px }
  .cross-page .door-left,.cross-page .door-right { top:100px }
}
@media(prefers-reduced-motion:reduce) {
  .detail-motion-ready .detail-line>span,.detail-motion-ready [data-detail-reveal] { opacity:1 !important; transform:none !important }
  .detail-motion-ready [data-hero-copy] { animation:none; translate:none }
  .project-panel,.project-caption,.project-link,.project-panel::after,.offering-toggle::after { transition:none }
  .curve-pen { stroke-dashoffset:0 }
}
.explore-curve{overflow:visible}
.explore-curve .curve-pen{stroke-width:10}
