.xh34{
  --red:#d71920;
  position:relative;
  width:100%;
  height:calc(100vh - 74px);
  min-height:690px;
  max-height:900px;
  overflow:hidden;
  background:#0a0b0d;
  color:#fff;
  isolation:isolate;
}
.xh34,.xh34 *{box-sizing:border-box}
.xh34__seo{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

.xh34__brand{
  position:absolute;z-index:30;top:24px;left:30px;display:flex;align-items:baseline;gap:8px;
  pointer-events:none;text-shadow:0 2px 14px rgba(0,0,0,.5)
}
.xh34__brand b{font-size:38px;line-height:1;color:var(--red);font-weight:900}
.xh34__brand strong{font-size:27px;color:#fff;font-weight:700}
.xh34__brand small{font-size:9px;letter-spacing:.22em;color:rgba(255,255,255,.82)}

.xh34__panels{position:absolute;inset:0;display:flex}
.xh34__panel{
  position:relative;flex:1 1 0;min-width:0;overflow:hidden;cursor:pointer;outline:none;
  border-right:1px solid rgba(255,255,255,.14);
  transition:flex-grow .72s cubic-bezier(.22,.61,.36,1)
}
.xh34__panel:last-child{border-right:0}
.xh34__panel.is-active{flex-grow:5.7}
.xh34__panel img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
  transform:scale(1.035);transition:transform .9s cubic-bezier(.22,.61,.36,1),filter .45s ease
}
.xh34__panel:not(.is-active) img{filter:brightness(.44) saturate(.68)}
.xh34__panel.is-active img{filter:brightness(.9) saturate(.96);transform:scale(1)}
.xh34__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,6,8,.08),rgba(5,6,8,.04) 45%,rgba(5,6,8,.62) 100%)}
.xh34__panel:not(.is-active) .xh34__shade{background:rgba(5,6,8,.42)}

.xh34__rail{
  position:absolute;
  z-index:10;
  left:50%;
  top:50%;
  display:flex;
  align-items:center;
  gap:12px;
  width:max-content;
  max-width:60vh;
  transform:translate(-50%,-50%) rotate(-90deg);
  transform-origin:center;
  text-shadow:0 2px 12px rgba(0,0,0,.72);
  transition:opacity .25s ease;
}
.xh34__rail span{flex:0 0 auto;font-size:11px;color:var(--red);font-weight:800}
.xh34__rail strong{
  display:block;max-width:54vh;overflow:hidden;text-overflow:ellipsis;
  font-size:16px;line-height:1.15;font-weight:620;white-space:nowrap;letter-spacing:-.01em
}
.xh34__panel.is-active .xh34__rail{opacity:0}

.xh34__copy{
  position:absolute;z-index:12;left:44px;bottom:110px;max-width:min(640px,72%);
  opacity:0;transform:translateY(16px);
  transition:opacity .35s ease .18s,transform .35s ease .18s
}
.xh34__panel.is-active .xh34__copy{opacity:1;transform:translateY(0)}
.xh34__count{display:block;margin-bottom:14px;font-size:10px;letter-spacing:.12em;color:rgba(255,255,255,.8)}
.xh34__copy h2{
  margin:0 0 13px;color:#fff;font-size:clamp(34px,4vw,60px);line-height:1.02;font-weight:540;
  letter-spacing:-.045em;text-shadow:0 3px 18px rgba(0,0,0,.52)
}
.xh34__copy p{
  max-width:560px;margin:0 0 19px;color:rgba(255,255,255,.92);
  font-size:clamp(13px,1.15vw,16px);line-height:1.55;text-shadow:0 2px 12px rgba(0,0,0,.55)
}
.xh34__copy a{
  display:inline-flex;align-items:center;gap:18px;min-height:48px;padding:0 19px;
  background:var(--red);color:#fff!important;text-decoration:none!important;
  font-size:11px;font-weight:760;letter-spacing:.06em
}
.xh34__copy a:hover{background:#b60b12}

.xh34__controls{position:absolute;z-index:25;right:26px;bottom:78px;display:flex;align-items:center;gap:9px}
.xh34__dots{display:flex;gap:7px;width:220px;margin-right:10px}
.xh34__dots button{flex:1;height:2px;border:0;padding:0;background:rgba(255,255,255,.38);cursor:pointer}
.xh34__dots button.is-active{background:var(--red)}
.xh34__controls>[data-prev],.xh34__controls>[data-next]{
  width:40px;height:40px;border:1px solid rgba(255,255,255,.46);border-radius:50%;
  background:rgba(5,6,8,.35);color:#fff;cursor:pointer
}
.xh34__controls>[data-prev]:hover,.xh34__controls>[data-next]:hover{background:var(--red);border-color:var(--red)}

.xh34__footer{
  position:absolute;z-index:20;left:0;right:0;bottom:0;min-height:60px;padding:0 30px;
  display:grid;grid-template-columns:1.2fr 1fr 1.2fr;align-items:center;gap:22px;
  border-top:1px solid rgba(255,255,255,.2);background:rgba(4,5,7,.52);backdrop-filter:blur(8px);
  font-size:10px;letter-spacing:.05em;color:rgba(255,255,255,.9)
}
.xh34__footer span:last-child{text-align:right}

@media (hover:hover) and (min-width:981px){
  .xh34__panel:hover{flex-grow:5.7}
  .xh34__panels:hover .xh34__panel:not(:hover){flex-grow:1}
  .xh34__panel:hover img{filter:brightness(.9) saturate(.96);transform:scale(1)}
  .xh34__panel:hover .xh34__rail{opacity:0}
  .xh34__panel:hover .xh34__copy{opacity:1;transform:translateY(0)}
}
@media(max-width:980px){
  .xh34{height:auto;min-height:0;max-height:none;padding-bottom:52px}
  .xh34__brand{top:15px;left:17px}
  .xh34__brand b{font-size:30px}.xh34__brand strong{font-size:22px}.xh34__brand small{font-size:8px}
  .xh34__panels{position:relative;display:block}
  .xh34__panel{display:none;width:100%;aspect-ratio:16/9;border:0}
  .xh34__panel.is-active{display:block}
  .xh34__panel img{transform:none;filter:brightness(.84) saturate(.92)}
  .xh34__rail{display:none}
  .xh34__copy{left:20px;bottom:24px;max-width:78%;opacity:1;transform:none}
  .xh34__copy h2{font-size:clamp(28px,6vw,44px)}
  .xh34__copy p{font-size:13px;line-height:1.5;margin-bottom:15px}
  .xh34__copy a{min-height:43px;font-size:10px}
  .xh34__controls{left:17px;right:17px;bottom:7px}
  .xh34__dots{flex:1;width:auto}
  .xh34__controls>[data-prev],.xh34__controls>[data-next]{width:35px;height:35px}
  .xh34__footer{display:none}
}
@media(max-width:620px){
  .xh34__panel{aspect-ratio:4/3}
  .xh34__copy{left:15px;right:15px;bottom:18px;max-width:none}
  .xh34__copy h2{font-size:27px;max-width:90%;margin-bottom:12px}
  .xh34__copy p{max-width:92%;font-size:12px;line-height:1.45;margin-bottom:12px}
}
@media(prefers-reduced-motion:reduce){
  .xh34__panel,.xh34__panel img,.xh34__copy{transition:none!important}
}