/* ===== CyberX home UI update: about cards + loop sliders ===== */

.about-grid--premium{
  gap:22px;
  align-items:stretch;
}

.about-grid--premium .flip-card,
.about-grid--premium .flip-card__inner,
.about-grid--premium .flip-card__face{
  min-height:285px;
}

.about-grid--premium .flip-card{
  position:relative;
  isolation:isolate;
}

.about-grid--premium .flip-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:-1;
  border-radius:calc(var(--radius) + 2px);
  background:linear-gradient(135deg, rgba(255,0,51,.75), rgba(255,255,255,.16), rgba(255,0,51,.18));
  opacity:0;
  filter:blur(10px);
  transition:opacity .35s var(--ease), transform .35s var(--ease);
}

.about-grid--premium .flip-card:hover::before,
.about-grid--premium .flip-card.is-flipped::before{
  opacity:.75;
  transform:translateY(-4px);
}

.about-grid--premium .flip-card__face{
  background:
    radial-gradient(320px 180px at 100% 0%, rgba(255,0,51,.18), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.015)),
    var(--surface);
  border-color:rgba(255,255,255,.12);
  box-shadow:0 18px 50px rgba(0,0,0,.28);
}

.about-grid--premium .flip-card__front:hover,
.about-grid--premium .flip-card__back{
  border-color:rgba(255,0,51,.8);
  box-shadow:0 24px 70px rgba(255,0,51,.18), inset 0 1px 0 rgba(255,255,255,.08);
}

.about-grid--premium .flip-card__number{
  position:absolute;
  right:22px;
  bottom:14px;
  font-family:var(--font-display);
  font-size:3.3rem;
  font-weight:900;
  line-height:1;
  color:rgba(255,255,255,.045);
  pointer-events:none;
}

.about-grid--premium .flip-card__hint{
  padding:5px 10px;
  border:1px solid rgba(255,0,51,.35);
  border-radius:999px;
  background:rgba(255,0,51,.08);
}

.about-grid--premium .flip-card .ic{
  width:58px;
  height:58px;
  margin-bottom:20px;
  border-radius:18px;
  background:linear-gradient(135deg, rgba(255,0,51,.22), rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 0 28px rgba(255,0,51,.18);
}

.about-grid--premium .flip-card__title{
  font-size:1.16rem;
  letter-spacing:.2px;
}

.about-grid--premium .flip-card__text{
  max-width:92%;
}

.loop-slider{
  position:relative;
  --slider-gap:20px;
}

.loop-slider__viewport{
  overflow:hidden;
  padding:10px 2px 26px;
  mask-image:linear-gradient(90deg, transparent 0, #000 32px, #000 calc(100% - 32px), transparent 100%);
}

.loop-slider__track{
  display:flex;
  gap:var(--slider-gap);
  align-items:stretch;
  will-change:transform;
}

.loop-slider__slide{
  flex:0 0 calc((100% - (var(--slider-gap) * 2)) / 3);
  min-width:0;
  height:auto;
}

.loop-slider__slide.is-clone{
  pointer-events:none;
}

.loop-slider__controls{
  position:relative;
  z-index:8;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  margin-top:4px;
}

.loop-slider__btn{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:999px;
  border:1px solid var(--line-2);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
  color:var(--text);
  cursor:pointer;
  touch-action:manipulation;
  pointer-events:auto;
  transition:transform .22s var(--ease), border-color .22s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease);
}

.loop-slider__btn:hover{
  transform:translateY(-2px);
  border-color:var(--red);
  background:rgba(255,0,51,.12);
  box-shadow:0 0 26px rgba(255,0,51,.32);
}

.loop-slider__dots{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:80px;
}

.loop-slider__dot{
  width:8px;
  height:8px;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.24);
  cursor:pointer;
  touch-action:manipulation;
  pointer-events:auto;
  transition:width .25s var(--ease), background .25s var(--ease), box-shadow .25s var(--ease);
}

.loop-slider__dot.is-active{
  width:28px;
  background:var(--red);
  box-shadow:var(--glow-red);
}

.config-card.loop-slider__slide,
.review-card.loop-slider__slide,
.promo-card.loop-slider__slide{
  min-height:100%;
}

.config-card__media{
  position:relative;
  display:grid;
  place-items:center;
  min-height:178px;
  margin:4px 0 18px;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.1);
  background:
    radial-gradient(220px 120px at 50% 20%, rgba(255,0,51,.18), transparent 70%),
    linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
}

.config-card__media::after{
  content:"";
  position:absolute;
  inset:auto 12% 16px;
  height:18px;
  border-radius:999px;
  background:rgba(255,0,51,.22);
  filter:blur(16px);
}

.config-card__media img{
  position:relative;
  z-index:1;
  width:100%;
  height:190px;
  object-fit:contain;
  padding:16px;
  filter:drop-shadow(0 18px 24px rgba(0,0,0,.55));
}

.config-card__placeholder{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  gap:8px;
  padding:24px;
  text-align:center;
  color:var(--muted);
  font-weight:800;
  letter-spacing:.3px;
  opacity:0;
}

.config-card__media.is-empty .config-card__placeholder{
  opacity:1;
}

.config-card .specs{
  margin-top:16px;
}

.review-card.loop-slider__slide{
  padding:30px;
}

.review-card.loop-slider__slide p{
  font-size:1.02rem;
}

.promo-card.loop-slider__slide{
  padding:30px;
  background:
    radial-gradient(260px 140px at 100% 0, rgba(255,0,51,.16), transparent 70%),
    linear-gradient(180deg, var(--surface), var(--surface-2));
}

.promo-card.loop-slider__slide .disc{
  margin-bottom:8px;
}

/* Плашка «Нажми» теперь находится только на лицевой стороне */
.about-grid--premium .flip-card__front .flip-card__hint{
  position:absolute;
  top:14px;
  right:14px;
  z-index:2;
}

.about-grid--premium .flip-card__back .flip-card__hint,
.about-grid--premium .flip-card__more{
  display:none !important;
}

/* Центрирование иконки внутри рамки */
.about-grid--premium .flip-card .ic{
  display:grid;
  place-items:center;
  line-height:1;
}

.about-grid--premium .flip-card .ic i{
  display:block;
  line-height:1;
}

@media (max-width:980px){
  .loop-slider__slide{
    flex-basis:calc((100% - var(--slider-gap)) / 2);
  }
}

@media (max-width:620px){
  .loop-slider__viewport{
    mask-image:none;
    padding-left:0;
    padding-right:0;
  }

  .loop-slider__slide{
    flex-basis:100%;
  }

  .loop-slider__btn,
  .loop-slider__dot{
    cursor:pointer;
  }

  .config-card__media{
    min-height:150px;
  }
}

/* ===== Анимации блока статистики ===== */
.stats{
  position:relative;
  isolation:isolate;
  perspective:1100px;
}

.stats::before,
.stats::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:-1;
}

.stats::before{
  inset:-36px -18px;
  background:
    radial-gradient(520px 160px at var(--stats-x, 50%) 50%, rgba(255,0,51,.16), transparent 70%),
    linear-gradient(90deg, transparent, rgba(255,0,51,.12), transparent);
  opacity:.85;
  filter:blur(8px);
  animation:statsAura 8s ease-in-out infinite alternate;
}

.stats::after{
  left:6%;
  right:6%;
  top:-8px;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,0,51,.75), rgba(255,255,255,.45), transparent);
  box-shadow:0 0 28px rgba(255,0,51,.45);
  transform:translateX(-32%);
  opacity:.55;
  animation:statsBeam 5.5s cubic-bezier(.22,.61,.36,1) infinite;
}

.stats .stat{
  --rx:0deg;
  --ry:0deg;
  --lift:0px;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transform:translate3d(0, var(--lift), 0) rotateX(var(--rx)) rotateY(var(--ry));
  transform-style:preserve-3d;
  transition:
    transform .28s var(--ease),
    border-color .28s var(--ease),
    box-shadow .28s var(--ease),
    background .28s var(--ease),
    filter .28s var(--ease);
}

