/* Three operations, three distinct compositions, all actual product captures. */
.walkthrough{padding-block:160px;scroll-margin-top:0}
#courses{margin-top:112px}
#learning{margin-top:0}
.chapter-step{display:block;font-size:15px;line-height:1.5;color:#a79abf;margin-bottom:24px;letter-spacing:.08em}
.walkthrough .chapter-heading{padding-bottom:80px}
.walkthrough .chapter-description{font-size:19px;line-height:1.9;max-width:470px}
.story-controls{display:flex;flex-wrap:wrap;gap:12px 30px;margin-bottom:28px}
.story-controls button{background:none;border:0;border-radius:999px;color:#828994;padding:10px 16px;min-height:44px;font-size:15px;transition:color .25s,background .25s}
.story-controls button[aria-pressed=true]{background:#ffffff08;color:#e3e5e8}
.story-controls button:hover{color:#fff}
.generation-story{position:relative;isolation:isolate}
.generation-story:before{content:'';position:absolute;z-index:-1;inset:10% -40px -30px;pointer-events:none;background:radial-gradient(ellipse 62% 55% at 50% 65%,#87919d30,transparent 100%)}
.generation-window{margin:0;overflow:hidden;border-radius:10px}
.generation-window .image-open{box-shadow:none;border:0;border-radius:10px;aspect-ratio:1.6}
.generation-window img{width:100%;height:100%;object-fit:cover}
.editing-layout{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:80px;align-items:start}
.editing-copy{position:sticky;top:140px;padding-top:30px}
.editing-copy .chapter-heading{display:block;padding-bottom:34px}
.editing-copy .chapter-description{margin-top:32px;font-size:18px}
.editing-copy .chapter-description p{line-height:1.95}
.editing-copy .story-controls{gap:8px}
.editing-window{margin:0;position:relative;isolation:isolate}
.editing-window:before{content:'';position:absolute;inset:5% -28px -32px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 60% 65%,#8e81952b,transparent 75%)}
.editing-window .image-open{aspect-ratio:1.1;overflow:hidden;border:0;border-radius:10px;box-shadow:0 24px 70px #0008}
.editing-window img{display:block;width:145%;height:auto;max-width:none;margin-left:-32%}
.selection-story{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.8fr);gap:64px;align-items:center;position:relative;isolation:isolate}
.selection-story:before{content:'';position:absolute;inset:-32px -32px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 40% 58%,#b1c48e12,transparent 70%)}
.selection-story figure{margin:0;min-width:0}
.selection-story h3{font-size:16px;line-height:1.5;font-weight:450;color:#a0a6af;margin-bottom:24px}
.selection-story .image-open{position:relative;border:0;border-radius:10px;background:#030405;box-shadow:0 24px 70px #0006}
.selection-crop{aspect-ratio:1.55}
.selection-crop img{position:absolute;width:160%;max-width:none;height:auto;left:-31.25%;top:-44%}
.explanation-crop{aspect-ratio:.975}
.explanation-crop img{position:absolute;width:328.2%;max-width:none;height:auto;left:-223.1%;top:-65%}
.walkthrough .feature-specs{margin-top:44px}
.js .generation-story.in-view .generation-window{animation:generation-arrive 1s var(--motion-ease) both}
.js .editing-window.in-view .image-open{animation:editor-arrive 1s var(--motion-ease) both}
.js .selection-window.in-view .image-open{animation:selection-arrive .9s var(--motion-ease) both}
.js .explanation-window.in-view .image-open{animation:explanation-arrive 1s var(--motion-ease) .15s both}
@keyframes generation-arrive{from{opacity:0;transform:translateY(35px) scale(.98)}to{opacity:1;transform:none}}
@keyframes editor-arrive{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
@keyframes selection-arrive{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes explanation-arrive{from{opacity:0;transform:translate(18px,30px)}to{opacity:1;transform:none}}
@media(max-width:1100px){.walkthrough{padding-block:132px}.editing-layout{gap:48px;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.editing-copy{top:100px}.editing-copy .chapter-description{font-size:17px}.selection-story{gap:40px}.generation-story:before{inset:10% -24px -20px}}
@media(max-width:760px){.walkthrough{padding-block:112px}#courses{margin-top:80px}.walkthrough .chapter-heading{padding-bottom:64px}.walkthrough .chapter-description{font-size:17px}.editing-layout{grid-template-columns:1fr;gap:48px}.editing-copy{position:static;padding-top:0}.editing-copy .chapter-heading{display:grid;grid-template-columns:1fr 1fr;gap:36px;padding-bottom:28px}.editing-copy .chapter-description{margin-top:0}.editing-window .image-open{aspect-ratio:1.35}.selection-story{gap:32px;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}.selection-story h3{font-size:15px}.story-controls{gap:12px 20px}.editing-window:before{inset:5% -20px -20px}}
@media(max-width:540px){.walkthrough{padding-block:100px}#courses{margin-top:64px}.chapter-step{font-size:14px;margin-bottom:18px}.walkthrough .chapter-heading{padding-bottom:48px}.walkthrough .chapter-description{font-size:17px;line-height:1.9}.editing-copy .chapter-heading{display:block;padding-bottom:24px}.editing-copy .chapter-description{margin-top:28px}.editing-layout{gap:32px}.editing-window .image-open{aspect-ratio:1.1}.story-controls{gap:8px;margin-bottom:22px}.story-controls button{font-size:14px;padding:10px 13px}.selection-story{grid-template-columns:1fr;gap:40px}.selection-story h3{font-size:16px;margin-bottom:20px}.selection-crop{aspect-ratio:1.45}.explanation-window{width:84%;justify-self:end}.explanation-crop{aspect-ratio:.975}.generation-window .image-open{aspect-ratio:1.45}.generation-window img{object-position:center}.walkthrough .feature-specs{margin-top:30px}}
@media(prefers-reduced-motion:reduce){.js .generation-story.in-view .generation-window,.js .editing-window.in-view .image-open,.js .selection-window.in-view .image-open,.js .explanation-window.in-view .image-open{animation:none!important}.story-controls button{transition:none!important}}
@media(max-width:540px){.selection-story:before{inset:-20px}}
