/* Олег 04.11.2026 · первые экраны страниц с иллюстрацией серии (Google AI Studio, Nano Banana; без текста).
   Компьютер: текст слева, иллюстрация справа, растворяется в фон. Телефон: иллюстрация уходит за текст, приглушённо. */
.hero.has-art{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);text-align:left;align-items:center;gap:24px;position:relative}
.hero.has-art>div:first-child{max-width:620px;margin:0}
.hero.has-art p{margin-left:0;margin-right:0}
.hero.has-art .actions{justify-content:flex-start}
.hero.has-art>.hero-art-wrap{position:relative;min-height:420px;pointer-events:none;width:100%;max-width:none;margin:0;align-self:stretch}
.hero-art{position:absolute;inset:-40px -24px -40px -40px;width:calc(100% + 64px);height:calc(100% + 80px);object-fit:cover;object-position:78% 50%;
 -webkit-mask-image:radial-gradient(62% 62% at 60% 50%,#000 30%,transparent 88%);mask-image:radial-gradient(62% 62% at 60% 50%,#000 30%,transparent 88%);opacity:.95}
.js-motion .hero-art{animation:korpusArtIn 1.2s cubic-bezier(.2,.7,.2,1) both}
@keyframes korpusArtIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:.95;transform:none}}
@media (max-width:820px){
 .hero.has-art{grid-template-columns:1fr;text-align:center}
 .hero.has-art>div:first-child{margin:0 auto;position:relative;z-index:1}
 .hero.has-art .actions{justify-content:center}
 .hero.has-art>.hero-art-wrap{position:absolute;inset:0;min-height:0;z-index:0}
 .hero-art{inset:auto 0 0 0;top:0;width:100%;height:100%;object-position:70% 30%;opacity:.28;
  -webkit-mask-image:linear-gradient(#000 0,transparent 85%);mask-image:linear-gradient(#000 0,transparent 85%)}
 .js-motion .hero-art{animation:none}
}
@media (prefers-reduced-motion:reduce){.js-motion .hero-art{animation:none}}
