/* «Маркетинг с опытом» под стиль главной (28.09): кремовая полоса, постерный узкий заголовок,
   графитовая плашка #26282D с рыжим сиянием (рецепт календаря), один рыжий акцент — «20+», углы прямые.
   Refero-lock: Pipe c00d3961 (сплит «текст слева — тёмная контентная панель справа», плоские поверхности,
   единственный тёплый акцент) + Foundry 94f48092 (волосяные линейки, крупный постерный кегль).
   Старые классы .about/.years/.tags не используются — у них в style.css/mobile.css десятки правил под старую вёрстку. */
.home .xp-band{--xp-ink:#141414;--xp-soft:#4a4a48;--xp-line:rgba(20,20,20,.16);--xp-g:#26282d;--xp-g-ink:#ecebe8;--xp-g-soft:#c9cacd;
  --xp-g-line:rgba(255,255,255,.16);--xp-or:#fe6c1f;--xp-ease:cubic-bezier(.2,.7,.2,1)}
.home .xp-band>.xp{box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(32px,4vw,64px);
  align-items:stretch;height:auto;min-height:0;padding:clamp(56px,7vw,112px) clamp(16px,4vw,48px);color:var(--xp-ink)}

/* текст */
.home .xp-copy{display:flex;flex-direction:column;justify-content:center;min-width:0}
.home .xp-copy h2{margin:0;font:900 clamp(52px,6.6vw,104px)/.86 Poster,'Golos Text',sans-serif;font-stretch:75%;letter-spacing:-.02em;
  text-transform:uppercase;color:var(--xp-ink);-webkit-text-stroke:0;text-wrap:balance}
.home .xp-lead{margin:clamp(20px,2.4vw,32px) 0 0;padding-top:clamp(16px,1.6vw,22px);border-top:1px solid var(--xp-line);max-width:30em;
  font:400 clamp(17px,1.4vw,20px)/1.45 'Golos Text',sans-serif;letter-spacing:0;color:var(--xp-soft)}
.home .xp-act{display:grid;grid-template-columns:auto auto;justify-content:start;align-items:center;gap:14px 28px;margin-top:clamp(24px,2.8vw,40px)}
.home .xp-act .xp-cta{grid-column:1/-1;justify-self:start}
.home .xp-cta{min-height:52px;padding:0 20px;gap:16px;border:1px solid var(--xp-ink);border-radius:0;font:700 16px/1 'Golos Text',sans-serif;
  --plate:var(--xp-or)}
.home .xp-cta .i{width:20px;height:20px;stroke-width:2;transition:transform .2s var(--xp-ease)}
.home .xp-cta:is(:hover,:focus-visible) .i{transform:translateX(4px)}
.home .xp-more{display:inline-flex;align-items:center;min-height:44px;color:var(--xp-ink);font:600 15px/1.2 'Golos Text',sans-serif;
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;transition:color .2s,text-decoration-color .2s}
.home .xp-more:hover{text-decoration-thickness:2px;text-decoration-color:var(--xp-or)}
.home .xp-more:focus-visible{outline:2px solid var(--xp-or);outline-offset:3px}

/* графитовая плашка с рыжим сиянием */
.home .xp-panel{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  grid-template-rows:1fr auto;gap:clamp(24px,2.6vw,36px) clamp(20px,2.4vw,32px);min-width:0;padding:clamp(28px,3vw,44px);
  background:
    radial-gradient(60% 55% at 0% 0%,rgba(254,108,31,.30) 0%,rgba(254,108,31,0) 100%),
    radial-gradient(55% 50% at 100% 100%,rgba(168,51,12,.36) 0%,rgba(168,51,12,0) 100%),
    var(--xp-g);color:var(--xp-g-ink)}
.home .xp-panel::before{content:"";position:absolute;inset:-30%;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,rgba(254,108,31,.16),rgba(254,108,31,0));translate:-18% -22%;transition:translate 1.2s var(--xp-ease)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.home .xp-panel:hover::before{translate:-6% -12%}}
.home .xp-years{grid-column:1/-1;display:flex;flex-direction:column;align-items:flex-start;align-self:start;margin:0;padding:0;border:0;height:auto;text-align:left}
.home .xp-years b{display:block;font:900 clamp(120px,13vw,208px)/.8 Poster,'Golos Text',sans-serif;font-stretch:75%;letter-spacing:-.04em;
  white-space:nowrap;font-variant-numeric:tabular-nums;-webkit-text-stroke:0;
  color:var(--xp-or);background:linear-gradient(180deg,#ffb27a 0%,#fe6c1f 48%,#c2410c 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.home .xp-years span{display:block;margin:14px 0 0;font:600 13px/1.3 'Golos Text',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--xp-g-soft);white-space:nowrap}
.home .xp-tags{display:contents}
.home .xp-tags p{margin:0;padding:16px 0 0;border-top:1px solid var(--xp-g-line);position:static;transform:none;white-space:normal;width:auto}
.home .xp-tags p:first-child{font:600 12px/1.9 'Golos Text',sans-serif;letter-spacing:.18em;color:var(--xp-g-soft)}
.home .xp-tags p+p{align-self:end;font:900 clamp(24px,2.2vw,32px)/.95 Poster,'Golos Text',sans-serif;font-stretch:75%;letter-spacing:-.01em;color:var(--xp-g-ink);
  border-top:4px solid var(--xp-or)}

/* планшет: текст сверху, плашка на всю ширину строкой «20+ · метки · формула» */
@media (max-width:1023px){
  .home .xp-band>.xp{grid-template-columns:minmax(0,1fr)}
  .home .xp-copy h2{font-size:clamp(52px,9vw,88px)}
  .home .xp-panel{grid-template-columns:auto minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:auto;align-items:end}
  .home .xp-tags p+p{font-size:clamp(22px,2.9vw,28px)}
  .home .xp-years{grid-column:auto;align-self:end}
  .home .xp-years b{font-size:clamp(112px,17vw,168px)}
}
/* телефон: «20+» сверху, метки и формула в две колонки */
@media (max-width:700px){
  .home .xp-band>.xp{padding:48px 20px;gap:32px}
  .home .xp-copy h2{font-size:clamp(44px,13.4vw,64px)}
  .home .xp-lead br{display:none}
  .home .xp-act{grid-template-columns:minmax(0,1fr);gap:0}
  .home .xp-act .xp-cta{justify-self:stretch;justify-content:space-between;margin-bottom:10px}
  .home .xp-panel{grid-template-columns:minmax(0,1fr);gap:24px;padding:28px 22px}
  .home .xp-years{grid-column:auto}
  .home .xp-tags p:first-child{columns:2;column-gap:20px}
  .home .xp-tags p+p{font-size:clamp(26px,8.4vw,34px)}
  .home .xp-years b{font-size:clamp(112px,36vw,150px)}
}
@media (prefers-reduced-motion:reduce){.home .xp-cta .i,.home .xp-panel::before{transition:none}}
