/* ============================================================
   正向循环 · AI 学习法 — 官网样式
   Design: 克制的精密感 + 教育暖色
   ============================================================ */

:root{
  --ink:        #0A1729;   /* 主深墨蓝 */
  --ink-2:      #102A4C;
  --ink-3:      #1B3C6B;
  --primary:    #1F5FA8;
  --primary-lt: #2E74C9;
  --accent:     #F27438;   /* 暖橙 */
  --accent-lt:  #FF9A56;
  --gold:       #E8A33D;

  --paper:      #FFFFFF;
  --paper-2:    #F7F9FC;
  --paper-3:    #EFF3F9;
  --line:       #E2E7F0;
  --line-2:     #EDF0F6;

  --tx:         #16233A;
  --tx-2:       #4A5A73;
  --tx-3:       #7A879B;

  --r:          14px;
  --r-lg:       20px;
  --wrap:       1160px;
  --ease:       cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; scroll-padding-top:76px; }
#teachers,#voices,#contact{ scroll-margin-top:76px; }

body{
  margin:0;
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  color:var(--tx);
  background:var(--paper);
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  font-size:16px;
}

h1,h2,h3,h4{ margin:0; line-height:1.28; letter-spacing:-.01em; font-weight:700; }
p{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
a{ color:inherit; text-decoration:none; }
b,strong{ font-weight:700; }
em{ font-style:normal; }

.wrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding:0 28px; }

