/* ===== Home page — hero slider, services, pricing, voices ===== */

/* Hero slider */
.hero-section{padding:calc(var(--header-h) + 28px) 0 40px;}
.hero-slider{position:relative;}
.hero-viewport{overflow:hidden; border-radius:0; position:relative; min-height:500px;}
.hero-track{display:grid; grid-template-columns:1fr; overflow:hidden;}
.hero-slide{
  grid-area:1 / 1;
  min-height:500px;
  display:grid; grid-template-columns:1.05fr .95fr; gap:44px; align-items:center;
  padding:36px 40px; border-radius:0;
  border:none; box-shadow:none; position:relative; overflow:visible;
  background:transparent;
  opacity:0; visibility:hidden; pointer-events:none;
}
.hero-slide.is-active,
.hero-slide.is-leaving{opacity:1; visibility:visible;}
.hero-slide.is-active{pointer-events:auto; z-index:2;}
.hero-slide.is-leaving{pointer-events:none; z-index:1;}
.hero-slide .mockup{box-shadow:none;}
.hero-slide .mockup-shell::before{display:none;}
.hero-slide .live-stage{box-shadow:none;}
.hero-slide .note-sheet{box-shadow:none;}
.hero-slide > *{position:relative; z-index:1;}

/* Hero visual cards — modern hover */
.hero-visual{
  position:relative; perspective:1100px; transform-style:preserve-3d;
  display:flex; align-items:center; justify-content:center; min-height:300px;
}
.hero-visual > .mockup-shell,
.hero-visual > .live-stage,
.hero-visual > .notes-stack,
.hero-visual > .success-rings{
  --hero-rx:0deg; --hero-ry:0deg; --hero-lift:0px; --hero-scale:1;
  transform:translateY(var(--hero-lift)) rotateX(var(--hero-rx)) rotateY(var(--hero-ry)) scale(var(--hero-scale));
  transform-style:preserve-3d;
  transition:transform .2s ease-out, box-shadow .45s var(--ease), border-color .45s var(--ease);
  will-change:transform;
}
.hero-slide.is-active .hero-visual.is-hovering > *{
  --hero-lift:-12px; --hero-scale:1.025;
}
.hero-visual > *::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:20;
  background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.14) 50%,transparent 62%);
  transform:translateX(-130%) skewX(-12deg); opacity:0;
  transition:transform .75s var(--ease), opacity .35s;
}
.hero-slide.is-active .hero-visual.is-hovering > *::after{
  opacity:1; transform:translateX(130%) skewX(-12deg);
}

/* Slide 1 — dashboard mockup */
.hero-slide--classic .mockup{
  border:1px solid var(--m-border); border-radius:var(--r-xl); overflow:hidden;
  transition:border-color .45s, box-shadow .45s;
}
.hero-slide--classic.is-active .hero-visual.is-hovering .mockup{
  border-color:rgba(245,184,65,.35);
  box-shadow:0 36px 70px -28px rgba(245,184,65,.38), 0 0 0 1px rgba(245,184,65,.12);
}
.hero-slide--classic.is-active .hero-visual.is-hovering .subject-row{
  transition:transform .35s var(--ease), background .35s;
}
.hero-slide--classic.is-active .hero-visual.is-hovering .subject-row:nth-child(1){transform:translateX(-4px); transition-delay:.02s;}
.hero-slide--classic.is-active .hero-visual.is-hovering .subject-row:nth-child(2){transform:translateX(4px); transition-delay:.06s;}
.hero-slide--classic.is-active .hero-visual.is-hovering .subject-row:nth-child(3){transform:translateX(-4px); transition-delay:.1s;}
.hero-slide--classic.is-active .hero-visual.is-hovering .bar-fill{
  filter:brightness(1.15); box-shadow:0 0 12px rgba(245,184,65,.45);
  transition:filter .35s, box-shadow .35s;
}
.hero-slide--classic.is-active .hero-visual.is-hovering .live-strip{
  transform:scale(1.02); border-color:rgba(55,217,196,.35);
  transition:transform .35s var(--ease), border-color .35s;
}

/* Slide 2 — live stage */
.hero-slide--live .live-stage{
  border-radius:var(--r-xl); overflow:hidden;
  transition:border-color .45s, box-shadow .45s;
}
.hero-slide--live.is-active .hero-visual.is-hovering .live-stage{
  border-color:rgba(55,217,196,.55);
  box-shadow:0 36px 72px -28px rgba(55,217,196,.42), 0 0 40px -12px rgba(55,217,196,.25);
}
.hero-slide--live .live-teacher .play{transition:transform .4s var(--ease), box-shadow .4s;}
.hero-slide--live.is-active .hero-visual.is-hovering .live-teacher .play{
  transform:scale(1.14); box-shadow:0 14px 36px rgba(55,217,196,.55);
  animation:heroPlayPulse 1.2s ease-in-out infinite;
}
@keyframes heroPlayPulse{
  0%,100%{box-shadow:0 14px 36px rgba(55,217,196,.55);}
  50%{box-shadow:0 14px 44px rgba(55,217,196,.75), 0 0 0 8px rgba(55,217,196,.12);}
}
.hero-slide--live.is-active .hero-visual.is-hovering .chat-bubble{
  transition:transform .35s var(--ease), opacity .35s;
}
.hero-slide--live.is-active .hero-visual.is-hovering .chat-bubble:nth-child(1){transform:translateY(-6px); transition-delay:.04s;}
.hero-slide--live.is-active .hero-visual.is-hovering .chat-bubble:nth-child(2){transform:translateY(-10px) scale(1.02); transition-delay:.08s;}
.hero-slide--live.is-active .hero-visual.is-hovering .chat-bubble:nth-child(3){transform:translateY(-4px); transition-delay:.12s;}