.stats .stat::before{
  content:"";
  position:absolute;
  inset:-2px;
  z-index:-1;
  border-radius:inherit;
  background:conic-gradient(from var(--spin, 0deg), transparent 0 42%, rgba(255,0,51,.92), rgba(255,255,255,.75), transparent 58% 100%);
  opacity:0;
  transition:opacity .32s var(--ease);
  animation:statBorderSpin 4.8s linear infinite;
}

.stats .stat::after{
  content:"";
  position:absolute;
  inset:1px;
  z-index:-1;
  border-radius:inherit;
  background:
    linear-gradient(115deg, transparent 0 34%, rgba(255,255,255,.09) 44%, transparent 55%),
    radial-gradient(210px 90px at 50% 0, rgba(255,0,51,.18), transparent 70%),
    var(--surface);
  background-size:240% 100%, auto, auto;
  background-position:140% 0, 0 0, 0 0;
  transition:background-position .8s var(--ease), box-shadow .28s var(--ease);
}

.stats .stat:hover{
  --lift:-10px;
  border-color:rgba(255,0,51,.7);
  box-shadow:
    0 26px 60px rgba(0,0,0,.36),
    0 0 34px rgba(255,0,51,.24),
    inset 0 1px 0 rgba(255,255,255,.08);
  filter:saturate(1.08);
}

.stats .stat:hover::before{
  opacity:.86;
}

.stats .stat:hover::after{
  background-position:-40% 0, 0 0, 0 0;
}

.stats .stat .num{
  position:relative;
  display:inline-flex;
  align-items:baseline;
  justify-content:center;
  gap:2px;
  transform:translateZ(34px);
  text-shadow:0 0 28px rgba(255,255,255,.12);
}

.stats .stat .num::after{
  content:"";
  position:absolute;
  left:-8%;
  right:-8%;
  bottom:4px;
  height:10px;
  border-radius:999px;
  background:rgba(255,0,51,.22);
  filter:blur(10px);
  opacity:0;
  transform:scaleX(.55);
  transition:opacity .25s var(--ease), transform .25s var(--ease);
}

.stats .stat:hover .num::after{
  opacity:.9;
  transform:scaleX(1);
}

.stats .stat .num b{
  color:var(--red);
  text-shadow:0 0 24px rgba(255,0,51,.55);
  animation:statPlusPulse 1.9s ease-in-out infinite;
}

.stats .stat .lbl{
  position:relative;
  transform:translateZ(18px);
  transition:color .25s var(--ease), letter-spacing .25s var(--ease), transform .25s var(--ease);
}

.stats .stat:hover .lbl{
  color:rgba(255,255,255,.78);
  letter-spacing:.09em;
  transform:translateZ(24px) translateY(2px);
}

.stats.stats--ready .stat{
  opacity:0;
  filter:blur(8px);
}

.stats.stats--ready.is-inview .stat{
  animation:statAppear .72s cubic-bezier(.22,.61,.36,1) forwards;
}

.stats.stats--ready.is-inview .stat.d1{ animation-delay:.04s; }
.stats.stats--ready.is-inview .stat.d2{ animation-delay:.14s; }
.stats.stats--ready.is-inview .stat.d3{ animation-delay:.24s; }
.stats.stats--ready.is-inview .stat.d4{ animation-delay:.34s; }

@keyframes statAppear{
  0%{ opacity:0; filter:blur(10px); transform:translate3d(0,24px,0) scale(.96); }
  70%{ opacity:1; filter:blur(0); transform:translate3d(0,-5px,0) scale(1.01); }
  100%{ opacity:1; filter:blur(0); transform:translate3d(0,var(--lift),0) rotateX(var(--rx)) rotateY(var(--ry)); }
}

@keyframes statsAura{
  0%{ transform:translate3d(-10px,0,0) scale(.98); opacity:.5; }
  100%{ transform:translate3d(10px,-8px,0) scale(1.04); opacity:.95; }
}

@keyframes statsBeam{
  0%, 18%{ transform:translateX(-45%); opacity:0; }
  35%, 72%{ opacity:.7; }
  100%{ transform:translateX(45%); opacity:0; }
}

@property --spin{
  syntax:"<angle>";
  inherits:false;
  initial-value:0deg;
}

@keyframes statBorderSpin{
  to{ --spin:360deg; }
}

@keyframes statPlusPulse{
  0%, 100%{ transform:translateY(0) scale(1); filter:drop-shadow(0 0 0 rgba(255,0,51,0)); }
  45%{ transform:translateY(-2px) scale(1.13); filter:drop-shadow(0 0 10px rgba(255,0,51,.65)); }
}

@media (hover:none){
  .stats .stat:hover{
    --lift:0px;
  }
}

@media (prefers-reduced-motion:reduce){
  .stats::before,
  .stats::after,
  .stats .stat::before,
  .stats .stat .num b,
  .stats.stats--ready.is-inview .stat{
    animation:none !important;
  }

  .stats.stats--ready .stat{
    opacity:1;
    filter:none;
  }
}

/* ===== Правки всех трёх слайдеров: ПК, отзывы, акции ===== */
.loop-slider{
  touch-action:pan-y;
}

.loop-slider__viewport{
  position:relative;
}

.loop-slider__viewport::before,
.loop-slider__viewport::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  z-index:3;
  width:54px;
  pointer-events:none;
}

.loop-slider__viewport::before{
  left:0;
  background:linear-gradient(90deg, rgba(5,5,8,.96), transparent);
}

.loop-slider__viewport::after{
  right:0;
  background:linear-gradient(270deg, rgba(5,5,8,.96), transparent);
}

.loop-slider__track{
  cursor:grab;
  user-select:none;
}

.loop-slider.is-dragging .loop-slider__track{
  cursor:grabbing;
}

.loop-slider__slide{
  backface-visibility:hidden;
  transform:translateZ(0);
}

.loop-slider__slide.is-clone{
  opacity:1 !important;
  visibility:visible !important;
  filter:none !important;
  transform:translateZ(0) !important;
  animation:none !important;
}

.loop-slider.is-single .loop-slider__controls{
  display:none;
}

.loop-slider.is-single .loop-slider__track{
  justify-content:center;
  cursor:default;
}

.loop-slider.is-single .loop-slider__slide{
  max-width:430px;
}

.loop-slider__btn:active{
  transform:translateY(0) scale(.96);
}

.loop-slider__dot:hover{
  background:rgba(255,255,255,.48);
}

.config-card.loop-slider__slide,
.review-card.loop-slider__slide,
.promo-card.loop-slider__slide{
  display:flex;
  flex-direction:column;
}

.config-card.loop-slider__slide .btn{
  margin-top:auto;
}

.review-card.loop-slider__slide{
  justify-content:space-between;
}

.promo-card.loop-slider__slide{
  justify-content:flex-start;
}

@media (max-width:620px){
  .loop-slider__viewport::before,
  .loop-slider__viewport::after{
    display:none;
  }
}

/* ===== v6: минимальные карточки ПК на главной ===== */
.config-card--minimal{
  padding:26px;
  min-height:580px;
  justify-content:stretch;
  background:
    radial-gradient(420px 220px at 50% 16%, rgba(255,0,51,.18), transparent 68%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.02)),
    var(--surface);
}

.config-card--minimal .config-card__media{
  text-decoration:none;
}

.config-card--minimal .config-card__media--big{
  min-height:325px;
  margin:0 0 22px;
  border-radius:24px;
  background:
    radial-gradient(330px 160px at 50% 28%, rgba(255,0,51,.28), transparent 72%),
    radial-gradient(280px 120px at 50% 100%, rgba(255,255,255,.07), transparent 75%),
    linear-gradient(135deg, rgba(255,255,255,.095), rgba(255,255,255,.025));
  transition:transform .28s var(--ease), border-color .28s var(--ease), box-shadow .28s var(--ease);
}

.config-card--minimal:hover .config-card__media--big{
  transform:translateY(-5px) scale(1.015);
  border-color:rgba(255,0,51,.5);
  box-shadow:0 24px 56px rgba(0,0,0,.34), 0 0 42px rgba(255,0,51,.16);
}

.config-card--minimal .config-card__media--big::after{
  inset:auto 7% 24px;
  height:28px;
  opacity:.9;
  filter:blur(22px);
}

