/* Первый экран связывает эффект студии с объёмной композицией рабочих процессов. */
.hero.section{padding:30px 0 28px}
.hero .hero-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:28px 24px;align-items:center}
.hero .hero-copy{grid-column:1/span 5;min-width:0;max-width:none}
.hero .hero-copy .eyebrow{margin-bottom:28px}
.hero .hero-copy h1{font-size:clamp(48px,4vw,76px);font-weight:500;line-height:1.1;letter-spacing:-2.6px}
.hero h1 .headline-line{display:block;color:#e9eef0}.hero h1 .headline-accent{color:var(--brand);white-space:nowrap}
.hero .hero-copy>.lead{margin-top:28px;max-width:570px}.hero .hero-actions{margin-top:28px;gap:14px 24px}.hero .hero-proof{margin-top:28px}
.js .hero .headline-accent::after{width:84px;bottom:-10px}
.studio-growth{grid-column:7/span 6;min-width:0;background:#111f28;border-color:#3a555f;overflow:hidden}
.growth-top{display:flex;align-items:center;padding:17px 22px;border-bottom:1px solid #30434b}
.growth-top>.mono{font:15px/1.5 Inter,Arial,sans-serif;letter-spacing:.1px;color:#a9c3c9}.growth-status{display:none}
.growth-scene{position:relative;display:flex;flex-direction:column;isolation:isolate;padding:22px 22px 0}
.growth-caption{display:flex;align-items:flex-start;gap:10px;font-size:16px;line-height:1.45;color:#a7bcc4}
.growth-caption-line{width:16px;height:1px;flex:none;margin-top:13px;background:#8be675}
.growth-caption strong{display:block;font-size:24px;line-height:1.35;font-weight:500;color:#e3eceb;margin-top:3px}
.growth-canvas{position:relative;width:100%;height:clamp(220px,20vw,320px);margin-top:10px}
.studio-growth .growth-sculpture{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.growth-cycle{display:flex;justify-content:center;align-items:center;gap:16px;margin:0 0 18px;font-size:15px;line-height:1.5;color:#a7bdc1}
.growth-cycle i{font-style:normal;color:#6e9f6e}.growth-cycle strong{font-weight:500;color:#bae49f}
.growth-effects{display:grid;grid-template-columns:1fr 1fr;margin:0 22px;border-top:1px solid #365059}
.growth-effects>div{display:flex;align-items:flex-start;gap:10px;min-width:0;padding:18px 12px 18px 0;border-bottom:1px solid #2d414b}
.growth-effects>div:nth-child(2n){padding-left:15px;border-left:1px solid #2d414b}
.growth-effects strong{font-size:17px;font-weight:500;line-height:1.4;color:#e0e9e6}.growth-effects p{font-size:15px;line-height:1.5;color:#a8bbc7;margin-top:5px}
.growth-effects>div:nth-child(1){--effect-color:#d6b579;--effect-bg:#302b21}.growth-effects>div:nth-child(2){--effect-color:#cf8f9f;--effect-bg:#30232e}.growth-effects>div:nth-child(3){--effect-color:#af9acb;--effect-bg:#2b2638}.growth-effects>div:nth-child(4){--effect-color:#81bbc8;--effect-bg:#1d313b}
.growth-effect-icon{display:grid;place-items:center;width:28px;height:28px;flex:none;margin-top:1px;color:var(--effect-color);background:var(--effect-bg);border:1px solid color-mix(in srgb,var(--effect-color) 40%,#263b42);border-radius:4px}
.growth-effect-icon .icon{width:20px;height:20px}
.growth-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 22px;color:#a5bac2;font-size:15px;line-height:1.5}
.growth-foot>span{font-size:15px;line-height:1.5}
/* Общая палитра связывает вводную сцену, плату и четыре продукта без градиентов. */
.tone-bank{--tone:var(--bank);--tone-bg:#2f2a20}.tone-kz{--tone:var(--kz);--tone-bg:#112936}.tone-docs{--tone:var(--docs);--tone-bg:#2a1828}.tone-lens{--tone:var(--lens);--tone-bg:#2a173e}.tone-brand{--tone:var(--brand);--tone-bg:#172a20}
.outcome-number{font:15px var(--mono);color:var(--tone)}
/* Движение идёт по готовой SVG-геометрии; стрелки часов вращаются до изометрической проекции. */
.growth-work-signal{stroke-dasharray:.07 .93;stroke-dashoffset:1;opacity:0}
.growth-clock-minute,.growth-clock-hour{transform-box:view-box;transform-origin:50% 50%}
.js .in-view .growth-work-signal{animation:workspace-flow 7s linear infinite}.js .in-view .growth-resource{animation:workspace-resource 6s ease-in-out infinite;animation-delay:calc(var(--resource)*-.45s)}
.js .in-view .growth-clock-minute{animation:workspace-clock 24s linear infinite}.js .in-view .growth-clock-hour{animation:workspace-clock 144s linear infinite}
@keyframes workspace-flow{5%,90%{opacity:.9}100%{stroke-dashoffset:0;opacity:0}}
@keyframes workspace-resource{0%,100%{opacity:.72}45%,65%{opacity:1}}
@keyframes workspace-clock{to{transform:rotate(360deg)}}
@media(min-width:1800px){.growth-top{padding:22px 28px}.growth-scene{padding-inline:28px}.growth-caption strong{font-size:26px}.growth-effects{margin-inline:28px}.growth-effects>div{padding-block:22px}.growth-effects strong{font-size:18px}.growth-effects p{font-size:16px}.growth-foot{padding:16px 28px}}
@media(max-width:1350px) and (min-width:1051px){.growth-effects>div{gap:9px;padding-block:15px}.growth-effects>div:nth-child(2n){padding-left:14px}.growth-effects strong{font-size:16px}.growth-foot>span{max-width:240px}}
@media(min-width:1051px) and (max-height:850px){.hero.section{padding-block:24px 20px}.growth-canvas{height:200px}.growth-caption strong{font-size:22px}.growth-effects>div{padding-block:15px}.growth-effects strong{display:block;line-height:1.35}.growth-effects p{line-height:1.45}.growth-foot{padding-block:8px}}
@media(max-width:1050px){.hero .hero-copy,.hero .studio-growth{grid-column:1/-1;max-width:760px;width:100%;justify-self:center}.hero .hero-grid{gap:40px 24px}.hero .hero-copy h1{font-size:64px}.hero .hero-copy>.lead{max-width:640px}.hero .hero-bottom{margin-top:4px}}
@media(max-width:760px){
 .hero.section{padding:38px 0 24px}.hero .hero-grid{gap:32px 12px}.hero .hero-copy h1{font-size:clamp(36px,7.5vw,54px);letter-spacing:-1.3px;line-height:1.12}.hero .hero-copy .eyebrow{margin-bottom:26px}.hero .hero-copy>.lead{margin-top:28px}.hero .hero-proof{margin-top:24px}.hero .hero-actions{gap:12px 20px}.hero .hero-actions .btn-text{padding-left:0}.hero .hero-bottom{font-size:15px;gap:16px;margin-top:0}
 .growth-top{padding:15px 17px}.growth-scene{padding:20px 17px 0}.growth-caption strong{font-size:22px}.growth-canvas{height:240px;margin-top:12px}.growth-cycle{font-size:15px;gap:10px}
 .growth-effects{margin-inline:17px}.growth-effects>div{padding-block:15px;gap:8px}.growth-effects>div:nth-child(2n){padding-left:10px}.growth-effects strong{font-size:16px}.growth-effects p{font-size:15px}.growth-effect-icon{width:24px;height:25px}.growth-effect-icon .icon{width:18px;height:18px}.growth-foot{padding:12px 17px}
}
@media(max-width:560px){.growth-effects{grid-template-columns:1fr}.growth-effects>div,.growth-effects>div:nth-child(2n){padding:12px 0;border-left:0}.growth-effects p{margin-top:3px}.growth-foot>span{max-width:175px}}
@media(max-width:400px){.growth-canvas{height:210px}.growth-foot{flex-wrap:wrap;gap:8px}}
@media(prefers-reduced-motion:reduce){.studio-growth *,.studio-growth *::before,.studio-growth *::after{animation:none!important;transition:none!important}.growth-work-signal{opacity:.6}}
