/* edu.sorvian.io 落地页 r0 — 配色沿用 sorvian.io/education/ 学院主题 */
:root{--ink:#1a1f5c;--muted:#56608a;--line:#dfe5fb;--blue:#2f6bff;--violet:#7b3fe4;--orange:#ff9a1f;--sky:#eef5ff;--grad:linear-gradient(120deg,#2f6bff 0%,#7b3fe4 55%,#ff9a1f 100%);--grad-btn:linear-gradient(120deg,#3346d8,#6a35d6);--grad-text:linear-gradient(110deg,#2a4fe0 0%,#6a35d6 60%,#c2410c 100%);--focus:#5b2fd6}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;color:var(--ink);background:#f5f8ff;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}
html[data-lang="zh"] .en,html[data-lang="en"] .zh{display:none}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 12px;border-radius:8px;z-index:50}
.skip:focus{left:8px}

.top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top-row{display:flex;align-items:center;gap:20px;height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand img{width:44px;height:44px}
.brand-txt{display:flex;flex-direction:column;line-height:1.15}
.brand-txt b{font-size:16px;letter-spacing:.2px}
.brand-txt small{font-size:12px;color:var(--muted)}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{text-decoration:none;font-size:15px;color:var(--muted);padding:8px 12px;border-radius:999px}
.nav a:hover{background:var(--sky);color:var(--ink)}
.top-act{display:flex;align-items:center;gap:10px}
.lang{display:flex;background:#eef1fb;border-radius:999px;padding:3px}
.lang button{border:0;background:transparent;font:inherit;font-size:13px;font-weight:600;color:var(--muted);padding:5px 11px;border-radius:999px;cursor:pointer;min-height:32px}
.lang button[aria-pressed="true"]{background:#fff;color:var(--ink);box-shadow:0 1px 4px rgba(40,60,160,.15)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:48px;padding:0 22px;border-radius:999px;background:var(--grad-btn);color:#fff;font-weight:700;text-decoration:none;box-shadow:0 6px 18px rgba(70,60,210,.28);transition:transform .15s}
.btn:hover{transform:translateY(-1px)}
.btn-sm{min-height:38px;padding:0 16px;font-size:14px}
.btn-ghost{background:#fff;color:var(--ink);border:1.5px solid #cfd8f7;box-shadow:none}

.hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#e9f1ff 0%,#efe9ff 60%,#fff1e0 100%);padding:56px 0 64px}
.hero-grid{position:relative;display:grid;grid-template-columns:1fr 1.1fr;gap:40px;align-items:center}
.pills{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.pills span{font-size:13px;font-weight:700;letter-spacing:.8px;padding:6px 12px;border-radius:999px;background:#fff;border:1px solid #d7dffa}
.pills span:nth-child(1){color:#2a4fe0}.pills span:nth-child(2){color:#c2410c}.pills span:nth-child(3){color:#6a35d6}.pills span:nth-child(4){color:#1a1f5c}
h1{font-size:46px;line-height:1.18;margin:0 0 18px;letter-spacing:-.5px}
h1 em{font-style:normal;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:18px;color:var(--muted);margin:0 0 26px;max-width:34em}
.cta{display:flex;flex-wrap:wrap;gap:12px}
figure{margin:0;position:relative}
.hero-art img,.campus-art img{border-radius:24px;box-shadow:0 20px 50px rgba(60,70,180,.22);border:4px solid #fff}
.ai-tag{position:absolute;right:14px;bottom:14px;font-size:12px;font-weight:700;color:#fff;background:rgba(26,31,92,.72);padding:4px 10px;border-radius:999px;letter-spacing:.3px}

.cube{position:absolute;width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,#7fb0ff,#2f6bff);box-shadow:0 6px 14px rgba(47,107,255,.35);transform:rotate(18deg);animation:bob 6s ease-in-out infinite}
.cube.o{background:linear-gradient(135deg,#ffd27a,#ff9a1f);box-shadow:0 6px 14px rgba(255,154,31,.35)}
.c1{left:3%;top:14%}.c2{left:44%;top:8%;width:18px;height:18px;animation-delay:-2s}.c3{right:4%;bottom:10%;width:20px;height:20px;animation-delay:-4s}.c4{left:8%;bottom:12%;width:16px;height:16px;animation-delay:-1s}
.spark{position:absolute;width:22px;height:22px;background:#ffb326;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);animation:twinkle 3s ease-in-out infinite}
.s1{left:40%;bottom:16%}.s2{right:8%;top:10%;width:16px;height:16px;animation-delay:-1.5s}
@keyframes bob{50%{transform:translateY(-10px) rotate(28deg)}}
@keyframes twinkle{50%{transform:scale(.6);opacity:.6}}
@media (prefers-reduced-motion:reduce){.cube,.spark{animation:none}html{scroll-behavior:auto}}

.band{background:#fff;border-block:1px solid var(--line)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding-block:34px}
.step b{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--grad);color:#fff;font-size:15px}
.step h3{margin:10px 0 4px;font-size:17px}
.step p{margin:0;color:var(--muted);font-size:15px}

.sec{padding:72px 0}
.sec-tint{background:linear-gradient(180deg,#f1f5ff,#f6f1ff)}
h2{font-size:32px;line-height:1.25;margin:0 0 10px;letter-spacing:-.3px}
.sub{font-size:17px;color:var(--muted);margin:0 0 28px;max-width:40em}
.note{font-size:13px;color:var(--muted);margin:18px 0 0}

.grades{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.grade{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px 20px 56px;box-shadow:0 6px 20px rgba(60,80,180,.07);overflow:hidden}
.grade::before{content:"";position:absolute;left:0;right:0;top:0;height:6px}
.g1::before{background:#2f6bff}.g2::before{background:#7b3fe4}.g3::before{background:#ff9a1f}.g4::before{background:var(--grad)}
.g-age{display:inline-block;font-size:13px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--sky);color:#2a4fe0}
.g2 .g-age{background:#f1ebff;color:#6a35d6}.g3 .g-age{background:#fff1e0;color:#c2410c}.g4 .g-age{background:#eef1fb;color:var(--ink)}
.grade h3{font-size:22px;margin:12px 0 6px}
.grade p{margin:0;color:var(--muted);font-size:15px}
.g-floor{position:absolute;left:20px;bottom:18px;font-size:13px;font-weight:700;color:var(--ink)}
.g-floor::before{content:"🏢 "}

.campus{display:grid;grid-template-columns:1fr 1.15fr;gap:44px;align-items:center}
.campus.rev{grid-template-columns:1.15fr 1fr}
.floors{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:8px;max-width:420px}
.floors li{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 14px}
.floors b{min-width:52px;text-align:center;font-size:18px;padding:4px 0;border-radius:10px;background:var(--sky);color:#2a4fe0}
.floors li.lobby{border-color:#c9b8f5;background:linear-gradient(120deg,#fff,#f4efff)}
.floors li.lobby b{background:var(--grad);color:#fff}
.badge-dev{display:inline-block;margin:0;font-weight:700;font-size:14px;padding:6px 14px;border-radius:999px;background:#fff1e0;color:#9a3412;border:1px solid #ffd7a8}
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.ticks li{position:relative;padding-left:30px;font-size:16px}
.ticks li::before{content:"✦";position:absolute;left:4px;top:0;color:var(--orange)}

.parents{display:grid;grid-template-columns:1.2fr 1fr;gap:44px;align-items:center}
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:26px}
.feat>div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px}
.feat i{font-style:normal;font-size:24px}
.feat h3{margin:6px 0 2px;font-size:16px}
.feat p{margin:0;font-size:14px;color:var(--muted)}
.mock{background:#fff;border-radius:22px;border:1px solid var(--line);box-shadow:0 20px 50px rgba(60,70,180,.18);padding:16px 18px 18px}
.mock-bar{display:flex;gap:6px;margin-bottom:14px}.mock-bar span{width:10px;height:10px;border-radius:50%;background:#dfe5fb}
.mock-kid{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;background:linear-gradient(120deg,#e9f1ff,#efe9ff 60%,#fff1e0)}
.mock-av{width:46px;height:46px;border-radius:14px;background:#fff;display:grid;place-items:center;font-size:24px}
.mock-kid b{display:block;font-size:15px}.mock-kid small{color:var(--muted);font-size:12px}
.mock-chip{margin-left:auto;font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;background:#fff;color:#2a4fe0}
.mock-row{display:flex;align-items:center;gap:12px;margin-top:14px;font-size:13px;font-weight:600;color:var(--muted)}
.mock-row>span{width:40px}
.mock-thumbs{display:flex;gap:8px;flex:1}.mock-thumbs i{flex:1;height:54px;border-radius:12px;background:linear-gradient(135deg,#e7efff,#efe7ff)}
.mock-thumbs i:nth-child(2){background:linear-gradient(135deg,#fff1e0,#ffe2bd)}
.mock-bars{flex:1;display:grid;gap:7px}.mock-bars i{display:block;height:9px;border-radius:9px;background:var(--grad)}
.mock-bars .w72{width:72%}.mock-bars .w54{width:54%}.mock-bars .w63{width:63%}
.mock-cap{margin:14px 0 0;font-size:12px;color:var(--muted);text-align:center}

.final-box{display:flex;align-items:center;gap:32px;background:#fff;border:1px solid var(--line);border-radius:28px;padding:32px 36px;box-shadow:0 10px 30px rgba(60,80,180,.08)}
.final-box img{width:120px;height:120px;flex:none}
.final-box p{color:var(--muted);margin:0 0 18px}
.final{padding-top:0;background:linear-gradient(180deg,#f6f1ff 0,#f5f8ff 120px)}

.foot{border-top:1px solid var(--line);background:#fff;padding:22px 0;font-size:14px;color:var(--muted)}
.foot-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px}
.foot-links{display:flex;flex-wrap:wrap;gap:16px}
.foot a{text-decoration:none}.foot a:hover{color:var(--ink)}

@media (max-width:980px){
  .nav{display:none}
  .top-act{margin-left:auto}
  .hero-grid,.campus,.campus.rev,.parents{grid-template-columns:1fr}
  .campus.rev figure{order:2}
  .grades{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  h1{font-size:38px}
}
@media (max-width:600px){
  .wrap{padding:0 16px}
  .top-row{height:58px;gap:10px}
  .brand img{width:38px;height:38px}
  .brand-txt b{font-size:14px}
  .top-act .btn-sm{display:none}
  .hero{padding:32px 0 40px}
  .c1{left:auto;right:5%;top:3%}.c2{left:auto;right:30%;top:2%}
  h1{font-size:31px}
  .lead{font-size:16px}
  .cta .btn{flex:1 1 100%}
  .sec{padding:48px 0}
  h2{font-size:25px}
  .sub{font-size:16px}
  .grades,.steps,.feat{grid-template-columns:1fr}
  .steps{gap:16px;padding-block:28px}
  .final-box{flex-direction:column;text-align:center;padding:26px 18px}
  .final-box .cta{justify-content:center}
  .hero-art img,.campus-art img{border-radius:18px}
}