.config-card--minimal .config-card__media--big img{
  height:320px;
  padding:12px;
  transform:translateY(4px) scale(1.08);
  transition:transform .32s var(--ease), filter .32s var(--ease);
}

.config-card--minimal:hover .config-card__media--big img{
  transform:translateY(-2px) scale(1.13);
  filter:drop-shadow(0 24px 28px rgba(0,0,0,.62));
}

.config-card--minimal .config-card__placeholder{
  font-size:1.05rem;
}

.config-card--minimal .config-card__main{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-top:auto;
  margin-bottom:22px;
}

.config-card--minimal h3{
  margin:0;
  font-size:1.7rem;
  line-height:1.05;
}

.config-card--minimal .price{
  margin:0;
  white-space:nowrap;
  font-size:2.25rem;
  line-height:1;
}

.config-card--minimal .price small{
  font-size:.9rem;
}

.config-card--minimal .ic,
.config-card--minimal .tag,
.config-card--minimal .specs{
  display:none !important;
}

@media (max-width:980px){
  .config-card--minimal{
    min-height:530px;
  }

  .config-card--minimal .config-card__media--big{
    min-height:280px;
  }

  .config-card--minimal .config-card__media--big img{
    height:280px;
  }
}

@media (max-width:620px){
  .config-card--minimal{
    min-height:500px;
    padding:22px;
  }

  .config-card--minimal .config-card__media--big{
    min-height:255px;
  }

  .config-card--minimal .config-card__media--big img{
    height:250px;
  }

  .config-card--minimal .config-card__main{
    align-items:flex-start;
    flex-direction:column;
    gap:10px;
  }
}

/* ===== v8: единый шрифт карточек ПК + скрытие Telegram/Discord в подвале ===== */
.config-card--minimal{
  --cx-body-font: var(--font-main, var(--font-body, Manrope, Arial, sans-serif));
  --cx-display-font: var(--font-display, Unbounded, Manrope, Arial, sans-serif);
  font-family: var(--cx-body-font);
}

.config-card--minimal h3,
.config-card--minimal .price,
.config-card--minimal .price small,
.config-card--minimal .btn,
.config-card--minimal .config-card__placeholder{
  font-family: var(--cx-display-font);
}

.config-card--minimal h3{
  font-weight: 800;
  letter-spacing: .01em;
  text-transform: none;
}

.config-card--minimal .price{
  font-weight: 900;
  letter-spacing: -.035em;
}

.config-card--minimal .price small{
  font-weight: 800;
  letter-spacing: .01em;
}

.config-card--minimal .btn{
  letter-spacing: .03em;
}

/* Скрываем именно ссылки/иконки Telegram и Discord в футере. VK и остальные контакты остаются. */
footer a[href*="t.me"],
footer a[href*="telegram"],
footer a[href*="discord"],
.footer a[href*="t.me"],
.footer a[href*="telegram"],
.footer a[href*="discord"],
.site-footer a[href*="t.me"],
.site-footer a[href*="telegram"],
.site-footer a[href*="discord"]{
  display:none !important;
}

/* ===== v9: финальная унификация главной страницы ===== */
.hero,
.section,
#about,
.configs,
.reviews,
.promotions{
  color:var(--text);
}

.hero-kicker,
.flip-card__hint,
.config-card--minimal .tag,
.promo-card .tag,
.review-card .tag{
  font-family:var(--font-display) !important;
  font-size:var(--fs-xs);
  font-weight:800;
  letter-spacing:.12em !important;
  text-transform:uppercase;
}

.about-grid--premium .flip-card__title,
.config-card--minimal h3,
.review-card.loop-slider__slide h3,
.promo-card.loop-slider__slide h3{
  font-family:var(--font-display) !important;
  color:var(--text);
  font-weight:800;
  letter-spacing:-.035em;
}

.about-grid--premium .flip-card__text,
.review-card.loop-slider__slide p,
.promo-card.loop-slider__slide p,
.config-card__placeholder{
  font-family:var(--font-body) !important;
  color:var(--muted);
  font-size:var(--fs-base);
  line-height:1.66;
  letter-spacing:0;
}

.about-grid--premium .flip-card .ic{
  color:var(--text);
}

.loop-slider__btn,
.loop-slider__dot{
  font-family:var(--font-display) !important;
}

.loop-slider__btn{
  background:rgba(255,255,255,.055);
  border-color:var(--line-2);
}

.loop-slider__btn:hover{
  border-color:rgba(255,0,51,.62);
  background:rgba(255,0,51,.12);
}

.config-card--minimal{
  min-height:560px;
  padding:26px;
  border-radius:var(--radius-lg);
}

.config-card--minimal .config-card__media--big{
  min-height:340px;
  border-radius:24px;
}

.config-card--minimal .config-card__media--big img{
  height:335px;
}

.config-card--minimal .config-card__main{
  gap:16px;
}

.config-card--minimal h3{
  font-size:clamp(1.35rem, 2vw, 1.85rem);
  line-height:1.05;
  margin:0;
}

.config-card--minimal .price{
  font-family:var(--font-display) !important;
  font-size:clamp(2.05rem, 3vw, 2.85rem);
  font-weight:800;
  line-height:1;
  letter-spacing:-.055em;
  color:var(--text);
}

.config-card--minimal .price small{
  font-family:var(--font-display) !important;
  color:var(--muted);
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.02em;
}

.config-card--minimal .btn{
  width:100%;
  border-radius:14px;
}

.review-card.loop-slider__slide,
.promo-card.loop-slider__slide{
  border-radius:var(--radius-lg);
}

.review-card.loop-slider__slide p{
  font-size:clamp(1rem, 1.25vw, 1.12rem);
}

.promo-card.loop-slider__slide .disc{
  font-family:var(--font-display) !important;
  color:var(--red);
  font-size:clamp(2.15rem, 4vw, 3.8rem);
  font-weight:800;
  letter-spacing:-.065em;
}

.stats .stat .num{
  font-family:var(--font-display) !important;
  font-size:clamp(2.35rem, 4.5vw, 3.8rem);
  font-weight:800;
  letter-spacing:-.065em;
}

.stats .stat .lbl{
  font-family:var(--font-display) !important;
  color:var(--muted);
  font-size:var(--fs-xs);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em !important;
}

@media (max-width:980px){
  .config-card--minimal{
    min-height:520px;
  }

  .config-card--minimal .config-card__media--big{
    min-height:285px;
  }

  .config-card--minimal .config-card__media--big img{
    height:285px;
  }
}

@media (max-width:620px){
  .config-card--minimal{
    min-height:480px;
  }

  .config-card--minimal .config-card__media--big{
    min-height:250px;
  }

  .config-card--minimal .config-card__media--big img{
    height:245px;
  }
}

/* =====================================================================
   v10 — уменьшенные шрифты на главной, чтобы текст не выходил за карточки
===================================================================== */
.about-grid--premium .flip-card,
.about-grid--premium .flip-card__inner,
.about-grid--premium .flip-card__face{
  min-height:265px;
}

.about-grid--premium .flip-card__face{
  padding:24px 22px;
}

.about-grid--premium .flip-card .ic{
  width:52px;
  height:52px;
  margin-bottom:16px;
  border-radius:16px;
}

.about-grid--premium .flip-card__title{
  font-size:clamp(1rem, 1.3vw, 1.18rem) !important;
  line-height:1.22;
  letter-spacing:-.03em;
}

.about-grid--premium .flip-card__text{
  max-width:100%;
  font-size:.9rem !important;
  line-height:1.55 !important;
}

.about-grid--premium .flip-card__number{
  font-size:2.85rem;
  right:18px;
  bottom:12px;
}

.about-grid--premium .flip-card__hint{
  padding:4px 9px;
  font-size:.66rem !important;
}

.loop-slider__slide{
  min-width:0;
}

.config-card--minimal{
  min-height:520px;
  padding:22px;
}

.config-card--minimal .config-card__media--big{
  min-height:300px;
  margin-bottom:18px;
}

.config-card--minimal .config-card__media--big img{
  height:295px;
  padding:10px;
}

.config-card--minimal .config-card__main{
  gap:12px;
  margin-bottom:18px;
}

