/* Scoped landing-page additions. Existing KYD and SLPP styling is untouched. */
:root{--text-orange:#945200;--text-coral:#ae3015}
html{scroll-padding-top:110px}
section[id]{scroll-margin-top:110px}
.hero--fyp{grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);min-height:650px}
.hero--fyp .hero__panel{padding:70px 48px 66px max(var(--gutter),calc((100vw - var(--wrap))/2));min-width:0;background:linear-gradient(125deg,#f6af43,#f38d00 65%,#ef8b47);color:var(--ink)}
/* Apply the page gutter once, to the panel, not inside an auto-aligned
   fixed-width copy box. The old combination squeezed copy on wide screens. */
.hero--fyp .hero__copy{width:100%;max-width:none;min-width:0;margin:0;padding:0}
.hero--fyp h1{font-size:clamp(3.3rem,5.6vw,5.7rem);letter-spacing:-.025em;color:var(--ink);max-width:100%;line-height:1.02}
.hero--fyp .kicker,.hero--fyp .sub,.hero--fyp .lead{color:var(--ink);opacity:1}
.hero--fyp .sub{font-size:clamp(1.3rem,2vw,1.7rem);font-style:normal;max-width:25ch}
.hero--fyp .lead{font-size:1.1rem;line-height:1.7}
.hero--fyp .btn--outline{border-color:var(--ink);color:var(--ink)}
.hero--fyp .hero-note{font-size:.88rem;margin:20px 0 0;font-weight:600}
.hero--fyp .facts{font-size:.92rem;gap:8px}
.hero--fyp .facts li{display:block}
.hero__media--fyp{background-color:#eae6dc;padding:46px 36px}
.workbook-figure{margin:0;max-width:400px;width:100%;text-align:center}
.book-wrap{width:78%;max-width:300px;margin:0 auto;border-left:6px solid #c7c2b6;box-shadow:12px 18px 28px #1c12512b;transform:rotate(3deg)}
.book-wrap img{width:100%;height:auto}
.workbook-figure figcaption{max-width:27ch;margin:28px auto 0;font-size:.86rem;line-height:1.6;color:var(--ink2)}
.steady-steps{display:flex;justify-content:space-around;gap:12px;margin-block:0;flex-wrap:wrap;font-family:'IBM Plex Mono',monospace;font-size:.9rem;letter-spacing:.08em;padding-block:9px}
.approach{background:var(--ink);color:#fff}
.approach .kicker,.approach .step{color:var(--amber)}
.approach .cols3 li{background:#2a2160;backdrop-filter:none;border-color:#71678d}
.approach .cols3 p{color:#eeebf5}
.modules-section{background:#f1ece3;padding-top:76px}
.mod h4{font-size:1.1rem;line-height:1.35}
.mod .mod__k{color:var(--text-coral);font-size:.73rem;margin-bottom:6px}
.phaseblock__h{font-size:1.6rem}
.who-section{background:#e8e1d4}
.who-section p{max-width:44ch}
.price-section{background:#f1ece3}
.price-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:32px}
.price-card{display:flex;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid #c7c1ce;border-radius:20px;padding:36px}
.price-card--live{border:2px solid var(--ink);box-shadow:7px 7px 0 var(--orange)}
.price-card h3{font-size:2rem}
.price{font-family:'Fraunces',Georgia,serif;font-size:3.5rem;font-weight:600;line-height:1.1;margin:16px 0}
.price span{display:block;font-family:'Manrope',sans-serif;font-size:.9rem;font-weight:500;margin-top:12px;color:var(--muted)}
.price-card ul{padding-left:22px;display:grid;gap:12px;margin-bottom:30px}
.price-card .btn{margin-top:auto}
.price-card .small{margin-top:0}
.fyp-pathway{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;padding:0;gap:12px;margin:32px 0 24px}
.fyp-pathway li{border-top:3px solid #b5adbd;background:#f1ece3;padding:22px 18px}
.fyp-pathway li.current{background:var(--ink);border-color:var(--orange);color:#fff}
.fyp-pathway span{display:block;font-family:'IBM Plex Mono',monospace;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:18px}
.fyp-pathway h3,.fyp-pathway a{font-family:'Fraunces',Georgia,serif;font-size:1.2rem;line-height:1.3;font-weight:600;color:inherit}
.fyp-pathway h3{margin:0}
.fyp-pathway p{font-size:.9rem;line-height:1.65;margin-bottom:0}
.register .form-card .btn{white-space:normal;text-align:center}
.form-card .small{font-size:.88rem;line-height:1.7}
.ctac{color:var(--ink)}
.ctac h2,.ctac p{color:var(--ink)}
.on-orange :focus-visible{outline-color:var(--ink)}
.on-dark :focus-visible{outline-color:var(--amber)}
.form-card :focus-visible{outline-color:var(--ink)}
.nav a,.ftr a{min-height:28px;display:inline-block}
.faq__item summary{min-height:64px}
.no-js .nav-toggle{display:none}
@media(max-width:1100px){.hero--fyp .hero__panel{padding:52px 28px}.hero--fyp .btn-row{gap:10px}.hero--fyp .btn{font-size:.92rem}}
@media(max-width:960px){
 html{scroll-padding-top:20px}section[id]{scroll-margin-top:20px}
 .hero--fyp{grid-template-columns:minmax(0,1fr)}.hero--fyp .hero__panel{padding:44px var(--gutter) 48px}.hero--fyp .hero__copy{margin:0;width:100%}
 .hero--fyp h1{max-width:100%;font-size:clamp(3.3rem,10vw,5.6rem)}
 .hero--fyp .hero__media{order:0;padding:38px var(--gutter)}
 .book-wrap{max-width:190px}.workbook-figure figcaption{margin-top:22px}
 .hero--fyp .lead,.hero--fyp .sub{max-width:45ch}
 .fyp-pathway{grid-template-columns:repeat(2,minmax(0,1fr))}
 .no-js .nav{position:static;display:block;border:0}.no-js .mast__in{flex-wrap:wrap}.no-js .nav ul{flex-direction:row;flex-wrap:wrap}.no-js .mast__bar{flex-wrap:wrap}
}
@media(max-width:640px){
 .price-grid{grid-template-columns:minmax(0,1fr)}.price-card{padding:28px 22px}.price-card--live{box-shadow:5px 5px 0 var(--orange)}
 .fyp-pathway{grid-template-columns:minmax(0,1fr)}.fyp-pathway li{padding:22px}.fyp-pathway span{margin-bottom:10px}
 .steady-steps{font-size:.74rem;gap:14px;letter-spacing:0}
 .hero--fyp .btn-row{align-items:stretch;flex-direction:column}.hero--fyp .btn-row .btn{justify-content:center}
 .hero--fyp .kicker{font-size:.65rem;letter-spacing:.12em}.hero--fyp h1{font-size:clamp(3rem,13vw,4.5rem)}
 .phaseblock{padding:18px 14px}.mod{padding:14px 10px;gap:12px}.mod__n{width:30px;height:30px}
}
@media(prefers-reduced-motion:reduce){.book-wrap{transform:none}.progress{display:none}}

.form-card a.btn--violet,.form-card a.btn--violet:hover{color:#fff}

/* Intrinsic grid/flex sizing must never force cards or long links wider than
   their track. These page-local rules leave KYD and SLPP untouched. */
:is(.hero--fyp,.intro__cols,.cols3,.cols,.modules,.mods,.factsgrid,.price-grid,.fyp-pathway,.register__in,.faq,.ftr__top)>*{min-width:0}
.mod>div,.faq__item summary h3{min-width:0}
:is(.hero__copy,.col,.cols3 li,.mod,.factsgrid li,.price-card,.fyp-pathway li,.form-card,.faq__a,.ftr){overflow-wrap:anywhere}
.btn{max-width:100%;white-space:normal;text-align:center;justify-content:center}
.topbar a{display:inline-block;min-height:24px}
.intro__cols{grid-template-columns:repeat(2,minmax(0,1fr))}
.cols3,.factsgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
.cols{grid-template-columns:repeat(4,minmax(0,1fr))}
.mods{grid-template-columns:repeat(2,minmax(0,1fr))}
.register__in{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
.faq{grid-template-columns:minmax(0,280px) minmax(0,1fr)}
.ftr__top{grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr))}
@media(max-width:1100px){.cols,.fyp-pathway{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:960px){
 .intro__cols,.register__in,.faq,.cols3{grid-template-columns:minmax(0,1fr)}
 .factsgrid,.ftr__top{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:800px){.price-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:767px){.mods{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){
 .cols,.factsgrid,.fyp-pathway,.ftr__top{grid-template-columns:minmax(0,1fr)}
 .mast__in{gap:10px}.mast__logo{min-width:0;flex:1}.mast__bar{flex:none}
 .mast__logo .logo{max-width:100%;height:auto;max-height:44px}
 .nav a{min-height:44px}
}

/* The third item in the Steady phase uses the available row, without an empty half-card. */
.mods>.mod:last-child:nth-child(odd){grid-column:1 / -1}

/* Keep navigation visible and within the page if JavaScript is unavailable. */
@media(max-width:960px){
 .no-js .mast__bar{flex:1 1 100%;width:100%;max-width:100%;min-width:0}
 .no-js .mast__logo{padding-top:12px}
 .no-js .nav{width:100%;padding-inline:0}
}
/* Teaser video band (KYD pattern) */
.fyp-teaser{background:var(--ink);color:var(--paper);padding:72px 0}
.fyp-teaser__in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;align-items:center}
.fyp-teaser .kicker{color:var(--orange)}.fyp-teaser .secttl{color:#fff;margin:0}
.fyp-teaser .teaser{max-width:760px;justify-self:end}
.fyp-teaser .teaser video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#1C1251;border-radius:18px;box-shadow:12px 12px 0 var(--orange)}
.fyp-teaser .teaser figcaption{display:flex;flex-direction:column;gap:8px;margin-top:18px;color:var(--paper);font-size:.95rem}
.fyp-teaser .transcript summary{color:var(--orange);cursor:pointer}
.fyp-teaser .transcript summary:hover{color:#FFB749}
.fyp-teaser :focus-visible{outline:3px solid var(--orange);outline-offset:3px}
@media(max-width:960px){.fyp-teaser{padding:48px 0}.fyp-teaser__in{grid-template-columns:minmax(0,1fr);gap:24px}.fyp-teaser .teaser{justify-self:stretch;max-width:none}.fyp-teaser .teaser video{box-shadow:8px 8px 0 var(--orange);border-radius:14px}}
/* Page animations: reuses the SLPP (styles.css + main.js) reveal, stagger and hero-fade pattern. Only active once JS adds .fyp-anim, so content stays visible without JS. Transforms and opacity only, no layout shift. */
.fyp-anim .reveal{opacity:0;transform:translateY(32px);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1)}
.fyp-anim .reveal.is-in{opacity:1;transform:none}
.fyp-anim .stagger>*{opacity:0;transform:translateY(36px);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1)}
.fyp-anim .stagger.is-in>*{opacity:1;transform:none}
.fyp-anim .stagger.is-in>*:nth-child(2){transition-delay:.1s}
.fyp-anim .stagger.is-in>*:nth-child(3){transition-delay:.2s}
.fyp-anim .stagger.is-in>*:nth-child(4){transition-delay:.3s}
.fyp-anim .stagger.is-in>*:nth-child(5){transition-delay:.4s}
.fyp-anim .hero-fade{opacity:0;transform:translateY(18px);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1);transition-delay:var(--d,.1s)}
.fyp-anim .is-in .hero-fade{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.fyp-anim .reveal,.fyp-anim .stagger>*,.fyp-anim .hero-fade{opacity:1!important;transform:none!important;transition:none!important}}
@media print{.fyp-anim .reveal,.fyp-anim .stagger>*,.fyp-anim .hero-fade{opacity:1;transform:none}}
.fyp-anim .hf1{--d:.05s}.fyp-anim .hf2{--d:.12s}.fyp-anim .hf3{--d:.2s}.fyp-anim .hf4{--d:.28s}.fyp-anim .hf5{--d:.36s}.fyp-anim .hf6{--d:.44s}.fyp-anim .hf7{--d:.52s}.fyp-anim .hf8{--d:.6s}.fyp-anim .hf9{--d:.3s}

/* Finding Your Purpose: Ripple and Horizon. Programme-local accents only. */
:root{--paper:#F2F7F6;--ink:#0B3C49;--ink2:#164B56;--muted:#365E65;--text-orange:#1E7369;--text-coral:#AD3D1C;--amber:#FFB749;--focus:#0B3C49;--focus-inv:#FFB749;--line:#B3C9C7}
[hidden]{display:none!important}
.mast{background:rgba(242,247,246,.96)}
.hero--fyp .hero__panel{background:linear-gradient(125deg,#F2F7F6,#EAF4F2);color:var(--ink)}
.hero--fyp h1{font-size:clamp(3.3rem,5.4vw,5.3rem)}
.hero--fyp .kicker{color:var(--text-orange)}
.hero__media--fyp{background:radial-gradient(ellipse at 100% 100%,#7FC8C04D,transparent 65%),repeating-radial-gradient(ellipse at 90% 95%,transparent 0 55px,#1E736918 56px 57px),#EAF4F2}
.book-wrap{border-left-color:#1E7369;box-shadow:12px 18px 28px #0B3C492B}
.stepsband{border-color:#1E7369}.approach{background:#0B3C49}.approach .standfirst,.approach h3,.approach .secttl{color:#fff}
.approach .cols3 li{background:#164B56;border-color:#7FC8C0}.approach .cols3 p{color:#F2F7F6}
.modules-section,.price-section{background:#EAF4F2}.who-section{background:#DEEEEA}.safety-section{background:#EAF4F2}
.phaseblock{background:#F2F7F6}.mod{background:#fff}.mod__n{background:#0B3C49;color:#fff}
.price-card--live{box-shadow:7px 7px 0 #7FC8C0}.ctac{background:#DEEEEA}
.ctac h2,.ctac p{color:var(--ink)}
.register__aside p{color:#EAF4F2}.register .kicker{color:#FFB749}.ftr{color:#EAF4F2}.ftr__top a{color:#EAF4F2}
.form-card{box-shadow:12px 12px 0 #7FC8C0}.form-card a:not(.btn){color:#1E7369}
.fyp-teaser{background:#082A33}.fyp-teaser .kicker{color:#FFB749}.fyp-teaser .teaser img{border-radius:18px}
.on-mist :focus-visible{outline-color:#0B3C49}.on-dark :focus-visible{outline-color:#FFB749}.form-card :focus-visible{outline-color:#0B3C49}
.btn--violet:hover{background:#164B56}.hero .btn--violet:hover{background:#164B56}
@media(max-width:960px){.hero--fyp h1{font-size:clamp(3.3rem,10vw,5.6rem)}}
@media(max-width:640px){.hero--fyp h1{font-size:clamp(3rem,13vw,4.5rem)}.price-card--live{box-shadow:5px 5px 0 #7FC8C0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.btn:hover{transform:none}}

/* Keep the compact navigation CTA AA-compliant on hover. */
.btn--orange:hover{background:#FFB749;color:#0B3C49}

/* Hero teaser replaces the workbook cover. Keep its native 16:9 frame. */
.hero--fyp .hero__media--fyp-video{background:#082A33;padding:44px 36px;min-width:0;align-items:center}
.hero__media--fyp-video .teaser{max-width:760px;width:100%;min-width:0}
.hero__media--fyp-video video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:#082A33;border-radius:18px;box-shadow:10px 10px 0 #7FC8C0}
.hero__media--fyp-video .teaser figcaption{color:#F2F7F6;font-size:.95rem;line-height:1.6;margin-top:22px}
.hero__media--fyp-video .transcript summary{color:#FFB749;min-height:32px}
.hero__media--fyp-video .transcript div{background:#164B56}
.hero__media--fyp-video .transcript p{color:#F2F7F6}
.hero__media--fyp-video :focus-visible{outline:3px solid #FFB749;outline-offset:3px}
@media(max-width:960px){.hero--fyp .hero__media--fyp-video{order:0;padding:32px var(--gutter) 40px}.hero__media--fyp-video .teaser{max-width:none}.hero__media--fyp-video video{border-radius:14px;box-shadow:6px 6px 0 #7FC8C0}}