/* Course studio: shared storefront, learning and management design system. */
:root{--ink:#182239;--muted:#637087;--green:#6346db;--line:#e3e7f0;--paper:#f5f6fb;--soft:#efecfd;--gold:#d5caff}
body{font-family:'Segoe UI Variable','Segoe UI',system-ui,sans-serif;font-size:16px;line-height:1.65;background:radial-gradient(ellipse at 95% 0,#edeafa 0,transparent 38%),var(--paper)}
h1,h2,h3{font-family:'Segoe UI Variable Display','Segoe UI',system-ui,sans-serif;color:var(--ink);font-weight:750;overflow-wrap:anywhere}h1{letter-spacing:-1.8px}h2{font-size:26px}h3{font-size:20px}a,button{touch-action:manipulation}button,.button{font-size:14px;border-radius:11px;padding:13px 21px;box-shadow:0 4px 12px #6346db13}button:hover,.button:hover{background:#5134c0}.secondary{background:white;border-color:#d7dced;color:#43358a}.secondary:hover{background:#eeebfc;color:#43358a}.danger{background:#fff4f4;color:#a13939;border-color:#efd2d2;box-shadow:none}.danger:hover{background:#fbe3e3;color:#8b2626}.small{padding:8px 13px;font-size:12px}
.header{padding:16px 4%;background:#ffffffed;gap:24px}.header nav{font-size:14px;gap:24px}.brand{font-size:20px}.brand small{font-size:9px;letter-spacing:2.4px}.header .brand img.sc-site-logo{width:50px!important;height:50px!important;border-radius:12px}.announcement{background:#eeebfc;color:#53458d;font-size:12px}.page-shell{max-width:1530px;padding:32px 4% 72px;gap:28px}.eyebrow{font-size:11px;letter-spacing:2px}.subtle,small{font-size:13px}.lead{font-size:18px;line-height:1.75}.skip-link{position:absolute;top:-100px;left:20px;z-index:100;background:white;padding:12px}.skip-link:focus{top:10px}
.hero{position:relative;isolation:isolate;overflow:hidden;display:block;padding:64px 56px 36px;border-radius:26px;background:#0b152b url('images/learning-background.png') center/cover;margin-bottom:28px;min-height:475px;box-shadow:0 22px 50px #14234717}.hero:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#071225ee 0%,#071225c9 44%,#0712250d 85%)}.hero-copy{max-width:650px;width:64%}.hero h1{color:white;font-size:clamp(38px,4.4vw,65px);line-height:1.08;font-weight:780;letter-spacing:-2.8px}.hero .eyebrow{color:#c7baff}.hero .dot{background:#bba6ff;box-shadow:0 0 0 5px #bba6ff1a}.hero .lead{color:#c6d0e4;font-size:17px}.hero .actions{margin:28px 0}.hero .button{background:#8062f3;border-color:#9278fa}.hero .secondary{background:#ffffff0e;border-color:#ffffff50;color:white;backdrop-filter:blur(8px)}.hero .subtle{color:#c3cee2}.hero-foot{display:flex;gap:24px;border-top:1px solid #ffffff26;padding-top:20px;color:#d9dff0;font-size:12px;margin-top:30px;width:fit-content}.hero-foot span{display:flex;align-items:center;gap:8px}.hero-foot b{color:#c7baff}
.benefit-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:0 0 48px;padding:24px 12px;border-bottom:1px solid var(--line)}.benefit{display:flex;align-items:center;gap:15px}.benefit-icon{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;background:#eae5fc;color:#6647d9;border-radius:13px;font-weight:750;font-size:20px}.benefit strong{font-size:14px}.benefit p{font-size:12px;margin:2px 0 0}.section-heading{margin-bottom:24px}.section-heading h2{font-size:29px}.filters{padding:16px;background:white;border:1px solid var(--line);border-radius:15px;gap:12px}.filters input{background:#f8f9fc}.filters input,.filters select{min-height:46px}.filters a{font-size:13px;padding:8px}input,select,textarea{border-color:#dce1eb;border-radius:9px;padding:12px 14px}label{font-size:14px}input:focus,select:focus,textarea:focus{border-color:#8766ed}.course-grid{gap:24px}.course-card{border-radius:18px;box-shadow:0 6px 20px #25334d05;transition:transform .2s,box-shadow .2s}.course-card:hover{transform:translateY(-5px);box-shadow:0 16px 35px #25334d14}.course-art{height:205px;background:linear-gradient(125deg,#1d1749cc,#4532a144),url('images/learning-background.png') center/cover}.art-software_development{background-position:70% 50%}.art-ai_ml,.art-data_science{background-position:95% 30%}.art-technology{background-position:40% 65%}.art-symbol{color:#fff;font-size:58px;text-shadow:0 4px 22px #b6a5ff;font-weight:700}.course-art small{color:#e0d8ff;letter-spacing:3px}.level{left:16px;bottom:16px;font-size:11px;padding:5px 11px;border-radius:7px}.course-body{padding:25px}.course-body h3{line-height:1.4;letter-spacing:-.4px}.course-body p:not(.eyebrow){font-size:14px;line-height:1.7}.course-meta{font-size:12px;gap:14px;flex-wrap:wrap}.course-bottom{font-size:13px}.course-bottom strong{font-size:23px}.course-bottom a{font-weight:650}
.panel{padding:28px;border-radius:16px;box-shadow:0 4px 18px #26365c04}.page-heading{margin:8px 0 30px}.page-heading h1{font-size:clamp(27px,3vw,39px);letter-spacing:-1.3px}.page-heading p{font-size:14px}.stats{gap:18px}.stats>div{border-radius:15px;padding:24px;position:relative;overflow:hidden}.stats>div:before{content:'';position:absolute;left:0;top:22px;bottom:22px;width:4px;background:#8062eb;border-radius:0 4px 4px 0}.stats>div:nth-child(2):before{background:#2baf99}.stats>div:nth-child(3):before{background:#e8a344}.stats>div:nth-child(4):before{background:#559beb}.stats span{font-size:12px}.stats strong{font-size:34px;line-height:1.3}.admin-nav{background:#141d33;border:1px solid #23304a;border-radius:19px;padding:24px 13px;width:228px;align-self:flex-start;position:sticky;top:20px;box-shadow:0 12px 28px #14234713}.admin-nav .eyebrow{padding:0 14px;color:#9eaecb;font-size:10px}.admin-nav>a{color:#c7d1e5;padding:12px 13px;font-size:13px;border:1px solid transparent;display:flex;align-items:center;gap:11px}.admin-nav>a:hover,.admin-nav>a[aria-current=page]{background:#7660d52e;color:white;border-color:#8d78e63b}.nav-icon{color:#ae9aff;font-size:17px;width:20px;text-align:center}.nav-note{color:#d4def2;border-top-color:#ffffff20;padding:20px 13px 0;margin-top:25px}.nav-note small{color:#98a8c5;font-size:11px}.table-scroll{border:1px solid var(--line);border-radius:11px}table{font-size:13px}th{background:#f6f7fb;font-size:10px}th,td{padding:16px 14px}tbody tr:hover{background:#faf9ff}.list-row{font-size:14px;padding:19px 0}.list-row small,td small{font-size:12px}.badge{border-radius:7px;font-size:11px}.callout,.message{font-size:13px;background:#f0edfb;border-color:#e0d9f5;color:#584989}.course-hero{background:linear-gradient(110deg,#111b34ee,#232853b0),url('images/learning-background.png') center/cover;border-radius:20px;padding:34px;margin-bottom:24px}.course-hero h1{color:white;font-size:clamp(30px,3.4vw,45px)}.course-hero .eyebrow{color:#bcadff}.course-hero .lead{color:#d3dbeb}.chips{flex-wrap:wrap;gap:8px}.course-hero .chips span{color:#e2e7f5;border-color:#ffffff30;background:#ffffff09}.purchase-card{border-top:4px solid #7959e4}.price{font-size:39px}.prose p{font-size:16px}.module summary{font-size:15px}.module .list-row{padding-left:12px}.lesson-nav a{font-size:14px}.lesson-nav h3{font-size:14px}.video-panel{border-radius:17px;box-shadow:0 10px 30px #18223917}.auth-form{border-top:4px solid #8062eb}.auth-story{border-radius:22px;background:linear-gradient(#121d32bb,#121d32ec),url('images/learning-background.png') center/cover;padding:38px}.auth-story h1{font-size:43px;color:white}.auth-story p{color:#ccd4e8}.auth-story .eyebrow{color:#c5b5ff}.auth-art{color:#a995ef}.auth-art span{color:#e6deff}.footer{font-size:13px;background:white}.footer .brand{font-size:17px}.details{font-size:14px}.small-link{font-size:13px}
.editor-tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);padding-bottom:15px;margin-bottom:25px;flex-wrap:wrap}.editor-tabs a{padding:9px 16px;border-radius:8px;color:#667087;font-size:14px;font-weight:600}.editor-tabs a[aria-current=page],.editor-tabs a:hover{background:#e9e4fb;color:#5e40c7;text-decoration:none}.editor-section{grid-column:1/-1;border:0;border-bottom:1px solid var(--line);padding:0 0 28px;margin:0;min-width:0;scroll-margin-top:25px}.editor-section legend{font-size:21px;font-weight:700;margin-bottom:20px;letter-spacing:-.5px}.editor-section legend span{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--soft);color:var(--green);font-size:12px;margin-right:10px}.editor-fields{display:grid;grid-template-columns:1fr 1fr;gap:22px}.editor-actions{position:sticky;bottom:12px;background:#ffffffed;backdrop-filter:blur(12px);padding:16px;border:1px solid var(--line);border-radius:12px;box-shadow:0 5px 22px #18223912;justify-content:space-between;z-index:2}.editor-actions small{margin:0}.lesson-editor{padding:0 16px;border:1px solid var(--line);border-radius:12px;margin:12px 0;background:#fafbfe}.resource-row{border-radius:8px;margin-bottom:12px;flex-wrap:wrap}.curriculum-summary{padding:22px 26px;background:linear-gradient(115deg,#eee9ff,#f8faff);border:1px solid #e0d9f7;border-radius:14px;display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:24px}.curriculum-summary p{margin:0;font-size:13px}.curriculum-summary strong{display:block;color:#322854;font-size:16px}
@media(min-width:1400px){.page-shell:has(.admin-nav){max-width:1700px;padding-left:3%;padding-right:3%}}
@media(max-width:1100px){.hero{padding:45px 35px}.hero-copy{width:75%}.admin-nav{width:195px}.header nav{gap:16px}.course-layout{grid-template-columns:minmax(0,1fr) 300px}.page-shell{gap:22px}.benefit-strip{gap:14px}.benefit p{font-size:11px}}
@media(max-width:800px){.header{flex-wrap:wrap}.header nav{width:100%;justify-content:space-between;flex-wrap:wrap;font-size:13px;gap:12px}.page-shell{display:block;padding:22px 5% 45px}.admin-nav{position:static;width:auto;margin-bottom:25px;display:flex;flex-wrap:wrap;gap:4px;padding:12px}.admin-nav .eyebrow,.nav-note{display:none}.admin-nav>a{margin:0;padding:9px;font-size:12px}.course-layout{grid-template-columns:1fr}.hero-copy{width:85%}.hero{min-height:0}.benefit-strip{grid-template-columns:1fr;padding:18px 5px;gap:20px;margin-bottom:32px}.benefit p{font-size:13px}.hero h1{font-size:43px}.hero-foot{gap:15px;flex-wrap:wrap}.course-hero{padding:27px}.page-heading{align-items:flex-start}.panel{padding:22px}.section-heading h2{font-size:24px}.auth-layout{grid-template-columns:1fr}.auth-story{display:none}}
@media(max-width:560px){.hero{padding:32px 24px 24px;border-radius:19px;background-position:63% center}.hero:before{background:#081329b8}.hero-copy{width:100%}.hero h1{font-size:37px;letter-spacing:-1.5px}.hero .lead{font-size:15px}.hero .actions{gap:10px}.hero .button{font-size:13px;padding:11px 14px}.hero-foot{font-size:11px;gap:12px}.course-grid,.enrollment-grid,.editor-fields,.form-grid{grid-template-columns:1fr}.course-art{height:200px}.filters{flex-wrap:wrap}.filters input{flex:1 1 100%}.filters select{max-width:none;flex:1;min-width:130px}.stats{gap:10px}.stats>div{padding:17px}.stats strong{font-size:27px}.stats span{font-size:11px}.page-heading,.section-heading,.curriculum-summary{flex-wrap:wrap}.page-heading h1{font-size:29px}.list-row{flex-wrap:wrap;gap:12px}.chips{font-size:11px}.footer{flex-direction:column;align-items:flex-start}.editor-actions{position:static}.editor-tabs{gap:4px}.editor-tabs a{font-size:12px;padding:8px 10px}.course-hero h1{font-size:31px}.auth-form{padding:24px}.lesson-editor{padding:0 12px}.header .brand{font-size:18px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