.config-card--minimal h3{
  font-size:clamp(1.12rem, 1.55vw, 1.45rem) !important;
  line-height:1.12;
  letter-spacing:-.035em;
  min-width:0;
}

.config-card--minimal .price{
  font-size:clamp(1.55rem, 2.35vw, 2.15rem) !important;
  line-height:.98;
  letter-spacing:-.05em;
  white-space:nowrap;
}

.config-card--minimal .price small{
  font-size:.66rem !important;
  letter-spacing:.01em;
}

.config-card--minimal .btn{
  min-height:42px;
  font-size:.7rem !important;
}

.config-card--minimal .config-card__placeholder{
  font-size:.9rem !important;
  line-height:1.35;
}

.review-card.loop-slider__slide,
.promo-card.loop-slider__slide{
  padding:24px;
}

.review-card.loop-slider__slide p,
.promo-card.loop-slider__slide p{
  font-size:.9rem !important;
  line-height:1.58 !important;
}

.review-card.loop-slider__slide h3,
.promo-card.loop-slider__slide h3{
  font-size:clamp(1.02rem, 1.35vw, 1.28rem) !important;
  line-height:1.16;
}

.promo-card.loop-slider__slide .disc{
  font-size:clamp(1.8rem, 3.2vw, 3rem) !important;
  line-height:.98;
}

.stats .stat{
  padding:26px 18px;
}

.stats .stat .num{
  font-size:clamp(2rem, 3.6vw, 3.15rem) !important;
  line-height:1;
}

.stats .stat .lbl{
  font-size:.68rem !important;
  line-height:1.28;
  letter-spacing:.065em !important;
}

.loop-slider__btn{
  width:42px;
  height:42px;
}

.loop-slider__dot.is-active{
  width:24px;
}

/* Правка inline-стиля в блоках преимуществ/цен: CSS перебивает слишком крупные значения. */
.price.text-red{
  font-size:clamp(1.45rem, 2.4vw, 1.85rem) !important;
  line-height:1.05;
}

@media (max-width:980px){
  .config-card--minimal{
    min-height:485px;
  }

  .config-card--minimal .config-card__media--big{
    min-height:255px;
  }

  .config-card--minimal .config-card__media--big img{
    height:255px;
  }
}

@media (max-width:620px){
  .about-grid--premium .flip-card,
  .about-grid--premium .flip-card__inner,
  .about-grid--premium .flip-card__face{
    min-height:245px;
  }

  .config-card--minimal{
    min-height:450px;
    padding:20px;
  }

  .config-card--minimal .config-card__media--big{
    min-height:230px;
  }

  .config-card--minimal .config-card__media--big img{
    height:225px;
  }

  .config-card--minimal .config-card__main{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }

  .config-card--minimal .price{
    font-size:1.75rem !important;
  }
}

/* =====================================================================
   v12 — аккуратный полноэкранный hero без перегруза
   Исправляет слишком крупный текст, пустоту справа и хаотичные элементы.
===================================================================== */
.container{
  margin-left:auto;
  margin-right:auto;
}

.hero-screen{
  position:relative;
  min-height:100svh;
  display:flex;
  align-items:center;
  overflow:hidden;
  padding:clamp(96px, 10vh, 132px) 0 clamp(78px, 8vh, 104px);
  background:
    radial-gradient(680px 440px at 78% 26%, rgba(255,0,51,.18), transparent 66%),
    radial-gradient(520px 360px at 16% 78%, rgba(255,0,51,.09), transparent 70%),
    linear-gradient(180deg, rgba(5,5,7,.96), rgba(7,7,10,.98));
  isolation:isolate;
}

.hero-screen__bg{
  position:absolute;
  inset:0;
  z-index:-3;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:58px 58px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.86), rgba(0,0,0,.62) 62%, transparent);
  opacity:.52;
}

.hero-screen::before{
  content:"";
  position:absolute;
  inset:14% 8% auto auto;
  width:min(620px, 38vw);
  height:min(620px, 38vw);
  z-index:-2;
  pointer-events:none;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,0,51,.18), transparent 68%);
  filter:blur(10px);
}

.hero-screen::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:34%;
  z-index:-2;
  pointer-events:none;
  background:linear-gradient(180deg, transparent, rgba(0,0,0,.42));
}

.hero-screen__inner{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0, 1.05fr) minmax(360px, .82fr);
  align-items:center;
  gap:clamp(38px, 6vw, 76px);
}

.hero-screen__content{
  max-width:680px;
}

.hero-screen .hero-kicker{
  display:inline-flex;
  align-items:center;
  gap:9px;
  width:auto;
  max-width:100%;
  margin:0 0 22px;
  padding:8px 14px;
  border:1px solid rgba(255,0,51,.35);
  border-radius:999px;
  background:rgba(255,0,51,.075);
  box-shadow:0 0 28px rgba(255,0,51,.1);
  color:var(--text-soft);
  line-height:1.15;
  text-align:left;
}

.hero-screen .hero-kicker i{
  flex:0 0 auto;
  color:var(--red);
  font-size:.52rem;
  filter:drop-shadow(0 0 8px rgba(255,0,51,.85));
}

.hero-screen h1{
  max-width:760px;
  margin:0 0 20px;
  color:var(--text);
  font-size:clamp(3.15rem, 5.25vw, 5.85rem) !important;
  line-height:.96 !important;
  letter-spacing:-.07em !important;
  text-wrap:balance;
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:manual;
}

.hero-screen h1 span{
  display:inline !important;
  white-space:normal;
  word-break:normal !important;
  overflow-wrap:normal !important;
}

.hero-screen h1 .accent{
  color:var(--red);
  text-shadow:0 0 38px rgba(255,0,51,.36);
}

.hero-screen p{
  max-width:560px;
  margin:0 0 28px;
  color:var(--text-soft);
  font-size:clamp(.94rem, 1.05vw, 1.06rem) !important;
  line-height:1.64;
}

.hero-screen .hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:0 0 28px;
}

.hero-screen .btn{
  min-height:48px;
  padding:0 20px;
  border-radius:14px;
  font-size:.78rem;
}

.hero-screen__stats{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
  max-width:520px;
}

.hero-screen__stats div{
  min-height:78px;
  padding:14px 16px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:18px;
  background:rgba(255,255,255,.045);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
  backdrop-filter:blur(14px);
}

.hero-screen__stats b{
  display:block;
  margin-bottom:5px;
  color:var(--text);
  font-family:var(--font-display) !important;
  font-size:1.14rem;
  line-height:1;
  letter-spacing:-.05em;
}

.hero-screen__stats span{
  display:block;
  color:var(--muted);
  font-size:.72rem;
  font-weight:750;
  line-height:1.25;
}

.hero-screen__visual{
  position:relative;
  width:min(100%, 520px);
  justify-self:end;
  min-height:520px;
}

.hero-card-main{
  position:absolute;
  inset:36px 0 26px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:24px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:32px;
  background:
    radial-gradient(460px 260px at 50% -8%, rgba(255,0,51,.2), transparent 68%),
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.026)),
    rgba(16,16,22,.86);
  box-shadow:0 34px 110px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(18px);
}

.hero-card-main::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(135deg, rgba(255,0,51,.72), rgba(255,255,255,.12), rgba(255,0,51,.12));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
  opacity:.52;
}

.hero-card-main__head{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  color:var(--muted);
  font-family:var(--font-display) !important;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.hero-card-main__head b{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--red);
  font-weight:800;
}

.hero-card-main__head b i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--red);
  box-shadow:0 0 14px rgba(255,0,51,.82);
}

.hero-pc-frame{
  position:relative;
  z-index:1;
  display:grid;
  place-items:center;
  padding:18px 0;
}

.hero-pc-frame__glow{
  position:absolute;
  width:70%;
  height:44%;
  border-radius:50%;
  background:rgba(255,0,51,.22);
  filter:blur(46px);
  opacity:.72;
}

.hero-pc-frame__screen{
  position:relative;
  width:100%;
  min-height:250px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:9px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:26px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.1), rgba(255,255,255,.025)),
    radial-gradient(280px 150px at 50% 20%, rgba(255,0,51,.24), transparent 74%);
  box-shadow:inset 0 0 42px rgba(255,0,51,.08), 0 22px 68px rgba(0,0,0,.28);
}

