/*
 * Блок v2 «Hero каталога» (acf/wx-hero). Подключается, только если блок есть на странице и не скрыт.
 * Иллюстрация «окна amoCRM» — Golos Text с системным запасным (CLAUDE.md, 5).
 */

.v2 .wx-hero,.v2 .wx-cat-layout{--wx-amo-font:"Golos Text",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;}
/* ===== Hero ===== */
.v2 .wx-hero{display:flex;align-items:center;gap:64px;padding-top:64px;padding-bottom:56px;}
.v2 .wx-hero__l{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:20px;}
.v2 .wx-hero .wx-h1.wx-grad{background-image:linear-gradient(90deg,var(--orange-2),var(--red-2),var(--orange-1),var(--orange-2));background-size:200% 100%;
  animation:wx-shimmer 6s 1s linear 3;}
@keyframes wx-shimmer{0%{background-position:0% 50%;}100%{background-position:200% 50%;}}

/* иллюстрация: окно amoCRM */
.v2 .wx-crmv{flex:0 0 600px;position:relative;padding:22px 18px 0;font-family:var(--wx-amo-font);}
.v2 .wx-crmw{display:flex;height:300px;border-radius:14px;overflow:hidden;background:#f4f6f8;
  box-shadow:0 30px 60px -20px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.12);
  transform:perspective(1400px) rotateY(-8deg) rotateX(3deg);animation:wx-crmfloat 7s 1.4s ease-in-out infinite;}
