@charset "UTF-8";

*,
:before,
:after {
  box-sizing: border-box
}

:where(ul, ol):where([class]) {
  padding-left: 0
}

body,
:where(blockquote, figure):where([class]) {
  margin: 0
}

:where(h1, h2, h3, h4, h5, h6, p, ul, ol, dl):where([class]) {
  margin-block: 0
}

:where(dd[class]) {
  margin-left: 0
}

:where(fieldset[class]) {
  margin-left: 0;
  padding: 0;
  border: none
}

:where(ul[class]) {
  list-style: none
}

:where(address[class]) {
  font-style: normal
}

p {
  --paragraphMarginBottom: 1.5rem;
  margin-block: 0
}

p:where(:not([class]):not(:last-child)) {
  margin-bottom: var(--paragraphMarginBottom)
}

img,
video {
  display: block;
  max-width: 100%;
  height: auto
}

input,
textarea,
select,
button {
  font: inherit
}

html {
  height: 100%;
  scrollbar-gutter: stable
}

html,
:has(:target) {
  scroll-behavior: smooth
}

body {
  min-height: 100%;
  line-height: 1.5
}

a:where([class]) {
  display: inline-flex
}

button,
label {
  cursor: pointer
}

:where([fill]:not([fill=none], [fill^=url])) {
  fill: currentColor
}

:where([stroke]:not([stroke=none], [stroke^=url])) {
  stroke: currentColor
}

svg * {
  transition-property: fill, stroke
}

:where(table) {
  border-collapse: collapse;
  border-color: currentColor
}

@media (prefers-reduced-motion: reduce) {

  *,
  :before,
  :after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important
  }
}