.hero-pc-frame__screen::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:100% 10px;
  opacity:.28;
}

.hero-pc-frame__screen i,
.hero-pc-frame__screen strong,
.hero-pc-frame__screen small{
  position:relative;
  z-index:1;
}

.hero-pc-frame__screen i{
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,0,51,.28);
  border-radius:20px;
  background:rgba(255,0,51,.11);
  color:var(--red);
  font-size:1.55rem;
  box-shadow:0 0 28px rgba(255,0,51,.18);
}

.hero-pc-frame__screen strong{
  color:var(--text);
  font-family:var(--font-display) !important;
  font-size:1.32rem;
  line-height:1;
  letter-spacing:-.045em;
  text-align:center;
}

.hero-pc-frame__screen small{
  color:var(--muted);
  font-family:var(--font-display) !important;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  text-align:center;
}

.hero-card-main__features{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}

.hero-card-main__features div{
  min-height:72px;
  display:grid;
  place-items:center;
  gap:8px;
  padding:12px 8px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:18px;
  background:rgba(255,255,255,.045);
}

.hero-card-main__features i{
  color:var(--red);
  font-size:1.05rem;
}

.hero-card-main__features span{
  color:var(--text-soft);
  font-family:var(--font-display) !important;
  font-size:.66rem;
  font-weight:800;
  text-align:center;
  letter-spacing:-.02em;
}

.hero-soft-chip{
  position:absolute;
  z-index:3;
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:42px;
  padding:0 15px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(17,17,23,.74);
  color:var(--text-soft);
  box-shadow:0 18px 60px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter:blur(16px);
  font-family:var(--font-display) !important;
  font-size:.66rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.hero-soft-chip i{
  color:var(--red);
}

.hero-soft-chip--top{
  top:0;
  right:26px;
}

.hero-soft-chip--bottom{
  left:20px;
  bottom:0;
}

.hero-screen .hero-scroll{
  position:absolute;
  left:50%;
  bottom:24px;
  z-index:5;
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--muted);
  text-decoration:none;
  font-family:var(--font-display) !important;
  font-size:.66rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  transform:translateX(-50%);
}

.hero-screen .hero-scroll i{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,0,51,.36);
  border-radius:999px;
  color:var(--red);
  background:rgba(255,0,51,.08);
}

.hero-screen .hero-line{
  position:absolute;
  left:50%;
  bottom:0;
  width:min(1180px, calc(100% - 32px));
  height:1px;
  transform:translateX(-50%);
  background:linear-gradient(90deg, transparent, rgba(255,0,51,.42), transparent);
  opacity:.8;
}

@media (max-width:1080px){
  .hero-screen{
    min-height:auto;
    padding:104px 0 74px;
  }

  .hero-screen__inner{
    grid-template-columns:1fr;
  }

  .hero-screen__content{
    max-width:760px;
  }

  .hero-screen__visual{
    justify-self:start;
    width:min(100%, 560px);
    min-height:480px;
  }

  .hero-screen .hero-scroll{
    display:none;
  }
}

@media (max-width:680px){
  .hero-screen{
    padding:92px 0 58px;
  }

  .hero-screen h1{
    font-size:clamp(2.55rem, 14vw, 4rem) !important;
    letter-spacing:-.06em !important;
  }

  .hero-screen__stats{
    grid-template-columns:1fr;
  }

  .hero-screen__visual{
    min-height:420px;
  }

  .hero-card-main{
    inset:24px 0 22px;
    padding:18px;
    border-radius:26px;
  }

  .hero-pc-frame__screen{
    min-height:205px;
    border-radius:22px;
  }

  .hero-card-main__features{
    gap:8px;
  }

  .hero-card-main__features div{
    min-height:62px;
    border-radius:15px;
  }

  .hero-card-main__features span{
    font-size:.58rem;
  }

  .hero-soft-chip{
    display:none;
  }
}

/* =====================================================================
   v13 — hero в стиле постера: огромная типографика + компактная плашка
   Сделано по референсу, но в фирменной палитре CyberX.
===================================================================== */
.hero-poster{
  position:relative;
  min-height:100svh;
  display:flex;
  align-items:center;
  overflow:hidden;
  isolation:isolate;
  padding:clamp(86px, 10vh, 124px) 0 clamp(72px, 8vh, 106px);
  background:
    radial-gradient(860px 520px at 30% 78%, rgba(255,0,51,.18), transparent 68%),
    radial-gradient(740px 480px at 80% 30%, rgba(255,0,51,.14), transparent 66%),
    linear-gradient(180deg, #040406 0%, #07070a 56%, #040405 100%);
}

.hero-poster__grid{
  position:absolute;
  inset:0;
  z-index:-4;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.036) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.036) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(circle at 50% 48%, #000 0 45%, transparent 78%);
  opacity:.62;
}

.hero-poster::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-3;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.48), transparent 28%, transparent 72%, rgba(0,0,0,.52)),
    linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.54));
}

.hero-poster::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  z-index:-2;
  width:min(980px, 62vw);
  height:min(980px, 62vw);
  transform:translate(-50%, -48%);
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,0,51,.12), transparent 66%);
  filter:blur(12px);
  opacity:.86;
}

.hero-poster__glow{
  position:absolute;
  z-index:-2;
  pointer-events:none;
  border-radius:50%;
  filter:blur(58px);
  opacity:.66;
}

.hero-poster__glow--left{
  left:14%;
  bottom:10%;
  width:360px;
  height:250px;
  background:rgba(255,0,51,.18);
}

.hero-poster__glow--right{
  right:8%;
  top:18%;
  width:420px;
  height:280px;
  background:rgba(255,255,255,.055);
}

.hero-poster__inner{
  position:relative;
  z-index:2;
  min-height:calc(100svh - 180px);
  display:flex;
  align-items:center;
  justify-content:center;
}

.hero-poster__badge{
  position:absolute;
  left:0;
  top:clamp(4px, 2vh, 28px);
  max-width:270px;
  min-height:58px;
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:10px 20px 10px 17px;
  border:1px solid rgba(255,0,51,.48);
  border-radius:999px;
  background:rgba(255,0,51,.075);
  color:var(--red);
  box-shadow:0 0 36px rgba(255,0,51,.12);
  font-family:var(--font-display) !important;
  font-size:.65rem;
  font-weight:800;
  line-height:1.35;
  letter-spacing:.075em;
  text-transform:uppercase;
}

.hero-poster__badge i{
  color:var(--red);
  font-size:.48rem;
  filter:drop-shadow(0 0 10px rgba(255,0,51,.9));
}

.hero-poster__word{
  position:relative;
  z-index:1;
  width:100%;
  margin:0;
  color:rgba(255,255,255,.94);
  font-family:var(--font-display) !important;
  font-size:clamp(5.6rem, 17vw, 16.8rem) !important;
  font-weight:800;
  line-height:.76 !important;
  letter-spacing:-.12em !important;
  text-align:center;
  text-transform:uppercase;
  white-space:nowrap;
  transform:translateY(2vh);
  text-shadow:
    0 0 40px rgba(255,255,255,.035),
    0 26px 100px rgba(0,0,0,.5);
}

.hero-poster__word span,
.hero-poster__word b{
  display:inline-block;
}

.hero-poster__word b{
  color:var(--red);
  font-style:normal;
  text-shadow:0 0 54px rgba(255,0,51,.46), 0 24px 80px rgba(0,0,0,.5);
}

.hero-poster__subline{
  position:absolute;
  left:clamp(0px, 8vw, 124px);
  top:calc(50% + clamp(42px, 8.2vw, 118px));
  z-index:3;
  color:var(--text);
  font-family:var(--font-display) !important;
  font-size:clamp(.72rem, 1.12vw, 1rem);
  font-weight:800;
  line-height:1;
  letter-spacing:-.04em;
  text-transform:uppercase;
}

.hero-poster__subline::after{
  content:"";
  display:block;
  width:72px;
  height:3px;
  margin-top:10px;
  border-radius:999px;
  background:var(--red);
  box-shadow:0 0 20px rgba(255,0,51,.55);
}

