/* R4 course family — HTML integration of the supplied course mockups. */
.ph-v4-exact.course-page,.ph-v4-exact .course-page{--c:#5133ff;--c2:#7f4cff;--ink:#09104a;background:linear-gradient(#fff,#fbfcff);color:var(--ink)}
.ph-v4-exact .course-wrap{width:min(1430px,calc(100% - 64px));margin:0 auto}.ph-v4-exact .course-breadcrumb{display:flex;gap:8px;align-items:center;min-height:40px;font-size:11px;color:#4050a3;white-space:nowrap;overflow:auto}.ph-v4-exact .course-breadcrumb strong{color:#11184f}.ph-v4-exact .course-breadcrumb a:hover{text-decoration:underline}.ph-v4-exact .course-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;background:#ece9ff;color:#4d2ce7;font-size:11px;font-weight:700}.ph-v4-exact .course-btn{border:0;border-radius:14px;padding:12px 22px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:700;background:linear-gradient(100deg,#7e4cff,#4c27ff);color:#fff}.ph-v4-exact .course-btn.alt{background:#fff;color:#3e35d6;border:1px solid #dcd9f7}.ph-v4-exact .course-btn.mint{background:linear-gradient(100deg,#45d99d,#019c72)}.ph-v4-exact .course-hero{position:relative;overflow:hidden;border-radius:0 0 32px 32px;background:linear-gradient(115deg,#f8f7ff,#eef3ff);min-height:270px}.ph-v4-exact .course-hero>.course-wrap{position:relative;z-index:2;padding:18px 0 22px}.ph-v4-exact .course-hero-art{position:absolute;right:0;top:0;width:58%;height:100%;object-fit:cover;mask-image:linear-gradient(90deg,transparent 0,#000 16%)}.ph-v4-exact .course-hero h1{font-size:50px;line-height:1.03;letter-spacing:-.045em;margin:8px 0 4px}.ph-v4-exact .course-hero h2{font-size:22px;color:#293b95;line-height:1.2}.ph-v4-exact .course-hero p{max-width:650px;font-size:15px;line-height:1.46;color:#34489a;margin-top:8px}.ph-v4-exact .course-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.ph-v4-exact .course-tags span{padding:6px 10px;border-radius:999px;background:#eeefff;color:#3040b0;font-size:10px;font-weight:700}.ph-v4-exact .course-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.ph-v4-exact .course-tabs{display:flex;gap:6px;align-items:center;overflow:auto;padding:8px 10px;border-radius:15px;background:#fff;box-shadow:0 6px 24px rgba(31,25,102,.06);margin:-18px auto 13px;position:relative;z-index:5}.ph-v4-exact .course-tabs a,.ph-v4-exact .course-tabs button{border:0;background:#fff;border-radius:10px;padding:10px 17px;color:#36449b;white-space:nowrap;font-size:11px}.ph-v4-exact .course-tabs .on{color:#3d2de0;font-weight:700;box-shadow:inset 0 -3px #5b39ff}.ph-v4-exact .course-layout{display:grid;grid-template-columns:245px minmax(0,1fr) 300px;gap:14px;align-items:start}.ph-v4-exact .course-layout.two{grid-template-columns:minmax(0,1fr) 330px}.ph-v4-exact .course-side,.ph-v4-exact .course-panel,.ph-v4-exact .course-card,.ph-v4-exact .course-main{border:1px solid #e8e8f8;border-radius:15px;background:#fff;box-shadow:0 5px 18px rgba(26,24,90,.045)}.ph-v4-exact .course-side{padding:14px;position:sticky;top:10px}.ph-v4-exact .course-side h2,.ph-v4-exact .course-panel h2{font-size:17px;margin-bottom:10px}.ph-v4-exact .course-side ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}.ph-v4-exact .course-side li,.ph-v4-exact .course-side a{display:flex;align-items:center;gap:8px;padding:8px 9px;border-radius:9px;color:#344497;font-size:11px}.ph-v4-exact .course-side .on{background:#efedff;color:#4b31e6;font-weight:700}.ph-v4-exact .course-progress{height:7px;border-radius:99px;background:#e5e7fb;overflow:hidden}.ph-v4-exact .course-progress i{height:100%;display:block;background:linear-gradient(90deg,#13b28c,#5638ff)}.ph-v4-exact .course-main{padding:15px}.ph-v4-exact .course-main h1{font-size:29px;letter-spacing:-.035em}.ph-v4-exact .course-main h2{font-size:20px;margin-bottom:8px}.ph-v4-exact .course-main p{font-size:13px;line-height:1.5;color:#344897}.ph-v4-exact .course-video{position:relative;border-radius:15px;overflow:hidden;background:#0b1648;min-height:300px}.ph-v4-exact .course-video img{width:100%;height:100%;min-height:300px;object-fit:cover}.ph-v4-exact .course-video .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:72px;height:72px;border-radius:50%;border:0;background:#fff;color:#4f2ee7;font-size:29px;display:grid;place-items:center;box-shadow:0 10px 34px #0b0f5544}.ph-v4-exact .course-video .timeline{position:absolute;left:16px;right:16px;bottom:12px;height:6px;border-radius:99px;background:#ffffff70}.ph-v4-exact .course-video .timeline i{display:block;width:28%;height:100%;background:#753eff;border-radius:99px}.ph-v4-exact .course-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.ph-v4-exact .course-grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.ph-v4-exact .course-grid-6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:11px}.ph-v4-exact .course-panel{padding:15px}.ph-v4-exact .course-panel.soft-violet{background:linear-gradient(120deg,#f5f2ff,#fbfaff)}.ph-v4-exact .course-panel.soft-mint{background:linear-gradient(120deg,#effff8,#f8fffc)}.ph-v4-exact .course-panel.soft-yellow{background:linear-gradient(120deg,#fff8e9,#fffdf7)}.ph-v4-exact .course-panel.soft-pink{background:linear-gradient(120deg,#fff0f8,#fff8fc)}.ph-v4-exact .course-list{display:grid;gap:8px}.ph-v4-exact .course-list div,.ph-v4-exact .course-list li{font-size:12px;line-height:1.35;color:#344795}.ph-v4-exact .course-check{list-style:none;padding:0;margin:0;display:grid;gap:9px}.ph-v4-exact .course-check li{display:flex;gap:8px;align-items:flex-start}.ph-v4-exact .course-check li:before{content:'✓';width:20px;height:20px;border-radius:50%;display:grid;place-items:center;flex:0 0 20px;background:#c9f8e6;color:#049568;font-weight:800}.ph-v4-exact .course-resource{display:grid;grid-template-columns:42px 1fr 28px;gap:9px;align-items:center;padding:9px;border-radius:10px;background:#fafaff}.ph-v4-exact .course-resource b{font-size:11px}.ph-v4-exact .course-resource small{font-size:9.5px;color:#5f6ba7}.ph-v4-exact .course-step{display:grid;grid-template-columns:32px 1fr auto;gap:9px;align-items:center;padding:9px;border-radius:10px;background:#fafaff}.ph-v4-exact .course-step b{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#5d39ff;color:#fff}.ph-v4-exact .course-step strong{font-size:11px}.ph-v4-exact .course-step small{font-size:9.5px;color:#5965a4}.ph-v4-exact .course-chapters{display:flex;gap:11px;overflow:auto;padding:4px 0 10px}.ph-v4-exact .course-chapter{flex:0 0 180px;border:1px solid #e4e6f8;border-radius:12px;background:#fff;overflow:hidden}.ph-v4-exact .course-chapter img{width:100%;height:82px;object-fit:cover}.ph-v4-exact .course-chapter div{padding:8px}.ph-v4-exact .course-chapter strong{font-size:11px}.ph-v4-exact .course-chapter small{display:block;margin-top:4px;color:#5e6aaa}.ph-v4-exact .course-recos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.ph-v4-exact .course-reco{border:1px solid #e6e7f8;border-radius:12px;overflow:hidden;background:#fff}.ph-v4-exact .course-reco img{width:100%;height:80px;object-fit:cover}.ph-v4-exact .course-reco div{padding:7px}.ph-v4-exact .course-reco strong{font-size:11px}.ph-v4-exact .course-reco small{display:block;color:#5967a6;margin-top:3px}.ph-v4-exact .course-catalogue{display:grid;grid-template-columns:240px 1fr;gap:18px}.ph-v4-exact .course-filters{padding:14px;border:1px solid #e5e7f8;border-radius:13px;background:#fff}.ph-v4-exact .course-filters h2{font-size:16px;margin-bottom:8px}.ph-v4-exact .course-filters section{border-top:1px solid #eef0fb;padding:10px 0}.ph-v4-exact .course-filters section:first-of-type{border-top:0}.ph-v4-exact .course-filters label{display:flex;gap:8px;align-items:center;padding:4px 0;font-size:11px;color:#34469b}.ph-v4-exact .course-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.ph-v4-exact .course-card{overflow:hidden}.ph-v4-exact .course-card img{width:100%;height:145px;object-fit:cover}.ph-v4-exact .course-card>div{padding:10px}.ph-v4-exact .course-card h3{font-size:14px}.ph-v4-exact .course-card p{font-size:11px;line-height:1.35;color:#5260a0;margin:5px 0}.ph-v4-exact .course-card .course-btn{width:100%;padding:8px;font-size:11px}.ph-v4-exact .course-state-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.ph-v4-exact .course-state{min-height:245px;border-radius:15px;padding:22px 15px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px solid #e6e7f7;background:#f8f7ff}.ph-v4-exact .course-state:nth-child(2){background:#fff7ea}.ph-v4-exact .course-state:nth-child(5){background:#fff1f5}.ph-v4-exact .course-state h3{font-size:16px;margin:10px 0 5px}.ph-v4-exact .course-state p{font-size:11px;line-height:1.4;color:#5663a2}.ph-v4-exact .course-state .state-icon{font-size:36px}.ph-v4-exact .course-state .course-btn{margin-top:15px;font-size:11px;padding:9px 18px}.ph-v4-exact .course-shell{background:#0d1437;color:#fff;border-radius:18px;padding:13px;display:grid;grid-template-columns:260px 1fr;gap:12px;min-height:470px}.ph-v4-exact .course-shell aside{padding:10px}.ph-v4-exact .course-shell h2{font-size:23px;margin:8px 0}.ph-v4-exact .course-shell ol{list-style:none;padding:0;margin:20px 0;display:grid;gap:8px}.ph-v4-exact .course-shell li{padding:9px;border-radius:10px;background:#171f4b;font-size:11px}.ph-v4-exact .course-shell li.on{background:#2d376c}.ph-v4-exact .course-shell .course-video{min-height:420px}.ph-v4-exact .course-mode-row{display:flex;justify-content:center;gap:34px;margin-top:15px}.ph-v4-exact .course-mode-row span{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:10px;color:#3e4baa}.ph-v4-exact .course-mode-row b{font-size:24px}.ph-v4-exact .course-reader{display:grid;grid-template-columns:210px minmax(0,1fr) 300px;gap:14px}.ph-v4-exact .course-reader .course-main{box-shadow:none;border:0;background:transparent;padding:0}.ph-v4-exact .course-article-section{padding:16px;border:1px solid #e7e8f8;border-radius:14px;background:#fff;margin-bottom:12px}.ph-v4-exact .course-article-section h2{font-size:20px;display:flex;gap:10px;align-items:center}.ph-v4-exact .course-article-section h2 b{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#5d38ff;color:#fff}.ph-v4-exact .course-article-section p{margin-top:8px}.ph-v4-exact .course-article-section img{width:100%;max-height:250px;object-fit:cover;border-radius:12px;margin-top:12px}.ph-v4-exact .course-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.ph-v4-exact .course-meta div{padding:10px;border-radius:11px;background:#fafaff}.ph-v4-exact .course-meta strong{font-size:11px}.ph-v4-exact .course-meta small{display:block;color:#5965a3;margin-top:3px}.ph-v4-exact .course-inline-note{padding:12px;border-radius:12px;background:#effbf5;color:#23654e;font-size:11px;line-height:1.4;margin-top:10px}.ph-v4-exact .course-lesson-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:12px}.ph-v4-exact .course-example-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.ph-v4-exact .course-example-grid article{padding:12px;border-radius:12px;background:#fff;border:1px solid #e8e9f8;font-size:11px;line-height:1.4}.ph-v4-exact .course-hero-mini{display:grid;grid-template-columns:1fr 1.15fr;gap:20px;align-items:center;border-radius:18px;background:linear-gradient(115deg,#f7f5ff,#eef3ff);overflow:hidden}.ph-v4-exact .course-hero-mini .copy{padding:25px}.ph-v4-exact .course-hero-mini img{width:100%;height:270px;object-fit:cover}.ph-v4-exact .course-hero-mini h1{font-size:45px;line-height:1}.ph-v4-exact .course-hero-mini h2{font-size:20px;color:#30439a;margin-top:5px}.ph-v4-exact .course-hero-mini p{font-size:14px;line-height:1.45;color:#3c4e9c;margin-top:8px}.ph-v4-exact .course-mobile-note{display:none}
@media(max-width:1100px){.ph-v4-exact .course-wrap{width:calc(100% - 32px)}.ph-v4-exact .course-layout{grid-template-columns:210px minmax(0,1fr)}.ph-v4-exact .course-layout>.course-side:last-child,.ph-v4-exact .course-reader>.course-side:last-child{grid-column:1/-1;position:static}.ph-v4-exact .course-reader{grid-template-columns:190px 1fr}.ph-v4-exact .course-cards{grid-template-columns:repeat(2,1fr)}.ph-v4-exact .course-state-grid{grid-template-columns:repeat(3,1fr)}.ph-v4-exact .course-recos{grid-template-columns:repeat(3,1fr)}.ph-v4-exact .course-hero h1{font-size:43px}.ph-v4-exact .course-hero-art{width:55%}.ph-v4-exact .course-grid-3{grid-template-columns:1fr 1fr}.ph-v4-exact .course-grid-3>*:last-child{grid-column:1/-1}.ph-v4-exact .course-grid-4{grid-template-columns:repeat(2,1fr)}.ph-v4-exact .course-shell{grid-template-columns:220px 1fr}}
@media(max-width:700px){.ph-v4-exact .course-wrap{width:calc(100% - 20px)}.ph-v4-exact .course-hero{min-height:430px;padding-bottom:185px}.ph-v4-exact .course-hero-art{top:auto;bottom:0;width:100%;height:200px;mask-image:linear-gradient(180deg,transparent,#000 12%)}.ph-v4-exact .course-hero h1{font-size:35px}.ph-v4-exact .course-hero h2{font-size:18px}.ph-v4-exact .course-hero p{font-size:13px}.ph-v4-exact .course-tabs{margin-top:-9px}.ph-v4-exact .course-layout,.ph-v4-exact .course-layout.two,.ph-v4-exact .course-reader,.ph-v4-exact .course-catalogue,.ph-v4-exact .course-lesson-grid{grid-template-columns:1fr}.ph-v4-exact .course-side{position:static}.ph-v4-exact .course-grid-3,.ph-v4-exact .course-grid-4,.ph-v4-exact .course-meta{grid-template-columns:1fr}.ph-v4-exact .course-grid-6{display:flex;overflow:auto}.ph-v4-exact .course-grid-6>*{flex:0 0 190px}.ph-v4-exact .course-recos{display:flex;overflow:auto}.ph-v4-exact .course-reco{flex:0 0 210px}.ph-v4-exact .course-cards{grid-template-columns:1fr}.ph-v4-exact .course-state-grid{grid-template-columns:1fr 1fr}.ph-v4-exact .course-shell{grid-template-columns:1fr}.ph-v4-exact .course-shell .course-video{min-height:280px}.ph-v4-exact .course-mode-row{gap:15px;flex-wrap:wrap}.ph-v4-exact .course-hero-mini{grid-template-columns:1fr}.ph-v4-exact .course-hero-mini img{height:220px;order:-1}.ph-v4-exact .course-hero-mini h1{font-size:34px}.ph-v4-exact .course-example-grid{grid-template-columns:1fr}.ph-v4-exact .course-mobile-note{display:block;padding:10px;background:#f4efff;border-radius:10px;font-size:10px;color:#5c5aa1}.ph-v4-exact .course-filters{display:none}}
/* R4 overflow hardening for narrow screens and dense sidebars. */
.ph-v4-exact .course-layout,.ph-v4-exact .course-layout.two,.ph-v4-exact .course-reader,.ph-v4-exact .course-catalogue,.ph-v4-exact .course-lesson-grid{min-width:0;max-width:100%}
.ph-v4-exact .course-layout>*,.ph-v4-exact .course-reader>*,.ph-v4-exact .course-catalogue>*,.ph-v4-exact .course-lesson-grid>*,.ph-v4-exact .course-main,.ph-v4-exact .course-side,.ph-v4-exact .course-panel,.ph-v4-exact .course-resource{min-width:0;max-width:100%}
.ph-v4-exact .course-resource p{min-width:0;overflow-wrap:anywhere}.ph-v4-exact .searchbar input{min-width:0}.ph-v4-exact .course-tabs{max-width:100%}
@media(max-width:700px){.ph-v4-exact .course-catalogue>section,.ph-v4-exact .course-cards,.ph-v4-exact .course-recos{width:100%;min-width:0;max-width:100%}.ph-v4-exact .course-card{min-width:0}.ph-v4-exact .course-video{max-width:100%;overflow:hidden}}