@font-face {
  font-family: Manrope;
  src: url("../assets/fonts/Manrope-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: Manrope;
  src: url("../assets/fonts/Manrope-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: Manrope;
  src: url("../assets/fonts/Manrope-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: Manrope;
  src: url("../assets/fonts/Manrope-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap
}

:root {
  --color-white: #FFFFFF;
  --color-black: #000000;
  --color-red-45: #E50000;
  --color-red-50: #FF0000;
  --color-red-55: #FF1919;
  --color-red-60: #FF3333;
  --color-red-80: #FF9999;
  --color-red-90: #FFCCCC;
  --color-red-95: #FFE5E5;
  --color-red-99: #FFFAFA;
  --color-black-06: #0F0F0F;
  --color-black-08: #141414;
  --color-black-10: #1A1A1A;
  --color-black-12: #1F1F1F;
  --color-black-15: #262626;
  --color-black-20: #333333;
  --color-black-25: #404040;
  --color-black-30: #4C4C4C;
  --color-gray-60: #999999;
  --color-gray-65: #A6A6A6;
  --color-gray-70: #B3B3B3;
  --color-gray-75: #BFBFBF;
  --color-gray-90: #E4E4E7;
  --color-gray-95: #F1F1F3;
  --color-gray-97: #F7F7F8;
  --color-gray-99: #FCFCFD;
  --border: var(--border-width-s) solid var(--color-black-15);
  --border-width-xl: .375rem;
  --border-width-l: .25rem;
  --border-width-m: .1875rem;
  --border-width-s: .0625rem;
  --border-radius-l: .75rem;
  --border-radius-m: .625rem;
  --border-radius-s: .5rem;
  --border-radius-xs: .375rem;
  --border-radius-xxs: .3125rem;
  --border-radius-xxxs: .25rem;
  --font-family-base: "Manrope", sans-serif;
  --container-width: clamp(80rem, 0rem + 100vw, 100rem);
  --container-padding-x: 1rem;
  --section-padding-y: clamp(2.5rem, 1.7949380165rem + 2.8925619835vw, 4.6875rem);
  --transtition-duration: .2s;
  --transtition-duration-longer: .4s
}

.container {
  width: 100%;
  max-width: calc(var(--container-width) + var(--container-padding-x) * 2);
  margin-inline: auto;
  padding-inline: var(--container-padding-x)
}

.visually-hidden {
  position: absolute !important;
  width: .0625rem !important;
  height: .0625rem !important;
  margin: -.0625rem !important;
  border: 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
  clip-path: inset(100%) !important;
  clip: rect(0 0 0 0) !important;
  overflow: hidden !important
}

@media (width > 63.9375rem) {
  .visible-tablet {
    display: none !important
  }
}

@media (width <=63.9375rem) {
  .hidden-tablet {
    display: none !important
  }
}

@media (width > 47.9375rem) {
  .visible-mobile {
    display: none !important
  }
}

@media (width <=47.9375rem) {
  .hidden-mobile {
    display: none !important
  }
}

html.is-lock {
  overflow: hidden
}

body {
  font-size: clamp(.875rem, .7944214876rem + .3305785124vw, 1.125rem);
  display: flex;
  flex-direction: column;
  font-family: var(--font-family-base);
  color: var(--color-gray-60);
  background-color: var(--color-black-08)
}

main {
  flex-grow: 1
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  color: var(--color-white)
}

h1,
.h1 {
  font-size: clamp(1.75rem, 1.145661157rem + 2.479338843vw, 3.625rem);
  font-weight: 700
}

h2,
.h2 {
  font-size: clamp(1.5rem, 1.0165289256rem + 1.9834710744vw, 3rem);
  font-weight: 700
}

h3,
.h3 {
  font-size: clamp(1.25rem, .8873966942rem + 1.4876033058vw, 2.375rem);
  font-weight: 700
}

h4,
.h4 {
  font-size: clamp(1.125rem, 1.0041322314rem + .4958677686vw, 1.5rem);
  font-weight: 600
}

h5,
.h5 {
  font-size: clamp(1.125rem, 1.0444214876rem + .3305785124vw, 1.375rem);
  font-weight: 500
}

h6,
.h6 {
  font-size: clamp(1rem, .9194214876rem + .3305785124vw, 1.25rem);
  font-weight: 600
}

a,
button,
label,
input,
textarea,
select,
svg * {
  transition-duration: var(--transtition-duration)
}

a {
  color: inherit
}

@media (any-hover: hover) {
  a:hover {
    color: var(--color-red-45)
  }
}

@media (any-hover: none) {
  a:active {
    color: var(--color-red-45)
  }
}

a[class] {
  text-decoration: none
}

:focus-visible {
  outline: .125rem dashed var(--color-white);
  outline-offset: .25rem;
  transition-duration: 0s !important
}

:has(.swiper) {
  min-width: 0
}

.content {
  padding-top: clamp(2.5rem, 2.298553719rem + .826446281vw, 3.125rem);
  padding-bottom: var(--section-padding-y)
}

.content--reset-padding-top {
  padding-top: 0
}

.soc1als__list {
  display: flex;
  flex-wrap: wrap;
  gap: .625rem clamp(.625rem, -.375rem + 1.25vw, .875rem)
}

.button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  column-gap: .25rem;
  padding: clamp(.875rem, -.125rem + 1.25vw, 1.125rem) clamp(1.25rem, .25rem + 1.25vw, 1.5rem);
  font-weight: 600;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-red-45);
  border: none;
  border-radius: var(--border-radius-s);
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer
}

@media (any-hover: hover) {
  .button:hover {
    color: var(--color-white);
    background-color: var(--color-red-60)
  }
}

@media (any-hover: none) {
  .button:active {
    color: var(--color-white);
    background-color: var(--color-red-60)
  }
}

@media (width <=90rem) {
  .button {
    border-radius: var(--border-radius-xs)
  }
}

.button:active {
  scale: 1.05
}

.button:disabled {
  color: var(color-gray-60);
  background-color: var(--color-black-06);
  pointer-events: none
}

.button:has(.button__icon:only-child) {
  width: clamp(2.75rem, -.25rem + 3.75vw, 3.5rem);
  height: clamp(2.75rem, -.25rem + 3.75vw, 3.5rem);
  padding: 0
}

.button--transparent {
  background-color: transparent
}

.button--transparent:has(.button__icon:only-child) {
  width: 2.75rem;
  height: 2.75rem
}

.button--transparent:has(.button__icon:only-child) .button__icon {
  --iconSize: clamp(1.5rem, -1rem + 3.125vw, 2.125rem)
}

.button--black-06,
.button--black-08,
.button--black-10 {
  border: var(--border)
}

.button--black-06 {
  background-color: var(--color-black-06)
}

.button--black-08 {
  background-color: var(--color-black-08)
}

.button--black-10 {
  background-color: var(--color-black-10)
}

.icon {
  --iconSize: clamp(1.5rem, .5rem + 1.25vw, 1.75rem);
  width: var(--iconSize);
  height: var(--iconSize);
  display: inline-flex
}

.footer {
  background-color: var(--color-black-06)
}

.footer__menu {
  --footerMenuColumns: 6;
  display: grid;
  grid-template-columns: repeat(var(--footerMenuColumns), 1fr);
  gap: 30 clamp(.625rem, .222107438rem + 1.652892562vw, 1.875rem);
  padding-block: clamp(3.125rem, 2.117768595rem + 4.132231405vw, 6.25rem);
  border-bottom: var(--border)
}

@media (width <=90rem) {
  .footer__menu {
    --footerMenuColumns: 3
  }
}

@media (width <=47.9375rem) {
  .footer__menu {
    --footerMenuColumns: 2
  }
}

.footer__menu-column {
  display: flex;
  flex-direction: column;
  align-items: start;
  row-gap: clamp(1rem, .8388429752rem + .6611570248vw, 1.5rem)
}

.footer__menu-list {
  display: flex;
  flex-direction: column;
  align-items: start;
  row-gap: clamp(.5rem, .3791322314rem + .4958677686vw, .875rem)
}

.footer__extra {
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: 1rem;
  padding-top: clamp(1.25rem, .25rem + 1.25vw, 1.5rem);
  padding-bottom: clamp(1.25rem, .645661157rem + 2.479338843vw, 3.125rem)
}

@media (width <=47.9375rem) {
  .footer__extra {
    flex-direction: column;
    row-gap: 1.25rem
  }
}

.footer__extra-links {
  display: flex;
  align-items: center;
  flex-wrap: wrap
}

.footer__extra-link:not(:last-child) {
  align-items: center
}

.footer__extra-link:not(:last-child):after {
  content: "";
  height: 1em;
  margin-inline: clamp(1rem, 0rem + 1.25vw, 1.25rem);
  border-right: var(--border)
}

.logo {
  width: clamp(7.25rem, 5.5779958678rem + 6.8595041322vw, 12.4375rem)
}

.header {
  position: sticky;
  z-index: 100;
  top: 0;
  width: 100%;
  padding-block: clamp(.875rem, .7138429752rem + .6611570248vw, 1.375rem);
  border-bottom: var(--border-width-s) solid transparent;
  animation-name: scrolling-header;
  animation-fill-mode: both;
  animation-timeline: scroll();
  animation-range: 0 6.25rem
}

@keyframes scrolling-header {
  to {
    padding-block: .625rem;
    background-color: var(--color-black-08);
    border-color: var(--color-black-15)
  }
}

.header.is-fixed {
  position: fixed
}

.header__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: 1rem
}

.header__overlay-menu-dialog {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: column-reverse;
  justify-content: start;
  row-gap: 1rem;
  width: 100%;
  height: 100%;
  padding: var(--container-padding-x);
  background-color: var(--color-black-20);
  border: none;
  transition-duration: var(--transtition-duration);
  transition-behavior: allow-discrete
}

@media (width > 63.9375rem) {
  .header__overlay-menu-dialog {
    display: contents
  }
}

.header__overlay-menu-dialog[open] {
  display: flex
}

@starting-style {
  .header__overlay-menu-dialog[open] {
    opacity: 0;
    translate: 50%
  }
}

.header__overlay-menu-dialog:not([open]) {
  opacity: 0;
  translate: 50%
}

.header__menu {
  border-radius: var(--border-radius-l)
}

@media (width <=90rem) {
  .header__menu {
    border-radius: var(--border-radius-m)
  }
}

@media (width > 63.9375rem) {
  .header__menu {
    padding: clamp(.5rem, 0rem + .625vw, .625rem);
    background-color: var(--color-black-06);
    outline: var(--border-width-l) solid var(--color-black-12)
  }
}

@media (width <=63.9375rem) {
  .header__menu {
    display: flex;
    justify-content: center;
    height: 100%;
    border-radius: 0;
    overflow-y: auto
  }
}

.header__menu-list {
  display: flex;
  align-items: center;
  column-gap: .375rem
}

@media (width <=63.9375rem) {
  .header__menu-list {
    flex-direction: column;
    row-gap: 1rem;
    margin-block: auto
  }
}

.header__menu-link {
  padding: clamp(.75rem, .25rem + .625vw, .875rem) clamp(1.25rem, .25rem + 1.25vw, 1.5rem);
  color: var(--color-gray-75);
  border-radius: var(--border-radius-s)
}

@media (width <=63.9375rem) {
  .header__menu-link {
    font-size: 1.25rem
  }
}

@media (any-hover: hover) {
  .header__menu-link:hover {
    color: var(--color-white);
    background-color: var(--color-red-60)
  }
}

@media (any-hover: none) {
  .header__menu-link:active {
    color: var(--color-white);
    background-color: var(--color-red-60)
  }
}

.header__menu-link.is-active {
  font-weight: 500;
  color: var(--color-white);
  background-color: var(--color-black-10);
  pointer-events: none
}

.header__actions {
  display: flex;
  align-items: center;
  column-gap: .625rem
}

.header__burger-button {
  position: relative
}

.burger-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 3.1875rem;
  height: 3.1875rem;
  padding: 0;
  background-color: var(--color-black-10);
  border: var(--border-width-m) solid var(--color-black-15);
  border-radius: var(--border-radius-xs)
}

@media (any-hover: hover) {
  .burger-button:hover {
    background-color: var(--color-red-60);
    border-color: transparent
  }
}

@media (any-hover: none) {
  .burger-button:active {
    background-color: var(--color-red-60);
    border-color: transparent
  }
}

.burger-button.is-active .burger-button__line {
  stroke-dasharray: 90 207;
  stroke-dashoffset: -134
}

.burger-button.is-active .burger-button__line--2 {
  stroke-dasharray: 1 60;
  stroke-dashoffset: -30
}

.burger-button:not(.is-active) .burger-button__line--3 {
  stroke-dasharray: 30 207;
  stroke-dashoffset: -30
}

.burger-button__line {
  fill: none;
  stroke: var(--color-white);
  stroke-width: 6;
  stroke-linecap: round;
  stroke-dasharray: 60 207;
  transition: stroke-dasharray var(--transtition-duration-longer) cubic-bezier(.4, 0, .2, 1), stroke-dashoffset var(--transtition-duration-longer) cubic-bezier(.4, 0, .2, 1)
}

.burger-button__line--2 {
  stroke-dasharray: 60 60
}

.banner {
  padding-block: var(--section-padding-y)
}

