/* Application window and module rail. */

.hero{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:38px;align-items:center;min-height:0;padding-top:48px;padding-bottom:46px}
.hero-copy{padding-top:0}
.hero h1{font-size:clamp(43px,4vw,58px);letter-spacing:-2.6px}
.hero-description{max-width:395px}
.hero-ctas{gap:21px;flex-direction:row;align-items:center;margin-top:32px}
.hero-showcase{display:grid;grid-template-columns:58px minmax(0,1fr);gap:16px;min-width:0;position:relative;--scene-accent:#ab7cba;--scene-rgb:171,124,186}
.hero[data-scene=work] .hero-showcase{--scene-accent:#3c9aac;--scene-rgb:60,154,172}
.hero[data-scene=social] .hero-showcase{--scene-accent:#c38592;--scene-rgb:195,133,146}
.hero-showcase:before{content:'';position:absolute;inset:10% -3% -4% 8%;background:radial-gradient(ellipse,rgba(var(--scene-rgb),.13),transparent 68%);filter:blur(35px);z-index:-1;pointer-events:none}
.hero-showcase .context-selector{align-self:center;display:flex;flex-direction:column;align-items:center;gap:9px;width:58px;height:auto;padding:7px;margin:0;border:1px solid #ffffffb3;border-radius:19px;background:linear-gradient(145deg,#ffffffc9,#f0eef6a6);box-shadow:inset 0 1px 1px #fff,0 12px 28px -15px #57516e45,0 0 0 1px #d8dae38c;backdrop-filter:blur(22px);z-index:8}
.hero-showcase .context-button{position:relative;display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:10px;margin:0;border:1px solid transparent;border-radius:12px;color:#888895;background:transparent;transition:background .25s,color .25s,box-shadow .25s}
.hero-showcase .context-button:after{display:none}
.hero-showcase .context-button .icon{width:22px;height:22px;stroke-width:1.7}
.hero-showcase .context-button.is-active{color:var(--scene-accent);background:linear-gradient(140deg,#fff,#f4f2f8b3);border-color:#fff;box-shadow:0 0 0 1px #ccc6d775,inset 0 1px 1px #fff,inset 0 -2px 5px rgba(var(--scene-rgb),.1),0 4px 8px -4px #62567533}
.hero-showcase .context-button:hover{color:var(--scene-accent);background:#ffffff80}
.context-label{position:absolute;left:calc(100% + 18px);top:50%;transform:translate(-5px,-50%);padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);box-shadow:var(--shadow);font-size:11px;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s,transform .2s;z-index:10}
.context-button:hover .context-label,.context-button:focus-visible .context-label{opacity:1;visibility:visible;transform:translate(0,-50%)}
.hero-window{min-width:0;border:1px solid #fff;border-radius:27px;background:linear-gradient(135deg,#ffffffb5,#f8f7fb85);box-shadow:inset 0 1px 1px #fff,0 0 0 1px #dfe1e9a6,0 30px 70px -35px #5c567b33;backdrop-filter:blur(24px);overflow:clip;isolation:isolate;transition:box-shadow .5s}
.hero-window-bar{height:50px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 22px;border-bottom:1px solid #e8e7edbf;background:#ffffff5c}
.window-brand{display:flex;align-items:center;gap:9px;font-size:8px;letter-spacing:1.2px;color:#7a7b88}
.window-brand .brandmark{width:28px;height:19px}
.window-brand strong{font-size:10px;font-weight:550;letter-spacing:0;color:var(--ink)}
.window-divider{font-size:13px;color:#c4c1ce;margin:0 2px}
.window-live{font-size:6.5px;letter-spacing:1.4px;color:var(--muted);display:flex;align-items:center;gap:7px}
.window-live i{width:4px;height:4px;border-radius:50%;background:var(--scene-accent);box-shadow:0 0 0 3px rgba(var(--scene-rgb),.08);transition:background .4s}
.hero-showcase .hero-stage{width:100%;height:534px;min-height:0;max-width:none;margin:0;transform:none;background:radial-gradient(ellipse at 52% 52%,rgba(var(--scene-rgb),.07),transparent 66%);overflow:clip}
.hero-showcase .stage-aura{inset:0;opacity:.42;filter:blur(18px)}
.hero-showcase .hero-avatar{height:480px;width:320px;bottom:20px;transform:translateX(-45%)}
.hero-showcase .avatar-shadow{bottom:20px}
.hero-showcase .stage-coordinate{top:24px;left:25px;right:25px;font-size:6px;letter-spacing:1.25px}
.hero-showcase .orbit-lines span{width:100%;height:185px;left:50%;top:51%}
.hero-showcase .orbit-lines span:nth-child(2){width:105%;height:215px}
.hero-showcase .orbit-lines span:nth-child(3){width:98%;height:335px}
.hero-showcase .star-one{top:75px;right:40px}
.hero-showcase .star-two{bottom:80px;right:80px}
.hero-showcase .card-calendar{left:20px;top:72px;width:215px;padding:15px}
.hero-showcase .card-calendar>strong{font-size:11px}
.hero-showcase .card-note{right:19px;top:274px;width:205px;padding:16px 12px}
.hero-showcase .card-note strong{font-size:12px}
.hero-showcase .card-outfit{left:21px;bottom:87px;font-size:8px;padding:11px 13px}
.hero-showcase .avatar-label{bottom:14px;left:50%;transform:translateX(-40%);font-size:8px}
.hero-window-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:43px;padding:10px 22px;border-top:1px solid #e8e7ed80;background:#fff4}
.hero-showcase .context-caption{margin:0;font-size:10px;line-height:1.5;color:var(--muted)}
.hero-showcase .scene-demo{position:static;font-size:7px;color:var(--soft);white-space:nowrap}
:root[data-color-mode=dark] .hero-showcase .context-selector{background:linear-gradient(150deg,#3c3a495c,#242531b5);border-color:#b9b0d029;box-shadow:inset 0 1px 1px #ebe6ff26,0 14px 25px -12px #0008,0 0 0 1px #05060a99}
:root[data-color-mode=dark] .hero-showcase .context-button{color:#a09bad}
:root[data-color-mode=dark] .hero-showcase .context-button.is-active{color:#e0c5ee;background:linear-gradient(140deg,#d7c8e128,#8c7eac13);border-color:#f0e6ff5c;box-shadow:inset 0 1px 1px #ffffff52,inset 0 -1px 5px #dfd0ff28,0 0 0 1px #c4aeee29,0 3px 9px #0003}
:root[data-color-mode=dark] .hero-showcase .context-button:hover{background:#ffffff0e}
:root[data-color-mode=dark] .hero[data-scene=work] .context-button.is-active{color:#9addde}
:root[data-color-mode=dark] .hero[data-scene=social] .context-button.is-active{color:#f0b6c4}
:root[data-color-mode=dark] .hero-window{border-color:#b7adc62d;background:linear-gradient(135deg,#25233085,#181b258c);box-shadow:inset 0 1px 1px #d4c5e617,0 0 0 1px #08090d,0 30px 70px -35px #0009}
:root[data-color-mode=dark] .hero-window-bar{background:#ffffff03;border-color:#86759426}
:root[data-color-mode=dark] .window-brand{color:#a29cae}
:root[data-color-mode=dark] .window-divider{color:#575261}
:root[data-color-mode=dark] .hero-window-bottom{border-color:#8675941f;background:#00000005}
:root[data-color-mode=dark] .hero-showcase .stage-aura{opacity:.18}

@media(max-width:1200px) and (min-width:1001px){.hero{gap:24px;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr)}.hero h1{font-size:46px}.hero-showcase{grid-template-columns:54px minmax(0,1fr);gap:12px}.hero-showcase .context-selector{width:54px;padding:5px}.hero-showcase .hero-stage{height:510px}.hero-showcase .hero-avatar{height:460px;width:307px}.hero-showcase .card-calendar{width:182px;left:16px;padding:12px}.hero-showcase .card-note{width:176px;right:16px;padding:12px}.hero-showcase .card-note strong{font-size:11px}.hero-ctas{gap:15px}.hero-ctas .button{gap:18px}.hero-description{font-size:14px}.window-live{display:none}}
@media(max-width:1000px){.hero{display:flex;flex-direction:column;gap:37px;padding-top:42px;padding-bottom:40px;min-height:0}.hero-copy{padding:0;text-align:center;max-width:600px;width:100%}.hero-copy .eyebrow{justify-content:center}.hero h1{font-size:52px;letter-spacing:-2.4px}.hero h1 .hero-purpose{margin-inline:auto}.hero-description{max-width:410px;margin-inline:auto;font-size:15px}.hero-ctas{justify-content:center;flex-direction:row;align-items:center}.hero-showcase{width:100%;max-width:680px}.hero-showcase .hero-stage{height:534px}.hero-showcase .hero-avatar{height:480px;width:320px}}
@media(max-width:760px){.hero{gap:29px;padding-top:30px;padding-bottom:28px}.hero h1{font-size:36px;letter-spacing:-1.7px}.hero-description{font-size:12px;max-width:330px}.hero-ctas{margin-top:20px;gap:14px}.hero-ctas .button-white{min-height:48px;padding:0 7px 0 18px;gap:17px}.hero-showcase{grid-template-columns:50px minmax(0,1fr);gap:10px;max-width:460px}.hero-showcase .context-selector{width:50px;padding:3px;gap:8px;border-radius:17px}.hero-showcase .context-button{width:44px;height:44px;padding:11px;border-radius:12px}.hero-showcase .context-button .icon{width:20px;height:20px}.context-label{left:calc(100% + 9px);font-size:10px;padding:7px 9px}.hero-window{border-radius:21px}.hero-window-bar{height:42px;padding:0 14px;gap:4px}.window-brand{gap:6px;font-size:6px;letter-spacing:.8px}.window-brand .brandmark{width:23px;height:16px}.window-brand strong{font-size:9px}.window-divider{margin:0;font-size:10px}.window-live{display:none}.hero-showcase .hero-stage{height:407px}.hero-showcase .hero-avatar{height:352px;width:235px;bottom:25px;transform:translateX(-44%)}.hero-showcase .stage-coordinate{top:18px;left:15px;right:15px;font-size:4.5px;letter-spacing:.75px}.hero-showcase .card-calendar{width:139px;left:12px;top:111px;padding:10px;border-radius:13px}.hero-showcase .card-calendar>strong{font-size:8px;margin-top:8px}.hero-showcase .card-note{width:130px;right:12px;top:228px;padding:12px 10px;border-radius:13px}.hero-showcase .card-note strong{font-size:9px}.hero-showcase .card-note small{font-size:5px}.hero-showcase .card-note p{font-size:6px}.hero-showcase .card-outfit{left:10px;bottom:64px;font-size:6px;padding:9px 10px}.hero-showcase .card-outfit .icon{width:11px;height:11px}.hero-showcase .avatar-shadow{width:130px;height:17px;bottom:26px}.hero-showcase .avatar-label{bottom:12px;font-size:6px;gap:4px}.hero-showcase .avatar-label strong{font-size:9px}.hero-showcase .avatar-label>span:last-child{padding-left:5px;margin-left:1px}.hero-showcase .star-one{right:18px;top:59px;font-size:18px}.hero-showcase .star-two{right:18px;bottom:70px}.hero-showcase .orbit-lines span{height:118px}.hero-showcase .orbit-lines span:nth-child(2){height:146px}.hero-showcase .orbit-lines span:nth-child(3){height:237px}.hero-window-bottom{padding:11px 14px;align-items:flex-start;flex-direction:column;gap:4px;min-height:52px}.hero-showcase .context-caption{font-size:8px}.hero-showcase .scene-demo{font-size:6px}}
@media(max-width:360px){.hero h1{font-size:32px}.hero-showcase{gap:8px;grid-template-columns:48px minmax(0,1fr)}.hero-showcase .context-selector{width:48px;padding:2px}.hero-window-bar{padding:0 10px}.hero-showcase .hero-stage{height:373px}.hero-showcase .hero-avatar{height:327px;width:218px}.hero-showcase .card-calendar{width:127px;left:10px;top:96px}.hero-showcase .card-note{width:118px;right:10px;top:207px}.hero-showcase .card-outfit{font-size:5.5px;bottom:62px}.hero-showcase .avatar-label>span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.hero-showcase:before,.hero-showcase .stage-aura{filter:none}.hero-showcase .hero-avatar{animation:none}}

/* Exact shared material values; EVREN only supplies the canvas and module color. */
.hero-showcase .hero-window{border-color:var(--studio-crystal-edge);box-shadow:var(--studio-crystal-shadow),0 30px 70px -35px #5c567b33}
.hero-showcase .context-button.is-active,:root[data-color-mode=dark] .hero-showcase .context-button.is-active{background:var(--studio-crystal-fill),rgba(var(--scene-rgb),.04);border-color:var(--studio-crystal-edge);box-shadow:var(--studio-crystal-shadow);backdrop-filter:blur(14px)}
.hero-showcase .floating-card{background:var(--studio-crystal-fill),#ffffffa8;border-color:var(--studio-crystal-edge);box-shadow:var(--studio-crystal-shadow),0 18px 36px -20px #4d405929;backdrop-filter:blur(14px)}
.button-white .button-orb,:root[data-color-mode=dark] .button-white .button-orb{background:var(--studio-crystal-fill);border-color:var(--studio-crystal-edge);box-shadow:var(--studio-crystal-shadow);backdrop-filter:blur(14px)}
:root[data-color-mode=dark] .hero-showcase .hero-window{border-color:var(--studio-crystal-edge);box-shadow:var(--studio-crystal-shadow),0 30px 70px -35px #0009}
:root[data-color-mode=dark] .hero-showcase .floating-card{background:var(--studio-crystal-fill),#252633b8;border-color:var(--studio-crystal-edge);box-shadow:var(--studio-crystal-shadow),0 18px 36px -20px #0007}
/* Align the opening rhythm with Platform Glass before the ecosystem strip. */
@media(min-width:1001px){.hero{padding-top:32px;padding-bottom:32px}.hero-copy{align-self:center;padding-top:0}}
.ecosystem-strip{position:relative;margin-top:0;margin-bottom:18px}.ecosystem-strip-heading{display:flex;align-items:center;justify-content:center;margin-bottom:8px;font-size:7px;letter-spacing:1.7px;color:var(--soft)}
.ecosystem-glass{overflow:hidden;border-block:1px solid var(--line);background:linear-gradient(100deg,#ffffff03,#cbbadd08,#ffffff03);backdrop-filter:blur(8px);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ecosystem-track{display:flex;width:max-content;animation:ecosystemDrift 48s linear infinite}.ecosystem-set{display:flex;gap:24px;flex-shrink:0;align-items:center;padding:18px 12px}.ecosystem-logo{width:156px;height:52px;display:flex;justify-content:center;align-items:center;gap:9px;padding:10px 14px;border-radius:12px;background:linear-gradient(135deg,#c9b5d806,#fff0);border:1px solid #afa1c00c;white-space:nowrap}.ecosystem-logo img{width:auto;height:auto;max-width:100%;max-height:26px;object-fit:contain;filter:brightness(0);opacity:.48}.ecosystem-logo.ecosystem-symbol img{width:25px;height:25px;flex-shrink:0}.ecosystem-logo>span{font-size:13px;font-weight:550;letter-spacing:-.3px;color:var(--muted)}.ecosystem-logo:hover img{opacity:.9}.ecosystem-pause{position:absolute;right:-7px;top:calc(50% + 7px);transform:translateY(-50%);width:36px;height:44px;background:var(--bg);border:0;color:var(--soft);border-radius:9px}.ecosystem-pause .icon{width:12px;height:12px}.ecosystem-pause .rail-play{display:none}.ecosystem-pause[aria-pressed=true] .rail-play{display:block}.ecosystem-pause[aria-pressed=true] .rail-pause{display:none}.ecosystem-strip[data-paused=true] .ecosystem-track,.ecosystem-strip:focus-within .ecosystem-track,.ecosystem-strip:hover .ecosystem-track,.motion-paused .ecosystem-track{animation-play-state:paused}
:root[data-color-mode=dark] .ecosystem-logo img{filter:brightness(0) invert(1);opacity:.59}:root[data-color-mode=dark] .ecosystem-logo{background:linear-gradient(135deg,#d7ffe508,#fff0);border-color:#d7ffe50a}
@keyframes ecosystemDrift{to{transform:translateX(-50%)}}
@media(max-width:760px){.ecosystem-strip-heading{font-size:6px;letter-spacing:1.1px}.ecosystem-set{gap:12px;padding:14px 8px}.ecosystem-logo{width:132px;height:46px;gap:8px}.ecosystem-logo>span{font-size:11px}.ecosystem-logo.ecosystem-symbol img{width:23px;height:23px}.ecosystem-pause{right:-4px}.intro-rail{margin-top:0}}
@media(prefers-reduced-motion:reduce){.ecosystem-track{animation:none}}

.ecosystem-logo.ecosystem-model{flex-direction:column;gap:4px}.ecosystem-model img{max-height:15px;max-width:95px}.ecosystem-model>span{font-size:11px;letter-spacing:.2px}

.hero-copy .eyebrow{font-size:11px;letter-spacing:1.8px}
body[data-page=index] .hero-copy .status-dot{background:#fff;box-shadow:0 0 0 4px #b3b8ca24,0 0 10px #ffffff24}
.button-glass{min-height:56px;padding:0 22px;gap:10px;border-radius:99px;background:var(--studio-crystal-fill);border:1px solid var(--studio-crystal-edge);box-shadow:var(--studio-crystal-shadow);color:var(--ink);backdrop-filter:blur(14px);font-size:12px;font-weight:500}
.hero-ctas .button-glass .icon{width:16px;height:16px}
@media(max-width:760px){.hero-copy .eyebrow{font-size:9px;letter-spacing:1.5px}.hero-ctas{gap:12px}.hero-ctas .button-glass{min-height:48px;padding:0 15px;gap:7px;font-size:10px}.hero-ctas .button-glass .icon{width:14px;height:14px}}
@media(max-width:360px){.hero-ctas{gap:10px}.hero-ctas .button-glass{padding:0 12px;gap:6px;font-size:9px}.hero-ctas .button-white{padding-left:13px;gap:11px;font-size:10px}}
/* Provider marks sit between the invitation and the main promise. */
.hero-ai-providers{display:flex;align-items:center;gap:19px;margin:0 0 22px}.hero-ai-provider{display:flex;align-items:center;gap:8px;padding:0;border:0;background:none;color:var(--ink);font:inherit;font-size:10px;cursor:pointer;opacity:.7;transition:opacity .2s,transform .3s}.hero-ai-provider img{width:27px;height:27px;object-fit:contain}.hero-ai-provider:hover{opacity:1;transform:translateY(-3px)}:root[data-color-mode=dark] .hero-ai-provider img{filter:invert(1)}.hero-copy:has(.hero-ai-providers)>.eyebrow{margin-bottom:22px}@media(max-width:760px){.hero-ai-providers{margin-bottom:20px;gap:18px}.hero-ai-provider{font-size:9px;gap:6px}.hero-ai-provider img{width:24px;height:24px}.hero-copy:has(.hero-ai-providers)>.eyebrow{margin-bottom:18px}}
