:root{--purple:#211451;--petrol:#127a7b;--coral:#ed7268;--mint:#d0e7d9;--teal:#8db0b1;--white:#fff;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--white);color:var(--purple);font:400 18px/1.6 Avenir,'Avenir Next',Arial,sans-serif;font-synthesis:none}button,input,textarea{font:inherit;color:inherit}a{color:inherit}button,a{touch-action:manipulation}button{cursor:pointer;background:none;border:0}button:disabled{cursor:default;opacity:.4}a:hover,button.inline-button:hover{text-decoration:underline;text-underline-offset:4px}:focus-visible{outline:3px solid var(--purple);outline-offset:5px}[hidden]{display:none!important}.wrap{width:min(1160px,calc(100% - 96px));margin-inline:auto}.site-header{height:120px;display:flex;align-items:center;justify-content:space-between}.brand{display:block;width:92px;height:126px}.brand img{display:block;width:100%;height:100%;object-fit:contain}.login{font-size:13px;text-decoration:none;padding:8px 0;border-bottom:1px solid var(--mint)}.login span{margin-left:20px}.story{border-top:1px solid var(--mint);overflow:hidden}.story-top{display:flex;justify-content:flex-end;padding-top:16px}.text-button{font-size:13px;padding:8px 0}.text-button span{margin-left:20px}.story-stage{position:relative;min-height:460px;padding-block:15px 36px}.scene{width:57%;min-height:405px;display:flex;align-items:center}.scene.active{animation:scene-in 500ms ease both}.scene h2{font-weight:400;font-size:clamp(48px,5.6vw,78px);line-height:1.08;letter-spacing:-.035em;margin:0 0 25px}.scene h2 span{color:var(--petrol)}.scene p{font-family:Avenir,'Avenir Next',Arial,sans-serif;font-weight:400;font-size:18px;line-height:1.75;margin:0}.button{display:inline-flex;justify-content:space-between;align-items:center;gap:35px;padding:13px 22px;border:1px solid var(--petrol);background:var(--petrol);color:var(--white);font-size:15px;text-decoration:none}.button:hover{background:var(--purple);border-color:var(--purple);text-decoration:none}.scene .button{margin-top:25px}.programme-art{position:absolute;right:0;top:0;bottom:24px;width:41%;display:flex;align-items:center;margin:0}.programme-canvas{width:100%;position:relative;aspect-ratio:500/440}.house-field{display:block;width:100%;height:100%;overflow:visible;opacity:1;transition:opacity 450ms ease 150ms}.home{opacity:1;transform-origin:0 0;transition:transform 1250ms cubic-bezier(.22,.7,.2,1),opacity 450ms ease;animation:house-in 700ms ease var(--enter-delay) both}.programme-logo{position:absolute;left:50%;top:46%;width:auto;height:88%;max-width:94%;object-fit:contain;transform:translate(-50%,-50%);opacity:0;visibility:hidden;transition:opacity 280ms ease,visibility 0s linear 280ms}.story[data-scene="5"] .house-field{opacity:0;transition:opacity 700ms ease 1800ms}.story[data-scene="5"] .programme-logo{opacity:1;visibility:visible;transition:opacity 850ms ease 1550ms,visibility 0s linear 1550ms}.story-bottom{display:flex;justify-content:space-between;gap:30px;align-items:center;border-top:1px solid var(--mint);padding-block:15px 20px}.story-progress{display:flex;gap:12px;width:440px;max-width:60%}.step{flex:1;min-width:0;padding:10px 0;text-align:left;font-size:11px}.step i{display:block;height:2px;background:var(--teal);opacity:.55;margin-top:8px}.step.current i{height:3px;background:var(--petrol);opacity:1}.step.current span{color:var(--petrol);font-weight:600}.story-controls{display:flex;align-items:center;gap:10px}.story-controls button{width:44px;height:44px;border:1px solid var(--teal);border-radius:50%;font-size:19px}.story-controls button:hover:not(:disabled){background:var(--mint)}.story-controls #play{width:75px;font-size:13px;border:0;border-radius:0}.intro{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;padding-block:96px}.practice-photo{margin:0}.practice-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2}.intro h2,.contact h2{font-size:42px;line-height:1.18;font-weight:400;letter-spacing:-.02em;margin:0 0 24px}.intro-copy p{margin:0 0 22px}.lead{font-family:Avenir,'Avenir Next',Arial,sans-serif;font-size:20px;line-height:1.7;font-weight:400}.benefits{padding-left:19px;margin:0;font-size:16px}.benefits li{padding-left:5px;margin-top:10px}.benefits li::marker{color:var(--petrol)}.contact{background:var(--mint);padding-block:76px 82px}.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:100px}.contact h2{font-size:46px}.contact p{font-size:16px;max-width:400px}.direct-contact{margin-top:32px}.direct-contact a{text-decoration:none;border-bottom:1px solid var(--petrol);padding-bottom:5px}.direct-contact span{padding-left:15px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}form label{display:block;font-size:14px;margin-bottom:21px}.required{color:var(--purple)}.optional{font-size:12px}input,textarea{display:block;margin-top:7px;background:var(--white);border:1px solid var(--teal);width:100%;border-radius:0;padding:11px;font-size:17px}textarea{resize:vertical;min-height:110px}.privacy-hint{font-size:12px!important;line-height:1.6;max-width:none!important;margin-top:0;margin-bottom:22px}.inline-button{padding:0;text-decoration:underline;text-underline-offset:3px;font-size:inherit}.honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.confirmation{padding-top:15px}.confirmation h3{font-size:35px;line-height:1.2;font-weight:400;margin:0 0 22px}#form-error{border-left:3px solid var(--purple);padding-left:15px;font-size:14px;max-width:none;margin:0 0 20px}form[aria-busy=true] .button{opacity:.6}.form-panel .inline-button{font-size:13px}footer{padding-block:28px;display:flex;gap:24px;align-items:center;font-size:12px}.footer-attribution{display:flex;gap:10px;align-items:center;flex:1;margin:0}.footer-attribution span{white-space:nowrap}.footer-attribution a{display:inline-flex;flex-shrink:0}.footer-attribution img{display:block;width:100px;height:auto}footer nav{display:flex;gap:25px}footer nav a{text-decoration:none}footer nav button{padding:0;font-size:12px}dialog{width:min(590px,calc(100% - 36px));max-height:85vh;overflow:auto;padding:40px;border:1px solid var(--teal);color:var(--purple);background:var(--white)}dialog::backdrop{background:rgb(33 20 81 / .4)}dialog h2{font-size:32px;line-height:1.2;font-weight:400;margin:0 0 22px}dialog p{font-size:15px;overflow-wrap:anywhere}.dialog-close{position:absolute;right:14px;top:7px;font-size:30px}.dialog-dismiss{margin-top:15px}.sr-only,.skip-link:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link:focus{position:fixed;z-index:100;background:var(--white);padding:12px}.intro:focus:not(:focus-visible){outline:none}@keyframes scene-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes house-in{from{opacity:0}to{opacity:1}}
@media(max-width:950px){.wrap{width:calc(100% - 64px)}.scene h2{font-size:57px}.scene p{font-size:17px}.intro{gap:40px}.contact-grid{gap:50px}.contact h2{font-size:40px}}
@media(max-width:650px){.wrap{width:calc(100% - 40px)}.site-header{height:104px}.brand{width:76px;height:102px}.login{font-size:12px}.login span{margin-left:10px}.story-top{padding-top:7px}.text-button{font-size:12px}.story-stage{min-height:0;display:flex;flex-direction:column;gap:20px;padding-block:20px}.scene{min-height:232px;display:block;width:100%}.scene h2{font-size:clamp(38px,10.4vw,57px);line-height:1.1;margin-bottom:20px}.scene p{font-size:16px;line-height:1.65}.scene .button{padding:11px 18px;margin-top:18px}.programme-art{position:relative;inset:auto;width:100%}.programme-canvas{width:270px;max-width:100%;height:235px;aspect-ratio:auto;margin-left:auto}.story-bottom{flex-wrap:wrap;gap:5px;padding-block:7px 17px}.story-progress{flex-basis:100%;max-width:none;width:auto;gap:12px}.step{min-height:44px}.story-controls{margin-left:auto}.intro{grid-template-columns:1fr;gap:30px;padding-block:56px}.intro h2,.contact h2{font-size:36px;margin-bottom:22px}.lead{font-size:18px}.intro-copy p,.benefits{font-size:15px}.intro-copy .lead{font-size:18px}.contact{padding-block:50px 55px}.contact-grid{grid-template-columns:1fr;gap:30px}.contact p{font-size:15px}.direct-contact{margin-top:23px}.form-row{grid-template-columns:1fr;gap:0}.form-panel label{margin-bottom:18px}footer{flex-wrap:wrap;gap:20px;font-size:11px}.footer-attribution{flex-basis:100%}.footer-attribution img{width:90px}footer nav{width:100%;justify-content:space-between}dialog{padding:35px 24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Supplied logo: retain the complete image and its original proportions. */
.brand{width:160px;height:144px}.brand img{transform:translateY(7px)}
@media(max-width:650px){.brand{width:132px;height:120px}.brand img{transform:translateY(6px)}}

/* Use installed Avenir; webfont embedding can be added when supplied. */
.scene h2{font-family:Avenir,'Avenir Next',Arial,sans-serif;font-weight:700;font-size:clamp(44px,5.2vw,72px);line-height:1.12;letter-spacing:-.025em;font-synthesis:none}
.intro h2,.contact h2,.confirmation h3,dialog h2{font-family:Avenir,'Avenir Next',Arial,sans-serif;font-weight:500;letter-spacing:-.015em;font-synthesis:none}
.scene p,.lead{font-family:Avenir,'Avenir Next',Arial,sans-serif;font-weight:400;font-synthesis:none}
.scene p{font-size:22px;line-height:1.5}.lead{font-size:23px;line-height:1.5}
@media(max-width:950px) and (min-width:651px){.scene h2{font-size:53px}}
@media(max-width:650px){.scene h2{font-size:clamp(36px,9.9vw,55px)}.scene p{font-size:20px}.intro-copy .lead{font-size:21px}}

/* Avenir throughout, including controls and form fields. */
a,button,form label,.optional,footer,.text-button,.step.current span{font-weight:500}
input,textarea{font-weight:400}

/* The houses settle into the supplied logo; the logo artwork stays intact. */
.home path{transition:fill 1200ms ease}
.story[data-scene="5"] .home{animation:none;transition:transform 1600ms cubic-bezier(.22,1.12,.3,1) var(--morph-delay),opacity 600ms ease 900ms}
.story[data-scene="5"] .home.is-extra{opacity:0}
.story[data-scene="5"] .home path{fill:var(--logo-color)}
.story[data-scene="5"] .house-body{transform-origin:17px 21px;animation:logo-settle 1600ms ease var(--morph-delay) both}
@keyframes logo-settle{0%,100%{transform:translateY(0) rotate(0)}35%{transform:translateY(-9px) rotate(-5deg)}70%{transform:translateY(3px) rotate(2deg)}}

/* Coral accents in the opening story, using the existing Rytm palette. */
.story[data-scene="1"] .scene h2 span,.story[data-scene="4"] .scene h2 span,.story[data-scene="5"] .scene h2 span{color:var(--coral)}