.banner__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: 6.25rem;
  padding: clamp(3.125rem, 2.117768595rem + 4.132231405vw, 6.25rem) clamp(1.875rem, .867768595rem + 4.132231405vw, 5rem);
  background: linear-gradient(90deg, var(--color-black-06) 2.42%, rgba(20, 15, 15, .97) 25.46%, rgba(34, 14, 14, .91) 46.72%, rgba(229, 0, 0, 0) 168.98%), url("../assets/images/bg.png") center/cover no-repeat;
  border: var(--border);
  border-radius: var(--border-radius-l)
}

@media (width <=63.9375rem) {
  .banner__inner {
    flex-direction: column;
    row-gap: 3.125rem;
    text-align: center
  }
}

@media (width <=30rem) {
  .banner__inner {
    background: linear-gradient(135deg, var(--color-black-06) .42%, rgba(20, 15, 15, .97) 25.46%, rgba(34, 14, 14, .91) 46.72%, rgba(229, 0, 0, 0) 168.98%), url("../assets/images/bg_mobile.png") center/cover no-repeat
  }
}

.banner__body {
  display: grid;
  row-gap: clamp(.625rem, .5444214876rem + .3305785124vw, .875rem)
}

.banner__button {
  flex-shrink: 0
}

.category-card {
  --categoryCardImagesGradientOpacity: 1;
  display: flex;
  flex-direction: column;
  padding: clamp(1.25rem, 1.048553719rem + .826446281vw, 1.875rem);
  background-color: var(--color-black-10);
  border: var(--border);
  border-radius: var(--border-radius-l)
}

@media (width <=90rem) {
  .category-card {
    border-radius: var(--border-radius-m)
  }
}

@media (any-hover: hover) {
  .category-card:hover {
    --categoryCardImagesGradientOpacity: 0;
    color: var(--color-white);
    border-color: currentColor
  }
}

@media (any-hover: none) {
  .category-card:active {
    --categoryCardImagesGradientOpacity: 0;
    color: var(--color-white);
    border-color: currentColor
  }
}

.category-card:focus-visible {
  outline-offset: -.125rem
}

.category-card__images {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .3125rem
}

.category-card__images:after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: "";
  background-image: linear-gradient(180deg, rgba(26, 26, 26, 0) 0%, var(--color-black-10) 101.79%);
  opacity: var(--categoryCardImagesGradientOpacity);
  transition-duration: var(--transtition-duration)
}

.category-card__image {
  width: 100%;
  object-fit: cover;
  border-radius: var(--border-radius-m)
}

@media (width <=90rem) {
  .category-card__image {
    border-radius: var(--border-radius-xs)
  }
}

.category-card__body {
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: .625rem
}

.category-card__title {
  display: flex;
  flex-direction: column;
  align-items: start;
  row-gap: clamp(.125rem, -.375rem + .625vw, .25rem);
  font-size: inherit;
  font-weight: 600
}

.category-card__icon.icon {
  --iconSize: clamp(1.25rem, 1.048553719rem + .826446281vw, 1.875rem)
}

.badge {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  column-gap: .125rem;
  padding: .375rem .625rem;
  font-size: clamp(.75rem, .25rem + .625vw, .875rem);
  font-weight: 500;
  line-height: 1;
  color: var(--color-gray-60);
  white-space: nowrap;
  background-color: var(--color-black-08);
  border: var(--border);
  border-radius: 3.125rem
}

@media (width <=47.9375rem) {
  .badge {
    padding-inline: .5rem
  }
}

.badge--accent {
  color: var(--color-white);
  background-color: var(--color-red-45);
  border: none;
  border-radius: var(--border-radius-xxs)
}

@media (width <=90rem) {
  .badge--accent {
    border-radius: var(--border-radius-xxxs)
  }
}

.badge--big {
  padding: clamp(.5rem, 0rem + .625vw, .625rem);
  font-size: clamp(.75rem, -.25rem + 1.25vw, 1rem);
  font-weight: 600
}

.badge__icon.icon {
  --iconSize: clamp(1.25rem, .25rem + 1.25vw, 1.5rem)
}

@font-face {
  font-family: swiper-icons;
  src: url(data:application/font-woff;charset=utf-8;base64,\ d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA);
  font-weight: 400;
  font-style: normal
}

:root {
  --swiper-theme-color: #007aff
}

:host {
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  z-index: 1
}

.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
  display: block
}

.swiper-vertical>.swiper-wrapper {
  flex-direction: column
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
  box-sizing: content-box
}

.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
  transform: translateZ(0)
}

.swiper-horizontal {
  touch-action: pan-y
}

.swiper-vertical {
  touch-action: pan-x
}

.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
  display: block
}

.swiper-slide-invisible-blank {
  visibility: hidden
}

.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto
}

.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height
}

.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden
}

.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 75rem
}

.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d
}

.swiper-3d {
  perspective: 75rem
}

.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
  transform-style: preserve-3d
}

.swiper-css-mode>.swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none
}

.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar {
  display: none
}

.swiper-css-mode>.swiper-wrapper>.swiper-slide {
  scroll-snap-align: start start
}

.swiper-css-mode.swiper-horizontal>.swiper-wrapper {
  scroll-snap-type: x mandatory
}

.swiper-css-mode.swiper-vertical>.swiper-wrapper {
  scroll-snap-type: y mandatory
}

.swiper-css-mode.swiper-free-mode>.swiper-wrapper {
  scroll-snap-type: none
}

.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide {
  scroll-snap-align: none
}

.swiper-css-mode.swiper-centered>.swiper-wrapper:before {
  content: "";
  flex-shrink: 0;
  order: 9999
}

.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide {
  scroll-snap-align: center center;
  scroll-snap-stop: always
}

.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child {
  margin-inline-start: var(--swiper-centered-offset-before)
}

.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before {
  height: 100%;
  min-height: .0625rem;
  width: var(--swiper-centered-offset-after)
}

.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child {
  margin-block-start: var(--swiper-centered-offset-before)
}

.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before {
  width: 100%;
  min-width: .0625rem;
  height: var(--swiper-centered-offset-after)
}

.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10
}

.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, .15)
}

.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-lazy-preloader {
  width: 2.625rem;
  height: 2.625rem;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -1.3125rem;
  margin-top: -1.3125rem;
  z-index: 10;
  transform-origin: 50%;
  box-sizing: border-box;
  border: .25rem solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent
}

.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
  animation: swiper-preloader-spin 1s infinite linear
}

.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff
}

.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000
}

@keyframes swiper-preloader-spin {
  0% {
    transform: rotate(0)
  }

  to {
    transform: rotate(360deg)
  }
}

.slider {
  position: relative
}

@media (width <=30rem) {
  .slider--beyond-the-viewport-on-mobile-s {
    width: calc(100vw - var(--container-padding-x))
  }
}

.slider__scrollbar {
  position: absolute;
  left: 50%;
  translate: -50%;
  top: calc(100% + 1.5rem);
  width: 5rem;
  height: .3125rem;
  background-color: var(--color-black-20);
  border-radius: 1.25rem
}

.slider__scrollbar-drag {
  height: 100%;
  background-color: var(--color-red-45);
  border-radius: inherit
}

.slider__navigation {
  margin-top: clamp(1.5rem, 1.1776859504rem + 1.3223140496vw, 2.5rem)
}

.slider__navigation.slider-navigation {
  justify-content: space-between
}

.slider__item {
  width: auto
}

.slider-navigation {
  display: flex;
  justify-content: center;
  align-items: center
}

.slider-navigation--tile {
  column-gap: clamp(.75rem, -.25rem + 1.25vw, 1rem);
  padding: clamp(.75rem, -.25rem + 1.25vw, 1rem);
  background-color: var(--color-black-06);
  border: var(--border);
  border-radius: var(--border-radius-l)
}

