
:root{--b:#1368e8;--b2:#0a4fb9;--sky:#eff6ff;--navy:#07182f;--t:#18243a;--m:#68758a;--line:#dce8f7}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,sans-serif;color:var(--t);line-height:1.6;background:#fff}a{text-decoration:none;color:inherit}.container{width:min(1160px,92%);margin:auto}
.top{background:var(--navy);color:#dce8fa;font-size:.84rem}.top .container{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:8px 0}
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);border-bottom:1px solid #edf2f8}.nav{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:12px;font-weight:900}.brand img{width:58px;height:58px;border-radius:14px;object-fit:cover}.brand small{display:block;color:#718096;font-size:.68rem;letter-spacing:.08em}.links{display:flex;gap:22px;align-items:center;font-weight:700;color:#32435d}.links a:hover,.links .active{color:var(--b)}.menu{display:none}
.btn{display:inline-flex;padding:13px 20px;border-radius:12px;font-weight:800;border:1px solid transparent}.primary{background:linear-gradient(135deg,var(--b),#2f90ff);color:#fff}.outline{border-color:#bfd7f5;color:var(--b);background:#fff}
.hero{padding:82px 0 70px;background:linear-gradient(180deg,#f7fbff,#fff);overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}.eyebrow{color:var(--b);font-size:.78rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}h1{font-size:clamp(2.8rem,6vw,5.1rem);line-height:1.03;letter-spacing:-.045em;margin:.7rem 0 1.2rem;color:#0a234c}.lead{font-size:1.12rem;color:#627089}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.paycard{background:#fff;border:1px solid #deebf8;border-radius:28px;padding:24px;box-shadow:0 20px 55px rgba(26,79,150,.12)}.app{min-height:460px;border-radius:24px;padding:20px;background:linear-gradient(180deg,#f8fbff,#eef6ff);position:relative}.apphead{display:flex;justify-content:space-between;align-items:center}.mini{width:44px;height:44px;border-radius:12px}.balance{margin:24px 0;padding:20px;background:linear-gradient(135deg,#0e5dd4,#2f90ff);border-radius:20px;color:#fff}.quick{display:grid;grid-template-columns:1fr 1fr;gap:12px}.q{padding:16px;border-radius:16px;background:#fff;border:1px solid #deebf8}.q span{font-size:1.35rem}.q strong{display:block;margin-top:9px}.q small{color:#7a8798}
.section{padding:76px 0}.alt{background:#f7fbff}.title{max-width:760px;margin-bottom:32px}.title h2{font-size:clamp(2rem,4vw,3.3rem);line-height:1.08;margin:.4rem 0}.title p{color:var(--m)}.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card{background:#fff;border:1px solid #dfebf8;border-radius:22px;padding:24px;box-shadow:0 12px 35px rgba(28,78,145,.07)}.icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#eaf4ff;color:var(--b);font-size:1.25rem;margin-bottom:14px}.card p{color:var(--m)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.step{padding:26px;border:1px solid #deebf8;border-radius:20px;background:#fff}.step b{color:var(--b)}.step p{color:var(--m)}
.band{background:linear-gradient(135deg,#0b56c7,#176fe8 55%,#42a2ff);color:#fff;border-radius:28px;padding:38px;display:grid;grid-template-columns:1fr 1fr;gap:28px}.band p{color:#ddecff}.features{display:grid;grid-template-columns:1fr 1fr;gap:12px}.features div{background:rgba(255,255,255,.12);padding:14px;border-radius:14px}
.pagehero{padding:62px 0 40px;background:linear-gradient(180deg,#eef6ff,#fff)}.pagehero h1{font-size:clamp(2.4rem,5vw,4rem)}.prose{max-width:900px}.prose h2{margin-top:2rem;color:#123461}.prose p,.prose li{color:#5f6f84}.prose a{color:var(--b)}
.contact{display:grid;grid-template-columns:.85fr 1.15fr;gap:24px}.info{padding:18px;border:1px solid #deebf8;border-radius:14px;background:#f7fbff;margin-bottom:12px}label{display:block;font-weight:800;margin-bottom:7px}input,textarea{width:100%;padding:13px;border:1px solid #ccdef3;border-radius:11px}.fg{display:grid;grid-template-columns:1fr 1fr;gap:14px}.full{grid-column:1/-1}.note{padding:18px;border-left:3px solid var(--b);background:#eff6ff;border-radius:12px;color:#4e6380}
footer{background:var(--navy);color:#d8e5f7;padding:48px 0 22px;margin-top:30px}.foot{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:25px}footer p,footer a{color:#aebdd1;font-size:.9rem}footer a{display:block;margin:7px 0}.bottom{border-top:1px solid #1a3150;margin-top:26px;padding-top:18px;color:#8799af;font-size:.82rem}
@media(max-width:900px){.menu{display:block;background:#fff;border:1px solid #dce8f7;border-radius:10px;padding:8px}.links{display:none;position:absolute;top:78px;left:4%;right:4%;background:#fff;padding:16px;border:1px solid #dce8f7;border-radius:16px;flex-direction:column}.links.open{display:flex}.hero-grid,.band,.contact{grid-template-columns:1fr}.g4,.g3{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.g4,.g3,.steps,.features,.foot,.fg{grid-template-columns:1fr}.full{grid-column:auto}.brand small{display:none}}

/* ===== E-Classes ===== */
.course-hero{padding:54px 0 28px;background:#fff}
.course-hero h1{font-size:clamp(2.4rem,5vw,4rem);margin:.2rem 0 .5rem;color:#0a234c}
.course-hero p{color:#60718a;font-size:1.08rem}
.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.course-card{border:1px solid #dbe8f7;border-radius:22px;overflow:hidden;background:#fff;box-shadow:0 12px 35px rgba(28,78,145,.07);display:flex;flex-direction:column}
.course-thumb{height:215px;position:relative;overflow:hidden;padding:22px;background:linear-gradient(135deg,#07182f,#0f4fbf 55%,#32a1ff);color:#fff}
.course-thumb:before{content:"";position:absolute;width:170px;height:170px;border-radius:50%;right:-45px;top:-55px;background:rgba(255,255,255,.12)}
.course-thumb:after{content:"";position:absolute;left:20px;right:20px;bottom:20px;height:2px;background:linear-gradient(90deg,transparent,#7ed4ff,transparent);box-shadow:0 0 18px #7ed4ff}
.course-thumb .big-icon{position:absolute;right:24px;bottom:28px;font-size:4.2rem;filter:drop-shadow(0 12px 16px rgba(0,0,0,.25))}
.course-thumb .label{position:relative;z-index:2;font-weight:900;font-size:1.45rem;line-height:1.05;max-width:70%}
.course-thumb .sub{position:relative;z-index:2;font-size:.78rem;color:#d8ecff;margin-top:8px}
.course-body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.course-body h3{margin:0;font-size:1.2rem;color:#132540}.teacher{color:#6c7c93;font-size:.9rem}
.tags{display:flex;gap:8px;flex-wrap:wrap}.tag{padding:6px 10px;border-radius:999px;background:#f0f5fb;color:#52637a;font-size:.76rem}.tag.accent{background:#fff0bf;color:#a85a00}
.course-bottom{margin-top:auto;padding-top:15px;border-top:1px solid #edf2f8;display:flex;align-items:end;justify-content:space-between;gap:14px}
.price{font-size:1.35rem;font-weight:900;color:#0e254a}.price small{display:block;font-size:.74rem;font-weight:500;color:#75859a}
.course-detail{padding:50px 0}
.detail-top{border:1px solid #dbe8f7;border-radius:22px;padding:26px;display:grid;grid-template-columns:.95fr 1.05fr;gap:28px;background:#fff}
.detail-banner{min-height:300px;border-radius:18px;background:linear-gradient(135deg,#061932,#0d55c9,#31a0ff);color:#fff;padding:28px;position:relative;overflow:hidden}
.detail-banner:after{content:"";position:absolute;width:220px;height:220px;border:36px solid rgba(255,255,255,.1);border-radius:50%;right:-80px;bottom:-80px}
.detail-banner .big-icon{font-size:6rem;position:absolute;right:28px;bottom:22px}
.detail-banner h2{font-size:2rem;max-width:70%;line-height:1.05;position:relative;z-index:2}
.detail-copy h1{font-size:clamp(2rem,4vw,3rem);margin:.2rem 0 .4rem}
.detail-copy p{color:#5f7088}
.detail-price-row{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid #edf2f8;margin-top:24px;padding-top:20px}
.detail-price{font-size:1.8rem;font-weight:900;color:#0f2d58}
.detail-price small{display:block;font-size:.78rem;color:#6f8095;font-weight:500}
.detail-columns{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:24px}
.detail-box{border:1px solid #dbe8f7;border-radius:18px;padding:22px;background:#fff}
.detail-box h3{margin-top:0}.detail-box ul{padding-left:20px;color:#52647d}.detail-box li{margin:9px 0}
.req-box{margin-top:22px;border:1px solid #dbe8f7;border-radius:18px;padding:22px}
@media(max-width:900px){.course-grid{grid-template-columns:1fr 1fr}.detail-top{grid-template-columns:1fr}.detail-columns{grid-template-columns:1fr}}
@media(max-width:640px){.course-grid{grid-template-columns:1fr}.course-thumb{height:190px}.detail-banner{min-height:240px}}