.hero-poster__panel{
  position:absolute;
  right:clamp(0px, 8vw, 112px);
  top:50%;
  z-index:4;
  width:min(370px, 33vw);
  transform:translateY(-19%);
  padding:24px 26px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:0;
  background:
    linear-gradient(90deg, rgba(12,12,16,.92), rgba(24,24,28,.58)),
    radial-gradient(240px 130px at 0% 50%, rgba(255,0,51,.2), transparent 70%);
  box-shadow:0 28px 90px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}

.hero-poster__panel::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:var(--red);
  box-shadow:0 0 22px rgba(255,0,51,.75);
}

.hero-poster__panel-kicker{
  display:block;
  margin-bottom:10px;
  color:var(--red);
  font-family:var(--font-display) !important;
  font-size:.63rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.hero-poster__panel h2{
  max-width:100%;
  margin:0 0 12px;
  color:var(--text);
  font-family:var(--font-display) !important;
  font-size:clamp(1.24rem, 1.75vw, 1.78rem) !important;
  line-height:1.07 !important;
  letter-spacing:-.065em !important;
  text-transform:uppercase;
  text-wrap:balance;
}

.hero-poster__panel p{
  margin:0 0 18px;
  color:var(--text-soft);
  font-size:.84rem !important;
  line-height:1.55;
}

.hero-poster__panel-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:14px;
}

.hero-poster__panel .btn{
  min-height:42px;
  padding:0 16px;
  border-radius:12px;
  font-size:.68rem;
}

.hero-poster__link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--text);
  text-decoration:none;
  font-family:var(--font-display) !important;
  font-size:.62rem;
  font-weight:800;
  letter-spacing:.035em;
  text-transform:uppercase;
  transition:color .2s ease, transform .2s ease;
}

.hero-poster__link:hover{
  color:var(--red);
  transform:translateX(3px);
}

.hero-poster__chips{
  position:absolute;
  left:0;
  bottom:clamp(8px, 4vh, 42px);
  z-index:5;
  display:flex;
  align-items:center;
  gap:10px;
}

.hero-poster__chips div{
  min-width:108px;
  padding:12px 16px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:999px;
  background:rgba(255,255,255,.05);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(12px);
}

.hero-poster__chips b{
  display:inline-block;
  margin-right:5px;
  color:var(--text);
  font-family:var(--font-display) !important;
  font-size:.92rem;
  line-height:1;
  letter-spacing:-.05em;
}

.hero-poster__chips span{
  color:var(--text-soft);
  font-size:.62rem;
  font-weight:800;
  line-height:1;
}

.hero-poster__scroll{
  position:absolute;
  left:50%;
  bottom:24px;
  z-index:6;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,0,51,.38);
  border-radius:50%;
  color:var(--red);
  background:rgba(255,0,51,.07);
  box-shadow:0 0 32px rgba(255,0,51,.16);
  text-decoration:none;
  transform:translateX(-50%);
  animation:heroPosterScroll 2s ease-in-out infinite;
}

.hero-poster__scroll span{
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
}

@keyframes heroPosterScroll{
  0%, 100%{ transform:translateX(-50%) translateY(0); }
  50%{ transform:translateX(-50%) translateY(7px); }
}

@media (max-width:1180px){
  .hero-poster__panel{
    right:28px;
    width:min(350px, 36vw);
  }

  .hero-poster__word{
    font-size:clamp(5rem, 16vw, 13rem) !important;
  }
}

@media (max-width:920px){
  .hero-poster{
    min-height:100svh;
    padding:92px 0 78px;
  }

  .hero-poster__inner{
    min-height:calc(100svh - 170px);
    align-items:center;
    justify-content:flex-start;
    flex-direction:column;
  }

  .hero-poster__badge,
  .hero-poster__subline,
  .hero-poster__panel,
  .hero-poster__chips{
    position:relative;
    left:auto;
    right:auto;
    top:auto;
    bottom:auto;
    transform:none;
  }

  .hero-poster__badge{
    align-self:flex-start;
    margin-bottom:34px;
  }

  .hero-poster__word{
    font-size:clamp(4.4rem, 18vw, 8rem) !important;
    transform:none;
    white-space:nowrap;
  }

  .hero-poster__subline{
    align-self:flex-start;
    margin:16px 0 24px;
  }

  .hero-poster__panel{
    align-self:stretch;
    width:auto;
    max-width:620px;
    margin:0 auto;
    border-radius:22px;
  }

  .hero-poster__panel::before{
    width:100%;
    height:3px;
    inset:0 0 auto;
  }

  .hero-poster__chips{
    margin-top:18px;
    justify-content:center;
    flex-wrap:wrap;
  }
}

@media (max-width:620px){
  .hero-poster{
    padding:86px 0 62px;
  }

  .hero-poster__inner{
    min-height:auto;
  }

  .hero-poster__badge{
    max-width:240px;
    min-height:48px;
    padding:9px 15px;
    font-size:.55rem;
  }

  .hero-poster__word{
    width:100%;
    font-size:clamp(3.1rem, 19vw, 5.4rem) !important;
    letter-spacing:-.11em !important;
  }

  .hero-poster__panel{
    padding:20px;
  }

  .hero-poster__panel h2{
    font-size:1.28rem !important;
  }

  .hero-poster__panel p{
    font-size:.78rem !important;
  }

  .hero-poster__panel-actions{
    align-items:stretch;
    flex-direction:column;
    gap:12px;
  }

  .hero-poster__panel .btn{
    width:100%;
  }

  .hero-poster__link{
    justify-content:center;
  }

  .hero-poster__chips{
    width:100%;
    display:grid;
    grid-template-columns:1fr;
  }

  .hero-poster__chips div{
    width:100%;
    min-width:0;
    text-align:center;
  }

  .hero-poster__scroll{
    display:none;
  }
}

/* =====================================================================
   v15 — hero в стиле референса, но в фирменных цветах CyberX:
   огромная центральная типографика, тёмный фон, красный акцент,
   компактная информационная плашка поверх слова.
===================================================================== */
.hero-colizeum{
  --hero-accent:#ff0033;
  --hero-accent-2:#ff2a55;
  --hero-dark:#030306;
  position:relative;
  min-height:100svh;
  display:flex;
  align-items:center;
  overflow:hidden;
  isolation:isolate;
  padding:88px 0 68px;
  background:
    radial-gradient(520px 360px at 36% 76%, rgba(255,0,51,.24), transparent 70%),
    radial-gradient(620px 420px at 65% 40%, rgba(255,0,51,.14), transparent 72%),
    radial-gradient(900px 650px at 50% 54%, rgba(0,0,0,.18), transparent 46%),
    linear-gradient(180deg, #050509 0%, #030306 100%);
}

.hero-colizeum::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-5;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size:68px 68px;
  opacity:.32;
  mask-image:radial-gradient(circle at 50% 54%, #000 0 40%, transparent 82%);
}

.hero-colizeum::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 50%, transparent 0 34%, rgba(0,0,0,.58) 74%),
    linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.38));
}

.hero-colizeum__grain{
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.22;
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 3px);
  mix-blend-mode:screen;
}

.hero-colizeum__halo{
  position:absolute;
  z-index:-3;
  pointer-events:none;
  border-radius:50%;
  background:rgba(255,0,51,.18);
  filter:blur(52px);
  opacity:.78;
}

.hero-colizeum__halo--left{
  width:380px;
  height:260px;
  left:22%;
  bottom:12%;
}

.hero-colizeum__halo--right{
  width:560px;
  height:440px;
  right:18%;
  top:17%;
  opacity:.36;
}

.hero-colizeum__inner{
  position:relative;
  z-index:2;
  min-height:calc(100svh - 156px);
  display:grid;
  place-items:center;
}

.hero-colizeum__poster{
  position:relative;
  width:min(1180px, 100%);
  min-height:58vh;
  display:grid;
  place-items:center;
}