@media (width <=90rem) {
  .slider-navigation--tile {
    border-radius: var(--border-radius-m)
  }
}

.slider-navigation--rounded {
  column-gap: clamp(.5rem, 0rem + .625vw, .625rem)
}

.slider-navigation--rounded .slider-navigation__arrow-button {
  border-radius: 50%
}

.slider-navigation--space-between {
  justify-content: space-between
}

.slider-navigation--abs-bottom {
  position: absolute;
  z-index: 1;
  inset-inline: clamp(2.5rem, 0rem + 3.125vw, 3.125rem);
  bottom: clamp(1rem, 0rem + 1.25vw, 1.25rem)
}

.slider-navigation__pagination {
  display: flex;
  column-gap: .1875rem
}

.slider-navigation__pagination-bullet {
  width: 1rem;
  height: .25rem;
  background-color: var(--color-black-20);
  border-radius: 6.25rem;
  transition-duration: var(--transition-duration)
}

.slider-navigation__pagination-bullet.is-active {
  width: 1.4375rem;
  background-color: var(--color-red-45)
}

.section {
  display: grid;
  padding-block: var(--section-padding-y);
  row-gap: clamp(2.5rem, 1.694214876rem + 3.305785124vw, 5rem)
}

.section__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: 1rem
}

@media (width <=47.9375rem) {
  .section__header {
    flex-direction: column;
    align-items: start;
    row-gap: 1.25rem
  }
}

.section__header:has(.section__description) {
  align-items: end
}

@media (width <=47.9375rem) {
  .section__header:has(.section__description) {
    align-items: start
  }
}

.section__info {
  display: grid;
  row-gap: clamp(.625rem, -.375rem + 1.25vw, .875rem)
}

.device-card {
  display: grid;
  row-gap: clamp(1.25rem, 1.048553719rem + .826446281vw, 1.875rem);
  padding: clamp(1.5rem, .9762396694rem + 2.1487603306vw, 3.125rem);
  border: var(--border);
  border-radius: var(--border-radius-l);
  background: linear-gradient(222deg, rgba(229, 0, 0, .5) -208.03%, rgba(229, 0, 0, 0) 41.32%), var(--color-black-06)
}

@media (width <=90rem) {
  .device-card {
    border-radius: var(--border-radius-m)
  }
}

.device-card__header {
  display: flex;
  align-items: center;
  column-gap: clamp(.625rem, .5041322314rem + .4958677686vw, 1rem)
}

.device-card__image-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  width: clamp(2.75rem, 2.1859504132rem + 2.3140495868vw, 4.5rem);
  height: clamp(2.75rem, 2.1859504132rem + 2.3140495868vw, 4.5rem);
  background-color: var(--color-black-08);
  border: var(--border-width-s) solid var(--color-black-12);
  border-radius: var(--border-radius-l)
}

@media (width <=90rem) {
  .device-card__image-wrapper {
    border-radius: var(--border-radius-m)
  }
}

@media (width <=47.9375rem) {
  .device-card__image-wrapper {
    border-radius: var(--border-radius-s)
  }
}

.device-card__image {
  width: 55%;
  object-fit: contain
}

.grid {
  --gridColumns: 1;
  display: grid;
  grid-template-columns: repeat(var(--gridColumns), 1fr);
  gap: clamp(1.25rem, -1.25rem + 3.125vw, 1.875rem)
}

@media (width <=63.9375rem) {
  .grid .grid__item:nth-child(odd):last-child {
    grid-column: -1/1
  }
}

.grid--2 {
  --gridColumns: 2
}

.grid--3 {
  --gridColumns: 3
}

@media (width <=63.9375rem) {
  .grid--3 {
    --gridColumns: 2
  }

  .grid--3 .grid__item:nth-child(odd):last-child {
    grid-column: -1/1
  }
}

@media (width <=47.9375rem) {
  .grid--3 {
    --gridColumns: 1
  }
}

.hero {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  padding-bottom: var(--section-padding-y);
  text-align: center
}

@media (width <=47.9375rem) {
  .hero {
    min-height: 39.9375rem
  }
}

.hero__pano {
  --heroGradientColorStart: var(--color-black-08);
  --heroGradientColorEnd: rgb(20 20 20 / 0);
  --heroGradientHeight: 67.5%;
  --heroGradientTop: linear-gradient(to bottom, var(--heroGradientColorStart) 0%, var(--heroGradientColorEnd) 100%) 50% 0/100% var(--heroGradientHeight);
  --heroGradientBottom: linear-gradient(to top, var(--heroGradientColorStart) 0%, var(--heroGradientColorEnd) 100%) 50% 101%/100% var(--heroGradientHeight);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
  padding-top: clamp(9.375rem, 8.4684917355rem + 3.7190082645vw, 12.1875rem);
  padding-bottom: clamp(3.125rem, 1.493285124rem + 6.694214876vw, 8.1875rem);
  background: var(--heroGradientTop), var(--heroGradientBottom), url("../assets/images/bg2.png") 50%/cover;
  background-repeat: no-repeat
}

.hero__play-button {
  width: clamp(12.5rem, 7.0609504132rem + 22.3140495868vw, 29.375rem);
  height: clamp(12.5rem, 7.0609504132rem + 22.3140495868vw, 29.375rem);
  padding: 0;
  background-color: transparent;
  border: none
}

.hero__title {
  margin-top: -.5em;
  margin-bottom: clamp(.625rem, -.375rem + 1.25vw, .875rem)
}

.hero__description {
  margin-bottom: clamp(1.875rem, 1.472107438rem + 1.652892562vw, 3.125rem)
}

.hero__body {
  padding-bottom: clamp(1.25rem, .645661157rem + 2.479338843vw, 3.125rem)
}

.plan-card {
  display: flex;
  flex-direction: column;
  row-gap: clamp(1.875rem, 1.472107438rem + 1.652892562vw, 3.125rem);
  height: 100%;
  padding: clamp(1.5rem, .9762396694rem + 2.1487603306vw, 3.125rem);
  background-color: var(--color-black-10);
  border: var(--border);
  border-radius: var(--border-radius-l)
}

@media (width <=90rem) {
  .plan-card {
    border-radius: var(--border-radius-m)
  }
}

.plan-card__info {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  row-gap: clamp(.625rem, .5041322314rem + .4958677686vw, 1rem)
}

.plan-card__conditions {
  display: flex;
  align-items: end;
  column-gap: clamp(.125rem, -.375rem + .625vw, .25rem);
  line-height: .73
}

.plan-card__price {
  font-size: clamp(1.5rem, 1.1776859504rem + 1.3223140496vw, 2.5rem);
  font-weight: 600;
  color: var(--color-white)
}

.plan-card__actions {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: clamp(.75rem, -1.25rem + 2.5vw, 1.25rem)
}

.tabs-navigation {
  --tabsNavigationActiveButtonWidth: 0;
  --tabsNavigationActiveButtonOffsetLeft: 0;
  --tabsNavigationPadding: clamp(.5rem, 0rem + .625vw, .625rem);
  position: relative;
  display: var(--tabsNavigationDisplay, flex);
  padding: var(--tabsNavigationPadding);
  border: var(--border);
  border-radius: var(--border-radius-m)
}

@media (width <=90rem) {
  .tabs-navigation {
    border-radius: var(--border-radius-s)
  }
}

