/* PGP page, Scaler-style draft (school/pgp-v2.html). Layout patterns from scaler.com, in Bversity's teal palette. */
.v2{--navy:#04211E; --navy-2:#0A3A35; --blue:#0E7C72; --blue-2:#17A595; --pale:#E3F4F0; --line:#DCE5E3; --mut:#55625F;
  --f2:'Plus Jakarta Sans',Inter,system-ui,sans-serif}
.v2 main{background:#fff; color:#0B1D1A; font-family:var(--f2)}
.v2 main h1,.v2 main h2,.v2 main h3{font-family:var(--f2)}
.ph{background:#FFF1A8; color:#5A4500; padding:0 4px; border-radius:2px; box-shadow:0 0 0 1px #F2D35A inset}
.v2-draft{margin:0; padding:10px 16px; text-align:center; font-size:.86rem; background:#FFF8D6; color:#5A4500; border-bottom:1px solid #F2D35A}

/* labels, buttons */
.v2-lk{font-size:.74rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--mut); margin:0}
.v2-lk.lt{color:#9FD9CF}
.v2-lk.center{text-align:center}
.v2 .v2-btn{display:inline-flex; align-items:center; justify-content:center; height:46px; padding:0 26px; border-radius:0; font:700 .78rem var(--f2); letter-spacing:.14em; text-transform:uppercase; cursor:pointer; border:1px solid transparent; transition:background .2s, color .2s}
.v2-btn-b{background:var(--blue); color:#fff} .v2-btn-b:hover{background:#0A5F57}
.v2-btn-o{background:#fff; color:var(--navy); border-color:var(--navy)} .v2-btn-o:hover{background:var(--pale)}
.v2-btn-w{background:#fff; color:var(--navy)} .v2-btn-w:hover{background:var(--pale)}

/* hero */
.v2-hero{padding:64px 0 40px; text-align:center; background:radial-gradient(1200px 380px at 50% 0,#EAF7F4,#fff 70%)}
.v2-kick{font-size:.8rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--blue); margin:0}
.v2-hero h1{font-size:clamp(2.2rem,4.8vw,4rem); line-height:1.08; letter-spacing:-.035em; font-weight:700; color:var(--navy); margin:18px auto 0; max-width:21ch}
.v2-box{display:inline-block; background:var(--pale); padding:0 .18em; border-radius:4px}
.v2-grad{background:linear-gradient(90deg,#0E7C72,#2BB3A3); -webkit-background-clip:text; background-clip:text; color:transparent}
.v2-sub{color:#2B3A37; font-size:1.05rem; line-height:1.6; margin:22px auto 0; max-width:62ch}
.v2-hero .v2-lk.center{margin-top:26px}
.v2-chips{display:flex; flex-wrap:wrap; justify-content:center; gap:8px 22px; margin-top:12px; font-size:.92rem; color:#2B3A37}
.v2-ctas{display:flex; flex-wrap:wrap; justify-content:center; gap:14px; margin-top:28px}
.v2-ctas.left{justify-content:flex-start}
.v2-video{margin-top:48px}
.v2-video .yt-player{position:relative; aspect-ratio:16/9; max-width:1000px; margin:0 auto; overflow:hidden; background:#0B1D1A}
.v2-video .yt-player img,.v2-story .yt-player img{width:100%; height:100%; object-fit:cover; display:block}
.v2 .yt-play{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:68px; height:68px; border:0; border-radius:50%; background:rgba(255,255,255,.92); color:var(--navy); display:grid; place-items:center; cursor:pointer}
.v2 .yt-play svg{width:26px; height:26px; margin-left:4px}

/* banner strip */
.v2-strip{display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin:36px 0 0; padding:16px 18px; border:1px solid #CFE7E2; background:linear-gradient(90deg,#EAF7F4,#fff 70%)}
.v2-strip p{margin:0; display:flex; align-items:center; gap:12px; font-weight:700; color:var(--navy); font-size:1.02rem}
.v2-ic{width:28px; height:28px; color:var(--blue-2); flex:none} .v2-ic svg{width:28px; height:28px}

/* why (dark) */
.v2-why{background:radial-gradient(900px 400px at 85% 100%,#0F6E64,var(--navy) 60%); color:#fff; padding:72px 0 56px; margin-top:56px}
.v2-why h2,.v2-sec h2{font-size:clamp(1.8rem,3.4vw,2.6rem); letter-spacing:-.03em; line-height:1.15; font-weight:700; margin-top:8px}
.v2-why h2{color:#fff}
.v2-p{margin:8px 0 0; color:var(--mut); font-size:1rem}
.v2-why .v2-p{color:#C9DDD9}
.v2-why-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:32px}
.v2-why-grid article{background:#fff; color:var(--navy); padding:22px; border:1px solid #2BB3A3; display:grid; gap:10px; align-content:start}
.v2-why-grid svg{width:30px; height:30px; color:var(--blue-2)}
.v2-why-grid h3{font-size:1.15rem; font-weight:700; letter-spacing:-.01em}
.v2-why-grid p{font-size:.88rem; line-height:1.55; color:#36504B; margin:0}
.v2-why-logos{display:flex; align-items:center; gap:24px; margin-top:34px; min-width:0}
.v2-why-logos > p{flex:none; margin:0; font-size:.88rem; color:#C9DDD9}
.v2-run{overflow:hidden; display:flex; min-width:0; width:100%; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.v2-run ul{display:flex; gap:10px; list-style:none; margin:0; padding:0 10px 0 0; animation:v2run 50s linear infinite; flex:none}
.v2-run li{height:44px; min-width:110px; padding:0 14px; background:#fff; display:flex; align-items:center; justify-content:center}
.v2-run img{max-height:24px; max-width:96px}
@keyframes v2run{to{transform:translateX(-100%)}}
@media (prefers-reduced-motion:reduce){ .v2-run ul{animation:none} }

/* sections */
.v2-sec{padding:72px 0 0}
.v2-sec h2{color:var(--navy)}
.v2-sec:last-of-type{padding-bottom:96px}

/* programme tabs */
.v2-tabs{display:grid; grid-template-columns:repeat(3,1fr); background:#F1F4F3; padding:6px; margin-top:28px}
.v2-tabs button{background:none; border:0; padding:14px 10px; cursor:pointer; font:inherit; color:var(--navy); display:grid; gap:2px}
.v2-tabs b{font-weight:700} .v2-tabs span{font-size:.84rem; color:var(--mut)}
.v2-tabs [aria-selected="true"]{background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.08)}
.v2-prog{background:var(--navy); color:#fff; padding:clamp(22px,3vw,36px); margin-top:14px}
.v2-prog-top{display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; padding-bottom:20px; border-bottom:1px solid rgba(255,255,255,.14)}
.v2-prog h3{font-size:clamp(1.5rem,2.6vw,2rem); font-weight:600; letter-spacing:-.02em; margin-top:6px; max-width:22ch}
.v2-prog-sub{color:#C9DDD9; margin-top:8px}
.v2-prog-stat{display:flex; gap:22px; align-items:flex-start}
.v2-prog-stat div{display:grid; text-align:center} .v2-prog-stat div + div{padding-left:22px; border-left:1px solid rgba(255,255,255,.2)}
.v2-prog-stat b{font-size:1.6rem; font-weight:700} .v2-prog-stat span{font-size:.78rem; color:#C9DDD9}
.v2-prog > .v2-lk{margin-top:22px}
.v2-build{list-style:none; margin:12px 0 0; padding:0; display:grid; gap:10px}
.v2-build li{display:flex; gap:14px; color:#E1F3EF} .v2-build span{color:#9FD9CF; font-weight:700}
.v2-evolve{margin-top:22px; padding:18px; background:rgba(255,255,255,.06)} .v2-evolve p:last-child{margin:6px 0 0; color:#E1F3EF}
.v2-prog-cta{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:22px}

/* curriculum "labs" */
.v2-labs{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:28px}
.v2-lab{background:linear-gradient(135deg,#0B5A53,#17998B); color:#fff; padding:22px; display:flex; flex-direction:column; gap:10px; min-height:220px}
.v2-lab.wide{grid-column:span 2} .v2-lab.tall{grid-row:span 2}
.v2-lab h3{font-size:1.2rem; font-weight:700; display:flex; align-items:center; gap:8px}
.v2-arrow{font-size:.75rem; border:1px solid rgba(255,255,255,.5); padding:1px 5px}
.v2-lab > p:not(.v2-lk){margin:0; color:#E1F3EF; font-size:.92rem}
.v2-tags{display:flex; flex-wrap:wrap; gap:6px}
.v2-tags span{font-size:.8rem; padding:4px 10px; border:1px solid rgba(255,255,255,.4); background:rgba(255,255,255,.08)}
.v2-lab .v2-lk{color:#BFE9E1; margin-top:auto; padding-top:12px}
.v2-tools{display:flex; gap:8px; flex-wrap:wrap}
.v2-tools img{height:40px; width:auto; max-width:132px; object-fit:contain; background:#fff; padding:8px 12px; border-radius:6px}

/* stories */
.v2-stories{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:28px; align-items:start}
.v2-stories > div{display:grid; gap:14px}
.v2-story{border:1px solid var(--line); padding:20px; background:#fff}
.v2-big{font-size:2.6rem; font-weight:700; letter-spacing:-.03em; color:var(--navy); margin:0 0 14px; padding-bottom:14px; border-bottom:1px solid var(--line)}
.v2-big small{font-size:1.1rem; font-weight:500}
.v2-face{width:64px; height:64px; object-fit:cover; margin-bottom:14px}
.v2-name{font-weight:600; font-size:1.05rem; margin:0; color:var(--navy)}
.v2-role{font-size:.86rem; color:var(--mut); margin:2px 0 0}
.v2-bn{margin:14px 0 0; display:grid; gap:6px; font-size:.86rem}
.v2-bn div{display:flex; gap:8px} .v2-bn dt{letter-spacing:.08em; text-transform:uppercase; color:var(--mut); font-size:.74rem; padding-top:2px; min-width:58px} .v2-bn dd{margin:0}
.v2-sfoot{display:flex; justify-content:space-between; align-items:center; margin-top:14px}
.v2-offers{font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; border:1px solid var(--navy); padding:4px 8px}
.v2-co{max-height:22px; max-width:110px}
.v2-quote{margin:0; line-height:1.6; color:#2B3A37; font-size:.95rem}
.v2-qby{display:flex; gap:12px; align-items:center; margin-top:16px; padding-top:14px; border-top:1px solid var(--line)}
.v2-qby img{width:40px; height:40px; object-fit:cover}
.v2-vid{padding:0; overflow:hidden}
.v2-vid .yt-player{position:relative; aspect-ratio:16/10; background:#0B1D1A}
.v2-vcap{padding:14px 16px}

/* mentors */
.v2-mentors{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:28px}
.v2-mentor{position:relative; margin:0; aspect-ratio:16/10; overflow:hidden; background:linear-gradient(135deg,#0B5A53,#17998B)}
.v2-mentor img{position:absolute; right:0; bottom:0; height:100%; width:auto; object-fit:cover}
.v2-mentor figcaption{position:absolute; left:18px; top:18px; max-width:55%; color:#fff; display:grid; gap:4px}
.v2-mentor b{font-size:1.1rem} .v2-mentor span{font-size:.84rem; color:#E1F3EF}

/* how it works */
.v2-how{display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,64px); margin-top:32px}
.v2-how-img{position:sticky; top:140px; align-self:start; aspect-ratio:4/5; overflow:hidden; background:linear-gradient(135deg,#0B5A53,#17998B)}
.v2-how-img img{width:100%; height:100%; object-fit:cover; display:block}
.v2-step{padding:32px 0 48px; border-bottom:1px solid var(--line); opacity:.4; transition:opacity .3s; min-height:42vh}
.v2-step.on,.v2-step:first-child{opacity:1}
.v2-num{margin:0; font-weight:700; color:var(--blue-2); font-size:.85rem}
.v2-step .v2-lk{margin-top:4px}
.v2-step h3{font-size:clamp(1.4rem,2.2vw,1.8rem); font-weight:500; letter-spacing:-.02em; color:var(--navy); margin-top:14px; line-height:1.25}
.v2-step p:last-child{color:var(--mut); margin-top:12px; line-height:1.6}

/* proof */
.v2-proof{position:relative; margin-top:28px}
.v2-proof > img{width:100%; height:clamp(260px,34vw,420px); object-fit:cover; display:block}
.v2-proof-stats{display:grid; grid-template-columns:repeat(4,1fr); background:#fff; border:1px solid var(--line); margin:-90px 24px 0; position:relative}
.v2-proof-stats div{padding:22px 18px} .v2-proof-stats div + div{border-left:1px solid var(--line)}
.v2-proof-stats b{display:block; font-size:clamp(1.8rem,3vw,2.5rem); font-weight:700; color:var(--blue); letter-spacing:-.03em}
.v2-proof-stats span{font-size:.84rem; color:#2B3A37}

/* fee */
.v2-fee{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:24px}
.v2-fee div{border:1px solid var(--line); padding:20px; display:grid; gap:6px}
.v2-fee b{font-size:1.6rem; font-weight:700; color:var(--navy)} .v2-fee span{color:var(--mut); font-size:.92rem}

/* blog */
.v2-blog{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:28px}
.v2-blog a{border:1px solid var(--line); padding:20px; display:grid; gap:8px; align-content:start; color:var(--navy)}
.v2-blog a:hover{border-color:var(--blue)}
.v2-blog b{font-size:1.05rem; line-height:1.3} .v2-blog span{font-size:.88rem; color:var(--mut)} .v2-blog small{font-size:.8rem; color:var(--mut); padding-top:10px; border-top:1px solid var(--line)}

/* pinned call bar (desktop) */
.v2-callbar{position:fixed; left:0; right:0; bottom:0; z-index:57; background:var(--navy); color:#fff; text-align:center; padding:12px 16px; font-family:var(--f2)}
.v2-callbar p{margin:0; font-size:.95rem}
.v2-callbar a{color:#fff; font-weight:700; margin:0 4px}
.v2-callbar button{background:none; border:0; color:#fff; font:700 .95rem var(--f2); text-decoration:underline; text-underline-offset:3px; cursor:pointer; padding:0}
.v2 .wa-fab,.v2 .ev-pop{bottom:calc(64px + env(safe-area-inset-bottom,0px))}
.v2 .wa-panel{bottom:calc(130px + env(safe-area-inset-bottom,0px))}
.v2 footer,.v2 .s-footer{padding-bottom:60px}

@media (max-width:1000px){
  .v2-why-grid,.v2-proof-stats{grid-template-columns:1fr 1fr}
  .v2-labs,.v2-stories,.v2-mentors,.v2-blog,.v2-fee{grid-template-columns:1fr 1fr}
  .v2-how{grid-template-columns:1fr} .v2-how-img{position:relative; top:0; aspect-ratio:16/10}
  .v2-step{min-height:0; opacity:1}
}
@media (max-width:760px){
  .v2-callbar{display:none}
  .v2 .wa-fab{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .v2 .ev-pop{bottom:calc(150px + env(safe-area-inset-bottom,0px))}
  .v2-why-grid,.v2-labs,.v2-stories,.v2-mentors,.v2-blog,.v2-fee,.v2-tabs,.v2-prog-cta{grid-template-columns:1fr}
  .v2-lab.wide{grid-column:auto} .v2-lab.tall{grid-row:auto}
  .v2-proof-stats{margin:-40px 10px 0}
  .v2-why-logos{flex-direction:column; align-items:flex-start}
  .v2-hero h1 br{display:none}
  .v2-strip{flex-direction:column; align-items:flex-start}
}
.v2 .v2-btn-o{border-color:var(--navy)}
.v2-note{margin:24px 0 0; color:var(--mut)} .v2-note a{color:var(--blue); font-weight:600; text-decoration:underline; text-underline-offset:3px; margin-left:6px}
.v2-fee b{font-size:1.25rem} .v2-fee div:first-child b{font-size:1.6rem}

/* Hero: rotating role */
.v2-rot{display:inline-grid; vertical-align:bottom; background:var(--pale); border-radius:6px; padding:0 .2em; overflow:hidden}
.v2-rot span{grid-area:1/1; opacity:0; transform:translateY(60%); transition:opacity .5s ease, transform .5s ease; white-space:nowrap}
.v2-rot span.on{opacity:1; transform:none}
.v2-rot span.out{opacity:0; transform:translateY(-60%)}
@media (max-width:760px){ .v2-rot span{white-space:normal} }
@media (prefers-reduced-motion:reduce){ .v2-rot span{transition:none} }

/* Buttons: dark green gradients with a soft shine, instead of flat teal */
.v2 .v2-btn{position:relative; overflow:hidden; border-radius:8px; transition:transform .2s, box-shadow .2s, background-position .4s}
.v2 .v2-btn::after{content:""; position:absolute; top:0; left:-60%; width:40%; height:100%; background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent); transform:skewX(-20deg); transition:left .6s ease}
.v2 .v2-btn:hover::after{left:130%}
.v2 .v2-btn:hover{transform:translateY(-1px)}
.v2 .v2-btn-b{background:linear-gradient(135deg,#0F6E64 0%,#0A4A44 55%,#04211E 100%); color:#fff; box-shadow:0 10px 24px rgba(4,33,30,.28), inset 0 1px 0 rgba(255,255,255,.12)}
.v2 .v2-btn-b:hover{background:linear-gradient(135deg,#12867A 0%,#0C5A53 55%,#05302C 100%); box-shadow:0 14px 30px rgba(4,33,30,.34), inset 0 1px 0 rgba(255,255,255,.16)}
.v2 .v2-btn-o{background:linear-gradient(#fff,#fff) padding-box, linear-gradient(135deg,#2BB3A3,#04211E) border-box; border:2px solid transparent; color:#04211E}
.v2 .v2-btn-o:hover{background:linear-gradient(135deg,#F1FAF8,#E3F4F0) padding-box, linear-gradient(135deg,#2BB3A3,#04211E) border-box}
.v2 .v2-btn-w{background:linear-gradient(135deg,#ffffff,#E3F4F0); color:#04211E}
.v2-prog .v2-btn-b{background:linear-gradient(135deg,#2BB3A3,#0F6E64); color:#04211E}
.v2 .m-cta .btn-teal{background:linear-gradient(135deg,#0F6E64,#04211E)}
.v2-report{display:flex; align-items:center; gap:16px; margin-top:22px; padding:18px 20px; border-radius:12px; border:1px solid #CFE7E2; background:linear-gradient(90deg,#F1FAF8,#fff); color:var(--navy); transition:border-color .2s, transform .2s}
.v2-report:hover{border-color:#2BB3A3; transform:translateY(-1px)}
.v2-report-ic{flex:none; width:46px; height:46px; border-radius:10px; background:linear-gradient(135deg,#0F6E64,#04211E); color:#fff; display:grid; place-items:center}
.v2-report-ic svg{width:22px; height:22px}
.v2-report b{display:block; font-size:1.05rem} .v2-report small{display:block; color:var(--mut); margin-top:2px; font-size:.88rem}
.v2-report-go{margin-left:auto; white-space:nowrap; font-weight:700; color:var(--blue)}
@media (max-width:640px){ .v2-report{flex-wrap:wrap} .v2-report-go{margin-left:62px} }