.hero-colizeum__word{
  position:relative;
  z-index:1;
  margin:0;
  width:100%;
  color:#f4f4f7;
  font-family:var(--font-display, "Unbounded", "Manrope", sans-serif) !important;
  font-size:clamp(7.6rem, 21.7vw, 20.6rem) !important;
  font-weight:900 !important;
  line-height:.68 !important;
  letter-spacing:-.085em !important;
  text-align:center;
  text-transform:uppercase;
  white-space:nowrap;
  transform:scaleY(1.18);
  transform-origin:center;
  text-shadow:
    0 0 1px rgba(255,255,255,.16),
    0 20px 88px rgba(255,0,51,.24),
    0 50px 120px rgba(0,0,0,.78);
  filter:drop-shadow(0 0 38px rgba(255,0,51,.18));
}

.hero-colizeum__subline{
  position:absolute;
  z-index:4;
  left:clamp(8px, 3.2vw, 44px);
  bottom:clamp(56px, 8.8vw, 126px);
  color:var(--hero-accent);
  font-family:var(--font-display, "Unbounded", "Manrope", sans-serif) !important;
  font-size:clamp(.95rem, 1.5vw, 1.62rem);
  font-weight:900;
  line-height:.9;
  letter-spacing:-.045em;
  text-transform:uppercase;
  text-shadow:0 18px 56px rgba(255,0,51,.3);
}

.hero-colizeum__panel{
  position:absolute;
  z-index:5;
  right:clamp(70px, 11.2vw, 180px);
  top:48%;
  width:min(320px, 28vw);
  min-height:132px;
  padding:24px 26px 18px;
  transform:translateY(-34%);
  overflow:hidden;
  border:0;
  border-radius:0;
  color:#fff;
  background:
    linear-gradient(100deg, rgba(8,8,12,.92), rgba(54,9,20,.78) 48%, rgba(8,8,12,.88)),
    radial-gradient(180px 130px at 18% 50%, rgba(255,0,51,.32), transparent 72%);
  box-shadow:
    0 34px 90px rgba(0,0,0,.54),
    inset 0 1px 0 rgba(255,255,255,.1);
  backdrop-filter:blur(12px);
}

.hero-colizeum__panel::before{
  content:"";
  position:absolute;
  inset:-30% auto -30% 31%;
  width:82px;
  transform:rotate(8deg);
  background:linear-gradient(90deg, transparent, rgba(255,0,51,.34), transparent);
  filter:blur(8px);
  opacity:.62;
  animation:heroColizeumShine 5.8s ease-in-out infinite;
}

.hero-colizeum__panel h2{
  position:relative;
  z-index:2;
  max-width:250px;
  margin:0 0 15px;
  color:#fff;
  font-family:var(--font-display, "Unbounded", "Manrope", sans-serif) !important;
  font-size:clamp(1.14rem, 1.55vw, 1.72rem) !important;
  font-weight:900;
  line-height:.9 !important;
  letter-spacing:-.045em !important;
  text-transform:uppercase;
  text-wrap:balance;
}

.hero-colizeum__panel p{
  position:relative;
  z-index:2;
  max-width:260px;
  margin:0 0 16px;
  color:rgba(255,255,255,.72);
  font-size:.78rem !important;
  line-height:1.48;
}

.hero-colizeum__cta{
  position:relative;
  z-index:2;
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--hero-accent);
  text-decoration:none;
  font-family:var(--font-display, "Unbounded", "Manrope", sans-serif) !important;
  font-size:.82rem;
  font-weight:900;
  line-height:1;
  letter-spacing:-.035em;
  text-transform:uppercase;
  transition:transform .22s var(--ease), color .22s var(--ease);
}

.hero-colizeum__cta i{
  font-size:.7rem;
  transform:translateY(1px);
}

.hero-colizeum__cta:hover{
  color:#fff;
  transform:translateX(5px);
}

.hero-colizeum__scroll{
  position:absolute;
  left:50%;
  bottom:22px;
  z-index:6;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,0,51,.42);
  border-radius:50%;
  color:var(--hero-accent);
  background:rgba(255,0,51,.08);
  box-shadow:0 0 32px rgba(255,0,51,.14);
  text-decoration:none;
  transform:translateX(-50%);
  animation:heroPosterScroll 2s ease-in-out infinite;
}

@keyframes heroColizeumShine{
  0%, 100%{ transform:translateX(-46px) rotate(8deg); opacity:.35; }
  48%{ transform:translateX(112px) rotate(8deg); opacity:.7; }
}

@media (max-width:1160px){
  .hero-colizeum__word{
    font-size:clamp(6.8rem, 20vw, 15.8rem) !important;
  }

  .hero-colizeum__panel{
    right:clamp(34px, 7vw, 90px);
    width:min(300px, 31vw);
  }
}

@media (max-width:860px){
  .hero-colizeum{
    padding:94px 0 78px;
  }

  .hero-colizeum__inner{
    min-height:calc(100svh - 172px);
  }

  .hero-colizeum__poster{
    min-height:62vh;
    align-content:center;
  }

  .hero-colizeum__word{
    font-size:clamp(4.9rem, 21vw, 8.7rem) !important;
    letter-spacing:-.078em !important;
  }

  .hero-colizeum__subline,
  .hero-colizeum__panel{
    position:relative;
    left:auto;
    right:auto;
    top:auto;
    bottom:auto;
    transform:none;
  }

  .hero-colizeum__subline{
    justify-self:start;
    margin:22px 0 18px;
    font-size:clamp(.95rem, 3.8vw, 1.35rem);
  }

  .hero-colizeum__panel{
    justify-self:end;
    width:min(390px, 92vw);
    min-height:0;
    padding:22px 24px 18px;
  }

  .hero-colizeum__panel h2{
    font-size:1.42rem !important;
  }
}

@media (max-width:560px){
  .hero-colizeum{
    min-height:100svh;
    padding:90px 0 64px;
  }

  .hero-colizeum__inner{
    min-height:auto;
  }

  .hero-colizeum__poster{
    min-height:auto;
    display:block;
  }

  .hero-colizeum__word{
    margin-top:11vh;
    font-size:clamp(3.25rem, 19.2vw, 5.6rem) !important;
    line-height:.75 !important;
    letter-spacing:-.065em !important;
    transform:scaleY(1.12);
  }

  .hero-colizeum__subline{
    margin:28px 0 20px;
  }

  .hero-colizeum__panel{
    width:100%;
  }

  .hero-colizeum__panel h2{
    font-size:1.28rem !important;
  }

  .hero-colizeum__scroll{
    display:none;
  }
}

/* =====================================================================
   v16 — hero растянут и сделан читабельнее:
   слово занимает больше ширины, буквы меньше слипаются, плашка не закрывает текст.
===================================================================== */
.hero-colizeum__poster{
  width:min(1480px, 100%);
  min-height:62vh;
}

.hero-colizeum__word{
  font-size:clamp(6.9rem, 18.9vw, 18.2rem) !important;
  line-height:.78 !important;
  letter-spacing:-.035em !important;
  transform:scaleX(1.08) scaleY(1.08);
  transform-origin:center;
  text-shadow:
    0 0 1px rgba(255,255,255,.18),
    0 22px 90px rgba(255,0,51,.25),
    0 52px 124px rgba(0,0,0,.78);
}

.hero-colizeum__panel{
  right:clamp(42px, 8vw, 130px);
  top:51%;
  width:min(360px, 27vw);
  min-height:126px;
  padding:22px 26px 18px;
  transform:translateY(-18%);
}

.hero-colizeum__panel h2{
  max-width:292px;
  font-size:clamp(1.08rem, 1.34vw, 1.54rem) !important;
  line-height:1.02 !important;
  letter-spacing:-.025em !important;
}

.hero-colizeum__panel p{
  max-width:300px;
  font-size:.76rem !important;
}

.hero-colizeum__subline{
  left:clamp(10px, 2.2vw, 32px);
  bottom:clamp(48px, 7.2vw, 104px);
  font-size:clamp(.88rem, 1.26vw, 1.38rem);
  letter-spacing:-.025em;
}

@media (max-width:1160px){
  .hero-colizeum__word{
    font-size:clamp(6rem, 18.4vw, 14.4rem) !important;
    letter-spacing:-.03em !important;
    transform:scaleX(1.04) scaleY(1.06);
  }

  .hero-colizeum__panel{
    right:clamp(28px, 4.8vw, 62px);
    width:min(330px, 32vw);
  }
}