.tabs-navigation:before {
  content: "";
  position: absolute;
  top: var(--tabsNavigationPadding);
  left: 0;
  width: var(--tabsNavigationActiveButtonWidth);
  height: calc(100% - var(--tabsNavigationPadding) * 2);
  background-color: var(--color-black-12);
  border-radius: var(--border-radius-m);
  transition-duration: var(--transtition-duration);
  translate: var(--tabsNavigationActiveButtonOffsetLeft)
}

@media (width <=90rem) {
  .tabs-navigation:before {
    border-radius: var(--border-radius-xs)
  }
}

.tabs-navigation__button {
  flex-grow: 1;
  display: inline-flex;
  justify-content: center;
  position: relative;
  padding: clamp(.75rem, .25rem + .625vw, .875rem) clamp(1.25rem, .25rem + 1.25vw, 1.5rem);
  border-radius: var(--border-radius-m);
  transition-duration: var(--transtition-duration);
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none
}

@media (width <=90rem) {
  .tabs-navigation__button {
    border-radius: var(--border-radius-xs)
  }
}

@media (any-hover: hover) {
  .tabs-navigation__button:hover {
    color: var(--color-white)
  }
}

@media (any-hover: none) {
  .tabs-navigation__button:active {
    color: var(--color-white)
  }
}

.tabs-navigation__button.is-active {
  color: var(--color-white);
  pointer-events: none
}

.tabs {
  --tabsBodyRowGap: 0;
  --tabsNonActiveContentDisplay: none;
  display: grid;
  row-gap: 1.25rem
}

@media (width > 47.9375rem) {
  .tabs--enable-only-on-mobile {
    --tabsNonActiveContentDisplay: block;
    --tabsNavigationDisplay: none
  }
}

.tabs__body {
  display: grid;
  row-gap: var(--tabsBodyRowGap)
}

.tabs__content:not(.is-active) {
  display: var(--tabsNonActiveContentDisplay)
}

.accordion {
  width: 100%
}

.accordion:has(.accordion__arrow) .accordion__title {
  padding-right: 0
}

.accordion:has(.accordion__arrow) .accordion__title:before,
.accordion:has(.accordion__arrow) .accordion__title:after {
  display: none
}

.accordion__details[open] .accordion__title:after {
  rotate: 0deg
}

.accordion__details[open]+.accordion__content {
  grid-template-rows: 1fr
}

.accordion__details[open] .accordion__arrow {
  rotate: 180deg
}

.accordion__summary {
  color: var(--color-white);
  list-style: none;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none
}

@media (any-hover: hover) {
  .accordion__summary:hover {
    color: var(--color-red-45)
  }
}

@media (any-hover: none) {
  .accordion__summary:active {
    color: var(--color-red-45)
  }
}

.accordion__summary::-webkit-details-marker {
  display: none
}

.accordion__title {
  position: relative;
  display: flex;
  align-items: center;
  column-gap: clamp(.375rem, .2944214876rem + .3305785124vw, .625rem);
  padding-right: 3.125rem;
  min-height: var(--accordionGroupCounterHeight);
  color: inherit;
  transition-duration: var(--transtition-duration)
}

.accordion__title:before,
.accordion__title:after {
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  content: "";
  right: 0;
  width: clamp(1rem, 0rem + 1.25vw, 1.25rem);
  height: .15625rem;
  background-color: var(--color-white);
  border-radius: .625rem;
  transition-duration: var(--transtition-duration)
}

@media (width <=90rem) {

  .accordion__title:before,
  .accordion__title:after {
    height: .125rem
  }
}

.accordion__title:after {
  rotate: 90deg
}

.accordion__subtitle {
  font-size: .75em;
  font-weight: 500;
  color: var(--color-gray-60)
}

.accordion__arrow {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: clamp(2.75rem, .75rem + 2.5vw, 3.25rem);
  height: clamp(2.75rem, .75rem + 2.5vw, 3.25rem);
  margin-left: auto;
  color: var(--color-gray-60);
  background-color: var(--color-black-08);
  border: var(--border);
  border-radius: 50%;
  transition-duration: var(--transtition-duration)
}

.accordion__content {
  display: grid;
  grid-template-rows: 0fr;
  transition-duration: var(--transtition-duration-longer)
}

.accordion__content-inner {
  overflow: hidden
}

.accordion__content-body {
  margin-top: 1.25rem
}

.accordion-group--has-counter {
  --accordionGroupCounterHeight: clamp(2.875rem, 2.4519628099rem + 1.7355371901vw, 4.1875rem);
  counter-reset: custom-counter;
  list-style: none
}

.accordion-group--has-counter .accordion-group__item {
  display: flex;
  column-gap: clamp(1rem, 0rem + 1.25vw, 1.25rem);
  counter-increment: custom-counter
}

.accordion-group--has-counter .accordion-group__item:before {
  display: flex;
  justify-content: center;
  align-items: center;
  content: counter(custom-counter, decimal-leading-zero);
  font-size: clamp(1rem, 0rem + 1.25vw, 1.25rem);
  font-weight: 600;
  color: var(--color-white);
  min-width: clamp(2.625rem, 2.222107438rem + 1.652892562vw, 3.875rem);
  height: var(--accordionGroupCounterHeight);
  background-color: var(--color-black-12);
  border: var(--border);
  border-radius: var(--border-radius-m)
}

@media (width <=90rem) {
  .accordion-group--has-counter .accordion-group__item:before {
    border-radius: var(--border-radius-s)
  }
}

@media (width <=47.9375rem) {
  .accordion-group--has-counter .accordion-group__item:before {
    border-radius: var(--border-radius-xs)
  }
}

.accordion-group--dark {
  display: grid;
  row-gap: clamp(1rem, 0rem + 1.25vw, 1.25rem)
}

.accordion-group--dark .accordion-group__item {
  padding: clamp(1rem, .8388429752rem + .6611570248vw, 1.5rem) clamp(1.25rem, .645661157rem + 2.479338843vw, 3.125rem);
  background-color: var(--color-black-06);
  border: var(--border);
  border-radius: var(--border-radius-l)
}

@media (width <=90rem) {
  .accordion-group--dark .accordion-group__item {
    border-radius: var(--border-radius-m)
  }
}

.accordion-group--dark .accordion-group__item:after {
  display: none
}

.accordion-group--2-columns {
  column-gap: clamp(2.5rem, -7.5rem + 12.5vw, 5rem)
}

@media (width > 63.9375rem) {
  .accordion-group--2-columns {
    column-count: 2
  }
}

.accordion-group__item {
  padding: clamp(1.5rem, -1rem + 3.125vw, 2.125rem);
  break-inside: avoid-column
}

@media (width > 63.9375rem) {
  .accordion-group__item--last-columns-item:after {
    display: none
  }
}

@media (width <=63.9375rem) {
  .accordion-group__item {
    --accordionGroupItemPaddingY: 2.5rem;
    --accordionGroupItemHalfPaddingY: calc(var(--accordionGroupItemPaddingY) / 2);
    padding: var(--accordionGroupItemPaddingY) 0
  }

  .accordion-group__item:first-child {
    padding-top: var(--accordionGroupItemHalfPaddingY)
  }

  .accordion-group__item:last-child {
    padding-bottom: var(--accordionGroupItemHalfPaddingY)
  }
}

.accordion-group__item:not(:last-child) {
  position: relative
}

.accordion-group__item:not(:last-child):after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: .0625rem;
  background-image: linear-gradient(90deg, rgba(229, 0, 0, 0) 0%, var(--color-red-45) 16.67%, rgba(229, 0, 0, 0) 100%)
}

.movie-banner-card {
  position: relative;
  text-align: center;
  border: var(--border);
  border-radius: var(--border-radius-l);
  overflow: hidden
}

