:root { --navy:#002366; --deep:#00133a; --gold:#ffd500; --ink:#0a1728; --paper:#f7f4ea; --line:#d8dfeb; --white:#fff; font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); line-height:1.55; background:var(--paper); }
a { color:inherit; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline:3px solid var(--gold); outline-offset:3px; }
.header-cta:focus-visible, .button:focus-visible { outline-color:var(--deep); }
.skip-link { position:absolute; left:-9999px; }
.skip-link:focus { left:1rem; top:1rem; z-index:10; background:var(--gold); color:var(--deep); padding:.7rem 1rem; }
.site-header { background:var(--deep); color:var(--white); position:sticky; top:0; z-index:5; }
.nav-shell { max-width:1200px; min-height:78px; padding:10px 24px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; font-size:.85rem; line-height:1.05; white-space:nowrap; }
.brand img { width:48px; height:48px; object-fit:contain; }
.brand strong { display:block; font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; }
nav { display:flex; align-items:center; gap:19px; font-size:.9rem; }
nav a { text-decoration:none; color:rgba(255,255,255,.86); }
nav a:hover, nav a:focus-visible { color:var(--gold); }
.menu-toggle { display:none; min-height:38px; padding:8px 12px; border:1px solid var(--gold); border-radius:4px; background:transparent; color:var(--white); font:inherit; font-size:.85rem; font-weight:800; cursor:pointer; }
.header-cta, .button { display:inline-flex; justify-content:center; align-items:center; min-height:44px; padding:10px 18px; border-radius:4px; border:1px solid var(--gold); background:var(--gold); color:var(--deep); font-weight:800; text-decoration:none; }
.header-cta { min-height:38px; padding:8px 13px; font-size:.85rem; }
.button.secondary { background:transparent; color:var(--white); }
.programme-hero { background:linear-gradient(105deg,rgba(0,19,58,.96),rgba(0,35,102,.87)),var(--hero-image) center/cover; color:var(--white); padding:76px 24px 64px; }
.hero-inner, .container { max-width:1120px; margin:auto; }
.breadcrumb { display:inline-block; margin-bottom:26px; color:#d8e5ff; font-size:.9rem; }
.eyebrow { margin:0 0 12px; color:var(--gold); font-weight:800; text-transform:uppercase; letter-spacing:.08em; font-size:.77rem; }
h1 { max-width:900px; margin:0; font-size:clamp(2.35rem,5vw,4.4rem); line-height:1.04; letter-spacing:0; }
.hero-tagline { max-width:730px; margin:20px 0 0; font-size:1.18rem; }
.hero-copy { max-width:720px; margin:18px 0 28px; color:rgba(255,255,255,.88); }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.section { padding:64px 24px; }
.section.white { background:var(--white); }
.section.navy { background:var(--navy); color:var(--white); }
h2 { font-size:clamp(1.6rem,3vw,2.35rem); margin:0 0 14px; line-height:1.14; }
h3 { margin:0 0 8px; font-size:1.1rem; }
.lead { max-width:760px; margin:0 0 30px; color:#3d4a5c; }
.grid { display:grid; gap:20px; }
.facts { grid-template-columns:repeat(3,1fr); }
.fact { background:var(--white); padding:20px; border:1px solid var(--line); border-radius:6px; }
.fact dt { color:var(--navy); font-size:.76rem; text-transform:uppercase; letter-spacing:.08em; font-weight:850; }
.fact dd { margin:6px 0 0; font-weight:650; }
.two-col { grid-template-columns:1.15fr .85fr; align-items:start; }
.two-col > div { min-width:0; }
.programme-feature { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); align-items:center; gap:clamp(28px,5vw,72px); }
.feature-media { margin:0; }
.feature-media img { display:block; width:100%; aspect-ratio:3/4; object-fit:contain; background:var(--paper); border-radius:6px; box-shadow:0 20px 50px rgba(0,19,58,.18); }
.feature-copy { max-width:620px; }
.feature-copy .button { margin-top:12px; }
.list-card { background:var(--paper); border-left:4px solid var(--gold); padding:26px; }
.list { margin:0; padding:0; list-style:none; display:grid; gap:11px; }
.list li { position:relative; padding-left:20px; }
.list li::before { content:""; width:7px; height:7px; background:var(--gold); border-radius:50%; position:absolute; left:0; top:.56em; }
.learning { grid-template-columns:repeat(2,1fr); }
.learning article { background:var(--white); border:1px solid var(--line); padding:22px; border-radius:6px; }
.learning p { margin:0; color:#435166; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:25px; }
.step { border-top:3px solid var(--gold); padding-top:13px; color:#dce7ff; }
.step strong { display:block; color:var(--white); margin-bottom:5px; }
.faq { border-top:1px solid var(--line); }
details { border-bottom:1px solid var(--line); padding:15px 0; }
summary { cursor:pointer; font-weight:750; color:var(--navy); }
details p { max-width:800px; margin:10px 0 0; }
.cta-panel { max-width:1120px; margin:auto; padding:38px; background:var(--gold); color:var(--deep); display:flex; align-items:center; justify-content:space-between; gap:28px; }
.cta-panel h2 { margin:0; }
.cta-panel p { margin:8px 0 0; }
.cta-panel .button { background:var(--deep); color:var(--white); border-color:var(--deep); white-space:nowrap; }
footer { background:var(--deep); color:rgba(255,255,255,.82); padding:35px 24px; display:flex; gap:24px; align-items:center; justify-content:center; flex-wrap:wrap; font-size:.9rem; }
footer div { display:flex; align-items:center; gap:10px; } footer img { width:38px; height:38px; object-fit:contain; } footer p { margin:0; } footer a { color:var(--gold); }
@media (max-width:1180px) { .nav-shell { min-height:64px; padding:8px 16px; position:relative; gap:12px; } nav { display:none; position:absolute; top:100%; left:0; right:0; padding:10px 20px 18px; background:var(--deep); border-top:1px solid rgba(255,255,255,.16); box-shadow:0 16px 28px rgba(0,0,0,.24); } .nav-shell.menu-open nav { display:grid; gap:2px; } nav a { display:block; padding:12px 0; } .header-cta { min-height:44px; margin-left:auto; } .menu-toggle { display:inline-flex; align-items:center; min-height:44px; } }
@media (max-width:850px) { .facts,.two-col,.learning,.steps,.programme-feature { grid-template-columns:1fr; } .programme-hero { padding:58px 20px 48px; } .section { padding:48px 20px; } .cta-panel { margin:0 20px; padding:28px; display:block; } .cta-panel .button { margin-top:20px; } .feature-media { max-width:440px; } }
@media (max-width:540px) { .brand span { display:none; } .header-cta { padding:8px 10px; } .hero-actions .button { width:100%; } .cta-panel { margin:0; } }