body.marketplace-home .character-hero.scene-hero{width:100%;max-width:none;margin:0;min-height:700px;padding:0;overflow:hidden;isolation:isolate;background:#eeece5;border-bottom:0}
.scene-hero-art{position:absolute;inset:0;z-index:-2;background:url("/service-site/studio-learn-20261024/runtime/studio-direction-v01/software-studio-scene-v1/assets/hero-work-keeps-moving-candidate.webp") right center/auto 100% no-repeat;background-color:#eeece5}
.scene-hero:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#f5f3ed 0%,#f5f3ed 20%,#f5f3edb8 34%,#f5f3ed33 48%,transparent 60%);pointer-events:none}
.scene-hero .scene-hero-copy{padding-block:80px 65px;position:relative;z-index:1}
body.marketplace-home .scene-hero h1{font-size:clamp(44px,3.7vw,56px);max-width:510px;line-height:1.1;margin-top:24px;margin-bottom:28px}
.scene-hero h1 span{display:inline}
.scene-hero .eyebrow{margin-top:0}
.scene-hero .intro-bottom{max-width:435px}
.scene-hero .intro-bottom p{font-size:16px;line-height:1.7}
.scene-hero .hero-experience{max-width:400px;line-height:1.9;margin-top:28px;font-size:11px}
.scene-hero .hero-experience span{margin:0 6px 0 0}
.scene-hero .hero-experience .hero-proof{white-space:normal}
#hero-grain{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.52;mix-blend-mode:soft-light}
@media(min-width:1601px){body.marketplace-home .character-hero.scene-hero{min-height:700px}.scene-hero .scene-hero-copy{max-width:1200px}.scene-hero-art{background-position:right center}}
@media(min-width:761px) and (max-width:1100px){body.marketplace-home .scene-hero h1{max-width:44%;font-size:40px}.scene-hero .intro-bottom,.scene-hero .hero-experience{max-width:41%}.scene-hero .intro-bottom p{font-size:14px}.scene-hero:before{background:linear-gradient(90deg,#f5f3ede8,#f5f3edc9 30%,#f5f3ed55 48%,transparent 65%)}}
@media(max-width:1100px){body.marketplace-home .character-hero.scene-hero{display:flex;flex-direction:column;min-height:0;padding:0}.scene-hero-art{position:relative;inset:auto;width:100%;height:310px;z-index:auto;background-size:auto 100%;background-position:right center;background-color:#e9e6de}.scene-hero:before{display:none}.scene-hero .scene-hero-copy{padding-block:34px 38px;z-index:1}body.marketplace-home .scene-hero h1{font-size:clamp(34px,7.5vw,46px);max-width:none;margin:20px 0 24px}.scene-hero .intro-bottom,.scene-hero .hero-experience{max-width:none}.scene-hero .intro-bottom p{font-size:15px}.scene-hero .hero-experience{margin-top:26px}.scene-hero #hero-grain{height:310px}}

@media(min-width:1101px){.scene-hero-art{mask-image:linear-gradient(90deg,transparent,black 25%)}}

/* Give the tool ribbon a small breath beneath the hero scene. */
body.marketplace-home .scene-hero + .tool-ribbon{padding-top:28px}
@media(max-width:760px){body.marketplace-home .scene-hero + .tool-ribbon{padding-top:24px}}
/* Five illustrated working days, dissolving quietly behind fixed copy. */
.scene-hero-art{background:none;overflow:hidden;touch-action:pan-y}
.hero-scene-track{position:absolute;inset:0}
.hero-scene-track.is-snapping .hero-scene-slide{transition:none}
.hero-scene-slide{position:absolute;inset:0;opacity:0;z-index:0;pointer-events:none;transition:opacity 1.5s cubic-bezier(.4,0,.2,1);background-position:right center;background-size:auto 100%;background-repeat:no-repeat;background-color:#eeece5}
.hero-scene-slide.is-active{opacity:1;z-index:2}
.hero-scene-slide.is-outgoing{opacity:1;z-index:1}
.hero-scene-controls{position:absolute;right:24px;bottom:22px;z-index:4;display:flex;align-items:center;gap:3px;padding:4px 7px;border:1px solid #ffffff80;border-radius:28px;background:#f8f6f0d9;backdrop-filter:blur(12px);color:#37323b;box-shadow:0 3px 18px #2923350a}
.hero-scene-controls button{display:grid;place-items:center;width:38px;height:38px;min-width:38px;padding:11px;border:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer}
.hero-scene-controls button:hover{background:#50455812}
.hero-scene-controls button:focus-visible{outline:2px solid #76607f;outline-offset:2px}
.hero-scene-controls svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.hero-scene-count{font-size:11px;letter-spacing:.08em;line-height:1;width:51px;text-align:center;font-variant-numeric:tabular-nums}
@media(min-width:1101px){.scene-hero-art{mask-image:none}.hero-scene-slide{mask-image:linear-gradient(90deg,transparent,black 25%)}}
@media(max-width:1100px){.hero-scene-controls{right:12px;bottom:12px}.hero-scene-slide{background-position:right center}}
@media(prefers-reduced-motion:reduce){.hero-scene-slide{transition:none}}
.scene-hero .scene-hero-copy{pointer-events:none}
.scene-hero .scene-hero-copy :is(a,p,h1){pointer-events:auto}
/* Let the opening scene reach the top, beneath the gathering navigation. */
body[data-studio-page=home]:has(.scene-hero) .studio-header.header{position:fixed;left:50%;transform:translateX(-50%);margin:0;top:22px}
body.marketplace-home .character-hero.scene-hero{min-height:792px}
.scene-hero .scene-hero-copy{padding-top:172px}
.scene-hero:after{content:'';position:absolute;left:0;right:0;top:0;height:140px;z-index:0;pointer-events:none;background:linear-gradient(180deg,#f8f8f3e8,#f8f8f36b 55%,transparent)}
@media(max-width:1100px){
 body[data-studio-page=home]:has(.scene-hero) .studio-header.header{top:12px}
 body.marketplace-home .character-hero.scene-hero{min-height:0}
 .scene-hero-art{height:382px}
 .scene-hero .scene-hero-copy{padding-top:34px}
 .scene-hero #hero-grain{height:382px}
 .hero-scene-slide{background-size:auto calc(100% - 60px);background-position:right bottom}
 .scene-hero:after{height:110px;background:linear-gradient(180deg,#f8f8f3f2,#eeece5b3 56%,transparent)}
}

/* A tiny liquid bead reaches toward the next scene, then settles into a circle. */
.hero-scene-controls{gap:3px;padding:0;background:transparent;border:0;backdrop-filter:none;box-shadow:none;color:#fff8eed9}
.hero-scene-dots{position:relative;display:flex;align-items:center}
.hero-scene-controls .hero-scene-dot{position:relative;width:24px;height:32px;min-width:24px;min-height:32px;padding:0;border-radius:50%;background:none}
.hero-scene-dot:before{content:none}
.hero-scene-controls .hero-scene-marker{position:absolute;left:0;top:0;width:100%;height:32px;overflow:visible;pointer-events:none;fill:#fff8eeeb;stroke:none;filter:drop-shadow(0 1px 1px #29212538)}
.hero-scene-marker .scene-rest-dot{fill:#fff8ee70}
.hero-scene-marker .scene-liquid{fill:#fff8eeeb;stroke:none}
.hero-scene-controls .hero-scene-pause{width:28px;height:32px;min-width:28px;min-height:32px;padding:9px;opacity:.35;transition:opacity .3s}
.hero-scene-controls .hero-scene-pause svg{width:10px;height:10px}
.hero-scene-controls:hover .hero-scene-pause,.hero-scene-controls:focus-within .hero-scene-pause{opacity:.85}
.hero-scene-controls button:hover{background:#faf8f018}
.hero-scene-controls button:focus-visible{outline:1.5px solid #76607f;outline-offset:0}
@media(prefers-reduced-motion:reduce){.hero-scene-marker,.hero-scene-controls .hero-scene-pause{transition:none}}
