/* Design direction 02: original course first, MAPS as an experience layer. */
/* Deliberately layered after the inherited English V-inspired styles. */
:root{--teal:#5acdc4;--aqua:#85e4dc;--lime:#b9f0a3;--paper:#f7f9fa;--ink:#222c2a;--muted:#5e7270;--line:#dce8e5}
html{scroll-padding-top:76px}
body{background:#f7f9fa;color:#222c2a}
.hero.hero-course{margin:30px 30px 0;min-height:720px;background:#202c2e;isolation:isolate;color:#fff}
.hero.hero-course:before{inset:0;z-index:0;background:linear-gradient(180deg,rgba(13,24,28,.55),rgba(13,24,28,.26) 30%,rgba(11,19,26,.62) 84%,rgba(11,19,26,.72)),linear-gradient(90deg,rgba(13,18,24,.24),transparent 42%,rgba(13,18,24,.2));pointer-events:none}
.hero.hero-course .hero-photo{inset:0;z-index:-1;background-image:url('https://images.unsplash.com/photo-1498050108023-c5249f4df085?auto=format&fit=crop&w=2200&q=87');background-size:cover;background-position:center 48%;filter:saturate(.82) contrast(1.03)}
.hero.hero-course .hero-inner{position:relative;min-height:720px;display:flex;flex-direction:column;padding-top:60px;padding-bottom:29px}
.hero.hero-course .hero-header{display:flex;justify-content:center;align-items:center;position:relative;min-height:62px}
.hero.hero-course .brand{margin:auto;justify-content:center}
.hero.hero-course .brand img{width:243px;max-width:100%;height:auto;display:block;filter:brightness(0) invert(1)}
.hero.hero-course .maps-pill{position:absolute;right:0;top:3px;gap:8px;border:1px solid rgba(255,255,255,.45);background:rgba(12,36,36,.28);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);padding:6px 12px 6px 6px;font-size:10px;font-weight:900;letter-spacing:.075em;color:#fff}
.hero.hero-course .maps-spark{width:28px;height:28px;background:#86e2d9;color:#0b4b46}
.hero.hero-course .maps-pill b,.hero.hero-course .maps-pill>span:last-child{color:#b8f1e0}
.hero.hero-course .hero-copy{width:100%;max-width:1110px;margin:auto;position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;padding:70px 0 46px}
.hero.hero-course .hero-kicker{font-size:10px;color:#e8f5f2;letter-spacing:.19em;font-weight:800;text-align:center;justify-content:center;gap:11px}
.hero.hero-course .hero-kicker .signal{background:#76dfd3;box-shadow:0 0 0 4px #9be8d63d}
.hero-kicker-separator{opacity:.6}
.hero.hero-course h1{font-size:clamp(53px,6.9vw,99px);font-weight:800;letter-spacing:-.057em;line-height:1.06;margin:22px auto 0;max-width:1120px;color:white;text-shadow:0 9px 40px #09141930}
.hero-divider{display:block;width:88px;height:3px;background:white;opacity:.9;margin:34px 0 30px}
.hero-competence{font-size:clamp(17px,1.9vw,26px);font-weight:500;line-height:1.34;letter-spacing:-.025em;max-width:940px;color:#fff;margin:0 auto;text-wrap:balance;text-shadow:0 2px 12px #06111688}
.hero-explore{display:inline-flex;gap:27px;align-items:center;color:#103d39;background:#87e7dc;font-size:13px;font-weight:800;padding:12px 13px 12px 22px;border-radius:13px;margin-top:35px;box-shadow:0 11px 36px #051a203d;transition:transform .2s,background .2s}
.hero-explore>span{font-size:20px;line-height:1}.hero-explore:hover{background:#abfff0;transform:translateY(-2px);color:#103d39}
.hero.hero-course .hero-foot{position:static;display:flex;justify-content:space-between;width:100%;gap:20px;font-size:10px;color:#e4efed;letter-spacing:.14em}
.hero.hero-course .hero-foot b{font-size:16px;color:#98eade}
.maps-ribbon{background:linear-gradient(90deg,#54c9c0,#8ae6df);color:#144742}
.maps-ribbon .ribbon-inner{min-height:62px}
.maps-ribbon .ribbon-inner span b{color:#1a786d}
.maps-ribbon .ribbon-inner>i{background:#339c94}
.maps-ribbon .ribbon-inner>strong{font-weight:800;color:#18584e}
.course-nav{background:rgba(255,255,255,.94);border-bottom:1px solid #dfe8e7}
.nav-name{color:#263d39}.nav-name span{color:#069c8b}
.nav-links a{color:#617873}.nav-links a:hover,.nav-links a[aria-current=location]{background:#d6f4ed;color:#13554f}
.nav-progress{color:#148e7d}
.course-introduction{padding:91px 0 32px;background:#f8f9fa}
.introduction-card{border:1px solid #edf0f0;background:#fff;border-radius:36px;padding:46px clamp(27px,4.4vw,67px) 34px;box-shadow:0 17px 34px #172e2f17}
.intro-head{display:flex;justify-content:space-between;align-items:start;gap:20px}
.intro-overline{display:block;font-size:10px;color:#159887;letter-spacing:.13em;font-weight:900}
.intro-head h2{color:#202a2a;font-size:clamp(38px,3.8vw,53px);font-weight:800;letter-spacing:-.06em;margin:10px 0 20px}
.intro-title-dot{color:#43c8b7}.intro-mark{border:1px solid #cbede7;background:#e7f8f4;border-radius:50px;padding:9px 13px;white-space:nowrap;color:#33877b;font-weight:800;letter-spacing:.09em;font-size:10px}.intro-mark b{color:#075a50}
.intro-text{max-width:1110px;margin:auto;color:#354441;font-size:clamp(14px,1.16vw,16px);font-weight:500;line-height:1.57}
.intro-text p{margin:0 0 18px}.intro-text strong{font-weight:800;color:#273d38}
.intro-bottom{display:flex;flex-wrap:wrap;align-items:stretch;gap:12px;border-top:1px solid #e9eeeb;margin-top:27px;padding-top:25px}
.academic-badge{display:flex;align-items:center;gap:14px;background:#eaf5fb;border:1px solid #d0e7f3;border-radius:15px;padding:13px 18px;flex:1 1 240px;max-width:330px;color:#12354e}
.academic-badge.accent{background:#e8f8f5;border-color:#c9eeea;color:#075d67}
.academic-badge .badge-mark{flex:none;width:42px;height:42px;border-radius:12px;background:#183957;color:white;display:grid;place-items:center;font-size:19px;font-weight:900}.academic-badge.accent .badge-mark{background:#12a8bd}
.academic-badge b{display:block;font-size:11px;font-weight:900;letter-spacing:.03em}.academic-badge small{display:block;font-size:10px;color:#637d80;line-height:1.4;margin-top:4px}
.intro-action{margin-left:auto;align-self:center;display:inline-flex;align-items:center;gap:18px;color:#094d46;border:1px solid #98d9cd;border-radius:12px;padding:14px 16px;font-size:12px;font-weight:900;background:#f6fffc;transition:background .2s}.intro-action:hover{background:#d0f7eb;color:#094d46}
.course-hub{padding:58px 0 108px;background:#f8f9fa}
.hub-heading{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:24px}
.hub-heading h2{margin:7px 0 0;font-size:clamp(30px,3.2vw,43px);letter-spacing:-.055em;font-weight:800;color:#273b3a}
.hub-step{font-size:10px;font-weight:900;letter-spacing:.12em;color:#689188;white-space:nowrap}
.hub-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:205px 205px;gap:19px}
.hub-card{position:relative;overflow:hidden;min-width:0;border-radius:30px;transition:transform .23s ease,box-shadow .23s ease;box-shadow:0 11px 24px #21413f12}
.hub-card:hover,.hub-card:focus-visible{transform:translateY(-4px);box-shadow:0 18px 40px #21413f24}
.hub-start{grid-column:1 / span 3;grid-row:1 / span 2;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:33px;background:#202624;color:#fff}
.hub-start:before{content:'';position:absolute;width:290px;height:290px;right:-139px;bottom:-138px;border:1px solid #a9f4df4a;border-radius:50%;box-shadow:0 0 0 28px #92eed409,0 0 0 67px #92eed409}
.hub-play{width:90px!important;height:90px!important;background:#78e1d9!important;color:#fff!important;border-radius:50%!important;font-size:32px!important;display:grid;place-items:center;padding-left:5px!important;margin:0 0 auto!important}
.hub-start-title{font-size:clamp(36px,3.2vw,49px);font-weight:800;letter-spacing:-.065em;line-height:1.06;margin-top:auto;position:relative;z-index:1}
.hub-start-arrow{color:#78e1d9;font-size:32px;margin-left:7px}
.hub-start-bottom{position:relative;z-index:1;width:100%;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff35;margin-top:24px;padding-top:17px;font-size:10px;letter-spacing:.05em;font-weight:800;color:#b5e7de}
.hub-tile{background:#80dfd8;color:#203534;padding:25px 26px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start}
.hub-tile:nth-child(2){grid-column:4 / span 5;grid-row:1;background:#58d0c8}
.hub-tile:nth-child(3){grid-column:9 / span 4;grid-row:1;background:#8de5de}
.hub-tile:nth-child(4){grid-column:4 / span 3;grid-row:2;background:#90e7df}
.hub-tile:nth-child(5){grid-column:7 / span 3;grid-row:2;background:#61d1c9}
.hub-tile:nth-child(6){grid-column:10 / span 3;grid-row:2;background:#98eae3}
.hub-tile:before{content:'';position:absolute;right:-55px;bottom:-80px;width:175px;height:175px;border-radius:50%;border:1px solid #0d82764f;box-shadow:0 0 0 19px #14857b0d,0 0 0 46px #14857b0d}
.hub-icon{position:relative;z-index:1;width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:#fafffa;color:#244342;font-size:27px;font-weight:700}
.hub-card-number{font-size:9px;letter-spacing:.1em;color:#347d76;font-weight:900;margin-top:15px}
.hub-tile strong{font-size:clamp(20px,2vw,28px);font-weight:800;letter-spacing:-.045em;line-height:1.1;position:relative;z-index:1}
.hub-card-arrow{position:absolute;right:24px;top:25px;font-size:23px;color:#18665d;opacity:.9}
.learning{background:#f1f8f5}
.learning-head h2{font-size:clamp(40px,4.85vw,68px);color:#283c37}
.learning-head h2>span{background:#c6f3df;border-radius:13px;color:#0c6557}
.learning-head>div:first-child>p{color:#55736a}
.progress-card{border-color:#cfe5dc;box-shadow:0 9px 22px #1345360e}
.progress-ring{background:conic-gradient(#34bda4 var(--progress,0%),#e2f0e8 var(--progress,0%))}
.workspace{border-color:#d6e9df;background:#fff}
.workspace-lead{background:linear-gradient(120deg,#d8f4e9,#effcf4)}
.workspace-lead h3{color:#24443b}
.workspace-lead .continue-button{background:#167668;color:#fff}
.workspace-lead .continue-button>span{background:#b7f2df;color:#115e54}
.workspace-tools .filters button[aria-pressed=true]{background:#33bca9;border-color:#33bca9;color:#113b33}
.map-heading h3{font-size:clamp(32px,3.35vw,48px)}
.map-heading h3 em{color:#168c80}
.topic-grid{gap:18px}
.topic-card{border-radius:30px;border:1px solid #7ddbd3;box-shadow:0 11px 25px #274b4710;min-height:310px}
.topic-card.topic-1{background:#72d7cf;border-color:#72d7cf}
.topic-card.topic-2{background:#8ce4dc;color:#253633;border-color:#8ce4dc}
.topic-card.topic-3{background:#d7f6ef;border-color:#9edfd4}
.topic-card.topic-4{background:#72d7cf;border-color:#72d7cf}
.topic-card.topic-5{background:#a0eae0;border-color:#8bdfd5}
.topic-card.topic-2:after{border-color:#167f703d}
.topic-card.topic-2 .topic-status{color:#287d71}
.topic-card.topic-2.is-reviewed .topic-status{color:#087e4c}
.topic-card.topic-2 .topic-symbol{background:#fafffbba;border-color:#ffffffa0;color:#1b6155}
.topic-card.topic-2 .topic-tag{color:#3a8875}
.topic-card.topic-2 .topic-body p{color:#377a6c}
.topic-card.topic-2 .topic-bottom{border-color:#3c9b856d}
.topic-body h4{hyphens:none;overflow-wrap:normal;word-break:normal;font-size:clamp(22px,2.25vw,30px);line-height:1.14}
.topic-3 .topic-body h4,.topic-4 .topic-body h4,.topic-5 .topic-body h4{font-size:clamp(20px,2vw,27px)}
.topic-hit{color:transparent}
.accreditation{background:#f5faf8}
.feature-grid{grid-template-columns:minmax(0,1.37fr) minmax(290px,.85fr)}
.credential-card{background:linear-gradient(130deg,#8de6dd,#60d3c9);color:#153f39;box-shadow:0 12px 28px #20463c13}
.credential-card:before{border-color:#209c8c36;box-shadow:0 0 0 70px #bdf5e635,0 0 0 140px #eafff022}
.credential-top,.credential-main>.micro{color:#256e62}
.credential-star{color:#115f52}
.credential-main h2{color:#183d39;font-size:clamp(32px,3.8vw,53px)}
.credential-main h2 em{color:#046959}
.credential-main p{color:#376f67;font-size:14px}
.credential-emblem{background:#ffffffc7;border-color:#fff;color:#153f39}
.credential-icon{background:#1b776c;color:#fff}
.credential-emblem small{color:#39746c}
.credential-emblem>div span{color:#39766c}
.credential-emblem>b{color:#13685b}
.credential-disclaimer{color:#376f67}
.feature-tile{background:#e5f8f2}
.feature-lime{background:#cdf1e8}
.feature-tile h3{color:#1e4840}
.practice{background:linear-gradient(120deg,#a5ece3,#69d6ce);color:#1a4440}
.practice-copy h2{color:#1e4640}
.practice-copy h2 em{color:#116e62}
.practice-copy p{color:#386f67}
.practice .eyebrow.light{color:#246f64}
.practice .eyebrow.light i{background:#288f7e}
.practice-label{color:#236f62;border-color:#55b6a7}
.practice-label .icon{color:#1c8677}
.exercise{box-shadow:0 19px 45px #0e77702e}
.guide{background:#fbfcfb}
.guide-head h2{color:#233f39}
.guide-head h2 span{color:#238e7c}
.guide-card{border-color:#e2eeea;background:#fff}
.guide-card[open]{background:#e2f8f1}
.footer{background:#244943}
@media(max-width:1100px){
.hero.hero-course{margin:18px 18px 0}
.hero.hero-course .hero-inner{min-height:650px}
.hub-grid{grid-template-rows:190px 190px;gap:14px}
.hub-card{border-radius:23px}
.hub-tile{padding:20px}
.hub-tile strong{font-size:22px}
}
@media(max-width:767px){
.hero.hero-course{margin:10px 10px 0;min-height:690px}
.hero.hero-course .hero-inner{min-height:690px;padding-top:32px;padding-bottom:23px}
.hero.hero-course .hero-photo{inset:0;background-image:url('https://images.unsplash.com/photo-1498050108023-c5249f4df085?auto=format&fit=crop&w=1100&q=83');background-position:51% center}
.hero.hero-course .hero-header{align-items:start}
.hero.hero-course .brand img{width:168px}
.hero.hero-course .maps-pill{right:0;top:53px;font-size:9px}
.hero.hero-course .hero-copy{padding:90px 0 20px;margin:auto}
.hero.hero-course .hero-kicker{font-size:8px;letter-spacing:.1em}
.hero.hero-course h1{font-size:clamp(42px,8.8vw,64px);line-height:1.05;letter-spacing:-.055em;margin-top:21px}
.hero-divider{margin:26px 0 24px}
.hero-competence{font-size:clamp(15px,3.2vw,20px);line-height:1.43}
.hero-explore{margin-top:29px}
.hero.hero-course .hero-foot{font-size:8px;letter-spacing:.05em}
.maps-ribbon .ribbon-inner{gap:9px}
.introduction-card{padding:29px 24px;border-radius:26px}
.course-introduction{padding:51px 0 14px}
.intro-head{flex-direction:column;gap:2px}
.intro-head h2{margin-bottom:7px}
.intro-mark{font-size:9px;margin:0 0 20px}
.intro-bottom{flex-direction:column}
.academic-badge{width:100%;max-width:none;flex-basis:auto}
.intro-action{margin-left:0;width:100%;justify-content:space-between}
.course-hub{padding:42px 0 68px}
.hub-heading{align-items:start;flex-direction:column}
.hub-step{display:none}
.hub-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;gap:12px}
.hub-start{grid-column:1/-1;grid-row:auto;min-height:230px;padding:25px}
.hub-play{height:69px!important;width:69px!important;font-size:25px!important}
.hub-start-title{font-size:40px}
.hub-tile:nth-child(n){grid-column:auto;grid-row:auto;min-height:173px;padding:19px}
.hub-tile:last-child{grid-column:1/-1}
.hub-tile strong{font-size:21px}
.hub-icon{width:43px;height:43px;font-size:24px}
.hub-card-number{font-size:8px}
.hub-card-arrow{top:18px;right:19px}
.topic-card.topic-2{background:#8ce4dc}
.learning-head h2{font-size:clamp(40px,7.4vw,55px)}
.topic-body h4{font-size:25px}
}
@media(max-width:480px){
.hero.hero-course{min-height:690px}
.hero.hero-course .hero-inner{min-height:690px}
.hero.hero-course h1{font-size:clamp(36px,9vw,46px)}
.hero.hero-course .hero-foot span:last-child{display:none}
.hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.hub-tile strong{font-size:19px;word-break:normal}
.topic-grid{grid-template-columns:1fr}
.topic-card.topic-1,.topic-card.topic-2,.topic-card.topic-3,.topic-card.topic-4,.topic-card.topic-5{grid-column:auto;min-height:262px}
.topic-body h4,.topic-3 .topic-body h4,.topic-4 .topic-body h4,.topic-5 .topic-body h4{font-size:26px;hyphens:none;word-break:normal}
}
@media(prefers-reduced-motion:reduce){.hub-card,.hero-explore{transition:none!important}}

/* Tablet: never squeeze the original course tiles into unreadable columns. */
@media (min-width:768px) and (max-width:980px){
.hub-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none}
.hub-start{grid-column:1/-1;grid-row:auto;min-height:235px}
.hub-tile:nth-child(n){grid-column:auto;grid-row:auto;min-height:185px}
.hub-tile:last-child{grid-column:1/-1}
.hub-tile strong{font-size:clamp(21px,2.8vw,26px)}
.intro-bottom{gap:11px}.academic-badge{max-width:none}
}