/* Product UI v3: clean EdTech platform, not a themed school landing. */
:root {
  --v3-bg: #f5f6f8;
  --v3-surface: #ffffff;
  --v3-ink: #15171c;
  --v3-muted: #666b76;
  --v3-line: #e4e6eb;
  --v3-primary: #5658e8;
  --v3-primary-dark: #3739b8;
  --v3-lime: #d9ff68;
  --v3-mint: #bdf2db;
  --v3-coral: #ffb7a4;
  --v3-yellow: #ffe59d;
  --v3-radius: 24px;
  --p-font-display: Manrope, "Segoe UI", sans-serif;
}

html { background: var(--v3-bg); }
.public-page { background: var(--v3-bg); color: var(--v3-ink); font-family: Manrope, "Segoe UI", sans-serif; }
.public-page main { padding-top: 84px; }

.public-header {
  background: rgba(255,255,255,.88);
  border: 0;
  border-bottom: 1px solid rgba(21,23,28,.08);
  border-radius: 0;
  box-shadow: none;
  height: 72px;
  inset: 0 0 auto;
  padding: 0 clamp(20px,4vw,64px);
}
.public-header.is-scrolled { background: rgba(255,255,255,.96); box-shadow: 0 10px 30px rgba(25,27,34,.06); }
.public-brand { min-width: 224px; }
.public-brand-mark { height: 42px; width: 42px; }
.public-brand-type strong { color: var(--v3-ink); font-family: Manrope,sans-serif; font-size: 19px; font-weight: 800; letter-spacing: -.04em; }
.public-brand-type b { color: var(--v3-primary); }
.public-brand-type em { color: var(--v3-muted); font-size: 7px; letter-spacing: .18em; }
.public-nav { background: transparent; gap: 6px; padding: 0; }
.public-nav > a { border-radius: 10px; color: #4d515a; font-size: 12px; padding: 10px 12px; }
.public-nav > a:hover,.public-nav > a[aria-current="page"] { background: #f0f1f5; color: var(--v3-ink); }
.public-nav .public-cabinet-link { color: var(--v3-primary); }
.public-header-cta { background: var(--v3-ink); border-radius: 12px; gap: 10px; min-height: 42px; padding: 6px 7px 6px 16px; }
.public-header-cta b { background: var(--v3-lime); color: var(--v3-ink); height: 28px; width: 28px; }

.product-hero { display:grid; gap:20px; grid-template-columns:minmax(0,.82fr) minmax(560px,1.18fr); min-height:calc(100vh - 84px); padding:clamp(24px,4vw,64px); }
.product-hero-copy { align-content:center; display:grid; padding:clamp(20px,2vw,36px) 0; }
.product-kicker { align-items:center; color:var(--v3-muted); display:flex; font-size:11px; font-weight:750; gap:9px; letter-spacing:.08em; text-transform:uppercase; }
.product-kicker i { background:var(--v3-primary); border-radius:50%; height:8px; width:8px; }
.product-hero h1 { font-family:Manrope,sans-serif; font-size:clamp(64px,7vw,124px); font-weight:750; letter-spacing:-.075em; line-height:.86; margin:38px 0 30px; }
.product-hero h1 em { color:var(--v3-primary); font-family:inherit; font-style:normal; font-weight:inherit; }
.product-hero-copy>p { color:var(--v3-muted); font-size:clamp(16px,1.35vw,20px); line-height:1.65; margin:0; max-width:690px; }
.product-hero-actions { align-items:center; display:flex; flex-wrap:wrap; gap:22px; margin-top:34px; }
.product-hero-actions>a { color:var(--v3-ink); font-size:12px; font-weight:750; text-decoration:none; }
.product-hero-actions .product-primary { align-items:center; background:var(--v3-ink); border-radius:14px; color:#fff; display:flex; gap:24px; min-height:54px; padding:0 10px 0 21px; }
.product-primary span { align-items:center; background:var(--v3-lime); border-radius:10px; color:var(--v3-ink); display:flex; height:36px; justify-content:center; width:36px; }
.product-hero-meta { border-top:1px solid var(--v3-line); display:grid; gap:12px; grid-template-columns:repeat(3,1fr); margin-top:55px; padding-top:18px; }
.product-hero-meta span { color:var(--v3-muted); display:grid; font-size:10px; line-height:1.4; }
.product-hero-meta b { color:var(--v3-primary); font-size:9px; margin-bottom:5px; }

.product-demo { align-self:center; background:#171921; border:8px solid #20222b; border-radius:30px; box-shadow:0 45px 100px rgba(28,29,40,.25); color:#fff; min-height:650px; overflow:hidden; transform:perspective(1500px) rotateY(-3deg) rotateX(1deg); }
.product-demo>header { align-items:center; background:#242630; border-bottom:1px solid rgba(255,255,255,.07); display:flex; height:48px; padding:0 15px; }
.product-demo>header>div { display:flex; gap:6px; }
.product-demo>header i { background:#4b4e59; border-radius:50%; height:8px; width:8px; }
.product-demo>header i:first-child { background:#ff796f; }.product-demo>header i:nth-child(2){background:#ffd36a}.product-demo>header i:nth-child(3){background:#6edb91}
.product-demo>header span { color:#989ca9; font-size:9px; margin:auto; }
.product-demo>header b { align-items:center; background:var(--v3-lime); border-radius:8px; color:#171921; display:flex; font-size:9px; height:26px; justify-content:center; width:26px; }
.product-demo-body { display:grid; grid-template-columns:64px 1fr; min-height:594px; }
.product-demo-body>aside { align-items:center; background:#1c1e27; border-right:1px solid rgba(255,255,255,.06); display:flex; flex-direction:column; padding:18px 0; }
.product-demo-body>aside strong { align-items:center; background:var(--v3-primary); border-radius:10px; display:flex; font-size:11px; height:34px; justify-content:center; width:34px; }
.product-demo-body>aside nav { display:grid; gap:18px; margin-top:45px; }
.product-demo-body>aside nav i { border:2px solid #6f7280; border-radius:7px; height:17px; width:17px; }
.product-demo-body>aside nav i.is-active { background:var(--v3-lime); border-color:var(--v3-lime); box-shadow:0 0 0 7px rgba(217,255,104,.08); }
.product-demo-body>aside>span { color:#777a87; font-size:11px; margin-top:auto; }
.product-demo-body>main { background:#f6f7f9; color:var(--v3-ink); padding:32px; }
.demo-topline { align-items:center; display:flex; justify-content:space-between; }
.demo-topline small { color:#8b8f99; font-size:9px; font-weight:700; text-transform:uppercase; }
.demo-topline h2 { font-family:Manrope,sans-serif; font-size:24px; letter-spacing:-.045em; margin:5px 0 0; }
.demo-topline button { background:var(--v3-primary); border:0; border-radius:10px; color:#fff; font-size:10px; font-weight:800; padding:11px 14px; }
.demo-stat-row { display:grid; gap:10px; grid-template-columns:1.3fr 1fr 1fr; margin-top:24px; }
.demo-stat-row article { background:#fff; border:1px solid #e8e9ee; border-radius:14px; display:grid; min-height:82px; padding:13px; }
.demo-stat-row article:first-child { background:var(--v3-lime); border-color:var(--v3-lime); }
.demo-stat-row span { color:#777b84; font-size:8px; text-transform:uppercase; }
.demo-stat-row strong { align-self:end; font-size:24px; letter-spacing:-.05em; }
.demo-journey { background:#fff; border:1px solid #e8e9ee; border-radius:16px; margin-top:12px; padding:17px; }
.demo-journey-head { align-items:start; border-bottom:1px solid #eceef2; display:flex; padding-bottom:14px; }
.demo-journey-head>div { display:grid; }.demo-journey-head span { color:#8a8e98; font-size:8px; text-transform:uppercase; }.demo-journey-head strong { font-size:14px; margin-top:4px; }
.demo-journey-head>b { background:#e8f7ef; border-radius:99px; color:#30865d; font-size:7px; margin-left:auto; padding:6px 8px; text-transform:uppercase; }
.demo-journey ol { display:grid; gap:0; list-style:none; margin:0; padding:0; }
.demo-journey li { align-items:center; border-top:1px solid #f0f1f4; display:flex; gap:12px; min-height:58px; }
.demo-journey li:first-child { border-top:0; }
.demo-journey li>i { align-items:center; border:1px solid #d8dae1; border-radius:50%; color:#999da7; display:flex; font-size:8px; font-style:normal; height:24px; justify-content:center; width:24px; }
.demo-journey li.is-done>i { background:#1e2027; border-color:#1e2027; color:#fff; }.demo-journey li.is-current>i { background:var(--v3-primary); border-color:var(--v3-primary); color:#fff; }
.demo-journey li>div { display:grid; }.demo-journey li strong { font-size:10px; }.demo-journey li small { color:#9498a2; font-size:8px; margin-top:3px; }
.demo-material-row { display:grid; gap:10px; grid-template-columns:1fr 1fr; margin-top:12px; }
.demo-material-row article { background:#fff; border:1px solid #e8e9ee; border-radius:14px; display:grid; min-height:74px; padding:13px; }
.demo-material-row span { color:var(--v3-primary); font-size:7px; font-weight:800; text-transform:uppercase; }.demo-material-row strong { align-self:end; font-size:10px; }

.product-proof { padding:120px clamp(24px,6vw,100px); }
.product-proof>header { align-items:end; display:grid; gap:30px; grid-template-columns:.35fr 1fr; margin-bottom:65px; }
.product-proof>header>span { color:var(--v3-primary); font-size:11px; font-weight:800; text-transform:uppercase; }
.product-proof h2 { font-family:Manrope,sans-serif; font-size:clamp(44px,5vw,78px); font-weight:730; letter-spacing:-.065em; line-height:1.02; margin:0; }
.product-bento { display:grid; gap:16px; grid-template-columns:1.15fr .85fr; }
.product-bento>article { border-radius:var(--v3-radius); min-height:360px; overflow:hidden; padding:32px; }
.product-bento>article>span,.bento-library>div>span { color:#7a7f89; font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.product-bento h3 { font-family:Manrope,sans-serif; font-size:clamp(25px,2.5vw,40px); font-weight:700; letter-spacing:-.055em; line-height:1.08; margin:18px 0; }
.bento-library { background:#191b22; color:#fff; display:grid; gap:30px; grid-template-columns:1fr .85fr; min-height:480px!important; }
.bento-library p { color:#aeb1ba; font-size:13px; line-height:1.65; max-width:440px; }.bento-library>div>span { color:#8b8f9b; }
.bento-topic-stack { align-content:center; display:grid; gap:10px; }
.bento-topic-stack span { align-items:center; background:#2a2c35; border:1px solid rgba(255,255,255,.08); border-radius:14px; color:#fff!important; display:flex; font-size:12px!important; letter-spacing:0!important; padding:18px; text-transform:none!important; transform:rotate(-2deg); }
.bento-topic-stack span:nth-child(2){background:var(--v3-primary);transform:rotate(2deg)}.bento-topic-stack span:nth-child(3){transform:rotate(-1deg)}
.bento-topic-stack b { background:rgba(255,255,255,.12); border-radius:99px; font-size:9px; margin-left:auto; padding:6px 8px; }
.bento-visibility { background:var(--v3-lime); }
.bento-visibility>div { display:flex; flex-wrap:wrap; gap:8px; margin-top:40px; }
.bento-visibility i { background:rgba(255,255,255,.72); border-radius:99px; font-size:10px; font-style:normal; font-weight:750; padding:10px 13px; }.bento-visibility i:last-child{background:var(--v3-ink);color:#fff}
.bento-progress { background:#e9e8ff; display:grid; grid-template-columns:1fr 1.3fr; }
.bento-progress>span { grid-column:1/-1; }.bento-progress h3 { align-self:end; }
.progress-ring { align-items:center; align-self:center; background:conic-gradient(var(--v3-primary) 0 72%,rgba(86,88,232,.13) 72%); border-radius:50%; display:flex; height:145px; justify-content:center; position:relative; width:145px; }.progress-ring::after{background:#e9e8ff;border-radius:50%;content:"";inset:18px;position:absolute}.progress-ring strong{font-size:27px;position:relative;z-index:1}
.bento-rhythm { background:#fff; border:1px solid var(--v3-line); }
.bento-rhythm ul { display:grid; list-style:none; margin:32px 0 0; padding:0; }.bento-rhythm li { align-items:center; border-top:1px solid var(--v3-line); display:grid; gap:12px; grid-template-columns:48px 1fr auto; min-height:55px; }.bento-rhythm li b{font-size:10px}.bento-rhythm li span{font-size:11px}.bento-rhythm li i{background:#f0f1f4;border-radius:99px;font-size:8px;font-style:normal;padding:6px 8px}

/* Existing content, rebuilt into the same product system. */
.public-section { padding:110px clamp(24px,6vw,100px); }
.public-section-head { align-items:end; border:0; margin-bottom:45px; padding:0; }
.public-section-head h2 { font-family:Manrope,sans-serif; font-size:clamp(42px,5vw,74px); font-weight:730; letter-spacing:-.065em; line-height:1.02; }
.public-section-head>a { background:#fff; border:1px solid var(--v3-line); border-radius:12px; color:var(--v3-ink); font-size:11px; padding:12px 15px; }
.public-eyebrow { color:var(--v3-primary); font-size:9px; }
.public-subjects { background:#fff; }
.subject-grid { gap:12px; }
.subject-card { background:var(--v3-bg); border:0; border-radius:18px; min-height:390px; padding:25px; }
.subject-card::after { border-radius:20px; height:8px; inset:auto 24px 24px; opacity:1; width:auto; }
.subject-card>b { color:var(--v3-primary); font-family:Manrope,sans-serif; font-size:46px; font-weight:800; }
.subject-card h3 { font-family:Manrope,sans-serif; font-size:38px; font-weight:720; letter-spacing:-.055em; }.subject-card p{font-size:12px}.subject-card>i{margin-bottom:22px}
.public-programs { background:var(--v3-bg); }
.public-program-grid:has(.public-program-visual) { gap:16px; }
.public-program-card:has(.public-program-visual) { background:#fff; border:1px solid var(--v3-line); border-radius:18px; box-shadow:none; min-height:610px; }
.public-program-visual { height:260px; }.public-program-visual img{filter:saturate(.75)}
.public-program-card:has(.public-program-visual)>header span { background:var(--v3-lime); }.public-program-card:has(.public-program-visual)>header b{background:rgba(255,255,255,.92)}
.public-program-card:has(.public-program-visual) .public-pill { background:#efefff; color:var(--v3-primary); }
.public-program-card:has(.public-program-visual) h3 { font-family:Manrope,sans-serif; font-size:34px; font-weight:720; letter-spacing:-.05em; }
.public-program-card:has(.public-program-visual)>footer>a { background:var(--v3-ink); color:#fff; }
.public-method { background:transparent; gap:16px; grid-template-columns:1fr 1fr; margin:16px; min-height:650px; }
.method-visual { background:var(--v3-primary); border-radius:20px; }.method-big{color:#fff;font-family:Manrope,sans-serif;opacity:.12}.method-stilllife{display:none}.method-visual::after{background:radial-gradient(circle at 68% 48%,var(--v3-lime) 0 10%,transparent 10.5%),radial-gradient(circle at 44% 62%,var(--v3-coral) 0 7%,transparent 7.5%),linear-gradient(145deg,transparent 45%,rgba(255,255,255,.14) 46% 54%,transparent 55%);content:"";inset:0;position:absolute}.method-visual p{color:#fff;font-size:18px;z-index:2}
.method-copy { background:#191b22; border-radius:20px; }.method-copy h2{font-family:Manrope,sans-serif;font-size:clamp(44px,5vw,70px);font-weight:720;letter-spacing:-.06em}.method-copy h2 em{color:var(--v3-lime);font-style:normal}.method-copy li>span{color:var(--v3-lime)}
.public-teachers { background:#fff; }.teacher-showcase{gap:16px}.public-teacher-card{border:1px solid var(--v3-line);border-radius:18px;box-shadow:none}.public-teacher-card h3{font-family:Manrope,sans-serif;font-weight:720}.teacher-quote{background:#191b22;border-radius:18px}.teacher-quote p{font-family:Manrope,sans-serif;font-weight:650;letter-spacing:-.04em}.teacher-quote>span{color:var(--v3-lime)}
.public-request { background:transparent; gap:16px; margin:16px; }.request-copy{background:var(--v3-primary);border-radius:20px}.request-copy h2{font-family:Manrope,sans-serif;font-weight:730;letter-spacing:-.06em}.request-copy h2 em{color:var(--v3-lime);font-style:normal}.request-stilllife{display:none}.request-copy::after{background:radial-gradient(circle at 70% 70%,var(--v3-lime) 0 8%,transparent 8.5%),radial-gradient(circle at 80% 58%,var(--v3-coral) 0 5%,transparent 5.5%);content:"";inset:0;position:absolute;pointer-events:none}.public-form{border:1px solid var(--v3-line);border-radius:20px}.public-field .form-control{background:var(--v3-bg);border-color:var(--v3-line)}.public-button--lime{background:var(--v3-lime);box-shadow:none;color:var(--v3-ink)}
.public-footer{background:#191b22;border-radius:0;margin:0}.public-footer-main h2{font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.05em}.public-footer-main>a:last-child{color:var(--v3-lime)}

.public-inner-hero,.subject-profile-hero,.course-detail-hero { background:#191b22; border-radius:20px; margin:16px; }.public-inner-hero h1,.subject-profile-hero h1,.course-detail-hero h1,.teacher-profile-copy h1{font-family:Manrope,sans-serif;font-weight:730;letter-spacing:-.065em}.values-grid article,.about-teacher,.course-profile-card,.course-product-grid article{border:1px solid var(--v3-line);border-radius:18px;box-shadow:none}
.portal-login-shell{background:var(--v3-bg);gap:12px;padding:12px}.portal-login-story{background:#191b22;border-radius:20px}.portal-login-story::after{border-color:var(--v3-primary)}.portal-login-copy h1,.portal-login-form-copy h2{font-family:Manrope,sans-serif;font-weight:730;letter-spacing:-.065em}.portal-login-copy h1 em{color:var(--v3-lime);font-style:normal}.portal-login-ticket{background:var(--v3-primary)}.portal-login-panel{border-radius:20px}.portal-login-field input{background:var(--v3-bg);border-color:var(--v3-line)}

@media(max-width:1180px){.product-hero{grid-template-columns:1fr}.product-hero-copy{min-height:650px}.product-demo{justify-self:center;max-width:880px;width:100%}.product-proof>header{grid-template-columns:1fr}.public-program-grid:has(.public-program-visual){grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.public-header{height:66px}.public-nav{background:#191b22;border-radius:14px;top:66px}.public-nav>a{color:#fff}.public-page main{padding-top:72px}.product-hero{padding:24px}.product-bento{grid-template-columns:1fr}.public-method{grid-template-columns:1fr}.method-visual{min-height:430px}}
@media(max-width:760px){.public-header{inset:0 0 auto}.public-brand-type{display:grid!important}.public-brand-type em{display:none}.product-hero{gap:30px;padding:50px 16px}.product-hero-copy{min-height:auto}.product-hero h1{font-size:clamp(56px,18vw,76px);margin:28px 0 23px}.product-hero-copy>p{font-size:16px}.product-hero-actions{align-items:stretch;display:grid}.product-hero-actions .product-primary{justify-content:space-between}.product-hero-meta{grid-template-columns:1fr}.product-demo{border-width:5px;border-radius:20px;min-height:520px;transform:none}.product-demo-body{grid-template-columns:42px 1fr;min-height:470px}.product-demo-body>aside{padding-top:12px}.product-demo-body>aside strong{height:27px;width:27px}.product-demo-body>aside nav{gap:14px;margin-top:30px}.product-demo-body>aside nav i{height:14px;width:14px}.product-demo-body>main{padding:18px 13px}.demo-topline h2{font-size:17px}.demo-topline button{font-size:0;padding:0;width:34px}.demo-topline button::after{content:"+";font-size:15px}.demo-stat-row{grid-template-columns:repeat(3,1fr)}.demo-stat-row article{min-height:68px;padding:9px}.demo-stat-row strong{font-size:18px}.demo-stat-row span{font-size:6px}.demo-journey{padding:12px}.demo-journey li{min-height:51px}.demo-material-row{display:none}.product-proof{padding:80px 16px}.product-proof>header{margin-bottom:40px}.product-proof h2{font-size:clamp(39px,12vw,52px)}.product-bento>article{min-height:330px;padding:24px}.bento-library{grid-template-columns:1fr;min-height:590px!important}.bento-progress{grid-template-columns:1fr 1.2fr}.progress-ring{height:110px;width:110px}.public-section{padding:80px 16px}.public-section-head h2{font-size:clamp(39px,12vw,52px)}.subject-grid{grid-template-columns:1fr}.public-program-grid:has(.public-program-visual){grid-template-columns:1fr}.public-method,.public-request{margin:8px}.method-copy,.request-copy,.public-form{border-radius:16px}.public-teacher-card{grid-template-columns:1fr}.teacher-portrait{height:320px}.public-request{grid-template-columns:1fr}.request-copy{min-height:540px;padding-bottom:80px}.portal-login-shell{padding:8px}.portal-login-story,.portal-login-panel{border-radius:16px}}
@media(max-width:380px){.product-hero{padding-inline:12px}.product-hero h1{font-size:53px}.product-demo-body>main{padding-inline:9px}.demo-journey li strong{font-size:9px}.product-bento>article{padding:20px}.bento-progress{grid-template-columns:1fr}.progress-ring{margin-top:20px}.public-section{padding-inline:12px}}
@media(prefers-reduced-motion:reduce){.product-demo{transform:none}}