.movie-banner-card__image {
  width: 100%;
  min-height: clamp(29.25rem, 21.8569214876rem + 30.3305785124vw, 52.1875rem);
  object-fit: cover
}

.movie-banner-card__inner {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: center;
  row-gap: clamp(1.25rem, 1.048553719rem + .826446281vw, 1.875rem);
  padding: clamp(6.5rem, 1rem + 6.875vw, 7.875rem) clamp(1.5rem, .9762396694rem + 2.1487603306vw, 3.125rem);
  background-image: linear-gradient(0deg, var(--color-black-08) 0%, rgba(20, 20, 20, 0) 100%)
}

@media (width <=47.9375rem) {
  .movie-banner-card__inner {
    padding-block: 1rem
  }
}

.movie-banner-card__inner--small-padding-y {
  padding-block: clamp(1rem, 0rem + 1.25vw, 1.25rem)
}

.movie-banner-card__body {
  display: grid;
  row-gap: clamp(.125rem, -.375rem + .625vw, .25rem)
}

.movie-banner-card__description {
  max-width: clamp(60rem, -13.5rem + 91.875vw, 78.375rem)
}

.movie-banner-card__footer {
  display: flex;
  align-items: center;
  gap: 1.25rem
}

@media (width <=47.9375rem) {
  .movie-banner-card__footer {
    flex-direction: column;
    width: 100%
  }
}

@media (width <=30rem) {
  .movie-banner-card__play-button {
    width: 100%
  }
}

.movie-banner-card__actions {
  display: flex;
  column-gap: clamp(.5rem, 0rem + .625vw, .625rem)
}

.movie-details {
  --movieDetailsPaddingTop: clamp(3.75rem, 2.944214876rem + 3.305785124vw, 6.25rem);
  display: grid;
  gap: 1.25rem;
  padding-top: var(--movieDetailsPaddingTop);
  padding-bottom: var(--section-padding-y)
}

@media (width > 63.9375rem) {
  .movie-details {
    grid-template-columns: 1fr 32.5%
  }
}

@media (width <=63.9375rem) {
  .movie-details .movie-details__panel--description {
    order: -2
  }

  .movie-details .movie-details__info {
    order: -1
  }

  .movie-details .movie-details__panel--seasons {
    order: -3
  }
}

.movie-details__main {
  display: grid;
  row-gap: clamp(1.25rem, -1.25rem + 3.125vw, 1.875rem)
}

@media (width <=63.9375rem) {
  .movie-details__main {
    display: contents
  }
}

@media (width > 63.9375rem) {
  .movie-details__info {
    position: sticky;
    top: calc(var(--movieDetailsPaddingTop) + 1.25rem);
    align-self: start
  }
}

.movie-details__panel {
  display: grid;
  row-gap: clamp(1rem, .7179752066rem + 1.1570247934vw, 1.875rem);
  padding: clamp(1.5rem, .9762396694rem + 2.1487603306vw, 3.125rem);
  background-color: var(--color-black-10);
  border: var(--border);
  border-radius: var(--border-radius-l)
}

@media (width <=90rem) {
  .movie-details__panel {
    border-radius: var(--border-radius-m)
  }
}

.movie-details__panel--large-gap-y {
  row-gap: clamp(1.5rem, 1.1776859504rem + 1.3223140496vw, 2.5rem)
}

.movie-details__panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: .625rem
}

.movie-details__groups {
  display: grid;
  row-gap: clamp(1.25rem, 1.048553719rem + .826446281vw, 1.875rem)
}

.movie-details__group {
  display: grid;
  row-gap: clamp(.625rem, -.375rem + 1.25vw, .875rem)
}

.movie-details__group--big-gap-y {
  row-gap: clamp(1.25rem, .847107438rem + 1.652892562vw, 2.5rem)
}

.movie-details__title,
.movie-details__description {
  font-weight: 500
}

.movie-details__title {
  font-size: clamp(.875rem, .7944214876rem + .3305785124vw, 1.125rem);
  display: flex;
  align-items: center;
  column-gap: .25rem;
  color: inherit
}

.movie-details__description {
  color: var(--color-white)
}

.person-card:has(.person-card__body) {
  display: flex;
  align-items: center;
  column-gap: clamp(.5rem, 0rem + .625vw, .625rem);
  padding: clamp(.625rem, .5444214876rem + .3305785124vw, .875rem);
  background-color: var(--color-black-08);
  border: var(--border);
  border-radius: var(--border-radius-s)
}

.person-card:has(.person-card__body) .person-card__image {
  width: clamp(2.9375rem, .4375rem + 3.125vw, 3.5625rem);
  border-radius: var(--border-radius-s)
}

@media (width <=90rem) {
  .person-card:has(.person-card__body) .person-card__image {
    border-radius: var(--border-radius-xs)
  }
}

.person-card__image:only-child {
  width: clamp(4.375rem, 3.7303719008rem + 2.6446280992vw, 6.375rem);
  border: var(--border-width-s) solid transparent;
  border-radius: var(--border-radius-l);
  transition-duration: var(--transition-duration)
}

@media (width <=90rem) {
  .person-card__image:only-child {
    border-radius: var(--border-radius-m)
  }
}

@media (any-hover: hover) {
  .person-card__image:only-child:hover {
    border-color: var(--color-white)
  }
}

@media (any-hover: none) {
  .person-card__image:only-child:active {
    border-color: var(--color-white)
  }
}

.person-card__name {
  font-size: clamp(1rem, .5rem + .625vw, 1.125rem);
  font-weight: 500
}

.rating-view {
  --ratingViewValue: 5;
  display: flex;
  align-items: center;
  column-gap: .25rem
}

.rating-view__stars {
  position: relative
}

.rating-view__stars-filled {
  --ratingViewStarsClipEnd: calc(100% / 5 * var(--ratingViewValue));
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  clip-path: polygon(0 0, var(--ratingViewStarsClipEnd) 0, var(--ratingViewStarsClipEnd) 100%, 0 100%)
}

.review-card {
  display: grid;
  row-gap: clamp(1rem, 0rem + 1.25vw, 1.25rem);
  padding: clamp(1.5rem, 1.1776859504rem + 1.3223140496vw, 2.5rem);
  background-color: var(--color-black-06);
  border: var(--border);
  border-radius: var(--border-radius-l)
}

.review-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: .625rem
}

.review-card__name,
.review-card__subtitle {
  font-weight: 500
}

.tags__list {
  display: flex;
  flex-wrap: wrap;
  gap: .625rem
}

.tags__item {
  padding: clamp(.375rem, -.125rem + .625vw, .5rem) clamp(.75rem, .25rem + .625vw, .875rem);
  font-weight: 500;
  color: var(--color-white);
  background-color: var(--color-black-08);
  border: var(--border);
  border-radius: var(--border-radius-s)
}

@media (width <=90rem) {
  .tags__item {
    border-radius: var(--border-radius-xs)
  }
}

.ratings__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(1rem, 0rem + 1.25vw, 1.25rem)
}

.ratings__item {
  display: grid;
  row-gap: .25rem;
  padding: clamp(.75rem, .6694214876rem + .3305785124vw, 1rem);
  background-color: var(--color-black-08);
  border: var(--border);
  border-radius: var(--border-radius-s)
}

@media (width <=47.9375rem) {
  .ratings__item {
    row-gap: .125rem
  }
}

.ratings__title {
  font-size: clamp(.875rem, .7541322314rem + .4958677686vw, 1.25rem)
}