/* Slide 3 — notes stack fan */
.note-sheet{transition:transform .45s var(--ease), box-shadow .45s, opacity .45s, border-color .45s;}
.hero-slide--notes.is-active .hero-visual.is-hovering .note-sheet:nth-child(1){
  transform:rotate(10deg) translateY(-16px) translateX(10px); z-index:4;
  box-shadow:0 28px 50px -20px rgba(139,92,246,.45); border-color:rgba(167,139,250,.45);
}
.hero-slide--notes.is-active .hero-visual.is-hovering .note-sheet:nth-child(2){
  transform:rotate(-8deg) translateY(-8px) translateX(-6px); opacity:1;
}
.hero-slide--notes.is-active .hero-visual.is-hovering .note-sheet:nth-child(3){
  transform:rotate(5deg) translateY(6px); opacity:.92;
}

/* Slide 4 — success rings */
.hero-slide--success.is-active .hero-visual.is-hovering .ring-card{
  transition:transform .35s var(--ease), border-color .35s, box-shadow .35s;
}
.hero-slide--success.is-active .hero-visual.is-hovering .ring-card:nth-child(1){transform:translateY(-6px) scale(1.02);}
.hero-slide--success.is-active .hero-visual.is-hovering .ring-card:nth-child(2){transform:translateY(-8px); transition-delay:.05s;}
.hero-slide--success.is-active .hero-visual.is-hovering .ring-card:nth-child(3){transform:translateY(-8px); transition-delay:.1s;}
.hero-slide--success.is-active .hero-visual.is-hovering .ring-card:nth-child(4){transform:translateY(-8px); transition-delay:.15s;}
.hero-slide--success.is-active .hero-visual.is-hovering .ring-card.featured{
  box-shadow:0 24px 48px -20px rgba(245,184,65,.35); border-color:rgba(245,184,65,.35);
}
.hero-slide--success.is-active .hero-visual.is-hovering .ring-num{
  animation:heroNumGlow 1.4s ease-in-out infinite;
}
@keyframes heroNumGlow{
  0%,100%{filter:brightness(1);}
  50%{filter:brightness(1.2);}
}

