@font-face{font-family:Caslon;src:url('fonts/LibreCaslonDisplay-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{--navy:#0e1a23;--gold:#d1bf94;--cream:#f6f2e9;--paper:#080f15;--ink:#f6f2e9;--muted:#b8c6cc;--surface:#142833;--ink-muted:#c0cdd3;--line:#d1bf9466;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;color:var(--cream);background:var(--navy);font-size:16px;scroll-behavior:smooth;scroll-padding-top:30px;scrollbar-color:var(--gold) var(--navy)}
*{box-sizing:border-box}body{margin:0}::selection{background:var(--gold);color:var(--navy)}a{color:inherit;text-decoration:none;text-underline-offset:5px}a:hover{text-decoration:underline}a:active,button:active{opacity:.75}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #9c7639;outline-offset:6px}button,summary{-webkit-tap-highlight-color:transparent}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-family:Caslon,Georgia,serif;font-weight:400;letter-spacing:-.02em;line-height:1.04;text-wrap:balance}h1{font-size:clamp(54px,5.6vw,84px)}h2{font-size:clamp(46px,4.6vw,68px)}h3{font-size:32px}p{line-height:1.75}.arrow{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.5;flex-shrink:0}
header{height:96px;padding:0 6%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d1bf9433;background:var(--navy);position:relative;z-index:3}.brand{display:flex;align-items:center;gap:15px;font-size:29px}.brand>svg{width:28px;height:38px;fill:none;stroke:var(--gold);stroke-width:2}nav{display:flex;gap:32px;font-size:14px}nav a{padding:14px 0}.join{display:flex;align-items:center;gap:30px;border:1px solid var(--line);padding:14px 19px;font-size:14px}.text-link{display:inline-flex;gap:50px;align-items:center;min-height:48px;border-bottom:1px solid currentColor;font-size:15px}.skip{position:absolute;left:20px;top:-100px;z-index:10;padding:15px;background:var(--paper);color:var(--navy)}.skip:focus{top:12px}
.stage{background:var(--navy)}.hero{position:relative;min-height:680px;display:flex;align-items:center;padding:60px 7%}.hero-copy{position:relative;width:57%;z-index:1}.hero-copy p{font-size:19px;color:var(--muted);margin:28px 0 24px}.door-position{position:absolute;right:8%;top:9%;width:31%;height:80%;max-height:650px;transform-origin:center}.door{width:100%;height:100%;position:relative;overflow:hidden;background:var(--paper);border-radius:50% 50% 0 0;border:1px solid var(--gold);perspective:1200px}.door-leaf{position:absolute;top:0;bottom:0;width:50%;background:#152a35;backface-visibility:hidden}.door-leaf.left{left:0;transform-origin:left center;border-right:1px solid var(--gold)}.door-leaf.right{right:0;transform-origin:right center;border-left:1px solid var(--gold)}.door-leaf:after{content:'';position:absolute;top:61%;width:3px;height:26px;background:var(--gold)}.door-leaf.left:after{right:13px}.door-leaf.right:after{left:13px}.door-seam{position:absolute;inset:10px;border:1px solid #d1bf9440;border-radius:50% 50% 0 0;pointer-events:none}
.about{background:var(--paper);color:var(--ink);padding:100px 9%;display:grid;grid-template-columns:.85fr 1.6fr;align-items:start;gap:7%}.about .statement{font-family:Caslon,Georgia,serif;font-size:clamp(30px,3.4vw,48px);line-height:1.16;letter-spacing:-.015em;text-wrap:pretty}.about p+p{max-width:620px;margin:25px 0;font-size:17px;color:var(--ink-muted)}.about .text-link{margin-top:10px}
.motion-ready .entrance{height:205svh}.motion-ready .stage{position:sticky;top:0;height:100svh;overflow:hidden;background:var(--paper)}.motion-ready .hero{position:absolute;inset:0;height:100%;min-height:0;background:var(--navy)}.motion-ready .about{position:absolute;inset:0;align-content:center;opacity:0;pointer-events:none;background:transparent}.motion-ready .door-position{will-change:transform}.motion-ready .hero-copy{will-change:transform,opacity}
.light{background:var(--paper);color:var(--ink)}.activities{padding:70px 9% 100px}.activities>h2{margin-bottom:40px}.activity-row{border-top:1px solid #172a3238;padding:28px 0;display:grid;grid-template-columns:1fr 1.25fr 44px;gap:35px;align-items:start}.activity-row:last-child{border-bottom:1px solid #172a3238}.activity-row p{color:var(--ink-muted);max-width:520px;font-size:16px}.icon-link{width:44px;min-height:44px;display:grid;place-items:center}.icon-link:hover{background:#172a320a}
.launch{display:grid;grid-template-columns:1fr 1.1fr;gap:11%;padding:100px 9%;border-bottom:1px solid var(--line)}.launch-intro h2 span{color:var(--gold)}.status{display:inline-block;border:1px solid var(--line);padding:6px 12px;margin:25px 0 5px;font-size:14px;color:var(--gold)}.launch-intro>p:not(.status){color:var(--muted);font-size:17px;margin-top:22px;max-width:560px}.launch-intro .text-link{margin-top:28px}.programme>h3{margin-bottom:28px}details{border-top:1px solid var(--line)}details:last-of-type{border-bottom:1px solid var(--line)}summary{display:flex;justify-content:space-between;align-items:center;gap:15px;cursor:pointer;list-style:none;padding:23px 0;font-size:18px;line-height:1.4}summary::-webkit-details-marker{display:none}.plus{width:16px;height:16px;position:relative;flex-shrink:0}.plus:before,.plus:after{content:'';position:absolute;background:var(--gold);height:1px;width:14px;top:7px;left:1px}.plus:after{transform:rotate(90deg)}details[open] .plus:after{transform:rotate(0)}details p{font-size:16px;color:var(--muted);padding:0 0 25px;max-width:65ch}.programme-note{font-size:14px;color:var(--muted);margin-top:24px}
.events{padding:95px 9% 105px}.events>h2{margin-bottom:45px}.gallery{display:grid;grid-template-columns:.85fr 1.15fr;gap:7%}.gallery figure:nth-child(2){padding-top:90px}.gallery img{width:100%;height:440px;object-fit:cover;display:block}.gallery figure:first-child img{object-position:center 42%}.gallery figure:nth-child(2) img{height:325px;object-position:center 65%}.gallery h3{font-size:33px;line-height:1.12;margin:22px 0 12px}.gallery time{display:block;font-size:14px;color:var(--ink-muted)}.gallery p{font-size:16px;color:var(--ink-muted);margin-top:15px;max-width:500px}.closing{padding:85px 9%;display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:center}.closing p{margin-top:25px;color:var(--muted);font-size:17px}.button{display:inline-flex;align-items:center;gap:30px;background:var(--gold);color:var(--navy);padding:19px 22px;font-size:16px}.contact>p{font-size:14px}footer{border-top:1px solid var(--line);padding:28px 6%;display:flex;gap:25px;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px}.motion-toggle{font:inherit;border:1px solid var(--line);background:transparent;color:inherit;padding:12px;cursor:pointer;min-height:44px}.motion-toggle[hidden]{display:none}
@media(min-width:1700px){h1{font-size:90px}.hero{padding-left:9%}}
@media(max-width:760px){header{height:auto;min-height:105px;padding:16px 6% 8px;flex-wrap:wrap;gap:12px}.brand{font-size:25px}.brand>svg{width:24px;height:32px}.join{padding:10px 13px;font-size:13px;gap:18px}nav{order:3;width:100%;justify-content:space-between;gap:20px;font-size:13px}nav a{padding:10px 0}.hero{min-height:860px;padding:40px 7%;align-items:flex-start}.hero-copy{width:100%}h1{font-size:clamp(43px,11.8vw,62px)}h2{font-size:47px}.hero-copy p{font-size:16px;line-height:1.6;margin:22px 0 15px}.text-link{font-size:15px}.door-position{width:50%;right:10%;height:34%;top:auto;bottom:5%;max-height:none}.motion-ready .entrance{height:205svh}.motion-ready .hero{padding:35px 7%;min-height:0}.motion-ready .hero h1{font-size:clamp(40px,10.8vw,54px)}.motion-ready .hero-copy p{font-size:15px;margin:18px 0 10px}.motion-ready .door-position{height:38%;bottom:12%;width:46%;right:10%}.about{padding:65px 7%;grid-template-columns:1fr;gap:30px}.about .statement{font-size:34px}.about p+p{font-size:16px;line-height:1.65}.motion-ready .about{padding:40px 7%;gap:24px}.motion-ready .about h2{font-size:44px}.motion-ready .about .statement{font-size:32px}.activities{padding:60px 7%}.activities>h2{margin-bottom:30px}.activity-row{grid-template-columns:1fr 44px;gap:12px;padding:24px 0}.activity-row h3{font-size:30px}.activity-row p{grid-row:2;font-size:16px}.activity-row a{grid-column:2;grid-row:1/3}.launch{padding:65px 7%;grid-template-columns:1fr;gap:55px}.launch-intro h2{font-size:58px}.programme>h3{font-size:32px}summary{font-size:17px}.events{padding:65px 7%}.events>h2{margin-bottom:32px}.gallery{grid-template-columns:1fr;gap:44px}.gallery figure:nth-child(2){padding:0}.gallery img{height:420px}.gallery figure:nth-child(2) img{height:260px}.gallery h3{font-size:32px}.closing{padding:65px 7%;grid-template-columns:1fr;gap:30px}.closing p{margin-top:20px}.button{font-size:15px;gap:24px;padding:18px}.contact>p{font-size:14px}footer{padding:25px 7%;flex-wrap:wrap;font-size:12px}footer>span:first-child{width:100%}}
@media(max-height:650px){.motion-ready .hero h1{font-size:48px}.motion-ready .hero-copy p{font-size:15px}.motion-ready .about .statement{font-size:30px}.motion-ready .about{padding-top:25px;padding-bottom:25px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}.motion-ready .entrance{height:auto}.motion-ready .stage{position:relative;height:auto;overflow:visible}.motion-ready .hero,.motion-ready .about{position:relative;inset:auto;opacity:1!important;transform:none!important}.motion-ready .hero{min-height:680px}.motion-ready .about{background:var(--paper);pointer-events:auto}.door-position,.hero-copy{transform:none!important}.door-leaf{transform:none!important}}

.door-inscription{position:absolute;inset:0;display:grid;place-items:center;font-family:Caslon,Georgia,serif;font-size:24px;color:var(--ink);text-align:center}.motion-reduced{scroll-behavior:auto}

/* Supplied Durham gateway: retain its real silhouette and zoom towards the arch. */
.hero-copy{width:49%}.hero h1{font-size:clamp(50px,5vw,76px)}
.door-position{right:0;top:0;width:46%;height:100%;max-height:none;transform-origin:50% 74%}
.door{border:0;border-radius:0;background:var(--navy);perspective:none;box-shadow:none}
.gateway-photo{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 50%}
@media(max-width:760px){.hero{min-height:900px}.hero-copy{width:100%}.hero h1,.motion-ready .hero h1{font-size:clamp(40px,10.8vw,54px)}.door-position,.motion-ready .door-position{top:auto;bottom:0;right:0;width:100%;height:60%;max-height:none}.gateway-photo{object-position:50% 64%}.motion-ready .hero{padding-top:25px}.motion-ready .hero-copy p{font-size:15px;line-height:1.5;margin:15px 0 8px}}

/* Outline study: ordinary document flow while the visual direction is reviewed. */
.entrance{height:auto}.stage{position:static;height:auto;overflow:visible}.hero{min-height:660px;height:calc(100svh - 96px);max-height:850px;padding:60px 7%;isolation:isolate}.hero-copy{width:46%}.hero h1{font-size:clamp(48px,4.8vw,72px)}.hero-copy p{font-size:18px}.door-position{width:60%;height:100%;right:-3%;top:0;max-height:none;transform:none}.door{overflow:visible;background:transparent}.gateway-photo{object-fit:contain;object-position:center}.about{position:relative;opacity:1;pointer-events:auto;background:var(--paper)}
@media(max-width:760px){.hero{display:block;height:auto;max-height:none;min-height:0;padding:35px 7% 10px}.hero-copy{width:100%}.hero h1{font-size:clamp(40px,10.8vw,54px)}.hero-copy p{font-size:16px}.door-position{position:relative;inset:auto;width:116%;height:auto;aspect-ratio:3/2;margin:28px -8% 0}.door{height:100%}.gateway-photo{height:100%;object-fit:contain}.about{padding:60px 7%}}

.gateway-photo{mix-blend-mode:lighten}
.hero{overflow:hidden}

/* Cathedral study: keep the full silhouette inside the desktop viewport. */
@media(min-width:761px){.door-position{width:57%;right:0}}
.gateway-photo{mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent),linear-gradient(to bottom,transparent,#000 7%,#000 93%,transparent);mask-composite:intersect}

/* Palace Green composition: architecture left, copy right. */
@media(min-width:761px){.hero{padding-left:5%;padding-right:5%}.hero-copy{width:40%;margin-left:auto}.hero h1{font-size:clamp(43px,4.2vw,66px)}.door-position{left:0;right:auto;width:57%}}

/* Sparse vector study: architecture becomes a quiet background plane. */
.hero{background:var(--navy)}
.gateway-photo{mix-blend-mode:normal;mask-image:none;opacity:.42}
.door-position{pointer-events:none}
@media(min-width:761px){
.hero{min-height:720px;padding:70px 7%}
.hero-copy{width:48%;margin-left:auto}
.hero h1{font-size:clamp(48px,5vw,76px)}
.door-position{left:-13%;right:auto;top:12%;width:87%;height:100%;mask-image:linear-gradient(to right,#000 48%,transparent 91%)}
.gateway-photo{object-fit:contain;object-position:left bottom}
}
@media(max-width:760px){
.hero{padding-bottom:190px}
.hero-copy{margin-left:0}
.door-position{position:absolute;inset:auto auto -35px -22%;width:135%;height:360px;margin:0;aspect-ratio:auto;mask-image:linear-gradient(to bottom,transparent,#000 40%)}
.gateway-photo{opacity:.28;object-position:center bottom}
}

/* Medium-detail study with a shorter, more contained hero. */
@media(min-width:761px){
.hero{min-height:540px;height:calc(84svh - 96px);max-height:650px;padding:45px 7%}
.hero-copy{width:47%}
.hero h1{font-size:clamp(44px,4.5vw,66px)}
.hero-copy p{margin:22px 0 16px;font-size:17px}
.door-position{left:-8%;top:4%;width:76%;height:100%;mask-image:linear-gradient(to right,#000 55%,transparent 96%)}
.gateway-photo{opacity:.55}
}
@media(max-width:760px){
.hero{padding-top:28px;padding-bottom:155px}
.hero h1{font-size:clamp(38px,10vw,48px)}
.hero-copy p{margin:20px 0 14px}
.door-position{left:-12%;bottom:-27px;width:120%;height:290px}
.gateway-photo{opacity:.4}
}
@media(min-width:761px){.door-position{top:-7%}}
@media(max-width:760px){.door-position{bottom:0}}
/* User placement correction: wording left, Cathedral background right. */
@media(min-width:761px){.hero-copy{margin-left:0;margin-right:auto}.door-position{left:auto;right:-10%;mask-image:linear-gradient(to right,transparent 4%,#000 48%)}}

/* Homepage 3D render layout study. */
.hero{background:#243a47}
.gateway-photo{opacity:1;mix-blend-mode:normal;object-fit:contain;mask-image:linear-gradient(to right,transparent,#000 7%,#000 94%,transparent),linear-gradient(to bottom,transparent,#000 8%,#000 93%,transparent);mask-composite:intersect}
@media(min-width:761px){
.hero{min-height:480px;height:calc(100svh - 96px);max-height:660px;padding:40px 6%}
.hero-copy{width:44%}
.hero h1{font-size:clamp(44px,4.7vw,68px)}
.door-position{left:auto;right:-2%;top:0;width:62%;height:100%;mask-image:linear-gradient(to right,transparent,#000 12%)}
}
@media(max-width:760px){
.hero{padding:30px 7% 0}
.door-position{position:relative;inset:auto;width:116%;height:auto;aspect-ratio:11/8;margin:12px -8% 0;mask-image:none}
.gateway-photo{height:100%}
}

/* Centre the render within its available space at every viewport. */
.gateway-photo{object-position:center}

/* Gold architectural study, with the heading retained on the left. */
.hero{background:var(--navy)}
.gateway-photo{mix-blend-mode:lighten;opacity:1}

/* Interactive gold model, retaining the still as a loading/error fallback. */
.door-position{pointer-events:auto;mask-image:none}
#cathedral-model{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;--poster-color:transparent;touch-action:pan-y}
.model-ready #cathedral-model{opacity:1;pointer-events:auto}
.model-ready .gateway-photo{visibility:hidden}
.model-controls{position:absolute;bottom:12px;left:15%;right:8%;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:13px;color:#b8c6cc;z-index:2}
.model-controls[hidden]{display:none}
.model-controls button{font:inherit;background:transparent;border:1px solid #d1bf9466;color:var(--cream);min-height:44px;padding:10px 14px;cursor:pointer}
@media(max-width:760px){.model-controls{bottom:0;left:9%;right:9%;font-size:12px}.door-position{margin-bottom:38px}}

/* Larger Cathedral with room around the fixed heading. */
@media(min-width:761px){
.hero-copy{width:39%}
.hero h1{font-size:clamp(42px,4.3vw,62px)}
.door-position{width:68%;right:-4%}
}
@media(max-width:760px){
.door-position{aspect-ratio:1.2;margin-top:0}
}