.collections {
  --collectionsGroupPadding: clamp(2.5rem, 0rem + 3.125vw, 3.125rem);
  padding-block: var(--section-padding-y);
  display: flex;
  flex-direction: column;
  row-gap: 3.125rem
}

.collections.tabs {
  --tabsBodyRowGap: clamp(8.625rem, .625rem + 10vw, 10.625rem)
}

.collections__group {
  display: grid;
  row-gap: clamp(4.6875rem, 4.1838842975rem + 2.0661157025vw, 6.25rem)
}

@media (width > 47.9375rem) {
  .collections__group {
    position: relative;
    padding: var(--collectionsGroupPadding);
    border: var(--border);
    border-radius: var(--border-radius-l)
  }
}

.collections__title {
  position: absolute;
  left: var(--collectionsGroupPadding);
  top: 0;
  translate: 0 -50%;
  padding: clamp(.5rem, 0rem + .625vw, .625rem) clamp(1.25rem, .25rem + 1.25vw, 1.5rem);
  color: var(--color-white);
  font-size: clamp(1rem, 0rem + 1.25vw, 1.25rem);
  font-weight: 600;
  background-color: var(--color-red-45);
  border-radius: var(--border-radius-s)
}

@media (width <=90rem) {
  .collections__title {
    border-radius: var(--border-radius-xs)
  }
}

.collections__section.section {
  padding: 0
}

.movie-card {
  display: flex;
  flex-direction: column;
  row-gap: clamp(.75rem, .5888429752rem + .6611570248vw, 1.25rem);
  padding: clamp(.75rem, .5888429752rem + .6611570248vw, 1.25rem);
  background-color: var(--color-black-10);
  border: var(--border);
  border-radius: var(--border-radius-l)
}

@media (width <=90rem) {
  .movie-card {
    border-radius: var(--border-radius-m)
  }
}

@media (any-hover: hover) {
  .movie-card:hover {
    border-color: var(--color-white)
  }
}

@media (any-hover: none) {
  .movie-card:active {
    border-color: var(--color-white)
  }
}

.movie-card__image {
  width: 100%;
  border-radius: inherit
}

.movie-card__body {
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: .5rem
}

.movie-card__body .badge {
  width: 100%
}

@media (width <=63.9375rem) {
  .movie-card__body {
    flex-direction: column;
    row-gap: .25rem
  }
}

.movie-card__released-badge {
  width: 100%;
  text-wrap: wrap;
  text-align: center
}

.movie-card__released-badge-label {
  color: var(--color-gray-75)
}

.movies-banner {
  padding-bottom: clamp(2.5rem, .7877066116rem + 7.0247933884vw, 7.8125rem)
}

.episode-card {
  display: grid;
  grid-template-columns: clamp(1.875rem, -5.625rem + 9.375vw, 3.75rem) 10.75rem 1fr;
  align-items: center;
  gap: clamp(1.125rem, .625rem + .625vw, 1.25rem);
  padding-block: 2.5rem
}

@media (width <=90rem) {
  .episode-card {
    padding-top: 1.875rem
  }
}

@media (width <=47.9375rem) {
  .episode-card {
    grid-template-columns: 1fr auto;
    grid-template-areas: "player number" "body body";
    padding: 1.25rem;
    background-color: var(--color-black-08);
    border-radius: var(--border-radius-s)
  }
}

.episode-card__number {
  font-size: clamp(1.5rem, 0rem + 1.875vw, 1.875rem);
  font-weight: 600
}

@media (width <=47.9375rem) {
  .episode-card__number {
    grid-area: number
  }
}

.episode-card__player {
  position: relative;
  border-radius: var(--border-radius-l);
  border: var(--border);
  overflow: hidden
}

@media (width <=47.9375rem) {
  .episode-card__player {
    grid-area: player
  }
}

.episode-card__player:before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: "";
  background-image: linear-gradient(0deg, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .5) 100%)
}

.episode-card__video {
  width: 10.75rem;
  height: 7.375rem;
  object-fit: cover
}

@media (width <=47.9375rem) {
  .episode-card__video {
    width: 100%;
    height: 12.5rem
  }
}

@media (width <=30rem) {
  .episode-card__video {
    height: 7.375rem
  }
}

.episode-card__play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3.125rem;
  height: 3.125rem;
  padding: 0;
  color: var(--color-white);
  background-color: color-mix(in srgb, var(--color-black) 60%, transparent);
  border: none;
  border-radius: 50%
}

@media (any-hover: hover) {
  .episode-card__play-button:hover {
    background-color: var(--color-red-60)
  }
}

@media (any-hover: none) {
  .episode-card__play-button:active {
    background-color: var(--color-red-60)
  }
}

.episode-card__play-button:active {
  scale: 1.05
}

.episode-card__play-button:not(.is-active) {
  display: none
}

.episode-card__play-button-icon.icon {
  --iconSize: 1.875rem
}

.episode-card__body {
  display: grid;
  row-gap: clamp(.625rem, -.375rem + 1.25vw, .875rem)
}

@media (width <=47.9375rem) {
  .episode-card__body {
    grid-area: body
  }
}

.episode-card__info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .625rem 1rem
}

@media (width <=47.9375rem) {
  .episode-card__info {
    flex-direction: column-reverse;
    align-items: start
  }
}

.episode-card__duration {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  column-gap: .25rem;
  padding: clamp(.375rem, -.125rem + .625vw, .5rem) clamp(.375rem, -.625rem + 1.25vw, .625rem);
  background-color: var(--color-black-08);
  border: var(--border);
  border-radius: var(--border-radius-s)
}

@media (width <=90rem) {
  .episode-card__duration {
    border-radius: var(--border-radius-xs)
  }
}

@media (width <=47.9375rem) {
  .seasons__list {
    display: grid;
    row-gap: 1.25rem
  }
}

@media (width > 47.9375rem) {
  .seasons__item {
    border-top: var(--border)
  }
}

table {
  --tableBorder: var(--border);
  border: var(--tableBorder);
  border-collapse: separate;
  border-radius: var(--border-radius-l)
}

@media (width <=90rem) {
  table {
    border-radius: var(--border-radius-m)
  }
}

table thead {
  background-color: var(--color-black-06)
}

table tbody tr:last-child td {
  border-bottom: none
}

table th,
table td {
  padding: clamp(1.5rem, 0rem + 1.875vw, 1.875rem);
  border-bottom: var(--tableBorder)
}

table th:not(:last-child),
table td:not(:last-child) {
  border-right: var(--tableBorder)
}

table th {
  font-size: clamp(1.125rem, .625rem + .625vw, 1.25rem);
  font-weight: 600;
  color: var(--color-white);
  text-align: left
}

.specifications {
  padding: 1.5rem;
  font-weight: 500;
  background-color: var(--color-black-06);
  border: var(--border);
  border-radius: var(--border-radius-l)
}

.specifications__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem 1.25rem;
  grid-auto-flow: dense
}

.specifications__item {
  display: flex;
  flex-direction: column;
  align-items: start;
  row-gap: .25rem
}

.specifications__item--wide {
  grid-column: -1/1
}

.specifications__value {
  color: var(--color-white)
}

.support {
  display: grid;
  padding-block: var(--section-padding-y);
  gap: 3.125rem clamp(3.125rem, -4.375rem + 9.375vw, 5rem)
}

@media (width > 47.9375rem) {
  .support {
    grid-template-columns: 33.5% 1fr
  }
}

.support__body {
  display: grid;
  row-gap: clamp(1.875rem, 1.472107438rem + 1.652892562vw, 3.125rem)
}

.support__info {
  display: grid;
  row-gap: clamp(.625rem, -.375rem + 1.25vw, .875rem)
}

