.hero{position:relative;background:var(--tint)}
.hero-stage{display:flex;flex-direction:column;min-height:calc(100vh - var(--header-total) - var(--demo-h));min-height:calc(100svh - var(--header-total) - var(--demo-h))}
.hero-wall{position:relative;flex:1 1 auto;display:flex;align-items:center;min-height:300px;padding:56px 0;background:var(--kalk);overflow:hidden}
.hero-paint{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-paint .s{stroke:var(--fjard)}
.hero-paint .st-l{stroke:var(--kalk);opacity:.16}
.hero-paint .st-d{stroke:var(--ink);opacity:.22}
.hero-headline{position:relative;z-index:1}
.hero h1{position:relative;max-width:12.5ch;margin:0;font-size:clamp(42px,6.6vw,96px);line-height:1.02;letter-spacing:-.03em}
.hl-ink{display:block;color:#FFFFFF}
.hl-paint{display:none}

.hero-brush{position:absolute;z-index:2;left:86%;top:90%;height:34%;aspect-ratio:34/99;transform:translate(-50%,-99%) rotate(-24deg);transform-origin:50% 99%;pointer-events:none}
.hero-brush svg{display:block;width:100%;height:100%}

.hero-base{position:relative;border-top:14px solid var(--white);box-shadow:0 -1px 0 var(--line)}
.hero-base-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 56px;align-items:center;padding:28px 0 32px}
.hero-base .lead{margin:0;max-width:52ch}
.hero-offer{display:flex;align-items:flex-start;gap:12px;margin:0 0 16px;font-size:17px;font-weight:750;line-height:1.4}
.hero-offer .icon{width:26px;height:26px;padding:4px;border-radius:50%;background:var(--ockra);color:var(--ink);stroke-width:3}
@media (max-width:980px){.hero-base-inner{grid-template-columns:1fr;gap:16px;padding:24px 0 28px}}
@media (max-width:640px){
  .hero-wall{min-height:260px;padding:40px 0}
  .hero h1{font-size:clamp(38px,11vw,48px)}
  .hero-brush{height:32%}
  .hero-base .lead{font-size:16px}
  .hero-offer{font-size:16px;margin-bottom:12px}
  .hero-base .btn-row{gap:10px}
  .hero-base .btn{width:100%;min-height:48px}
}

.hero-anim .hero-track{height:calc(100vh - var(--header-total) + 125vh);height:calc(100svh - var(--header-total) + 125svh)}
.hero-anim .hero-stage{position:sticky;top:var(--header-total);height:calc(100vh - var(--header-total));height:calc(100svh - var(--header-total));min-height:0}
.hero-anim .hero-wall{min-height:200px}
.hero-anim .hero-paint{visibility:hidden}
.hero-anim .hero-ready .hero-paint{visibility:visible}
.hero-anim .hl-ink{color:var(--ink)}
.hero-anim .hl-paint{display:block;position:absolute;inset:0;color:#FFFFFF;clip-path:polygon(0 0,0 0,0 0)}
.hero-anim .hero-brush{left:0;top:0;transform:translate(-200px,-200px)}
.hero-anim .hero-ready .hero-brush{will-change:transform}