@keyframes wx-crmfloat{0%,100%{transform:perspective(1400px) rotateY(-8deg) rotateX(3deg) translateY(0);}50%{transform:perspective(1400px) rotateY(-5deg) rotateX(2deg) translateY(-10px);}}
.v2 .wx-crmw__side{width:46px;background:#0e2639;display:flex;flex-direction:column;align-items:center;gap:12px;padding-top:14px;}
.v2 .wx-crmw__side i{display:block;width:22px;height:22px;border-radius:6px;background:rgba(255,255,255,.14);}
.v2 .wx-crmw__side i.on{background:#2c8dff;}
.v2 .wx-crmw__main{flex:1;display:flex;flex-direction:column;min-width:0;}
.v2 .wx-crmw__top{height:44px;display:flex;align-items:center;gap:12px;padding:0 14px;background:#fff;border-bottom:1px solid #e3e7ea;}
.v2 .wx-crmw__top b{font:600 13px/1 var(--wx-amo-font);color:#1d2b36;letter-spacing:.02em;text-transform:uppercase;}
.v2 .wx-crmw__search{flex:1;height:22px;border-radius:4px;background:#eef1f3;}
.v2 .wx-crmw__btn{height:26px;padding:0 12px;border-radius:4px;background:#2f6fd8;color:#fff;font:500 11px/26px var(--wx-amo-font);}
.v2 .wx-kb{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:12px;}
.v2 .wx-kb__col{display:flex;flex-direction:column;gap:8px;}
.v2 .wx-kb__h{display:flex;justify-content:space-between;padding-bottom:7px;border-bottom:3px solid var(--k);font:600 10px/1.2 var(--wx-amo-font);text-transform:uppercase;color:#5c6b77;}
.v2 .wx-kb__h em{font-style:normal;color:#56636d;}
.v2 .wx-kb__c{position:relative;display:flex;flex-direction:column;gap:3px;padding:9px 10px;border-radius:4px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.08);}
.v2 .wx-kb__c b{font:500 12px/1.2 var(--wx-amo-font);color:#1d2b36;}
.v2 .wx-kb__c span{font:600 12px/1.2 var(--wx-amo-font);color:#1d2b36;}
.v2 .wx-kb__c small{font-size:10px;color:#56636d;}
.v2 .wx-kb__c--hl1{box-shadow:0 0 0 2px #ef4444;animation:wx-pulse 3s ease-in-out infinite;}
.v2 .wx-kb__c--hl2{box-shadow:0 0 0 2px #22c55e;animation:wx-pulse 3s 1s ease-in-out infinite;}
.v2 .wx-kb__c--hl3{box-shadow:0 0 0 2px #ec4899;animation:wx-pulse 3s 2s ease-in-out infinite;}
@keyframes wx-pulse{0%,100%{filter:none;}50%{filter:drop-shadow(0 0 10px rgba(239,68,68,.75));}}
.v2 .wx-wchip{position:absolute;z-index:3;display:flex;align-items:center;gap:9px;padding:7px 14px 7px 7px;border-radius:12px;background:#1b1720;
  border:1px solid rgba(255,255,255,.16);box-shadow:0 14px 30px -10px rgba(0,0,0,.7);font:500 13px/1 var(--wx-amo-font);color:#fff;white-space:nowrap;
  animation:wx-pop .6s var(--ease-standard) both,wx-bob 5s ease-in-out infinite;}
.v2 .wx-wchip .wx-ico{width:30px;height:30px;border-radius:8px;}
.v2 .wx-wchip--1{top:96px;left:-34px;animation-delay:.9s,1.5s;}
.v2 .wx-wchip--2{top:150px;right:-10px;animation-delay:1.1s,2.4s;}
.v2 .wx-wchip--3{top:272px;left:200px;animation-delay:1.3s,3.1s;}
.v2 .wx-crmstats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:40px 0 0;}
.v2 .wx-crmstats dd{display:flex;flex-direction:column;gap:4px;margin:0;}
.v2 .wx-crmstats b{font:700 28px/1 var(--wx-amo-font);}
.v2 .wx-crmstats span{font-size:13px;color:var(--text-muted);}
html[data-theme="light"] .v2 .wx-crmw{box-shadow:0 30px 60px -24px rgba(60,30,90,.35),0 0 0 1px rgba(23,20,31,.08);}


@media (max-width:1179px){
  .v2 .wx-hero{flex-direction:column;align-items:stretch;gap:24px;}
  .v2 .wx-crmv{flex:none;width:100%;max-width:600px;margin-inline:auto;}
}
@media (max-width:767px){
  .v2 .wx-hero{padding-top:24px;padding-bottom:16px;gap:16px;}
  .v2 .wx-lead{font-size:var(--fs-body);}
  .v2 .wx-crmv{padding:18px 0 0;margin:8px 0;}
  .v2 .wx-crmw{height:220px;transform:none;animation:none;}
  .v2 .wx-hero .wx-h1.wx-grad{animation:none;}
  .v2 .wx-wchip{animation:wx-pop .6s var(--ease-standard) both;}
  .v2 .wx-kb__c--hl1,.v2 .wx-kb__c--hl2,.v2 .wx-kb__c--hl3{animation:none;}
  .v2 .wx-crmw__side{width:30px;}
  .v2 .wx-crmw__side i{width:16px;height:16px;}
  .v2 .wx-crmw__top{height:36px;padding:0 10px;}
  .v2 .wx-crmw__top b{font-size:10px;}
  .v2 .wx-crmw__btn{display:none;}
  .v2 .wx-kb{grid-template-columns:repeat(2,minmax(0,1fr));padding:8px;gap:8px;}
  .v2 .wx-kb__col:nth-child(3){display:none;}
  .v2 .wx-wchip{font-size:11px;padding:5px 10px 5px 5px;}
  .v2 .wx-wchip .wx-ico{width:24px;height:24px;}
  .v2 .wx-wchip--1{top:70px;left:-4px;}
  .v2 .wx-wchip--2{top:120px;right:4px;}
  .v2 .wx-wchip--3{top:208px;left:30px;}
  .v2 .wx-crmstats{margin-top:32px;}
  .v2 .wx-crmstats b{font-size:22px;}
}

/* Пауза бесконечных анимаций вне экрана (components.css, --wx-play). */
.v2 .wx-crmw,.v2 .wx-wchip,.v2 .wx-kb__c--hl1,.v2 .wx-kb__c--hl2,.v2 .wx-kb__c--hl3{animation-play-state:var(--wx-play,running);}