.hero-slide h1{font-size:clamp(1.95rem,4vw,3.1rem); font-weight:800; line-height:1.32; margin-bottom:16px;}
.hero-slide p{color:var(--text-mid); font-size:1.02rem; max-width:470px; margin-bottom:26px; line-height:1.85;}
.hero-ctas{display:flex; gap:12px; flex-wrap:wrap; margin-bottom:32px;}
.hero-slide--live .g-text{background:linear-gradient(120deg,var(--jade),var(--jade-2)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero-slide--notes .g-text{background:linear-gradient(120deg,#C4B5FD,#8B5CF6); -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero-slide--live .eyebrow{background:var(--jade-soft); border-color:rgba(55,217,196,.3); color:var(--jade);}
.hero-slide--notes .eyebrow{background:rgba(139,92,246,.14); border-color:rgba(139,92,246,.28); color:#A78BFA;}

/* Per-slide enter animations */
@keyframes heroFadeUp{from{opacity:0; transform:translateY(40px);} to{opacity:1; transform:translateY(0);}}
@keyframes heroFadeOut{from{opacity:1; transform:translateY(0);} to{opacity:0; transform:translateY(-28px);}}
@keyframes heroSlideInStart{from{opacity:0; transform:translateX(48px);} to{opacity:1; transform:translateX(0);}}
@keyframes heroSlideOutEnd{from{opacity:1; transform:translateX(0);} to{opacity:0; transform:translateX(-48px);}}
@keyframes heroSlideInEnd{from{opacity:0; transform:translateX(-48px);} to{opacity:1; transform:translateX(0);}}
@keyframes heroSlideOutStart{from{opacity:1; transform:translateX(0);} to{opacity:0; transform:translateX(48px);}}
@keyframes heroZoomIn{from{opacity:0; transform:scale(.88);} to{opacity:1; transform:scale(1);}}
@keyframes heroZoomOut{from{opacity:1; transform:scale(1);} to{opacity:0; transform:scale(.92);}}
@keyframes heroPopIn{from{opacity:0; transform:scale(.75) rotate(-4deg);} to{opacity:1; transform:scale(1) rotate(0);}}
@keyframes heroFlipIn{from{opacity:0; transform:perspective(800px) rotateY(-18deg) translateX(20px);} to{opacity:1; transform:perspective(800px) rotateY(0) translateX(0);}}

.hero-slide--classic.is-active .hero-copy{animation:heroFadeUp .75s var(--ease) both;}
.hero-slide--classic.is-active .hero-visual{animation:heroFadeUp .75s .14s var(--ease) both;}
.hero-slide--classic.is-leaving{animation:heroFadeOut .55s var(--ease) forwards;}

.hero-slide--live.is-active .hero-copy{animation:heroSlideInStart .7s var(--ease) both;}
.hero-slide--live.is-active .hero-visual{animation:heroZoomIn .8s .16s var(--ease) both;}
.hero-slide--live.is-leaving{animation:heroSlideOutEnd .55s var(--ease) forwards;}

.hero-slide--notes.is-active .hero-copy{animation:heroSlideInEnd .7s .1s var(--ease) both;}
.hero-slide--notes.is-active .hero-visual{animation:heroFlipIn .85s var(--ease) both;}
.hero-slide--notes.is-leaving{animation:heroZoomOut .55s var(--ease) forwards;}

.hero-slide--success.is-active .hero-copy{animation:heroFadeUp .65s var(--ease) both;}
.hero-slide--success.is-active .hero-visual{animation:heroPopIn .9s .18s var(--ease) both;}
.hero-slide--success.is-leaving{animation:heroSlideOutStart .55s var(--ease) forwards;}

html[dir="ltr"] .hero-slide--live.is-active .hero-copy{animation-name:heroSlideInEnd;}
html[dir="ltr"] .hero-slide--live.is-leaving{animation-name:heroSlideOutStart;}
html[dir="ltr"] .hero-slide--notes.is-active .hero-copy{animation-name:heroSlideInStart;}
html[dir="ltr"] .hero-slide--success.is-leaving{animation-name:heroSlideOutEnd;}

.trust-row{display:flex; gap:10px; flex-wrap:wrap;}
.trust-item{display:flex; align-items:center; gap:10px; padding:11px 14px; border-radius:var(--r-md); background:var(--glass); border:1px solid var(--border); backdrop-filter:blur(8px); flex:1; min-width:120px;}
.trust-item .t-ic{width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; background:var(--gold-soft); color:var(--gold); flex-shrink:0;}
.trust-item .t-ic .icon{width:17px; height:17px;}
.stat-num{font-size:1.22rem; font-weight:800; display:block; line-height:1.1;}
.trust-item span{color:var(--text-low); font-size:.74rem;}

.hero-viewport .mockup{animation:none;}
.live-stage{width:100%; max-width:400px; background:linear-gradient(165deg,#12141F,#0A0C14); border:1px solid rgba(55,217,196,.28); border-radius:var(--r-xl); overflow:hidden; box-shadow:0 28px 60px -28px rgba(55,217,196,.35);}
.live-stage-bar{display:flex; align-items:center; justify-content:space-between; padding:11px 15px; background:rgba(255,107,107,.1); border-bottom:1px solid rgba(255,107,107,.18);}
.live-stage-bar .live-pill{display:flex; align-items:center; gap:6px; font-size:.7rem; font-weight:700; color:var(--rose);}
.live-stage-bar .viewers{font-size:.7rem; color:var(--m-text-low);}
.live-stage-body{padding:18px;}
.live-teacher{width:100%; aspect-ratio:16/9; border-radius:var(--r-md); background:linear-gradient(145deg,rgba(55,217,196,.14),rgba(9,10,18,.85)); display:flex; align-items:center; justify-content:center; margin-bottom:12px; border:1px solid var(--m-border);}
.live-teacher .play{width:52px; height:52px; border-radius:50%; background:var(--grad-jade); display:flex; align-items:center; justify-content:center; color:var(--ink-fixed); box-shadow:0 8px 22px rgba(55,217,196,.4);}
.live-chat{display:flex; flex-direction:column; gap:7px;}
.chat-bubble{padding:7px 11px; border-radius:11px; font-size:.75rem; max-width:88%;}
.chat-bubble.in{background:var(--m-surface-2); color:var(--m-text-mid); align-self:flex-start;}
.chat-bubble.out{background:var(--jade-soft); color:var(--jade); align-self:flex-end; border:1px solid rgba(55,217,196,.2);}

.notes-stack{position:relative; width:100%; max-width:320px; height:340px; margin:0 auto;}
.note-sheet{position:absolute; width:90%; padding:20px 22px; border-radius:var(--r-lg); background:linear-gradient(160deg,var(--surface),var(--surface-2)); border:1px solid var(--border-hi); box-shadow:0 18px 44px -18px rgba(0,0,0,.6);}
.note-sheet:nth-child(1){top:0; inset-inline-end:0; transform:rotate(4deg); z-index:3;}
.note-sheet:nth-child(2){top:46px; inset-inline-start:0; transform:rotate(-3deg); z-index:2; opacity:.92;}
.note-sheet:nth-child(3){top:92px; inset-inline-end:6%; transform:rotate(2deg); z-index:1; opacity:.78;}
.note-sheet .n-tag{font-size:.66rem; font-weight:700; color:#A78BFA; background:rgba(139,92,246,.16); padding:4px 10px; border-radius:999px; display:inline-block; margin-bottom:8px;}
.note-sheet h4{font-size:.92rem; font-weight:700; margin-bottom:6px;}
.note-sheet p{font-size:.76rem; color:var(--text-low); margin:0; line-height:1.55;}
.note-lines{display:flex; flex-direction:column; gap:5px; margin-top:10px;}
.note-lines span{height:4px; border-radius:99px; background:var(--border);}
.note-lines span:nth-child(1){width:90%;}
.note-lines span:nth-child(2){width:68%;}
.note-lines span:nth-child(3){width:50%;}

.success-rings{display:grid; grid-template-columns:1fr 1fr; gap:14px; width:100%; max-width:360px; margin:0 auto;}
.ring-card{padding:22px 18px; border-radius:var(--r-lg); text-align:center; background:var(--glass); border:1px solid var(--border); backdrop-filter:blur(8px); transition:transform .3s var(--ease);}
.ring-card:hover{transform:translateY(-4px); border-color:rgba(245,184,65,.28);}
.ring-card .ring-num{font-family:var(--font-head); font-size:2.2rem; font-weight:800; line-height:1; background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent;}
.ring-card span{font-size:.76rem; color:var(--text-low); display:block; margin-top:5px;}
.ring-card.featured{grid-column:span 2; display:flex; align-items:center; justify-content:center; gap:18px; text-align:start; padding:24px 28px; background:linear-gradient(135deg,rgba(245,184,65,.12),var(--glass));}
.ring-card.featured .ring-num{font-size:2.8rem;}

.hero-controls{display:flex; align-items:center; justify-content:center; gap:18px; margin-top:24px;}
.hero-dots{display:flex; gap:7px; align-items:center;}
.hero-dot{width:8px; height:8px; border-radius:50%; background:var(--border-hi); border:none; padding:0; cursor:pointer; transition:all .3s var(--ease);}
.hero-dot.active{width:26px; border-radius:99px; background:var(--grad-gold);}
.hero-arrow{width:38px; height:38px; border-radius:50%; background:var(--glass); border:1px solid var(--border); color:var(--text-hi); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all .25s var(--ease);}
.hero-arrow:hover{border-color:var(--gold); color:var(--gold);}
.hero-arrow .icon{width:17px; height:17px;}

/* Services */
.services-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.svc-card{overflow:hidden; display:flex; flex-direction:column; border-radius:var(--r-lg); background:var(--glass); border:1px solid var(--border); transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);}
.svc-card:hover{transform:translateY(-6px); box-shadow:0 24px 56px -26px rgba(0,0,0,.55); border-color:var(--border-hi);}
.svc-card--gold .svc-top{background:linear-gradient(160deg,rgba(245,184,65,.16),transparent 70%);}
.svc-card--jade .svc-top{background:linear-gradient(160deg,rgba(55,217,196,.14),transparent 70%);}
.svc-card--violet .svc-top{background:linear-gradient(160deg,rgba(139,92,246,.14),transparent 70%);}
.svc-top{padding:28px 28px 0; position:relative;}
.svc-num{position:absolute; top:12px; inset-inline-end:18px; font-family:var(--font-head); font-size:3.2rem; font-weight:800; line-height:1; opacity:.06; color:var(--text-hi);}
.svc-icon{width:54px; height:54px; border-radius:15px; display:flex; align-items:center; justify-content:center; margin-bottom:18px; border:1px solid var(--border);}
.svc-card--gold .svc-icon{background:var(--gold-soft); color:var(--gold); border-color:rgba(245,184,65,.25);}
.svc-card--jade .svc-icon{background:var(--jade-soft); color:var(--jade); border-color:rgba(55,217,196,.25);}
.svc-card--violet .svc-icon{background:rgba(139,92,246,.14); color:#A78BFA; border-color:rgba(139,92,246,.25);}
.svc-body{padding:0 28px 28px; flex:1; display:flex; flex-direction:column;}
.svc-card h3{font-size:1.2rem; font-weight:800; margin-bottom:10px;}
.svc-card p{color:var(--text-mid); font-size:.9rem; line-height:1.75; margin-bottom:18px; flex:1;}
.svc-feats{display:flex; flex-direction:column; gap:8px; margin-bottom:20px;}
.svc-feats li{display:flex; align-items:center; gap:9px; font-size:.82rem; color:var(--text-mid);}
.svc-feats li .dot{width:5px; height:5px; border-radius:50%; flex-shrink:0;}
.svc-card--gold .svc-feats .dot{background:var(--gold);}
.svc-card--jade .svc-feats .dot{background:var(--jade);}
.svc-card--violet .svc-feats .dot{background:#A78BFA;}
.svc-foot{padding:14px 28px; border-top:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; gap:10px;}
.svc-link{font-weight:600; font-size:.84rem; color:var(--gold); display:inline-flex; align-items:center; gap:6px; transition:gap .2s var(--ease);}
.svc-link:hover{gap:10px;}
.svc-link .icon{width:15px; height:15px;}
.svc-chips{display:flex; gap:6px; flex-wrap:wrap;}
.svc-chips span{font-size:.68rem; padding:4px 9px; border-radius:999px; background:var(--surface-2); border:1px solid var(--border); color:var(--text-low);}

/* Teachers — modern bento showcase */
.teachers-section{position:relative;}
.teachers-section::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(ellipse 70% 50% at 50% 0%, rgba(55,217,196,.06), transparent 60%);
  pointer-events:none;
}
.teachers-stats{
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px;
  margin:-24px auto 40px; max-width:820px;
}
.t-stat{
  text-align:center; padding:16px 12px; border-radius:var(--r-md);
  background:var(--glass); border:1px solid var(--border);
  transition:border-color .3s, transform .3s var(--ease);
}
.t-stat:hover{border-color:var(--border-hi); transform:translateY(-2px);}
.t-stat-num{
  display:block; font-family:var(--font-head); font-size:1.45rem; font-weight:800;
  background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent;
  line-height:1.2; margin-bottom:4px;
}
.t-stat span:last-child{font-size:.76rem; color:var(--text-low);}

.teachers-showcase{
  display:grid; grid-template-columns:1.15fr 1fr; grid-template-rows:auto auto auto;
  gap:18px; position:relative;
}
.t-card{
  position:relative; border-radius:var(--r-xl); overflow:hidden;
  border:1px solid var(--border); background:var(--glass);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s;
}
.t-card:hover{
  transform:translateY(-6px);
  box-shadow:0 28px 56px -28px rgba(0,0,0,.5);
  border-color:var(--border-hi);
}
.t-card--featured{grid-row:1 / 3;}
.t-card--wide{grid-column:1 / -1;}
.t-card-bg{
  position:absolute; inset:0; opacity:.55; pointer-events:none;
  transition:opacity .4s;
}
.t-card:hover .t-card-bg{opacity:.85;}
.t-card--gold .t-card-bg{background:linear-gradient(155deg,rgba(245,184,65,.16),transparent 55%);}
.t-card--jade .t-card-bg{background:linear-gradient(155deg,rgba(55,217,196,.14),transparent 55%);}
.t-card--violet .t-card-bg{background:linear-gradient(155deg,rgba(139,92,246,.14),transparent 55%);}
.t-card--rose .t-card-bg{background:linear-gradient(155deg,rgba(255,107,107,.12),transparent 55%);}
.t-card--gold:hover{border-color:rgba(245,184,65,.35); box-shadow:0 28px 56px -24px rgba(245,184,65,.22);}
.t-card--jade:hover{border-color:rgba(55,217,196,.35);}
.t-card--violet:hover{border-color:rgba(139,92,246,.35);}
.t-card--rose:hover{border-color:rgba(255,107,107,.3);}

.t-card-inner{position:relative; z-index:1; padding:26px 26px 24px; display:flex; flex-direction:column; gap:14px; height:100%;}
.t-card-inner--row{
  flex-direction:row; flex-wrap:wrap; align-items:center; gap:16px 24px;
}
.t-card-inner--row .t-card-head{flex:0 0 auto;}
.t-card-inner--row .t-bio{flex:1 1 220px; margin:0;}
.t-card-inner--row .t-metrics{flex:0 0 auto;}
.t-card-inner--row .t-link--inline{margin-inline-start:auto;}

.t-card-head{display:flex; align-items:center; gap:14px; flex-wrap:wrap;}
.t-head-meta{display:flex; flex-direction:column; gap:6px;}
.t-avatar{
  width:64px; height:64px; border-radius:18px; padding:2px; flex-shrink:0;
  background:var(--grad-gold); transition:transform .4s var(--ease);
}
.t-card:hover .t-avatar{transform:scale(1.06);}
.t-card--jade .t-avatar{background:var(--grad-jade);}
.t-card--violet .t-avatar{background:linear-gradient(135deg,#A78BFA,#8B5CF6);}
.t-card--rose .t-avatar{background:linear-gradient(135deg,#FF8A8A,var(--rose));}
.t-avatar--lg{width:80px; height:80px; border-radius:22px;}
.t-avatar span{
  width:100%; height:100%; border-radius:inherit; background:var(--surface);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-head); font-weight:800; font-size:1.15rem; color:var(--gold);
}
.t-card--jade .t-avatar span{color:var(--jade);}
.t-card--violet .t-avatar span{color:#A78BFA;}
.t-card--rose .t-avatar span{color:var(--rose);}

.t-subject{
  display:inline-block; font-size:.72rem; font-weight:700; letter-spacing:.04em;
  padding:5px 12px; border-radius:999px; width:fit-content;
}
.t-card--gold .t-subject{background:var(--gold-soft); color:var(--gold); border:1px solid rgba(245,184,65,.28);}
.t-card--jade .t-subject{background:var(--jade-soft); color:var(--jade); border:1px solid rgba(55,217,196,.28);}
.t-card--violet .t-subject{background:rgba(139,92,246,.14); color:#A78BFA; border:1px solid rgba(139,92,246,.28);}
.t-card--rose .t-subject{background:rgba(255,107,107,.12); color:var(--rose); border:1px solid rgba(255,107,107,.25);}

.t-live{display:inline-flex; align-items:center; gap:6px; font-size:.72rem; color:var(--jade); font-weight:600;}
.t-live .live-dot{background:var(--jade); box-shadow:0 0 0 0 rgba(55,217,196,.55);}
.t-card h3{font-size:1.15rem; font-weight:800; line-height:1.35;}
.t-card--featured h3{font-size:1.35rem;}
.t-bio{color:var(--text-mid); font-size:.88rem; line-height:1.75; font-weight:300;}
.t-bio--sm{font-size:.82rem; line-height:1.65;}

.t-metrics{display:flex; gap:10px; flex-wrap:wrap;}
.t-metrics--compact{gap:8px;}
.t-metric{
  display:flex; align-items:center; gap:6px; padding:8px 12px;
  border-radius:var(--r-sm); background:var(--surface-2); border:1px solid var(--border);
  font-size:.78rem; color:var(--text-mid);
}
.t-metric b{font-family:var(--font-head); font-size:.95rem; font-weight:800; color:var(--text-hi);}
.t-metric .icon{width:13px; height:13px; color:var(--gold);}

.t-tags{display:flex; flex-wrap:wrap; gap:7px;}
.t-tags span{
  font-size:.7rem; font-weight:600; padding:4px 10px; border-radius:999px;
  background:var(--glass); border:1px solid var(--border); color:var(--text-low);
}

.t-link{
  display:inline-flex; align-items:center; gap:8px; margin-top:auto;
  font-weight:700; font-size:.84rem; color:var(--gold);
  transition:gap .25s var(--ease), color .25s;
}
.t-link:hover{gap:12px; color:var(--gold-3);}
.t-link .icon{width:16px; height:16px;}
.t-link--inline{margin-top:0;}

/* Pricing — large showcase */
#pricing{
  position:relative;
  max-width:1440px;
  margin:0 auto;
  padding:110px clamp(20px,4vw,48px);
  width:100%;
}
#pricing::before{content:""; position:absolute; inset:0; background:radial-gradient(ellipse at 50% 0%,rgba(245,184,65,.08),transparent 55%); pointer-events:none;}
.pricing-showcase{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(20px,2.5vw,36px);
  align-items:stretch;
  position:relative;
  width:100%;
}
.plan-card{
  padding:clamp(36px,3vw,52px) clamp(28px,2.5vw,44px);
  display:flex; flex-direction:column; position:relative;
  border-radius:var(--r-xl); background:var(--glass); border:1px solid var(--border);
  min-height:540px; width:100%;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.plan-card:hover{transform:translateY(-6px); box-shadow:0 28px 60px -28px rgba(0,0,0,.5); border-color:var(--border-hi);}
.plan-card.featured{
  min-height:580px;
  background:linear-gradient(165deg,rgba(245,184,65,.14),rgba(9,10,18,.6));
  border:2px solid rgba(245,184,65,.4);
  box-shadow:0 32px 70px -24px rgba(245,184,65,.25);
}
.plan-card.featured:hover{transform:translateY(-8px); box-shadow:0 36px 76px -20px rgba(245,184,65,.35);}
.plan-icon{width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center; margin-bottom:20px; background:var(--gold-soft); color:var(--gold); border:1px solid rgba(245,184,65,.22);}
.plan-card:not(.featured) .plan-icon{background:var(--surface-2); color:var(--text-mid); border-color:var(--border);}
.plan-badge{position:absolute; top:-13px; inset-inline-start:50%; transform:translateX(50%); font-size:.72rem; font-weight:700; color:var(--ink-fixed); background:var(--grad-gold); padding:6px 18px; border-radius:999px; box-shadow:0 8px 22px -6px rgba(245,184,65,.75); font-family:var(--font-head); white-space:nowrap;}
.plan-card h3{font-size:clamp(1.25rem,1.6vw,1.45rem); font-weight:800; margin-bottom:8px;}
.plan-card .plan-desc{color:var(--text-low); font-size:clamp(.88rem,1vw,.95rem); margin-bottom:22px;}
.plan-card .price-wrap{margin-bottom:28px; padding-bottom:28px; border-bottom:1px solid var(--border);}
.plan-card .price{font-family:var(--font-head); font-size:clamp(2.8rem,4vw,3.8rem); font-weight:800; line-height:1; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap;}
.plan-card .price .cur{font-size:clamp(.88rem,1vw,1rem); color:var(--text-low); font-weight:400; font-family:var(--font-body);}
.plan-card ul{display:flex; flex-direction:column; gap:15px; margin-bottom:34px; flex:1;}
.plan-card ul li{display:flex; align-items:flex-start; gap:12px; font-size:clamp(.9rem,1vw,.98rem); color:var(--text-mid); line-height:1.55;}
.plan-card ul li .check{width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:1px;}
.plan-card.featured ul li .check{background:var(--gold-soft); color:var(--gold);}
.plan-card:not(.featured) ul li .check{background:var(--jade-soft); color:var(--jade);}
.plan-card ul li .check .icon{width:13px; height:13px;}

/* Student voices — grid */
#testimonials{background:linear-gradient(180deg,transparent,rgba(245,184,65,.03) 50%,transparent);}
.voices-grid{display:grid; grid-template-columns:repeat(12,1fr); gap:20px;}
.voice-card{
  grid-column:span 4; padding:28px 26px; border-radius:var(--r-lg);
  background:var(--glass); border:1px solid var(--border);
  display:flex; flex-direction:column; gap:16px;
  transition:transform .3s var(--ease), border-color .3s var(--ease);
}
.voice-card:hover{transform:translateY(-4px); border-color:var(--border-hi);}
.voice-card.featured{grid-column:span 8; flex-direction:row; align-items:center; gap:28px; padding:36px 32px; background:linear-gradient(135deg,rgba(245,184,65,.1),var(--glass)); border-color:rgba(245,184,65,.22);}
.voice-card.featured .voice-body{flex:1;}
.voice-stars{display:flex; gap:3px; color:var(--gold);}
.voice-stars .icon{width:15px; height:15px;}
.voice-quote{font-family:var(--font-head); font-size:2.8rem; line-height:1; color:var(--gold); opacity:.35; height:18px;}
.voice-card.featured .voice-quote{font-size:4rem; opacity:.4;}
.voice-card p{color:var(--text-mid); font-size:.92rem; line-height:1.8; flex:1;}
.voice-card.featured p{font-size:1.05rem;}
.voice-foot{display:flex; align-items:center; gap:12px; margin-top:auto;}
.voice-avatar{width:48px; height:48px; border-radius:50%; background:var(--grad-gold); padding:2px; flex-shrink:0;}
.voice-avatar span{width:100%; height:100%; border-radius:50%; background:var(--surface); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem; color:var(--gold); font-family:var(--font-head);}
.voice-card.featured .voice-avatar{width:64px; height:64px;}
.voice-card.featured .voice-avatar span{font-size:1rem;}
.voice-foot b{font-size:.9rem; display:block; font-weight:700;}
.voice-foot span{color:var(--text-low); font-size:.76rem;}
.voice-tag{display:inline-block; font-size:.68rem; font-weight:600; padding:4px 10px; border-radius:999px; background:var(--gold-soft); color:var(--gold); margin-top:4px;}

/* FAQ, app, cta */
.faq-list{max-width:760px; margin:0 auto; display:flex; flex-direction:column; gap:12px;}
.faq-item{background:var(--glass); border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; transition:border-color .3s var(--ease);}
.faq-item.open{border-color:rgba(245,184,65,.35);}
.faq-q{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 24px; cursor:pointer; font-weight:600; font-size:.95rem;}
.faq-q .icon{color:var(--text-low); transition:transform .35s var(--ease); flex-shrink:0;}
.faq-item.open .faq-q .icon{transform:rotate(180deg); color:var(--gold);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .4s var(--ease);}
.faq-a p{padding:0 24px 22px; color:var(--text-mid); font-size:.9rem;}

.app-sec{display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;}
.app-feats{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin:30px 0 36px;}
.app-feat{display:flex; gap:13px; align-items:flex-start;}
.app-feat .a-ic{width:42px; height:42px; border-radius:11px; background:var(--gold-soft); color:var(--gold); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.app-feat b{display:block; font-size:.94rem; font-weight:600; margin-bottom:2px;}
.app-feat span{color:var(--text-low); font-size:.82rem;}
.store-btns{display:flex; gap:12px; flex-wrap:wrap;}
.store-btn{display:flex; align-items:center; gap:11px; padding:12px 20px; border-radius:var(--r-md); background:var(--glass); border:1px solid var(--border-hi); transition:all .25s var(--ease);}
.store-btn:hover{border-color:var(--gold); transform:translateY(-2px);}
.store-btn .icon{color:var(--gold);}
.store-btn small{display:block; font-size:.68rem; color:var(--text-low); line-height:1.2;}
.store-btn b{display:block; font-size:.92rem; font-weight:600;}

.cta-band{max-width:var(--maxw); margin:0 auto; padding:56px 48px; border-radius:var(--r-xl); position:relative; overflow:hidden;
  background:linear-gradient(130deg,rgba(245,184,65,.16),rgba(55,217,196,.1)); border:1px solid var(--border-hi); text-align:center;}
.cta-band::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 20% 0,rgba(245,184,65,.35),transparent 55%); pointer-events:none;}
.cta-band h2{font-size:clamp(1.6rem,3vw,2.3rem); font-weight:800; margin-bottom:12px; position:relative;}
.cta-band p{color:var(--text-mid); margin-bottom:28px; position:relative;}
.cta-band .hero-ctas{justify-content:center; margin-bottom:0; position:relative;}

@media (max-width:1100px){
  .plan-card.featured{min-height:auto;}
}
@media (prefers-reduced-motion:reduce){
  .hero-slide.is-active .hero-copy,
  .hero-slide.is-active .hero-visual,
  .hero-slide.is-leaving{animation:none !important;}
  .hero-visual > *{transform:none !important; --hero-lift:0 !important; --hero-scale:1 !important;}
  .hero-visual > *::after{display:none;}
  .hero-slide--live.is-active .hero-visual.is-hovering .live-teacher .play{animation:none;}
  .hero-slide--success.is-active .hero-visual.is-hovering .ring-num{animation:none;}
}
@media (max-width:920px){
  .hero-section{padding:calc(var(--header-h) + 16px) 0 32px;}
  .hero-slide{grid-template-columns:1fr; min-height:auto; padding:28px 20px; gap:32px; max-width:100%; min-width:0;}
  .hero-copy,.hero-visual{max-width:100%; min-width:0;}
  .hero-viewport{min-height:auto;}
  .hero-slide h1{font-size:clamp(1.65rem,5.2vw,2.25rem);}
  .hero-slide p{font-size:.94rem; max-width:none; margin-bottom:20px;}
  .hero-ctas{margin-bottom:24px;}
  .hero-ctas .btn{flex:1 1 auto; min-width:0;}
  .trust-row{display:grid; grid-template-columns:repeat(2,1fr); gap:8px;}
  .trust-item{min-width:0; padding:10px 12px;}
  .hero-visual{min-height:240px; overflow:hidden;}
  .hero-visual .mockup-shell,.live-stage,.notes-stack,.success-rings{width:100%; max-width:100%;}
  .notes-stack{height:280px;}
  .services-grid{grid-template-columns:1fr;}
  .teachers-stats{grid-template-columns:1fr 1fr; gap:10px; margin-bottom:32px;}
  .teachers-showcase{grid-template-columns:1fr; grid-template-rows:auto;}
  .t-card--featured{grid-row:auto;}
  .t-card--wide .t-card-inner--row{flex-direction:column; align-items:flex-start;}
  .t-card--wide .t-link--inline{margin-inline-start:0;}
  #pricing{padding:80px 16px;}
  .pricing-showcase{grid-template-columns:1fr; max-width:560px; margin:0 auto;}
  .plan-card.featured{order:-1;}
  .plan-card{min-height:auto;}
  .voice-card,.voice-card.featured{grid-column:span 12; flex-direction:column;}
  .voices-grid{gap:14px;}
  .voice-card{padding:22px 20px;}
  .voice-card.featured{padding:26px 22px; gap:18px;}
  .app-sec{grid-template-columns:1fr; gap:40px;}
  .cta-band{padding:44px 24px; margin:0 16px; width:auto;}
}
@media (max-width:560px){
  .hero-section{padding-bottom:20px;}
  .hero-slide{padding:22px 16px; gap:22px;}
  .hero-slide h1{font-size:1.55rem; line-height:1.35;}
  .hero-slide p{font-size:.88rem; line-height:1.7;}
  .hero-ctas{flex-direction:column; gap:10px;}
  .hero-ctas .btn{width:100%; justify-content:center; white-space:normal; text-align:center; padding:12px 18px;}
  .trust-row{grid-template-columns:1fr;}
  .trust-item .stat-num{font-size:1.1rem;}
  .hero-visual{min-height:200px;}
  .notes-stack{height:220px;}
  .success-rings{gap:10px;}
  .ring-card{padding:16px 14px;}
  .ring-card .ring-num{font-size:1.75rem;}
  .ring-card.featured{flex-direction:column; text-align:center; gap:6px; padding:18px 16px;}
  .ring-card.featured .ring-num{font-size:2rem;}
  .hero-controls{margin-top:14px; gap:10px;}
  .hero-arrow{width:34px; height:34px;}
  .svc-top{padding:20px 20px 0;}
  .svc-body{padding:0 20px 20px;}
  .svc-foot{padding:12px 20px; flex-wrap:wrap;}
  .svc-num{font-size:2.2rem; top:8px;}
  .teachers-stats{grid-template-columns:1fr 1fr; gap:8px; margin-bottom:24px;}
  .t-card-inner{padding:18px;}
  .t-metrics{flex-wrap:wrap; gap:8px;}
  .t-stat{padding:12px 8px;}
  .t-stat-num{font-size:1.15rem;}
  #pricing{padding:72px 12px;}
  .plan-card{padding:26px 18px;}
  .plan-card .price{font-size:2.35rem;}
  .plan-badge{font-size:.65rem; padding:5px 12px; top:-11px;}
  .voice-card p{font-size:.86rem;}
  .voice-card.featured p{font-size:.9rem;}
  .voice-quote{font-size:1.8rem;}
  .voice-card.featured .voice-quote{font-size:2.4rem;}
  .faq-q{padding:16px 18px; font-size:.88rem; gap:12px;}
  .faq-a p{padding:0 18px 18px; font-size:.85rem;}
  .app-feats{grid-template-columns:1fr; margin:18px 0 22px;}
  .store-btns{flex-direction:column;}
  .store-btn{width:100%; justify-content:center;}
  .cta-band{padding:32px 18px; border-radius:var(--r-lg);}
  .cta-band h2{font-size:1.3rem;}
  .cta-band p{font-size:.88rem; margin-bottom:22px;}
}
@media (hover:none) and (pointer:coarse){
  .hero-visual > *{transform:none !important;}
  .hero-slide.is-active .hero-visual.is-hovering .note-sheet{transform:none !important; opacity:1 !important;}
  .hero-slide.is-active .hero-visual.is-hovering .ring-card{transform:none !important;}
  .hero-slide.is-active .hero-visual.is-hovering .chat-bubble{transform:none !important;}
  .hero-slide.is-active .hero-visual.is-hovering .subject-row{transform:none !important;}
  .plan-card:hover,.svc-card:hover,.voice-card:hover,.t-card:hover{transform:none;}
}