.support__image {
  width: 100%;
  background-color: var(--color-black-06);
  outline: var(--border-width-xl) solid var(--color-black-15);
  border-radius: var(--border-radius-xs)
}

@media (width <=90rem) {
  .support__image {
    border-radius: var(--border-radius-xxxs)
  }
}

.support__form {
  display: grid;
  gap: clamp(1.25rem, .645661157rem + 2.479338843vw, 3.125rem) clamp(1.25rem, -6.25rem + 9.375vw, 3.125rem);
  padding: clamp(1.5rem, .9762396694rem + 2.1487603306vw, 3.125rem);
  background-color: var(--color-black-06);
  border: var(--border);
  border-radius: var(--border-radius-l)
}

@media (width <=90rem) {
  .support__form {
    border-radius: var(--border-radius-m)
  }
}

@media (width > 63.9375rem) {
  .support__form {
    grid-template-columns: repeat(2, 1fr)
  }
}

.support__form-cell--wide {
  grid-column: -1/1
}

.support__form-cell--actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.25rem
}

@media (width <=30rem) {
  .support__form-cell--actions {
    flex-direction: column;
    align-items: stretch
  }
}

.field {
  display: flex;
  flex-direction: column;
  align-items: start;
  row-gap: clamp(.75rem, -.25rem + 1.25vw, 1rem)
}

.field__label {
  font-size: clamp(1rem, .5rem + .625vw, 1.125rem);
  font-weight: 600;
  color: var(--color-white)
}

.field__required-star {
  color: var(--color-red-45)
}

.field__body {
  display: flex;
  column-gap: clamp(.75rem, -.25rem + 1.25vw, 1rem);
  width: 100%
}

.field__control {
  width: 100%;
  height: clamp(3.3125rem, -.1875rem + 4.375vw, 4.1875rem);
  padding-inline: clamp(1rem, 0rem + 1.25vw, 1.25rem);
  color: var(--color-white);
  background-color: var(--color-black-08);
  border: var(--border);
  border-radius: var(--border-radius-s)
}

@media (width <=90rem) {
  .field__control {
    border-radius: var(--border-radius-xs)
  }
}

@media (any-hover: hover) {
  .field__control:hover {
    border-color: var(--color-white)
  }
}

@media (any-hover: none) {
  .field__control:active {
    border-color: var(--color-white)
  }
}

.field__control:user-invalid {
  border-color: var(--color-red-45)
}

.field__control:disabled {
  opacity: .5;
  cursor: not-allowed
}

.field__control::placeholder {
  color: var(--color-gray-60)
}

.field textarea.field__control {
  resize: vertical;
  min-height: clamp(6.8125rem, 5.7246900826rem + 4.4628099174vw, 10.1875rem);
  padding-block: clamp(1rem, 0rem + 1.25vw, 1.25rem)
}

.checkbox {
  display: inline-flex;
  align-items: center;
  column-gap: clamp(.5rem, 0rem + .625vw, .625rem)
}

@media (any-hover: hover) {

  .checkbox:hover,
  .checkbox:hover .checkbox__input {
    color: var(--color-white)
  }
}

@media (any-hover: none) {

  .checkbox:active,
  .checkbox:active .checkbox__input {
    color: var(--color-white)
  }
}

.checkbox__input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: flex;
  justify-content: center;
  align-items: center;
  width: clamp(1.5rem, .5rem + 1.25vw, 1.75rem);
  height: clamp(1.5rem, .5rem + 1.25vw, 1.75rem);
  margin: 0;
  background-color: var(--color-black-06);
  border: var(--border);
  border-radius: var(--border-radius-xxxs)
}

.checkbox__input:not(:checked):after {
  opacity: 0;
  visibility: hidden
}

.checkbox__input:user-invalid {
  border-color: var(--color-red-45)
}

.checkbox__input:disabled,
.checkbox__input:disabled+.checkbox__label {
  opacity: .5;
  cursor: not-allowed
}

.checkbox__input:required+.checkbox__label:after {
  content: " *" /"";
  color: var(--color-red-45)
}

.checkbox__input:after {
  content: "✓";
  color: var(--color-white);
  transition-duration: inherit
}

.select {
  --selectButtonArrowIconUrl: url("../assets/images/arrow-down_gray.svg");
  --selectButtonArrowIconSize: clamp(1.25rem, .25rem + 1.25vw, 1.5rem);
  --selectButtonGapX: clamp(.25rem, -.25rem + .625vw, .375rem);
  --selectButtonPaddingX: clamp(.5rem, -.5rem + 1.25vw, .75rem);
  flex-shrink: 0
}

.select__original-control,
.select__button {
  min-width: 5.875rem
}

.select__original-control {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding-left: var(--selectButtonPaddingX);
  padding-right: calc(var(--selectButtonArrowIconSize) + var(--selectButtonPaddingX) + var(--selectButtonGapX));
  background-image: var(--selectButtonArrowIconUrl);
  background-position: calc(100% - var(--selectButtonPaddingX)) 50%;
  background-size: var(--selectButtonArrowIconSize);
  background-repeat: no-repeat
}

@media (width > 47.9375rem) {
  .select__original-control {
    position: absolute !important;
    width: .0625rem !important;
    height: .0625rem !important;
    margin: -.0625rem !important;
    border: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    clip-path: inset(100%) !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important
  }
}

.select__original-control:disabled+.select__body {
  opacity: .5;
  cursor: not-allowed
}

.select__original-control:disabled+.select__body * {
  pointer-events: none
}

.select__body {
  position: relative
}

.select__button,
.select__option {
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer
}

.select__button *,
.select__option * {
  pointer-events: none
}

.select__button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: var(--selectButtonGap);
  padding-inline: var(--selectButtonPaddingX);
  transition-duration: var(--transtition-duration)
}

@media (width <=47.9375rem) {
  .select__button {
    position: absolute !important;
    width: .0625rem !important;
    height: .0625rem !important;
    margin: -.0625rem !important;
    border: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    clip-path: inset(100%) !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important
  }
}

.select__button:after {
  width: var(--selectButtonArrowIconSize);
  height: var(--selectButtonArrowIconSize);
  content: "";
  background: var(--selectButtonArrowIconUrl) center/contain no-repeat;
  transition-duration: inherit
}

.select__button.is-expanded:after {
  rotate: 180deg
}

.select__dropdown {
  position: absolute;
  top: calc(100% + .25rem);
  display: grid;
  row-gap: .25rem;
  min-width: 18.75rem;
  min-height: 15.625rem;
  overflow-y: auto;
  overscroll-behavior: none;
  padding: .25rem;
  background-color: var(--color-black-06);
  border: var(--border);
  border-radius: var(--border-radius-l);
  transition-duration: var(--transtition-duration)
}

.select__dropdown.is-on-the-left-side {
  left: 0;
  transform-origin: 0 0
}

.select__dropdown.is-on-the-right-side {
  right: 0;
  transform-origin: 100% 0
}

.select__dropdown:not(.is-expanded) {
  opacity: 0;
  visibility: hidden;
  scale: 0
}

.select__option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: .625rem;
  padding: .625rem;
  border: var(--border);
  border-radius: inherit
}

@media (any-hover: hover) {
  .select__option:hover {
    color: var(--color-white);
    border-color: var(--color-white)
  }
}

@media (any-hover: none) {
  .select__option:active {
    color: var(--color-white);
    border-color: var(--color-white)
  }
}

.select__option.is-selected {
  color: var(--color-white)
}

.select__option.is-selected:after {
  content: "✓"
}

.select__option.is-current {
  border-color: var(--color-white)
}