@media (max-width:860px){
  .hero-colizeum__poster{
    min-height:64vh;
  }

  .hero-colizeum__word{
    font-size:clamp(4.8rem, 18.4vw, 8.3rem) !important;
    line-height:.82 !important;
    letter-spacing:-.025em !important;
    transform:scaleX(1.02) scaleY(1.04);
  }

  .hero-colizeum__panel{
    width:min(430px, 92vw);
    transform:none;
  }
}

@media (max-width:560px){
  .hero-colizeum__word{
    margin-top:9vh;
    font-size:clamp(3.25rem, 17.2vw, 5.25rem) !important;
    line-height:.88 !important;
    letter-spacing:-.018em !important;
    transform:scaleX(1) scaleY(1.02);
  }

  .hero-colizeum__subline{
    font-size:.86rem;
  }

  .hero-colizeum__panel h2{
    font-size:1.16rem !important;
    line-height:1.08 !important;
  }
}


/* =====================================================================
   v17 — hero выше, шире и с красной X в фирменном стиле CyberX
===================================================================== */
.hero-colizeum__poster{
  width:min(1640px, 96vw);
  min-height:60vh;
  transform:translateY(-4.2vh);
}

.hero-colizeum__word{
  font-size:clamp(6.8rem, 18.2vw, 18.8rem) !important;
  line-height:.76 !important;
  letter-spacing:-.03em !important;
  transform:scaleX(1.16) scaleY(1.07);
  transform-origin:center;
}

.hero-colizeum__x{
  color:var(--hero-accent);
  text-shadow:
    0 0 2px rgba(255,0,51,.34),
    0 0 34px rgba(255,0,51,.48),
    0 22px 90px rgba(255,0,51,.42),
    0 52px 124px rgba(0,0,0,.78);
}

.hero-colizeum__panel{
  top:52%;
  right:clamp(30px, 7vw, 112px);
}

.hero-colizeum__subline{
  bottom:clamp(42px, 6.6vw, 94px);
}

@media (max-width:1160px){
  .hero-colizeum__poster{
    width:min(1220px, 94vw);
    transform:translateY(-3.2vh);
  }

  .hero-colizeum__word{
    font-size:clamp(5.8rem, 18vw, 13.8rem) !important;
    transform:scaleX(1.1) scaleY(1.05);
  }
}

@media (max-width:860px){
  .hero-colizeum__poster{
    transform:translateY(-2vh);
  }

  .hero-colizeum__word{
    font-size:clamp(4.55rem, 17.4vw, 7.8rem) !important;
    letter-spacing:-.018em !important;
    transform:scaleX(1.04) scaleY(1.03);
  }
}

@media (max-width:560px){
  .hero-colizeum__poster{
    transform:none;
  }

  .hero-colizeum__word{
    margin-top:7vh;
    font-size:clamp(3.05rem, 16.6vw, 5rem) !important;
    letter-spacing:-.012em !important;
    transform:scaleX(1.02) scaleY(1.01);
  }
}

/* =====================================================================
   v18 — лёгкий сдвиг hero-композиции влево
   ===================================================================== */
@media (min-width: 921px){
  .hero-poster__word{
    transform:translate(-4.6vw, 2vh);
  }

  .hero-poster__panel{
    right:clamp(58px, 12vw, 190px);
  }

  .hero-poster__subline{
    left:clamp(0px, 5.2vw, 82px);
  }
}

@media (min-width: 1400px){
  .hero-poster__word{
    transform:translate(-5.2vw, 2vh);
  }

  .hero-poster__panel{
    right:clamp(96px, 13vw, 220px);
  }
}

/* =====================================================================
   v19 — подпись hero по центру под главным словом
   ===================================================================== */
.hero-colizeum__subline{
  left:50%;
  right:auto;
  transform:translateX(-50%);
  text-align:center;
  white-space:nowrap;
}

@media (max-width:860px){
  .hero-colizeum__subline{
    justify-self:center;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
    transform:none;
  }
}

@media (max-width:560px){
  .hero-colizeum__subline{
    width:100%;
    white-space:normal;
  }
}

/* =====================================================================
   v20 — возвращаем подпись как была и центрируем всю hero-композицию
   ===================================================================== */
.hero-colizeum__inner{
  width:100%;
  max-width:none;
  padding-left:16px;
  padding-right:16px;
}

.hero-colizeum__poster{
  margin-left:auto;
  margin-right:auto;
  left:auto;
  right:auto;
}

.hero-colizeum__subline{
  left:clamp(10px, 2.2vw, 32px);
  right:auto;
  bottom:clamp(42px, 6.6vw, 94px);
  transform:none;
  text-align:left;
  white-space:normal;
}

@media (min-width: 921px){
  .hero-colizeum__poster{
    width:min(1540px, calc(100vw - 56px));
    transform:translateY(-4.2vh);
  }

  .hero-colizeum__word{
    transform:scaleX(1.13) scaleY(1.07);
    transform-origin:center center;
  }

  .hero-colizeum__panel{
    right:clamp(24px, 5.2vw, 96px);
  }
}

@media (min-width: 1400px){
  .hero-colizeum__poster{
    width:min(1640px, calc(100vw - 72px));
  }

  .hero-colizeum__panel{
    right:clamp(40px, 6vw, 112px);
  }
}

@media (max-width: 920px){
  .hero-colizeum__inner{
    max-width:1180px;
  }

  .hero-colizeum__subline{
    justify-self:start;
    margin:22px 0 18px;
    text-align:left;
    transform:none;
  }
}


/* ===== v23 local polish ===== */
.cyber-step h3,
.steps-card h3,
.about-card h3,
.flip-card__face h3{
  white-space:nowrap;
  font-size:clamp(.98rem, 1.15vw, 1.18rem) !important;
  line-height:1.12 !important;
  word-break:normal;
  overflow-wrap:normal;
}

.home-stat,
.stat-card,
.stats-grid .stat{
  border-radius:28px !important;
  transition:
    transform .55s cubic-bezier(.16,1,.3,1),
    border-color .55s cubic-bezier(.16,1,.3,1),
    box-shadow .55s cubic-bezier(.16,1,.3,1) !important;
}

.home-stat:hover,
.stat-card:hover,
.stats-grid .stat:hover{
  transform:translateY(-8px) scale(1.012);
}


/* ===== v24 exact fix for "Как начать играть" cards ===== */
.start-step-card{
  padding:clamp(22px, 2vw, 28px) !important;
  min-width:0;
  overflow:hidden;
}

.start-step-card__num{
  font-family:var(--font-display) !important;
  font-size:clamp(1.55rem, 2.2vw, 2rem) !important;
  line-height:.95 !important;
  font-weight:800 !important;
  letter-spacing:-.04em !important;
  margin:0 0 10px !important;
}

.start-step-card h3{
  margin:0 0 12px !important;
  display:block;
  max-width:100%;
  white-space:nowrap !important;
  overflow:visible;
  text-overflow:clip;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
  font-family:var(--font-display) !important;
  font-size:clamp(.86rem, .98vw, 1.03rem) !important;
  line-height:1.08 !important;
  letter-spacing:-.06em !important;
}

.start-step-card p{
  margin:0 !important;
  font-size:clamp(.86rem, .95vw, .98rem) !important;
  line-height:1.55 !important;
}

/* В этом блоке даём карточкам чуть больше воздуха, чтобы длинные заголовки не переносились */
.section-sm .grid.grid-4:has(.start-step-card){
  grid-template-columns:repeat(4, minmax(245px, 1fr)) !important;
  gap:clamp(16px, 1.6vw, 22px) !important;
}

@media (max-width: 1120px){
  .section-sm .grid.grid-4:has(.start-step-card){
    grid-template-columns:repeat(2, minmax(245px, 1fr)) !important;
  }
}

@media (max-width: 620px){
  .section-sm .grid.grid-4:has(.start-step-card){
    grid-template-columns:1fr !important;
  }

  .start-step-card h3{
    font-size:1rem !important;
  }
}