/* ---------- 通用按钮 ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 26px; border-radius:999px;
  font-size:15px; font-weight:600; letter-spacing:.01em;
  border:1.5px solid transparent; cursor:pointer;
  transition:all .22s var(--ease); white-space:nowrap;
}
.btn-lg{ padding:16px 34px; font-size:16px; }
.btn-sm{ padding:9px 18px; font-size:14px; }
.btn-block{ display:flex; width:100%; }

.btn-primary{
  background:linear-gradient(135deg,var(--accent) 0%,var(--accent-lt) 100%);
  color:#fff; box-shadow:0 6px 20px -6px rgba(242,116,56,.55);
}
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 12px 28px -8px rgba(242,116,56,.6); }

.btn-outline{
  background:transparent; color:var(--ink); border-color:var(--line);
}
.btn-outline:hover{ border-color:var(--ink); background:var(--ink); color:#fff; }

.btn-ghost{
  background:rgba(255,255,255,.06); color:#fff; border-color:rgba(255,255,255,.28);
  backdrop-filter:blur(6px);
}
.btn-ghost:hover{ background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.5); }

.btn-ghost-light{
  background:transparent; color:rgba(255,255,255,.92); border-color:rgba(255,255,255,.4);
}
.btn-ghost-light:hover{ background:rgba(255,255,255,.12); }

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(255,255,255,.82);
  backdrop-filter:saturate(180%) blur(18px);
  border-bottom:1px solid transparent;
  transition:all .3s var(--ease);
}
.nav.scrolled{ border-bottom-color:var(--line); box-shadow:0 2px 24px -12px rgba(10,23,41,.28); }
.nav-inner{
  max-width:var(--wrap); margin:0 auto; padding:0 28px;
  height:68px; display:flex; align-items:center; gap:28px;
}
.brand{ display:flex; align-items:center; gap:10px; color:var(--ink); flex-shrink:0; }
.brand-mark{ display:flex; color:var(--accent); }
.brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.brand-text b{ font-size:17px; letter-spacing:.02em; }
.brand-text i{ font-style:normal; font-size:11px; color:var(--tx-3); letter-spacing:.16em; }

.nav-links{ display:flex; gap:4px; margin-left:auto; }
.nav-links a{
  padding:7px 13px; border-radius:8px; font-size:14px; color:var(--tx-2);
  transition:all .18s var(--ease);
}
.nav-links a:hover{ color:var(--ink); background:var(--paper-3); }
.nav-links a.active{ color:var(--accent); font-weight:600; }

.nav-cta{ margin-left:6px; }
.nav-toggle{ display:none; margin-left:auto; background:none; border:0; cursor:pointer; padding:8px; }
.nav-toggle span{ display:block; width:20px; height:2px; background:var(--ink); margin:4px 0; border-radius:2px; }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative; overflow:hidden;
  padding:150px 0 0;
  background:
    radial-gradient(1100px 620px at 78% 8%, rgba(46,116,201,.22) 0%, transparent 62%),
    radial-gradient(760px 480px at 8% 82%, rgba(242,116,56,.16) 0%, transparent 60%),
    linear-gradient(168deg, var(--ink) 0%, var(--ink-2) 52%, #14314F 100%);
  color:#fff;
}
.hero-glow{
  position:absolute; width:520px; height:520px; right:-120px; top:-160px;
  background:radial-gradient(circle, rgba(255,154,86,.24) 0%, transparent 66%);
  filter:blur(30px); pointer-events:none;
}
.hero-grid{
  position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 90% 70% at 50% 30%, #000 30%, transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 50% 30%, #000 30%, transparent 78%);
}
.hero-inner{
  position:relative; display:grid; grid-template-columns:1.15fr .85fr;
  gap:64px; align-items:center; padding-bottom:96px;
}

.eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  padding:7px 16px 7px 12px; border-radius:999px;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16);
  font-size:13px; color:rgba(255,255,255,.86); margin-bottom:26px;
  backdrop-filter:blur(6px);
}
.eyebrow .dot{
  width:7px; height:7px; border-radius:50%; background:var(--accent-lt);
  box-shadow:0 0 0 4px rgba(255,154,86,.22);
}

.hero h1{
  font-size:52px; line-height:1.22; letter-spacing:-.02em; margin-bottom:26px;
  font-weight:800;
}
.hero h1 .hl-dim{ color:rgba(255,255,255,.5); }
.hero h1 .hl{
  background:linear-gradient(120deg,var(--accent-lt) 0%,var(--gold) 90%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  position:relative;
}
.hero-sub{
  font-size:17px; line-height:1.85; color:rgba(255,255,255,.74);
  max-width:600px; margin-bottom:36px;
}
.hero-sub b{ color:#fff; font-weight:600; }

.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:26px; }

.hero-note{
  display:inline-flex; align-items:center; gap:9px;
  font-size:13.5px; color:rgba(255,255,255,.6);
}
.hero-note svg{ flex-shrink:0; }

/* Hero 数据卡 */
.hero-card{
  position:relative;
  background:linear-gradient(160deg, rgba(255,255,255,.13) 0%, rgba(255,255,255,.05) 100%);
  border:1px solid rgba(255,255,255,.18);
  border-radius:22px; padding:34px 32px;
  backdrop-filter:blur(14px);
  box-shadow:0 30px 70px -30px rgba(0,0,0,.6);
}
.hero-card::before{
  content:''; position:absolute; inset:0; border-radius:22px; padding:1px;
  background:linear-gradient(150deg, rgba(255,154,86,.5), transparent 45%, rgba(46,116,201,.4));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.hc-label{
  font-size:12px; letter-spacing:.14em; color:rgba(255,255,255,.6);
  text-transform:uppercase; margin-bottom:18px;
}
.hc-big{ display:flex; align-items:baseline; gap:8px; }
.hc-big .num{
  font-size:76px; font-weight:800; line-height:.9; letter-spacing:-.03em;
  background:linear-gradient(120deg,#fff 0%, var(--accent-lt) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hc-big .unit{ font-size:19px; color:rgba(255,255,255,.7); font-weight:600; }
.hc-line{ height:1px; background:linear-gradient(90deg, rgba(255,255,255,.3), transparent); margin:22px 0 18px; }
.hc-text{ font-size:15px; line-height:1.9; color:rgba(255,255,255,.8); }
.hc-text b{ color:#fff; }
.hc-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.hc-tags span{
  font-size:12px; padding:5px 12px; border-radius:6px;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.82);
}

/* Hero 探索视觉 */
.hero-visual{
  position:relative; min-height:560px; isolation:isolate;
  border-radius:32px; overflow:hidden;
  background:
    radial-gradient(circle at 52% 38%, rgba(54,139,239,.22), transparent 28%),
    radial-gradient(circle at 22% 18%, rgba(255,154,86,.24), transparent 24%),
    rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.08);
}
.hero-astronaut{
  position:absolute; inset:0; z-index:3;
  width:100%; height:100%; max-width:100%; padding:22px 6px 14px;
  object-fit:contain; object-position:center; box-sizing:border-box;
  filter:drop-shadow(0 28px 28px rgba(0,0,0,.28));
  animation:floatAstronaut 7s ease-in-out infinite;
}
.orbit{
  position:absolute; border:1px solid rgba(255,255,255,.16); border-radius:50%; z-index:1;
  transform:rotate(-17deg);
}
.orbit-one{ width:430px; height:430px; left:20px; top:52px; }
.orbit-two{ width:330px; height:330px; left:70px; top:102px; border-color:rgba(255,154,86,.22); }
.growth-globe{
  position:absolute; z-index:5; right:20px; top:26px; width:168px; height:168px;
  border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center;
  color:#fff; letter-spacing:.14em; font-size:11px; font-weight:800;
  background:
    radial-gradient(circle at 32% 28%, rgba(255,255,255,.54), transparent 13%),
    linear-gradient(145deg,#52C9E8 0%,#5767E8 48%,#F27463 100%);
  box-shadow:0 22px 54px -18px rgba(46,116,201,.9), inset -18px -20px 34px rgba(18,29,94,.32);
  animation:floatGlobe 6s ease-in-out infinite;
}
.growth-globe::after{
  content:''; position:absolute; left:-19px; right:-19px; top:73px; height:26px;
  border:5px solid rgba(255,192,204,.8); border-radius:50%; transform:rotate(-12deg);
}
.growth-globe i{ color:rgba(255,255,255,.64); font-style:normal; line-height:1.25; }
.hero-proof{
  position:absolute; left:18px; bottom:22px; z-index:7; width:210px; padding:16px 18px;
  border-radius:16px; background:rgba(9,23,43,.72); border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(12px); box-shadow:0 20px 44px -24px rgba(0,0,0,.8);
}
.hero-proof > span{ display:block; font-size:10.5px; letter-spacing:.12em; color:rgba(255,255,255,.58); }
.hero-proof > b{ display:block; margin:2px 0 3px; color:#fff; font-size:16px; }
.hero-proof em{ font-size:36px; color:var(--accent-lt); font-style:normal; }
.hero-proof p{ font-size:11.5px; line-height:1.65; color:rgba(255,255,255,.68); }
.hero-dialog{
  position:absolute; z-index:8; padding:9px 13px; border-radius:12px;
  background:rgba(255,255,255,.92); color:var(--ink); font-size:11.5px; line-height:1.55;
  box-shadow:0 14px 34px -18px rgba(0,0,0,.65);
}
.hero-dialog::after{ content:''; position:absolute; width:8px; height:8px; background:inherit; transform:rotate(45deg); }
.hero-dialog-a{ left:2px; top:114px; }
.hero-dialog-a::after{ right:-4px; bottom:13px; }
.hero-dialog-b{ right:9px; bottom:132px; color:#8B3812; }
.hero-dialog-b::after{ left:-4px; bottom:12px; }
@keyframes floatAstronaut{ 0%,100%{ transform:translateY(0) rotate(-1deg); } 50%{ transform:translateY(-12px) rotate(1deg); } }
@keyframes floatGlobe{ 0%,100%{ transform:translateY(0) rotate(-2deg); } 50%{ transform:translateY(10px) rotate(2deg); } }

/* Hero 底部跑马灯 */
.hero-marquee{
  position:relative; border-top:1px solid rgba(255,255,255,.1);
  background:rgba(0,0,0,.18); overflow:hidden; padding:15px 0;
}
.hm-track{
  display:flex; gap:26px; white-space:nowrap; width:max-content;
  animation:marquee 42s linear infinite;
  font-size:14px; letter-spacing:.08em;
}
.hm-track span{ color:rgba(255,255,255,.78); font-weight:600; }
.hm-track i{ color:var(--accent); font-style:normal; }
@keyframes marquee{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/* ============================================================
   数据条
   ============================================================ */
.stats{
  background:var(--paper); border-bottom:1px solid var(--line-2);
  padding:52px 0;
}
.stats-inner{
  display:grid; grid-template-columns:repeat(4,1fr); gap:32px;
}
.stat{ text-align:left; padding-left:22px; border-left:2px solid var(--line); }
.stat:nth-child(1){ border-left-color:var(--accent); }
.stat:nth-child(2){ border-left-color:var(--gold); }
.stat:nth-child(3){ border-left-color:var(--primary-lt); }
.stat:nth-child(4){ border-left-color:var(--ink-3); }
.stat-num{
  font-size:38px; font-weight:800; letter-spacing:-.02em; color:var(--ink); line-height:1.1;
}
.stat-num em{ font-size:20px; color:var(--accent); margin-left:2px; }
.stat-label{ font-size:14.5px; font-weight:600; color:var(--tx); margin-top:8px; }
.stat-sub{ font-size:12.5px; color:var(--tx-3); margin-top:3px; line-height:1.6; }

/* ============================================================
   教学边界 + 真实证据
   ============================================================ */
.principles{ background:var(--ink); border-top:1px solid rgba(255,255,255,.08); }
.principles-inner{ display:grid; grid-template-columns:repeat(4,1fr); }
.principle{ padding:30px 24px 31px; border-right:1px solid rgba(255,255,255,.1); }
.principle:first-child{ border-left:1px solid rgba(255,255,255,.1); }
.principle > span{ font-size:10.5px; color:var(--accent-lt); font-weight:800; letter-spacing:.12em; }
.principle > b{ display:block; margin:4px 0 4px; color:#fff; font-size:17px; }
.principle > p{ font-size:12.5px; color:rgba(255,255,255,.58); line-height:1.65; }

.evidence-story{ overflow:hidden; background:linear-gradient(180deg,#fff 0%,#F7F9FC 100%); }
.evidence-grid{ display:grid; grid-template-columns:.92fr 1.08fr; gap:64px; align-items:center; }
.evidence-copy h2{ font-size:38px; margin-bottom:24px; }
.evidence-copy h2 b{ color:var(--primary); }
.evidence-copy > p{ font-size:15.5px; line-height:1.95; color:var(--tx-2); }
.evidence-copy > p b{ color:var(--ink); }
.evidence-numbers{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:28px 0 26px; }
.evidence-numbers div{ border-left:2px solid var(--accent); padding-left:14px; }
.evidence-numbers b{ display:block; font-size:27px; line-height:1.1; color:var(--ink); }
.evidence-numbers span{ display:block; margin-top:7px; font-size:11.5px; line-height:1.5; color:var(--tx-3); }
.evidence-turnaround{
  margin-top:4px; padding:20px 22px 21px; border-radius:16px;
  background:linear-gradient(145deg,var(--ink),var(--ink-3));
  box-shadow:0 18px 40px -28px rgba(10,23,41,.68);
}
.evidence-turnaround > span{
  display:block; color:var(--accent-lt); font-size:11px; font-weight:800;
  letter-spacing:.12em; margin-bottom:12px;
}
.turnaround-steps{ display:flex; align-items:center; gap:9px; margin-bottom:16px; }
.turnaround-steps b{ color:rgba(255,255,255,.82); font-size:12.5px; white-space:nowrap; }
.turnaround-steps i{ flex:1; height:1px; min-width:12px; background:rgba(255,255,255,.2); position:relative; }
.turnaround-steps i::after{
  content:''; position:absolute; right:0; top:-3px; width:6px; height:6px;
  border-top:1px solid var(--accent-lt); border-right:1px solid var(--accent-lt); transform:rotate(45deg);
}
.evidence-turnaround blockquote{ margin:0; color:#fff; font-size:21px; font-weight:700; line-height:1.55; }
.evidence-turnaround cite{ display:block; margin-top:7px; color:rgba(255,255,255,.54); font-size:11.5px; font-style:normal; font-weight:500; }
.evidence-media{ position:relative; min-height:560px; }
.evidence-photo{ margin:0; position:absolute; overflow:hidden; border-radius:22px; background:#fff; box-shadow:0 28px 68px -34px rgba(10,23,41,.55); }
.evidence-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.evidence-photo figcaption{ position:absolute; left:0; right:0; bottom:0; padding:48px 20px 17px; background:linear-gradient(transparent,rgba(7,17,32,.88)); color:#fff; }
.evidence-photo figcaption b,.evidence-photo figcaption span{ display:block; }
.evidence-photo figcaption b{ font-size:14px; }
.evidence-photo figcaption span{ margin-top:3px; font-size:11.5px; color:rgba(255,255,255,.72); }
.evidence-photo-main{ left:0; top:0; width:84%; height:420px; }
.evidence-photo-awards{ right:0; bottom:0; width:55%; height:250px; border:6px solid #fff; }

/* ============================================================
   区块通用
   ============================================================ */
.section{ padding:104px 0; }
.section-alt{ background:var(--paper-2); }

.sec-head{ max-width:760px; margin-bottom:56px; }
.sec-kicker{
  display:inline-block; font-size:12.5px; font-weight:700; letter-spacing:.16em;
  color:var(--accent); margin-bottom:18px;
  padding:5px 12px; border-radius:6px; background:rgba(242,116,56,.09);
}
.sec-kicker-light{
  color:var(--accent-lt); background:rgba(255,154,86,.14);
}
.sec-head h2{ font-size:38px; letter-spacing:-.02em; margin-bottom:20px; }
.sec-head h2 b{
  background:linear-gradient(120deg,var(--ink) 20%, var(--primary) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.sec-desc{ font-size:16.5px; color:var(--tx-2); line-height:1.9; }
.sec-desc b{ color:var(--ink); }

/* ============================================================
   困境 → 卡点 → 解法映射
   ============================================================ */
.pain-map{
  overflow:hidden; border:1px solid var(--line); border-radius:22px;
  background:var(--paper); box-shadow:0 22px 58px -42px rgba(10,23,41,.45);
}
.pain-map-head,.pain-row{
  display:grid; grid-template-columns:.92fr .82fr 1.26fr;
}
.pain-map-head{
  background:var(--ink); color:rgba(255,255,255,.74);
  font-size:12px; font-weight:800; letter-spacing:.1em;
}
.pain-map-head span{ padding:15px 22px; }
.pain-map-head span + span{ border-left:1px solid rgba(255,255,255,.1); }
.pain-row{ position:relative; transition:background .22s var(--ease); }
.pain-row + .pain-row{ border-top:1px solid var(--line); }
.pain-row:hover{ background:#FCFDFE; }
.pain-row > div{ min-width:0; padding:24px 22px 25px; }
.pain-row > div + div{ border-left:1px solid var(--line); }
.pain-scene i{
  display:inline-grid; place-items:center; width:30px; height:30px; margin-bottom:14px;
  border-radius:9px; background:rgba(242,116,56,.1); color:var(--accent);
  font-size:11px; font-style:normal; font-weight:800;
}
.pain-scene h3{ font-size:18px; line-height:1.5; margin-bottom:8px; }
.pain-scene p,.pain-cause p,.pain-solution p{ color:var(--tx-2); font-size:13.5px; line-height:1.8; }
.pain-cause{ background:var(--paper-2); }
.pain-cause b,.pain-solution b{ display:block; margin-bottom:9px; font-size:15.5px; line-height:1.6; color:var(--ink); }
.pain-cause b::before{ content:'真正原因'; display:block; margin-bottom:7px; color:var(--tx-3); font-size:10.5px; letter-spacing:.1em; }
.pain-solution{ background:linear-gradient(135deg,rgba(46,116,201,.055),rgba(242,116,56,.035)); }
.pain-solution b{ color:var(--primary); }
.pain-solution b::before{ content:'正向循环怎么做'; display:block; margin-bottom:7px; color:var(--accent); font-size:10.5px; letter-spacing:.1em; }
.pain-col-label{ display:none; }
.pain-system{
  margin-top:18px; padding:21px 24px; display:flex; align-items:center;
  justify-content:space-between; gap:26px; border-radius:16px;
  background:linear-gradient(135deg,var(--ink),var(--ink-3)); color:#fff;
}
.pain-system span{ color:var(--accent-lt); font-size:12px; font-weight:800; letter-spacing:.08em; }
.pain-system b{ font-size:15.5px; line-height:1.65; text-align:right; }

/* ============================================================
   核心主张
   ============================================================ */
.claim{
  background:linear-gradient(150deg, var(--ink) 0%, var(--ink-3) 100%);
  color:#fff; padding:96px 0; position:relative; overflow:hidden;
}
.claim::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(700px 400px at 20% 100%, rgba(242,116,56,.22), transparent 60%);
}
.claim-inner{ position:relative; text-align:center; }
.claim-badge{
  display:inline-block; font-size:12px; letter-spacing:.2em; font-weight:700;
  color:var(--accent-lt); border:1px solid rgba(255,154,86,.4);
  padding:6px 16px; border-radius:999px; margin-bottom:26px;
}
.claim h2{ font-size:40px; line-height:1.4; margin-bottom:44px; }
.claim h2 b{ color:var(--accent-lt); }

.claim-split{
  display:grid; grid-template-columns:1fr auto 1fr; gap:24px;
  align-items:stretch; max-width:900px; margin:0 auto;
}
.cs-item{
  border-radius:var(--r-lg); padding:26px 28px; text-align:left;
  border:1px solid rgba(255,255,255,.14);
}
.cs-weak{ background:rgba(255,255,255,.05); }
.cs-strong{ background:rgba(255,154,86,.14); border-color:rgba(255,154,86,.4); }
.cs-tag{
  font-size:11.5px; letter-spacing:.16em; font-weight:700; margin-bottom:12px;
  color:rgba(255,255,255,.55);
}
.cs-strong .cs-tag{ color:var(--accent-lt); }
.cs-item p{ font-size:17px; color:rgba(255,255,255,.9); line-height:1.7; }
.cs-item p span{ display:block; font-size:13.5px; color:rgba(255,255,255,.55); margin-top:8px; line-height:1.8; }
.cs-arrow{ display:grid; place-items:center; color:rgba(255,255,255,.4); }

/* ============================================================
   正向循环六环节
   ============================================================ */
.cycle-wrap{
  display:grid; grid-template-columns:420px 1fr; gap:64px; align-items:start;
}
.cycle-figure{ position:sticky; top:100px; }
.cycle-svg{ width:100%; height:auto; }
.cy-center-1{ font-size:24px; font-weight:800; fill:var(--ink); letter-spacing:.02em; }
.cy-center-2{ font-size:14px; font-weight:600; fill:var(--tx-3); letter-spacing:.3em; }
.cy-node{ cursor:pointer; }
.cy-node circle.n-outer{ transition:all .3s var(--ease); }
.cy-node text{ font-size:14px; font-weight:700; fill:var(--tx-2); transition:all .3s var(--ease); }
.cy-node.on circle.n-outer{ fill:var(--accent); stroke:var(--accent); }
.cy-node.on text{ fill:var(--ink); font-size:15px; }

.cycle-list{ display:flex; flex-direction:column; gap:4px; }
.cy-item{
  display:flex; gap:20px; padding:20px 22px; border-radius:var(--r);
  border:1px solid transparent; transition:all .26s var(--ease); cursor:default;
}
.cy-item:hover, .cy-item.on{
  background:var(--paper); border-color:var(--line);
  box-shadow:0 14px 34px -22px rgba(10,23,41,.3);
}
.cy-num{
  font-size:13px; font-weight:800; color:var(--accent);
  letter-spacing:.06em; padding-top:3px; min-width:26px;
}
.cy-body h3{ font-size:19px; margin-bottom:7px; }
.cy-body p{ font-size:14.5px; color:var(--tx-2); line-height:1.85; }
.cy-body p b{ color:var(--ink); }

/* ============================================================
   五步法
   ============================================================ */
.steps{
  display:grid; grid-template-columns:repeat(5,1fr); gap:16px;
}
.step{
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--r); padding:26px 22px 28px;
  transition:all .26s var(--ease); position:relative;
}
.step:hover{ transform:translateY(-5px); box-shadow:0 20px 42px -24px rgba(10,23,41,.35); border-color:#D6DEEA; }
.step-word{
  font-size:40px; font-weight:800; line-height:1; margin-bottom:16px;
  background:linear-gradient(140deg,var(--primary) 0%, var(--accent) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.step h3{ font-size:16px; margin-bottom:10px; }
.step p{ font-size:13.5px; color:var(--tx-2); line-height:1.85; }
.step p b{ color:var(--ink); }

.quote{
  margin-top:40px; padding:24px 32px; border-radius:var(--r);
  background:linear-gradient(100deg, rgba(242,116,56,.1), rgba(46,116,201,.08));
  border-left:3px solid var(--accent);
  font-size:18px; font-weight:600; color:var(--ink);
}

/* ============================================================
   紫牛 魔王级
   ============================================================ */
.purple-cow{
  background:linear-gradient(150deg, var(--ink-2) 0%, var(--ink) 100%);
  color:#fff; padding:100px 0; position:relative; overflow:hidden;
}
.purple-cow::before{
  content:''; position:absolute; right:-100px; top:-100px;
  width:520px; height:520px; border-radius:50%;
  background:radial-gradient(circle, rgba(242,116,56,.2), transparent 66%);
}
.pc-inner{
  position:relative; display:grid; grid-template-columns:1.25fr .75fr;
  gap:64px; align-items:center;
}
.pc-copy h2{ font-size:36px; line-height:1.4; margin-bottom:20px; }
.pc-copy h2 b{ color:var(--accent-lt); }
.pc-copy > p{ font-size:16px; color:rgba(255,255,255,.7); margin-bottom:26px; }

.ladder{ display:flex; flex-direction:column; gap:14px; margin-bottom:28px; }
.ladder li{
  position:relative; padding-left:38px; font-size:15px;
  color:rgba(255,255,255,.82); line-height:1.8;
}
.ladder li::before{
  content:''; position:absolute; left:0; top:9px;
  width:20px; height:20px; border-radius:50%;
  border:2px solid rgba(255,154,86,.5); background:rgba(255,154,86,.14);
}
.ladder li b{ color:#fff; }
.ladder li em{
  font-style:normal; color:var(--accent-lt); font-weight:700;
}
.pc-takeaway{
  padding:20px 24px; border-radius:var(--r);
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14);
  font-size:14.5px; line-height:1.9; color:rgba(255,255,255,.82);
}
.pc-takeaway b{ color:#fff; }

.pc-visual{ display:flex; flex-direction:column; gap:14px; }
.pc-bubble{
  padding:18px 22px; border-radius:16px; font-size:15px; line-height:1.7;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(8px); animation:float 6s ease-in-out infinite;
}
.pc-bubble b{ color:var(--accent-lt); }
.pc-bubble span{ font-size:13.5px; color:rgba(255,255,255,.65); }
.pc-b1{ margin-right:44px; }
.pc-b2{ margin-left:26px; animation-delay:1.2s; }
.pc-b3{ margin-right:20px; animation-delay:2.4s; }
@keyframes float{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-7px);} }
.pc-note{
  font-size:12.5px; color:rgba(255,255,255,.45); text-align:right; margin-top:6px;
}

/* ============================================================
   课堂真相
   ============================================================ */
.cls-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.cls-card{
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--r); padding:28px 26px 30px;
  transition:all .26s var(--ease);
}
.cls-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px -22px rgba(10,23,41,.32); }
.cls-card-accent{
  background:linear-gradient(160deg, rgba(242,116,56,.08), rgba(255,255,255,0) 60%);
  border-color:rgba(242,116,56,.28);
}
.cls-step{
  font-size:11.5px; font-weight:700; letter-spacing:.12em; color:var(--accent);
  margin-bottom:12px;
}
.cls-card h3{ font-size:18px; margin-bottom:12px; }
.cls-card > p{ font-size:14.5px; color:var(--tx-2); line-height:1.85; }
.cls-card ul{ display:flex; flex-direction:column; gap:9px; }
.cls-card li{
  font-size:14px; color:var(--tx-2); line-height:1.8; padding-left:16px; position:relative;
}
.cls-card li::before{
  content:''; position:absolute; left:0; top:11px;
  width:5px; height:5px; border-radius:50%; background:var(--accent);
}
.cls-card li b{ color:var(--ink); }
.cls-result{
  margin-top:16px; padding-top:14px; border-top:1px dashed var(--line);
  font-size:13.5px; color:var(--tx-3); line-height:1.8;
}
.cls-result b{ color:var(--primary); }

.pig{ display:flex; flex-direction:column; gap:8px; margin-top:4px; }
.pig span{
  font-size:13.5px; color:var(--tx-2); line-height:1.7;
  background:var(--paper-2); border-radius:8px; padding:8px 14px;
}
.pig b{
  display:inline-block; min-width:20px; color:#fff; background:var(--ink);
  border-radius:5px; padding:0 5px; margin-right:8px; font-size:12px; text-align:center;
}

.classroom-live{
  display:grid; grid-template-columns:1.25fr .75fr; gap:0; margin:-12px 0 30px;
  border-radius:var(--r-lg); overflow:hidden; background:var(--ink); box-shadow:0 24px 56px -34px rgba(10,23,41,.7);
}
.classroom-live figure{ margin:0; position:relative; min-height:380px; }
.classroom-live img{ width:100%; height:100%; min-height:380px; object-fit:cover; display:block; }
.classroom-live figcaption{ position:absolute; left:16px; bottom:14px; padding:6px 12px; border-radius:999px; background:rgba(7,17,32,.72); color:rgba(255,255,255,.76); font-size:11.5px; backdrop-filter:blur(8px); }
.classroom-path{ display:flex; flex-direction:column; justify-content:center; padding:32px 30px; }
.classroom-path span{ display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.09); color:rgba(255,255,255,.82); font-size:14px; }
.classroom-path span:last-child{ border-bottom:0; }
.classroom-path i{ flex:none; width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:rgba(255,154,86,.15); border:1px solid rgba(255,154,86,.35); color:var(--accent-lt); font-size:11px; font-style:normal; font-weight:800; }

/* ============================================================
   双角色机制
   ============================================================ */
.why-works{ background:linear-gradient(165deg,#F5F8FD 0%,#FFFFFF 72%); }
.role-pair{ display:grid; grid-template-columns:1fr 50px 1fr; gap:16px; align-items:stretch; margin-bottom:24px; }
.role-card{ padding:32px 30px; border-radius:var(--r-lg); color:#fff; min-height:220px; }
.role-card > span{ display:inline-block; padding:5px 11px; border-radius:999px; font-size:11px; font-weight:800; letter-spacing:.1em; background:rgba(255,255,255,.1); }
.role-card h3{ font-size:32px; margin:16px 0 12px; }
.role-card p{ max-width:430px; font-size:14.5px; line-height:1.9; color:rgba(255,255,255,.75); }
.role-teacher{ background:linear-gradient(145deg,var(--ink) 0%,var(--ink-3) 100%); }
.role-ai{ background:linear-gradient(145deg,#1D5CA6 0%,#3989D3 100%); }
.role-plus{ align-self:center; width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:var(--accent); color:#fff; font-size:24px; font-weight:300; box-shadow:0 10px 24px -12px rgba(242,116,56,.9); }
.why-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.why-card{ background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:22px 20px; }
.why-card b{ display:block; margin-bottom:7px; color:var(--ink); font-size:15.5px; }
.why-card p{ color:var(--tx-2); font-size:13px; line-height:1.75; }

/* ============================================================
   课程与价格
   ============================================================ */
.price-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:start; }

.price-card{
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:32px 28px 30px;
  display:flex; flex-direction:column; gap:20px;
  transition:all .28s var(--ease); position:relative;
}
.price-card:hover{ transform:translateY(-5px); box-shadow:0 24px 52px -26px rgba(10,23,41,.4); }

.pc-featured{
  border:2px solid var(--accent);
  box-shadow:0 20px 46px -26px rgba(242,116,56,.6);
}
.pcf-badge{
  position:absolute; top:-13px; left:28px;
  background:linear-gradient(135deg,var(--accent),var(--accent-lt));
  color:#fff; font-size:12px; font-weight:700; letter-spacing:.06em;
  padding:5px 14px; border-radius:999px;
}
.pc-main{ border-color:#CBD7E8; }

.price-head h3{ font-size:21px; margin-bottom:8px; }
.price-head p{ font-size:14px; color:var(--tx-2); line-height:1.8; }
.price-head p b{ color:var(--ink); }

.price-tag{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.pt-cur{ font-size:22px; font-weight:700; color:var(--accent); }
.pt-num{ font-size:52px; font-weight:800; letter-spacing:-.03em; color:var(--ink); line-height:1; }
.price-tag-sm .pt-num{ font-size:42px; }
.pt-old{ font-size:14px; color:var(--tx-3); text-decoration:line-through; }
.pt-unit{ font-size:15px; color:var(--tx-3); }

.pkg-table{
  border:1px solid var(--line); border-radius:12px; overflow:hidden;
}
.pkg-row{
  display:grid; grid-template-columns:88px 1fr; gap:4px 12px;
  padding:14px 16px; border-bottom:1px solid var(--line-2);
}
.pkg-row:last-child{ border-bottom:0; }
.pkg-row:nth-child(even){ background:var(--paper-2); }
.pkg-name{ font-size:15px; color:var(--tx); }
.pkg-name b{ font-size:17px; color:var(--ink); }
.pkg-price{
  font-size:19px; font-weight:800; color:var(--accent); text-align:right;
  grid-row:span 2; align-self:center;
}
.pkg-ask{ font-size:16px; color:var(--tx-3); font-weight:700; }
.pkg-note{ font-size:12.5px; color:var(--tx-3); line-height:1.6; }

.price-list{ display:flex; flex-direction:column; gap:10px; }
.price-list li{
  font-size:14px; color:var(--tx-2); line-height:1.8;
  padding-left:22px; position:relative;
}
.price-list li::before{
  content:''; position:absolute; left:2px; top:7px;
  width:12px; height:12px; border-radius:50%;
  background:rgba(242,116,56,.16);
  box-shadow:inset 0 0 0 2px rgba(242,116,56,.35);
}
.price-list li b{ color:var(--ink); }

.price-flow{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  padding:12px 14px; border-radius:10px; background:var(--paper-2);
  font-size:13px; color:var(--tx-2); line-height:1.6;
}
.price-flow b{ color:var(--accent); }

.program-actions{
  display:flex; flex-direction:column; gap:10px; margin-top:auto;
}
.program-phone{
  align-self:center; color:var(--primary); font-size:12.5px; font-weight:600;
  text-decoration:none; border-bottom:1px dashed rgba(31,95,168,.35);
  padding-bottom:2px; transition:color .2s var(--ease), border-color .2s var(--ease);
}
.program-phone:hover{ color:var(--accent); border-bottom-color:rgba(242,116,56,.55); }

.price-foot{
  margin-top:32px; display:flex; gap:10px; align-items:flex-start;
  padding:18px 22px; border-radius:var(--r);
  background:var(--paper-2); border:1px dashed var(--line);
  font-size:13.5px; color:var(--tx-2); line-height:1.8;
}
.price-foot svg{ flex-shrink:0; color:var(--tx-3); margin-top:3px; }
.price-foot b{ color:var(--ink); }

/* ============================================================
   适合 / 不适合
   ============================================================ */
.fit-grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.fit-card{
  border-radius:var(--r-lg); padding:34px 32px; border:1px solid var(--line);
}
.fit-yes{ background:var(--paper); }
.fit-no{ background:linear-gradient(160deg, rgba(10,23,41,.04), rgba(10,23,41,.02)); }
.fit-head{ display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.fit-yes .fit-head svg{ color:var(--primary); }
.fit-no .fit-head svg{ color:var(--tx-3); }
.fit-head h3{ font-size:20px; }
.fit-card ul{ display:flex; flex-direction:column; gap:12px; }
.fit-card li{
  font-size:15px; color:var(--tx-2); line-height:1.8; padding-left:24px; position:relative;
}
.fit-card li::before{
  content:''; position:absolute; left:6px; top:12px;
  width:6px; height:6px; border-radius:50%; background:var(--accent);
}
.fit-card li b{ color:var(--ink); }
.fit-no li::before{ background:var(--tx-3); }
.fit-big{
  padding:18px 22px; border-radius:12px; margin-bottom:20px;
  background:var(--ink); color:#fff; font-size:16px; line-height:1.8;
}
.fit-big b{ color:var(--accent-lt); }

/* ============================================================
   师资
   ============================================================ */
.teacher-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.teacher{
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--r); padding:28px 26px 30px;
  transition:all .26s var(--ease);
}
.teacher:hover{ transform:translateY(-4px); box-shadow:0 18px 40px -22px rgba(10,23,41,.3); }
.t-avatar{
  width:52px; height:52px; border-radius:14px; display:grid; place-items:center;
  font-size:19px; font-weight:800; color:#fff; margin-bottom:18px;
  background:linear-gradient(140deg, var(--ink-3), var(--primary));
}
.t-lead{ background:linear-gradient(140deg, var(--accent), var(--gold)); }
.t-ai{ background:linear-gradient(140deg, #6B7C99, #9AA9BF); }
.teacher h3{ font-size:18px; margin-bottom:5px; }
.t-role{ font-size:12.5px; color:var(--accent); font-weight:600; margin-bottom:14px; letter-spacing:.02em; }
.teacher p{ font-size:13.5px; color:var(--tx-2); line-height:1.85; }
.teacher p b{ color:var(--ink); }

/* ---------- 主创教师大卡 ---------- */
.lead-card{
  display:grid; grid-template-columns:320px 1fr; gap:0; align-items:stretch;
  background:linear-gradient(135deg, var(--ink) 0%, var(--ink-2) 100%);
  border-radius:var(--r-lg); overflow:hidden; margin-bottom:48px;
  box-shadow:0 26px 60px -32px rgba(10,23,41,.6);
}
.lead-side{
  padding:26px 24px 28px; display:flex; flex-direction:column;
  align-items:center; gap:14px; justify-content:center;
  background:rgba(255,255,255,.04);
  border-right:1px solid rgba(255,255,255,.09);
}
.lead-avatar{
  width:104px; height:104px; border-radius:50%;
  display:grid; place-items:center; font-size:40px; font-weight:800; color:#fff;
  background:linear-gradient(140deg, var(--accent) 0%, var(--gold) 100%);
  box-shadow:0 12px 30px -10px rgba(242,116,56,.7);
}
.lead-photo{
  width:100%; height:330px; object-fit:contain; object-position:center bottom; display:block;
  margin:0; filter:drop-shadow(0 18px 24px rgba(0,0,0,.28));
}
.lead-badge{
  font-size:11.5px; font-weight:700; letter-spacing:.14em;
  color:var(--gold); padding:6px 14px; border-radius:999px;
  border:1px solid rgba(232,163,61,.45); background:rgba(232,163,61,.1);
}
.lead-body{
  padding:36px 42px 38px; align-self:stretch; display:flex;
  flex-direction:column; justify-content:center;
}
.lead-name-row{ display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; }
.lead-body h3{ font-size:34px; color:#fff; letter-spacing:.01em; }
.lead-alias{
  font-size:14px; color:rgba(255,255,255,.84); font-weight:700;
  padding:5px 13px; border-radius:999px; background:rgba(255,255,255,.11);
}
.lead-role{
  font-size:16px; color:var(--accent-lt); font-weight:700;
  margin:11px 0 19px; letter-spacing:.02em;
}
.lead-desc{
  font-size:16.5px; line-height:1.85; color:rgba(255,255,255,.9);
  max-width:760px; margin-bottom:22px;
}
.lead-desc b{ color:#fff; }
.lead-summary{ max-width:none; margin-bottom:18px; }
.lead-experience{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px; margin-bottom:18px;
}
.lead-experience > div{
  padding:13px 15px; border-radius:11px;
  border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.065);
}
.lead-experience span{
  display:block; margin-bottom:5px; color:var(--accent-lt);
  font-size:12.5px; font-weight:800; letter-spacing:.06em;
}
.lead-experience b{
  display:block; color:#fff; font-size:14.5px; line-height:1.65;
}
.lead-tags{ display:flex; flex-wrap:wrap; gap:9px; }
.lead-tags li{
  font-size:13.5px; color:rgba(255,255,255,.88);
  padding:6px 13px; border-radius:8px;
  border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.05);
}
.lead-tags li b{ color:var(--gold); }
.lead-more{
  overflow:hidden; border-radius:12px; border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.035);
}
.lead-more > summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding:15px 16px; color:rgba(255,255,255,.92); font-size:15px; font-weight:750;
  transition:background .2s var(--ease), color .2s var(--ease);
}
.lead-more > summary::-webkit-details-marker{ display:none; }
.lead-more > summary:hover,.lead-more[open] > summary{ background:rgba(255,255,255,.06); color:#fff; }
.lead-more > summary span{
  flex:none; width:9px; height:9px; border-right:2px solid var(--accent-lt);
  border-bottom:2px solid var(--accent-lt); transform:rotate(45deg) translateY(-2px);
  transition:transform .24s var(--ease);
}
.lead-more[open] > summary span{ transform:rotate(-135deg) translateY(-2px); }
.lead-more-body{ display:grid; gap:13px; padding:18px 16px 19px; border-top:1px solid rgba(255,255,255,.1); }
.lead-more-body p{ color:rgba(255,255,255,.88); font-size:15px; line-height:1.85; }
.lead-more-body .lead-tags{ margin-top:3px; }
.lead-journey{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px;
}
.lead-journey > div{
  padding:15px 14px 16px; border-radius:11px;
  border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.045);
}
.lead-journey span{
  display:block; margin-bottom:7px; color:var(--accent-lt);
  font-size:11px; font-weight:800; letter-spacing:.07em;
}
.lead-journey b{ display:block; margin-bottom:7px; color:#fff; font-size:13.5px; line-height:1.6; }
.lead-more-body .lead-journey p{ color:rgba(255,255,255,.69); font-size:12.5px; line-height:1.75; }
.lead-team-results{
  overflow:hidden; margin-top:2px; border-radius:12px;
  border:1px solid rgba(255,255,255,.13); background:rgba(6,22,42,.32);
}
.lead-result-title{ padding:15px 16px; border-bottom:1px solid rgba(255,255,255,.1); }
.lead-result-title span{ display:block; color:var(--accent-lt); font-size:11px; font-weight:800; letter-spacing:.09em; }
.lead-result-title b{ display:block; margin-top:4px; color:#fff; font-size:15.5px; }
.lead-more-body .lead-result-title p{ margin-top:5px; color:rgba(255,255,255,.58); font-size:12px; line-height:1.65; }
.lead-result-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.lead-result-grid > div{ min-width:0; padding:15px 14px 16px; }
.lead-result-grid > div + div{ border-left:1px solid rgba(255,255,255,.1); }
.lead-result-grid b{ display:block; color:var(--gold); font-size:22px; line-height:1.1; }
.lead-result-grid span{ display:block; margin-top:8px; color:#fff; font-size:12px; line-height:1.55; }
.lead-result-grid small{ display:block; margin-top:5px; color:rgba(255,255,255,.52); font-size:10.5px; line-height:1.45; }

/* ---------- 团队价值 ---------- */
.tv-head{ margin:0 0 24px; }
.tv-title{ font-size:26px; color:var(--ink); line-height:1.45; }
.tv-title b{ color:var(--accent); }
.tv-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:44px; }
.tv-card{
  background:var(--paper-2); border:1px solid var(--line);
  border-radius:var(--r); padding:24px 22px 26px;
  transition:all .26s var(--ease);
}
.tv-card:hover{ transform:translateY(-3px); border-color:var(--primary-lt); background:var(--paper); }
.tv-n{
  font-size:12px; font-weight:800; color:var(--accent);
  letter-spacing:.1em; margin-bottom:12px;
}
.tv-card h4{ font-size:16.5px; color:var(--ink); margin-bottom:10px; }
.tv-card p{ font-size:13.5px; color:var(--tx-2); line-height:1.85; }
.tv-card p b{ color:var(--ink); }

/* ---------- 能力矩阵 ---------- */
.mx-wrap{
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:30px 32px 32px; margin-bottom:44px;
}
.mx-details{ padding:0; overflow:hidden; }
.mx-summary{
  list-style:none; cursor:pointer; display:flex; align-items:center;
  justify-content:space-between; gap:24px; padding:26px 30px;
  transition:background .2s var(--ease);
}
.mx-summary::-webkit-details-marker{ display:none; }
.mx-summary:hover,.mx-details[open] .mx-summary{ background:var(--paper-2); }
.mx-summary .mx-head{ margin:0; }
.mx-toggle{
  flex:none; display:inline-flex; align-items:center; gap:10px;
  color:var(--primary); font-size:13px; font-weight:700;
}
.mx-toggle::before{ content:'展开查看'; }
.mx-toggle::after{
  content:''; width:9px; height:9px; border-right:2px solid currentColor;
  border-bottom:2px solid currentColor; transform:rotate(45deg) translateY(-2px);
  transition:transform .24s var(--ease);
}
.mx-details[open] .mx-toggle::before{ content:'收起矩阵'; }
.mx-details[open] .mx-toggle::after{ transform:rotate(-135deg) translateY(-2px); }
.mx-panel{ border-top:1px solid var(--line); padding:22px 30px 30px; }
.mx-head{ margin-bottom:16px; }
.mx-head h4{ font-size:18px; color:var(--ink); margin-bottom:5px; }
.mx-head p{ font-size:13.5px; color:var(--tx-3); }
.mx-legend{ display:flex; gap:18px; margin-bottom:16px; flex-wrap:wrap; }
.mx-legend span{
  display:inline-flex; align-items:center; gap:7px;
  font-size:12.5px; color:var(--tx-3);
}
.mx-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.mx-table{ min-width:640px; }
.mx-row{
  display:grid; grid-template-columns:1.3fr repeat(5,1fr);
  align-items:center; gap:8px;
  padding:13px 0; border-top:1px solid var(--line-2);
}
.mx-row-head{ border-top:none; padding-bottom:12px; }
.mx-cell{ display:flex; align-items:center; gap:6px; justify-content:flex-start; }
.mx-cell-dim{
  font-size:14px; font-weight:700; color:var(--ink);
  justify-content:flex-start;
}
.mx-row-head .mx-cell{
  font-size:12.5px; font-weight:700; color:var(--tx-2);
  line-height:1.45;
}
.mx-row-head .mx-cell em{ font-style:normal; font-size:11px; color:var(--tx-3); font-weight:500; }
.mx-cell-ai{ background:rgba(107,124,153,.05); }
.mx-row-head .mx-cell-ai{
  background:transparent; border-radius:8px 8px 0 0;
}
.mx-dot{
  width:11px; height:11px; border-radius:50%;
  background:var(--line); flex:none;
}
.mx-dot.on{ background:var(--accent); box-shadow:0 0 0 3px rgba(242,116,56,.14); }
.mx-dot.half{ background:var(--primary-lt); opacity:.5; }

/* ============================================================
   家长必读（30 条选题）
   ============================================================ */
.rd-legend{
  display:flex; flex-wrap:wrap; gap:10px 26px; margin-bottom:26px;
  padding:16px 22px; border-radius:var(--r);
  background:var(--paper-2); border:1px solid var(--line);
}
.rd-legend span{
  display:inline-flex; align-items:center; gap:9px;
  font-size:13px; color:var(--tx-2);
}
.rd-lv{
  font-size:11.5px; font-weight:800; letter-spacing:.04em;
  padding:3px 10px; border-radius:6px; flex:none; white-space:nowrap;
}
.lv-y{ background:rgba(22,163,74,.1);   color:#127A38; }
.lv-o{ background:rgba(31,95,168,.09);  color:var(--primary); }
.lv-m{ background:rgba(122,135,155,.12); color:var(--tx-3); }

.rd-tabs{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:22px;
}
.rd-tab{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 20px; border-radius:999px; cursor:pointer;
  font-size:14.5px; font-weight:600; color:var(--tx-2);
  background:var(--paper); border:1px solid var(--line);
  transition:all .22s var(--ease); font-family:inherit;
}
.rd-tab:hover{ border-color:var(--primary-lt); color:var(--ink); }
.rd-tab em{
  font-style:normal; font-size:11.5px; font-weight:700;
  padding:2px 7px; border-radius:5px; background:var(--paper-3); color:var(--tx-3);
}
.rd-tab.on{
  background:var(--ink); color:#fff; border-color:var(--ink);
  box-shadow:0 8px 20px -10px rgba(10,23,41,.5);
}
.rd-tab.on em{ background:rgba(255,255,255,.16); color:var(--accent-lt); }
.rd-count{ margin-left:auto; font-size:13px; color:var(--tx-3); }
.rd-count b{ color:var(--accent); font-size:15px; }

.rd-list{ display:flex; flex-direction:column; gap:10px; }
.rd-item{
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--r); overflow:hidden;
  transition:border-color .22s var(--ease), box-shadow .22s var(--ease);
}
.rd-item[open]{ border-color:rgba(242,116,56,.4); box-shadow:0 14px 32px -24px rgba(10,23,41,.4); }
.rd-item > summary{
  display:flex; align-items:center; gap:14px;
  padding:17px 22px; cursor:pointer; list-style:none;
  transition:background .2s var(--ease);
}
.rd-item > summary::-webkit-details-marker{ display:none; }
.rd-item > summary:hover{ background:var(--paper-2); }
.rd-n{
  flex:none; font-size:12px; font-weight:800; letter-spacing:.06em;
  color:var(--accent); font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  min-width:32px;
}
.rd-t{
  flex:1; font-size:15.5px; font-weight:600; color:var(--ink); line-height:1.6;
}
.rd-item > summary::after{
  content:''; flex:none; width:9px; height:9px; margin-left:2px;
  border-right:2px solid var(--tx-3); border-bottom:2px solid var(--tx-3);
  transform:rotate(45deg); transition:transform .25s var(--ease); margin-top:-4px;
}
.rd-item[open] > summary::after{ transform:rotate(-135deg); margin-top:2px; border-color:var(--accent); }

.rd-body{
  padding:4px 22px 22px 68px; border-top:1px dashed var(--line); margin-top:2px;
}
.rd-body p{
  font-size:14.5px; line-height:1.95; color:var(--tx-2); margin-top:14px;
}
.rd-body p b{ color:var(--ink); }

/* ============================================================
   孩子们的声音与故事
   ============================================================ */
.voices-section{ background:linear-gradient(180deg,#fff 0%,#F4F7FB 100%); overflow:hidden; }
.voices-head{ max-width:820px; }
.voices-head h2 b{ color:var(--primary); }
.voices-proofline{
  display:flex; align-items:center; flex-wrap:wrap; gap:11px; margin-top:20px;
  color:var(--tx-2); font-size:13.5px; font-weight:650;
}
.voices-proofline span{ display:inline-flex; align-items:baseline; gap:4px; }
.voices-proofline b{ color:var(--primary); font-size:22px; line-height:1; }
.voices-proofline i{ width:4px; height:4px; border-radius:50%; background:var(--accent); }
.voice-wall{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:28px;
}
.voice-card{
  min-height:220px; display:flex; flex-direction:column;
  justify-content:space-between; gap:18px; margin:0; padding:25px 24px;
  border-radius:18px; background:#fff; border:1px solid var(--line);
  box-shadow:0 18px 42px -32px rgba(10,23,41,.42);
}
.voice-card-main{
  background:linear-gradient(140deg,var(--ink),var(--ink-3)); border-color:transparent;
}
.voice-card > span{ color:var(--accent); font-size:12.5px; font-weight:800; letter-spacing:.08em; }
.voice-card p{ color:var(--ink); font-size:20.5px; font-weight:650; line-height:1.62; }
.voice-card p strong{ color:var(--primary); font-weight:800; }
.voice-card cite{ color:var(--tx-3); font-size:13px; line-height:1.6; font-style:normal; }
.voice-card-main > span{ color:var(--accent-lt); }
.voice-card-main p{ color:#fff; font-size:27px; max-width:720px; }
.voice-card-main p strong{ color:var(--accent-lt); }
.voice-card-main cite{ color:rgba(255,255,255,.72); }
.voice-observation{ background:var(--paper-2); }

.story-list{ display:flex; flex-direction:column; gap:10px; margin-top:8px; }
.story-item{
  background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden;
  transition:border-color .22s var(--ease), box-shadow .22s var(--ease);
}
.story-item[open]{ border-color:rgba(31,95,168,.32); box-shadow:0 16px 36px -30px rgba(10,23,41,.5); }
.story-item > summary{
  list-style:none; cursor:pointer; display:grid; grid-template-columns:42px 1fr 14px;
  align-items:center; gap:16px; padding:21px 22px;
}
.story-item > summary::-webkit-details-marker{ display:none; }
.story-item > summary > span{
  width:40px; height:40px; border-radius:12px; display:grid; place-items:center;
  background:rgba(242,116,56,.1); color:var(--accent); font-size:12px; font-weight:800;
}
.story-item > summary div b{ display:block; color:var(--ink); font-size:17px; line-height:1.5; }
.story-item > summary div p{ margin-top:4px; color:var(--tx-3); font-size:13.5px; line-height:1.55; }
.story-item > summary::after{
  content:''; width:9px; height:9px; border-right:2px solid var(--primary);
  border-bottom:2px solid var(--primary); transform:rotate(45deg) translateY(-2px);
  transition:transform .24s var(--ease);
}
.story-item[open] > summary::after{ transform:rotate(-135deg) translateY(-2px); }
.story-body{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  margin:0 22px 22px 80px; overflow:hidden; border-radius:12px; background:var(--line);
}
.story-body > div{ padding:18px 19px; background:var(--paper-2); }
.story-body span{ display:block; color:var(--accent); font-size:12.5px; font-weight:800; letter-spacing:.08em; margin-bottom:8px; }
.story-body p{ color:var(--tx-2); font-size:14.5px; line-height:1.8; }
.voice-share{
  margin-top:26px; padding:24px 26px; display:flex; align-items:center;
  justify-content:space-between; gap:30px; border-radius:18px;
  background:#fff; border:1px solid var(--line);
}
.voice-share div span{ display:block; margin-bottom:6px; color:var(--accent); font-size:11px; font-weight:800; letter-spacing:.1em; }
.voice-share div b{ display:block; max-width:760px; color:var(--ink); font-size:15px; line-height:1.75; }
.voice-share .btn{ flex:none; }

/* ============================================================
   FAQ
   ============================================================ */
.faq-list{ display:flex; flex-direction:column; gap:12px; max-width:940px; }
.faq{
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--r); overflow:hidden;
  transition:all .24s var(--ease);
}
.faq[open]{ border-color:#CBD7E8; box-shadow:0 14px 34px -24px rgba(10,23,41,.35); }
.faq summary{
  list-style:none; cursor:pointer; padding:22px 26px;
  font-size:17px; font-weight:600; display:flex; align-items:center;
  justify-content:space-between; gap:20px; color:var(--ink);
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:''; flex-shrink:0; width:11px; height:11px;
  border-right:2px solid var(--accent); border-bottom:2px solid var(--accent);
  transform:rotate(45deg) translateY(-2px); transition:transform .26s var(--ease);
}
.faq[open] summary::after{ transform:rotate(-135deg) translateY(-2px); }
.faq-body{
  padding:0 26px 24px; font-size:15px; color:var(--tx-2); line-height:1.9;
}
.faq-body p + p{ margin-top:12px; }
.faq-body b{ color:var(--ink); }

/* ============================================================
   CTA
   ============================================================ */
.cta-section{
  background:linear-gradient(150deg, var(--ink) 0%, var(--ink-3) 55%, var(--primary) 130%);
  color:#fff; padding:112px 0 120px; position:relative; overflow:hidden;
}
.cta-section::before{
  content:''; position:absolute; left:-120px; bottom:-140px;
  width:520px; height:520px; border-radius:50%;
  background:radial-gradient(circle, rgba(242,116,56,.22), transparent 66%);
}
.cta-inner{
  position:relative; display:grid; grid-template-columns:1.16fr .84fr;
  gap:88px; align-items:center;
}
.cta-copy h2{ font-size:36px; line-height:1.4; margin-bottom:26px; }
.cta-copy > p{ font-size:16px; color:rgba(255,255,255,.76); line-height:1.9; margin-bottom:34px; }
.cta-copy > p b{ color:#fff; }

.conversion-list{ display:flex; flex-direction:column; gap:13px; }
.conversion-list article{
  display:grid; grid-template-columns:34px 1fr; gap:12px 14px;
  padding:16px 18px; border-radius:14px;
  border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.055);
}
.conversion-list span{
  grid-row:1 / span 2; width:30px; height:30px; border-radius:50%;
  display:grid; place-items:center; color:var(--accent-lt); font-size:11px; font-weight:800;
  background:rgba(255,154,86,.14); border:1px solid rgba(255,154,86,.34);
}
.conversion-list b{ color:#fff; font-size:15px; line-height:1.5; }
.conversion-list p{ color:rgba(255,255,255,.68); font-size:13px; line-height:1.75; }
.cta-btns{ display:flex; gap:16px; flex-wrap:wrap; margin-top:38px; }
.cta-btns .btn{ min-width:190px; }

.cta-qr{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px;
  padding:36px 28px; border-radius:26px; border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.045); box-shadow:0 24px 60px -40px rgba(0,0,0,.65);
}
.qr-frame{
  width:212px; height:212px; border-radius:20px; padding:14px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(8px);
}
.qr-img{
  width:100%; height:100%; object-fit:contain; border-radius:12px;
  background:#fff; display:block;
  box-shadow:0 6px 22px rgba(0,0,0,.18);
}
.qr-label{ text-align:center; font-size:16px; color:#fff; }
.qr-label b{ color:var(--accent-lt); }
.qr-label span{ font-size:13px; color:rgba(255,255,255,.6); }
.qr-act{ font-size:17px; letter-spacing:.3px; }
.qr-sub{ display:inline-block; margin-top:6px; max-width:300px; line-height:1.7; }
.qr-tel-bar{
  font-size:13px; color:rgba(255,255,255,.55); text-align:center; margin:0;
}
.qr-tel-link{
  color:var(--accent-lt); font-weight:600; text-decoration:none;
  border-bottom:1px dashed rgba(255,255,255,.25); padding-bottom:1px;
}
.qr-tel-link:hover{ color:#fff; border-bottom-color:var(--accent-lt); }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{
  background:#071120; color:rgba(255,255,255,.7); padding:64px 0 0;
}
.footer-inner{
  display:grid; grid-template-columns:1.2fr 2fr; gap:48px; padding-bottom:48px;
}
.f-brand{ display:flex; gap:14px; }
.f-brand > div > b{ display:block; font-size:17px; color:#fff; margin-bottom:8px; }
.f-brand p{ font-size:13px; line-height:1.8; }
.f-slogan{ color:rgba(255,255,255,.45); margin-top:6px; }
.f-cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.f-cols h4{
  font-size:13px; color:#fff; letter-spacing:.1em; margin-bottom:14px; font-weight:700;
}
.f-cols a, .f-cols span, .f-letter-link{
  display:block; font-size:13.5px; line-height:2.1; color:rgba(255,255,255,.6);
  transition:color .2s var(--ease);
}
.f-letter-link{
  margin:0; padding:0; border:0; background:none; cursor:pointer;
  font-family:inherit; text-align:left;
}
.f-cols a:hover, .f-letter-link:hover{ color:var(--accent-lt); }
.f-bottom{
  display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap;
  padding:20px 0; border-top:1px solid rgba(255,255,255,.1);
  font-size:12.5px; color:rgba(255,255,255,.42);
}

/* ============================================================
   滚动动画
   ============================================================ */
.reveal{
  opacity:0; transform:translateY(22px);
  transition:opacity .7s var(--ease), transform .7s var(--ease);
}
.reveal.in{ opacity:1; transform:none; }

/* ============================================================
   响应式
   ============================================================ */
@media (max-width:1080px){
  .hero-inner{ grid-template-columns:1fr; gap:48px; }
  .hero h1{ font-size:42px; }
  .hero-visual{ width:min(620px,100%); min-height:590px; margin:0 auto; }
  .cycle-wrap{ grid-template-columns:1fr; gap:40px; }
  .cycle-figure{ position:static; max-width:400px; margin:0 auto; }
  .steps{ grid-template-columns:repeat(3,1fr); }
  .pc-inner, .cta-inner{ grid-template-columns:1fr; gap:56px; }
  .cta-qr{ max-width:430px; align-items:center; }
  .tv-grid{ grid-template-columns:repeat(2,1fr); }
  .lead-card{ grid-template-columns:270px 1fr; }
  .lead-side{ padding:22px 20px 24px; }
  .lead-photo{ height:300px; }
  .lead-body{ padding:30px 30px 32px; }
  .lead-body h3{ font-size:32px; }
  .lead-role{ font-size:15px; }
  .lead-desc{ font-size:16px; line-height:1.82; }
  .lead-experience b{ font-size:14px; }
  .lead-result-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .lead-result-grid > div:nth-child(3){ border-left:0; }
  .lead-result-grid > div:nth-child(n+3){ border-top:1px solid rgba(255,255,255,.1); }
  .evidence-grid{ grid-template-columns:1fr; }
  .evidence-copy{ max-width:760px; }
  .evidence-media{ max-width:760px; width:100%; }
}

@media (max-width:920px){
  .nav-links{ display:none; }
  .nav-toggle{ display:block; }
  .nav.is-open .nav-links{
    display:flex; flex-direction:column; position:absolute;
    top:68px; left:0; right:0; background:var(--paper);
    border-bottom:1px solid var(--line); padding:14px 28px 20px; gap:2px;
    box-shadow:0 20px 40px -20px rgba(10,23,41,.3);
  }
  .nav.is-open .nav-links a{ padding:12px 10px; font-size:15px; }
  .nav-cta{ display:none; }

  .stats-inner{ grid-template-columns:repeat(2,1fr); gap:26px; }
  .pain-map-head{ display:none; }
  .pain-row{ grid-template-columns:1fr; }
  .pain-row + .pain-row{ border-top:10px solid var(--paper-2); }
  .pain-row > div{ padding:21px 23px 22px; }
  .pain-row > div + div{ border-left:0; border-top:1px solid var(--line); }
  .pain-col-label{
    display:block; margin-bottom:11px; color:var(--tx-3);
    font-size:10.5px; font-weight:800; letter-spacing:.09em;
  }
  .pain-cause b::before,.pain-solution b::before{ display:none; }
  .pain-system{ align-items:flex-start; flex-direction:column; gap:7px; }
  .pain-system b{ text-align:left; }
  .pain-grid, .cls-grid, .teacher-grid{ grid-template-columns:repeat(2,1fr); }
  .price-grid{ grid-template-columns:1fr; }
  .fit-grid{ grid-template-columns:1fr; }
  .principles-inner{ grid-template-columns:repeat(2,1fr); }
  .principle:nth-child(3){ border-left:1px solid rgba(255,255,255,.1); }
  .principle:nth-child(-n+2){ border-bottom:1px solid rgba(255,255,255,.1); }
  .classroom-live{ grid-template-columns:1fr; }
  .classroom-live figure,.classroom-live img{ min-height:330px; }
  .role-pair{ grid-template-columns:1fr; }
  .role-plus{ justify-self:center; margin:-8px 0; z-index:2; }
  .why-grid{ grid-template-columns:repeat(2,1fr); }
  .claim-split{ grid-template-columns:1fr; }
  .cs-arrow{ transform:rotate(90deg); padding:4px 0; }
  .sec-head h2{ font-size:30px; }
  .hero{ padding-top:120px; }
  .hero h1{ font-size:34px; }
  .footer-inner{ grid-template-columns:1fr; gap:36px; }
  .section{ padding:76px 0; }
  .voice-card,.voice-card-main{ grid-column:auto; }
  .voice-card-main p{ font-size:24px; }
  .story-body{ grid-template-columns:1fr; }
}

@media (max-width:640px){
  .wrap{ padding:0 20px; }
  .hero h1{ font-size:29px; }
  .hero-sub{ font-size:15px; }
  .hero-visual{ min-height:500px; border-radius:22px; }
  .hero-astronaut{
    inset:0; width:100%; height:100%; padding:42px 3px 46px;
    object-fit:contain; object-position:center;
  }
  .growth-globe{ width:120px; height:120px; right:12px; top:18px; font-size:9px; }
  .growth-globe::after{ left:-13px; right:-13px; top:52px; height:20px; border-width:4px; }
  .orbit-one{ width:330px; height:330px; left:-20px; top:45px; }
  .orbit-two{ width:250px; height:250px; left:20px; top:85px; }
  .hero-proof{ left:12px; bottom:14px; width:180px; padding:12px 14px; }
  .hero-proof em{ font-size:30px; }
  .hero-dialog-a{ top:248px; left:8px; }
  .hero-dialog-b{ display:none; }
  .hc-big .num{ font-size:58px; }
  .stats-inner, .pain-grid, .cls-grid, .teacher-grid, .steps{ grid-template-columns:1fr; }
  .principles-inner{ grid-template-columns:1fr; }
  .principle,.principle:first-child,.principle:nth-child(3){ border-left:1px solid rgba(255,255,255,.1); border-right:1px solid rgba(255,255,255,.1); border-bottom:1px solid rgba(255,255,255,.1); }
  .evidence-copy h2{ font-size:28px; }
  .evidence-numbers{ grid-template-columns:1fr; gap:15px; }
  .turnaround-steps{ align-items:flex-start; flex-direction:column; gap:6px; }
  .turnaround-steps i{ width:1px; height:12px; min-width:0; margin-left:5px; }
  .turnaround-steps i::after{ right:-3px; top:auto; bottom:0; transform:rotate(135deg); }
  .evidence-media{ min-height:auto; display:grid; gap:14px; }
  .evidence-photo{ position:relative; inset:auto; width:100%; border:0; }
  .evidence-photo-main{ height:270px; }
  .evidence-photo-awards{ height:230px; }
  .classroom-live figure,.classroom-live img{ min-height:260px; }
  .classroom-path{ padding:24px 22px; }
  .why-grid{ grid-template-columns:1fr; }
  .role-card{ min-height:auto; padding:27px 24px; }
  .role-card h3{ font-size:27px; }
  .lead-card{ grid-template-columns:1fr; }
  .lead-side{
    flex-direction:row; justify-content:flex-start; padding:18px 24px 0;
    border-right:none; border-bottom:1px solid rgba(255,255,255,.09);
  }
  .lead-photo{ width:132px; height:150px; margin:0; }
  .lead-avatar{ width:72px; height:72px; font-size:28px; }
  .lead-body{ padding:28px 24px 30px; }
  .lead-body h3{ font-size:26px; }
  .tv-grid{ grid-template-columns:1fr; }
  .lead-experience{ grid-template-columns:1fr; }
  .lead-summary{ font-size:15.5px; }
  .lead-journey{ grid-template-columns:1fr; }
  .lead-result-grid{ grid-template-columns:1fr; }
  .lead-result-grid > div + div{ border-left:0; border-top:1px solid rgba(255,255,255,.1); }
  .mx-wrap{ padding:24px 20px 26px; }
  .mx-details{ padding:0; }
  .mx-summary{ align-items:flex-start; padding:21px 20px; gap:16px; }
  .mx-panel{ padding:18px 20px 24px; }
  .mx-toggle::before{ display:none; }

  .voice-wall{ grid-template-columns:1fr; }
  .voice-card,.voice-card-main{ grid-column:auto; min-height:auto; }
  .voice-card{ padding:23px 21px; }
  .voice-card p{ font-size:18.5px; }
  .voice-card-main p{ font-size:22px; }
  .story-item > summary{ grid-template-columns:38px 1fr 12px; gap:12px; padding:16px 17px; }
  .story-item > summary > span{ width:36px; height:36px; }
  .story-body{ margin:0 17px 17px; }
  .voice-share{ align-items:flex-start; flex-direction:column; padding:21px 20px; }
  .voice-share .btn{ width:100%; }

  .rd-legend{ flex-direction:column; gap:10px; padding:16px 18px; }
  .rd-tab{ padding:9px 15px; font-size:13.5px; }
  .rd-count{ margin-left:0; }
  .rd-item > summary{ padding:15px 18px; gap:11px; }
  .rd-t{ font-size:14.5px; }
  .rd-body{ padding:4px 18px 20px 18px; }
  .rd-body p{ font-size:14px; }
  .sec-head h2{ font-size:26px; }
  .claim h2, .pc-copy h2, .cta-copy h2{ font-size:26px; }
  .hero-actions .btn, .cta-btns .btn{ width:100%; }
  .cta-section{ padding:82px 0 90px; }
  .cta-qr{ width:100%; padding:28px 20px; }
  .f-cols{ grid-template-columns:1fr; }
  .faq summary{ font-size:15.5px; padding:18px 20px; }
  .faq-body{ padding:0 20px 20px; font-size:14.5px; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; }
}

/* ============================================================
 * 进站引导页（Gate）—— 先问一个真问题，再决定给什么内容
 * 设计原则：
 *   · 不是弹窗广告，是一次"分诊"——高意向的往下看，犹豫的直接打电话
 *   · 7 天只出现一次，不反复打扰
 *   · 永远给「先随便看看」的出口，绝不拦路
 * ============================================================ */
.gate{
  position:fixed; inset:0; z-index:9999;
  display:flex; align-items:center; justify-content:center;
  padding:28px 20px;
  background:
    radial-gradient(1100px 620px at 78% 12%, rgba(46,116,201,.30), transparent 62%),
    radial-gradient(820px 520px at 14% 88%, rgba(242,116,56,.20), transparent 60%),
    linear-gradient(165deg, #0A1729 0%, #102A4C 52%, #0A1729 100%);
  overflow-y:auto; -webkit-overflow-scrolling:touch;
  opacity:0; visibility:hidden;
  transition:opacity .5s var(--ease), visibility .5s var(--ease);
}
.gate.is-open{ opacity:1; visibility:visible; }
.gate.is-closing{ opacity:0; visibility:hidden; }

/* 星点：呼应"火星儿 / 探索"主题，纯 CSS 无图片 */
.gate::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:
    radial-gradient(1.6px 1.6px at 12% 22%, rgba(255,255,255,.55), transparent),
    radial-gradient(1.4px 1.4px at 82% 18%, rgba(255,255,255,.45), transparent),
    radial-gradient(1.8px 1.8px at 68% 72%, rgba(255,255,255,.40), transparent),
    radial-gradient(1.3px 1.3px at 28% 78%, rgba(255,255,255,.50), transparent),
    radial-gradient(1.5px 1.5px at 92% 58%, rgba(255,255,255,.35), transparent),
    radial-gradient(1.2px 1.2px at 46% 12%, rgba(255,255,255,.42), transparent);
  animation:gate-twinkle 5.5s ease-in-out infinite alternate;
}
@keyframes gate-twinkle{ from{opacity:.45} to{opacity:1} }

.gate-inner{
  position:relative; z-index:1;
  width:100%; max-width:660px; margin:auto;
  text-align:center; color:#fff;
}

.gate-badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 16px; border-radius:999px; margin-bottom:26px;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16);
  font-size:12.5px; font-weight:600; letter-spacing:2px; color:rgba(255,255,255,.82);
}
.gate-badge i{
  width:6px; height:6px; border-radius:50%; background:var(--accent-lt);
  box-shadow:0 0 10px var(--accent); animation:gate-pulse 1.9s ease-in-out infinite;
}
@keyframes gate-pulse{ 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.35;transform:scale(.7)} }

.gate-q{
  font-size:clamp(27px, 6.4vw, 44px); line-height:1.32; font-weight:800;
  letter-spacing:-.5px; margin-bottom:16px;
}
.gate-q em{
  font-style:normal; position:relative; color:var(--accent-lt);
  background:linear-gradient(120deg, var(--accent-lt), var(--gold));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.gate-sub{
  font-size:15.5px; line-height:1.85; color:rgba(255,255,255,.66);
  margin-bottom:34px; max-width:430px; margin-inline:auto;
}

.gate-btns{ display:grid; gap:14px; margin-bottom:22px; }
@media (min-width:600px){ .gate-btns{ grid-template-columns:1fr 1fr; } }

.gate-btn{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px;
  padding:22px 20px; border-radius:var(--r-lg); cursor:pointer;
  font-family:inherit; font-size:16.5px; font-weight:700; color:#fff;
  border:1.5px solid rgba(255,255,255,.20); background:rgba(255,255,255,.06);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease),
             background .25s var(--ease), border-color .25s var(--ease);
}
.gate-btn span{ font-size:12.5px; font-weight:500; opacity:.72; letter-spacing:.3px; }
.gate-btn:hover{ transform:translateY(-3px); }
.gate-btn:active{ transform:translateY(-1px); }

.gate-btn-yes{
  background:linear-gradient(135deg, var(--accent), var(--accent-lt));
  border-color:transparent; box-shadow:0 14px 34px -12px rgba(242,116,56,.75);
}
.gate-btn-yes:hover{ box-shadow:0 20px 44px -12px rgba(242,116,56,.9); }
.gate-btn-yes span{ opacity:.9; }

.gate-btn-no:hover{
  background:rgba(255,255,255,.13); border-color:rgba(255,255,255,.42);
  box-shadow:0 14px 32px -14px rgba(0,0,0,.5);
}

.gate-skip{
  background:none; border:none; cursor:pointer; font-family:inherit;
  font-size:13.5px; color:rgba(255,255,255,.42); padding:9px 14px;
  text-decoration:underline; text-underline-offset:4px;
  transition:color .2s var(--ease);
}
.gate-skip:hover{ color:rgba(255,255,255,.8); }

/* ---------- 「还不确定」→ 电话面板 ---------- */
.gate-call{
  display:none; margin-top:8px; padding:26px 22px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-lg); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
.gate-call.is-on{ display:block; animation:gate-rise .42s var(--ease) both; }
@keyframes gate-rise{ from{opacity:0; transform:translateY(14px)} to{opacity:1; transform:none} }

.gate-call h3{ font-size:18px; margin-bottom:8px; }
.gate-call p{ font-size:13.5px; line-height:1.8; color:rgba(255,255,255,.6); margin-bottom:20px; }

.gate-call-num{
  display:block; font-size:clamp(26px, 7vw, 34px); font-weight:800; letter-spacing:1.5px;
  color:#fff; text-decoration:none; margin-bottom:16px;
  transition:color .2s var(--ease);
}
.gate-call-num:hover{ color:var(--accent-lt); }

.gate-call-actions{ display:flex; flex-direction:column; gap:10px; }
@media (min-width:480px){ .gate-call-actions{ flex-direction:row; justify-content:center; } }

.gate-call-btn{
  flex:1; max-width:230px; padding:14px 22px; border-radius:12px; cursor:pointer;
  font-family:inherit; font-size:15px; font-weight:700; color:var(--ink);
  background:#fff; border:none; text-decoration:none; text-align:center;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.gate-call-btn:hover{ transform:translateY(-2px); box-shadow:0 12px 26px -10px rgba(0,0,0,.6); }

.gate-call-btn.ghost{
  background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.24);
}

/* ---------- 背景音乐悬浮按钮 ---------- */
.bgm-toggle{
  position:fixed; right:18px; bottom:18px; z-index:900;
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 14px 9px 11px; border-radius:999px; cursor:pointer;
  font-family:inherit; font-size:12.5px; font-weight:600;
  color:var(--tx-2); background:rgba(255,255,255,.92);
  border:1px solid var(--line); box-shadow:0 8px 24px -10px rgba(10,23,41,.34);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  transition:transform .24s var(--ease), box-shadow .24s var(--ease), color .24s var(--ease);
}
.bgm-toggle:hover{ transform:translateY(-2px); box-shadow:0 12px 28px -10px rgba(10,23,41,.42); }
.bgm-toggle.is-on{ color:var(--accent); border-color:rgba(242,116,56,.35); }
.bgm-ico{ flex-shrink:0; }

/* 四根声波条，播放时才动 */
.bgm-bars{ display:inline-flex; align-items:flex-end; gap:2px; height:13px; flex-shrink:0; }
.bgm-bars i{
  width:2.5px; height:4px; border-radius:2px; background:currentColor; opacity:.42;
  transition:height .3s var(--ease), opacity .3s var(--ease);
}
.bgm-toggle.is-on .bgm-bars i{
  opacity:1; animation:bgm-wave 1.15s ease-in-out infinite;
  background:var(--accent);
}
.bgm-toggle.is-on .bgm-bars i:nth-child(2){ animation-delay:.16s; }
.bgm-toggle.is-on .bgm-bars i:nth-child(3){ animation-delay:.32s; }
.bgm-toggle.is-on .bgm-bars i:nth-child(4){ animation-delay:.48s; }
@keyframes bgm-wave{ 0%,100%{height:4px} 50%{height:13px} }

@media (max-width:640px){
  .bgm-toggle{ right:12px; bottom:12px; padding:8px 12px 8px 10px; }
  .bgm-tip{ display:none; }
  .gate{ padding:22px 16px; }
  .gate-btns{ gap:11px; }
  .gate-btn{ padding:18px 16px; font-size:15.5px; }
}

/* ============================================================
 * 给家长的一封信
 * 先是一张轻量「查收」卡片，家长主动点开后才进入完整信纸。
 * ============================================================ */
.parent-letter-modal{
  position:fixed; inset:0; z-index:10020;
  display:flex; align-items:center; justify-content:center;
  padding:24px;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .34s var(--ease), visibility .34s var(--ease);
}
.parent-letter-modal.is-open{
  opacity:1; visibility:visible; pointer-events:auto;
}
.parent-letter-backdrop{
  position:absolute; inset:0;
  background:rgba(4,13,27,.72);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
.parent-letter-frame{
  position:relative; z-index:1;
  width:min(100%, 610px); max-height:min(86vh, 780px);
  overflow:auto; overscroll-behavior:contain;
  color:var(--ink); background:#FFFDF8;
  border:1px solid rgba(255,255,255,.76); border-radius:28px;
  box-shadow:0 38px 90px -28px rgba(0,0,0,.72);
  transform:translateY(24px) scale(.975);
  transition:width .36s var(--ease), transform .38s var(--ease);
  scrollbar-width:thin; scrollbar-color:rgba(10,23,41,.24) transparent;
}
.parent-letter-modal.is-open .parent-letter-frame{ transform:none; }
.parent-letter-modal.is-full .parent-letter-frame{ width:min(100%, 790px); }
.parent-letter-frame::-webkit-scrollbar{ width:6px; }
.parent-letter-frame::-webkit-scrollbar-thumb{ background:rgba(10,23,41,.2); border-radius:999px; }

.parent-letter-close{
  position:sticky; float:right; top:16px; right:16px; z-index:4;
  width:38px; height:38px; margin:16px 16px -54px 0;
  display:grid; place-items:center; border-radius:50%; cursor:pointer;
  color:var(--tx-2); background:rgba(255,255,255,.88); border:1px solid var(--line);
  box-shadow:0 8px 24px -14px rgba(10,23,41,.42);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  transition:transform .2s var(--ease), color .2s var(--ease), background .2s var(--ease);
}
.parent-letter-close:hover{ transform:rotate(4deg) scale(1.05); color:var(--accent); background:#fff; }

.parent-letter-notice{
  min-height:560px; padding:42px 48px 40px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center;
  background:
    radial-gradient(360px 260px at 50% 18%, rgba(242,116,56,.12), transparent 72%),
    linear-gradient(180deg, #FFFDF8 0%, #FFF9F1 100%);
}
.letter-sender{
  align-self:flex-start; display:flex; align-items:center; gap:12px;
  margin-bottom:24px; text-align:left;
}
.letter-sender img{
  width:52px; height:52px; object-fit:cover; object-position:center top;
  border-radius:50%; background:#102A4C; border:2px solid #fff;
  box-shadow:0 8px 20px -10px rgba(10,23,41,.45);
}
.letter-sender span{ display:block; color:var(--accent); font-size:11.5px; font-weight:800; letter-spacing:.08em; }
.letter-sender b{ display:block; margin-top:3px; color:var(--tx-2); font-size:13px; font-weight:600; }
.letter-envelope{
  width:92px; height:92px; margin:2px auto 18px;
  display:grid; place-items:center; border-radius:28px;
  color:var(--accent); background:#fff;
  border:1px solid rgba(242,116,56,.18);
  box-shadow:0 20px 44px -20px rgba(242,116,56,.5);
}
.letter-kicker{
  color:var(--accent); font-size:11.5px; font-weight:800; letter-spacing:.17em;
  margin-bottom:11px;
}
.parent-letter-notice h2{
  font-size:clamp(29px, 5vw, 40px); line-height:1.28; letter-spacing:-.02em;
  margin-bottom:14px;
}
.parent-letter-notice > p{
  max-width:430px; color:var(--tx-2); font-size:15px; line-height:1.8;
}
.letter-notice-actions{
  width:100%; display:flex; flex-direction:column; align-items:center; gap:12px;
  margin-top:27px;
}
.letter-notice-actions .btn{ min-width:220px; }
.letter-later{
  padding:6px 12px; border:0; background:none; cursor:pointer;
  color:var(--tx-3); font-family:inherit; font-size:13px;
  text-decoration:underline; text-underline-offset:4px;
}
.letter-later:hover{ color:var(--tx-2); }

.parent-letter-document{ padding:55px 68px 46px; background:#FFFDF8; }
.letter-document-head{
  padding-bottom:27px; margin-bottom:28px; border-bottom:1px solid var(--line);
}
.letter-document-head > span{
  display:block; margin-bottom:10px; color:var(--accent);
  font-size:11.5px; font-weight:800; letter-spacing:.12em;
}
.letter-document-head h2{
  max-width:600px; font-size:clamp(29px, 4.3vw, 42px); line-height:1.28;
  letter-spacing:-.02em; margin-bottom:13px;
}
.letter-document-head p{ color:var(--tx-2); font-size:14px; line-height:1.75; }
.letter-copy{ color:#27374D; font-size:16px; line-height:2; }
.letter-copy p{ margin:0 0 20px; }
.letter-copy p:first-child{ color:var(--ink); font-weight:700; }
.letter-copy blockquote{
  position:relative; margin:30px 0; padding:24px 27px 24px 32px;
  color:var(--ink); background:#F4F8FD; border:1px solid #DCE7F3;
  border-left:4px solid var(--accent); border-radius:4px 16px 16px 4px;
  font-size:18px; font-weight:700; line-height:1.75;
}
.letter-share-copy{
  padding:23px 25px; border-radius:16px;
  color:#183759; background:linear-gradient(135deg, #EDF5FF, #FFF7EE);
  border:1px solid rgba(46,116,201,.13);
}
.letter-signature{
  display:flex; align-items:center; gap:12px; margin:31px 0 28px;
}
.letter-signature img{
  width:54px; height:54px; object-fit:cover; object-position:center top;
  border-radius:50%; background:#102A4C;
}
.letter-signature b{ display:block; color:var(--ink); font-size:14px; }
.letter-signature span{ display:block; margin-top:4px; color:var(--tx-3); font-size:12.5px; }
.letter-document-actions{
  display:flex; align-items:center; gap:12px; padding-top:25px;
  border-top:1px solid var(--line);
}
.letter-document-actions .btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.letter-share-status{ min-height:21px; margin:10px 0 0; color:var(--accent); font-size:12.5px; }

@media (max-width:640px){
  .parent-letter-modal{ padding:12px; align-items:flex-end; }
  .parent-letter-frame{
    max-height:91vh; border-radius:24px 24px 18px 18px;
    transform:translateY(32px);
  }
  .parent-letter-notice{ min-height:520px; padding:34px 24px 30px; }
  .letter-sender{ width:calc(100% - 44px); margin-bottom:19px; }
  .letter-sender b{ font-size:12.5px; }
  .letter-envelope{ width:78px; height:78px; border-radius:23px; }
  .letter-envelope svg{ width:49px; height:49px; }
  .parent-letter-notice h2{ font-size:28px; }
  .parent-letter-notice > p{ font-size:14px; }
  .parent-letter-document{ padding:52px 22px 31px; }
  .letter-document-head{ padding-right:23px; }
  .letter-document-head h2{ font-size:28px; }
  .letter-copy{ font-size:15px; line-height:1.92; }
  .letter-copy blockquote{ margin:25px 0; padding:20px 19px 20px 22px; font-size:16px; }
  .letter-share-copy{ padding:20px; }
  .letter-document-actions{ flex-direction:column; align-items:stretch; }
  .letter-document-actions .btn{ width:100%; }
}

@media (prefers-reduced-motion:reduce){
  .parent-letter-modal, .parent-letter-frame{ transition:none; }
}
