.page-hero{text-align:center;padding-top:80px;padding-bottom:64px;position:relative;overflow:hidden}.page-hero__bg{background:radial-gradient(ellipse 50% 40% at 50% 0%, color-mix(in oklab, var(--primary) 14%, transparent), transparent 60%);position:absolute;inset:0}.page-hero>*{position:relative}.page-hero .h1{max-width:800px;margin:20px auto 24px}.timeline{position:relative}.timeline:before{content:"";background:var(--border-faint);width:1px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-.5px)}@media (max-width:800px){.timeline:before{left:24px}}.step{grid-template-columns:1fr 56px 1fr;gap:32px;padding:48px 0;display:grid;position:relative}.step:nth-child(odd) .step__copy{text-align:right;grid-area:1/1;align-self:center;padding-right:16px}.step:nth-child(odd) .step__num{grid-area:1/2;align-self:start;margin-top:8px}.step:nth-child(odd) .step__visual{grid-area:1/3}.step:nth-child(2n) .step__visual{grid-area:1/1}.step:nth-child(2n) .step__num{grid-area:1/2;align-self:start;margin-top:8px}.step:nth-child(2n) .step__copy{text-align:left;grid-area:1/3;align-self:center;padding-left:16px}@media (max-width:800px){.step{grid-template-columns:56px 1fr;gap:16px}.step:nth-child(odd) .step__copy,.step:nth-child(2n) .step__copy{text-align:left;grid-area:1/2;padding:0!important}.step:nth-child(odd) .step__num,.step:nth-child(2n) .step__num{grid-area:1/1}.step:nth-child(odd) .step__visual,.step:nth-child(2n) .step__visual{grid-area:2/2}}.step__num{background:var(--bg);border:1px solid var(--border-strong);width:56px;height:56px;color:var(--fg-2);font-family:var(--ff-mono);z-index:1;border-radius:50%;justify-self:center;place-items:center;font-size:16px;font-weight:600;display:grid;position:relative}.step__num--active{background:var(--primary-dim);color:#fff;border-color:var(--primary);box-shadow:0 0 0 6px color-mix(in oklab, var(--primary) 12%, transparent)}.step h3{letter-spacing:-.025em;margin-bottom:12px;font-size:26px;font-weight:700;line-height:1.15}.step p{color:var(--fg-muted);max-width:420px;margin:0;font-size:15px;line-height:1.55}.step:nth-child(odd) p{margin-left:auto}@media (max-width:800px){.step:nth-child(odd) p{margin-left:0}}.step__visual{background:var(--bg-card);border:1px solid var(--border-faint);border-radius:var(--r-xl);text-align:left;box-sizing:border-box;width:100%;min-height:280px;padding:24px;overflow:hidden}.modes-grid{border:1px solid var(--border-faint);border-radius:var(--r-xl);grid-template-columns:1fr 1fr;display:grid;overflow:hidden}@media (max-width:780px){.modes-grid{grid-template-columns:1fr}}.modes-list{background:var(--bg-inset);border-right:1px solid var(--border-faint);flex-direction:column;display:flex}@media (max-width:780px){.modes-list{border-right:0;border-bottom:1px solid var(--border-faint);flex-direction:row;overflow-x:auto}}.mode-item{border-bottom:1px solid var(--border-faint);cursor:pointer;text-align:left;flex:1;align-items:flex-start;gap:16px;width:100%;padding:22px 28px;transition:background .15s;display:flex}.mode-item:last-child{border-bottom:0}.mode-item:hover{background:var(--bg-elevated)}.mode-item.active{background:var(--bg-card);border-left:2px solid var(--primary);padding-left:26px}.mode-item__num{font-family:var(--ff-mono);color:var(--fg-dim);flex-shrink:0;min-width:20px;padding-top:3px;font-size:11px}.mode-item.active .mode-item__num{color:var(--primary)}.mode-item__t{color:var(--fg-2);font-size:15px;font-weight:600;line-height:1.3}.mode-item.active .mode-item__t{color:var(--fg)}.mode-item__d{color:var(--fg-muted);margin-top:4px;font-size:13px;line-height:1.45}.modes-detail{background:var(--bg-card);flex-direction:column;justify-content:center;min-height:480px;padding:48px 52px;display:flex}@media (max-width:780px){.modes-detail{padding:32px 24px}.mode-item{border-bottom:0;border-right:1px solid var(--border-faint);flex:none;flex:unset;min-width:180px}.mode-item.active{border-left:0;border-bottom:2px solid var(--primary);padding-left:28px}}.demo-msg{gap:12px;margin-bottom:12px;display:flex}.demo-msg--user{flex-direction:row-reverse}.demo-msg__bubble{border-radius:var(--r-lg);max-width:75%;padding:12px 16px;font-size:14px;line-height:1.5}.demo-msg--tutor .demo-msg__bubble{background:var(--bg-elevated);border:1px solid var(--border-faint);border-bottom-left-radius:4px}.demo-msg--user .demo-msg__bubble{background:var(--primary-dim);color:#fff;border-bottom-right-radius:4px}.section__head{grid-template-columns:1fr 1fr;align-items:end;gap:48px;margin-bottom:56px;display:grid}.section__head--centered{text-align:center;justify-items:center;grid-template-columns:1fr!important}@media (max-width:780px){.section__head{grid-template-columns:1fr;gap:16px}}@media (max-width:700px){.page-hero{padding-top:40px;padding-bottom:40px}}