@import url("https://fonts.googleapis.com/css2?family=Onest:wght@100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Onest:wght@100..900&family=Play:wght@400;700&display=swap");
* {
  box-sizing: border-box; }

body, a, h1, h2, h3, h4 {
  font-family: 'Play';
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  letter-spacing: 0em;
  text-align: left;
  color: #efeeee; }

.container {
  max-width: 1392px;
  margin-left: auto;
  margin-right: auto;
  width: 100%; }
  @media (min-width: 768px) and (max-width: 1439px) {
    .container {
      max-width: 600px; } }
  @media (max-width: 767px) {
    .container {
      max-width: 320px; } }

html,
body,
p,
h1,
h2,
h3,
h4 {
  margin: 0;
  padding: 0;
  border: 0; }

html,
body {
  min-width: 100vw;
  min-height: 100vh;
  background-color: #292d33; }

ol,
ul {
  list-style: none;
  padding: 0; }

a {
  text-decoration: none; }

html,
body {
  max-width: 100%;
  overflow-x: hidden; }

html {
  scroll-behavior: smooth; }

body {
  overflow: auto; }

.footerTablet {
  display: none; }

.footerMobile {
  display: none; }

.footerDesctop {
  margin-top: 160px;
  margin-bottom: 24px; }
  .footerDesctop .container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center; }
  .footerDesctop__logo {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 274px; }
    .footerDesctop__logo--logo {
      content: '';
      height: 85px;
      width: 256px;
      background-image: url("/src/assets/Logo.png");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain; }
  .footerDesctop__main {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    width: 100vw; }
    .footerDesctop__main--left {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 32px; }
    .footerDesctop__main--center {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 32px; }
    .footerDesctop__main--right {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 32px; }

@media (min-width: 768px) and (max-width: 1439px) {
  .footerDesctop {
    display: none; }
  .footerMobile {
    display: none; }
  .footerTablet {
    display: block;
    margin-top: 160px;
    margin-bottom: 24px; }
    .footerTablet .container {
      display: flex;
      flex-direction: column;
      gap: 24px; }
    .footerTablet__logo--logo {
      content: '';
      height: 85px;
      width: 256px;
      background-image: url("/src/assets/Logo.png");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain; }
    .footerTablet__main {
      display: flex;
      flex-direction: row;
      justify-content: space-between; }
      .footerTablet__main--left {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px; }
      .footerTablet__main--center {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px; }
      .footerTablet__main--right {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px; } }

@media (max-width: 767px) {
  .footerDesctop {
    display: none; }
  .footerTablet {
    display: none; }
  .footerMobile {
    display: block;
    margin-top: 60px;
    margin-bottom: 40px; }
    .footerMobile .container {
      display: flex;
      flex-direction: column;
      gap: 24px; }
    .footerMobile__logo--logo {
      content: '';
      height: 56px;
      width: 150px;
      background-image: url("/src/assets/Logo.png");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain; }
    .footerMobile__main {
      display: flex;
      flex-direction: column;
      gap: 24px; }
      .footerMobile__main__topWrapper {
        display: flex;
        flex-direction: row;
        gap: 16px; }
      .footerMobile__main--left {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px; }
      .footerMobile__main--center {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px; }
      .footerMobile__main--right {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        max-height: 89px;
        gap: 16px; } }

.header .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px 0; }

.header__logo {
  content: '';
  height: 85px;
  width: 256px;
  background-image: url("/src/assets/Logo.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain; }

.header__links {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 32px; }
  .header__links a {
    text-decoration: none;
    text-transform: capitalize; }

.header__info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  gap: 8px; }
  .header__info a {
    font-size: 20px;
    line-height: 23px; }

.header__menuBtn {
  display: none; }

@media (min-width: 768px) and (max-width: 1439px) {
  .header {
    z-index: 5;
    position: absolute;
    width: 100vw;
    top: 0; }
    .header .container {
      padding: 32px 0; }
    .header__logo {
      content: '';
      height: 75px;
      width: 256px;
      background-image: url("/src/assets/Logo.png");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain; }
    .header__links {
      display: none; }
    .header__info {
      display: none; }
    .header__menuBtn {
      cursor: pointer;
      display: block;
      content: '';
      width: 77px;
      height: 32px;
      background-image: url("/src/assets/menuIcon.png");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      z-index: 3;
      transition: all 0.3s ease; } }

@media (max-width: 767px) {
  .header {
    z-index: 5;
    position: absolute;
    width: 100vw;
    top: 0; }
    .header .container {
      padding: 16px 0; }
    .header__logo {
      content: '';
      height: 58px;
      width: 152px; }
    .header__links {
      display: none; }
    .header__info {
      display: none; }
    .header__menuBtn {
      cursor: pointer;
      display: block;
      content: '';
      width: 60px;
      height: 34px;
      background-image: url("/src/assets/menuIcon.png");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      z-index: 3;
      transition: all 0.3s ease; } }

.menu {
  position: fixed;
  top: 0;
  right: -100vw;
  width: 100%;
  background-color: #292d33;
  z-index: 4;
  transition: right 0.3s ease;
  height: 100%; }
  .menu.open {
    right: 0; }
  .menu__links {
    margin-top: 30%;
    margin-bottom: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px; }
    .menu__links--link {
      font-size: 24px;
      line-height: 28px; }

*:has(.menu.open) {
  overflow: hidden; }

.contactUs {
  margin-top: 160px; }
  .contactUs__info {
    display: flex;
    flex-direction: row;
    gap: 28px; }
    .contactUs__info__left {
      flex: 30%;
      display: flex;
      flex-direction: column;
      gap: 16px; }
      .contactUs__info__left--title {
        font-family: 'Onest';
        font-size: 32px;
        line-height: 38px; }
      .contactUs__info__left--hrs {
        display: flex;
        flex-direction: column;
        gap: 16px; }
        .contactUs__info__left--hrs h4 {
          font-size: 20px;
          line-height: 23px;
          color: #f67100; }
        .contactUs__info__left--hrs h3 {
          font-size: 24px;
          line-height: 28px; }
    .contactUs__info__right {
      flex: 70%; }
      .contactUs__info__right--img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-top: 2px; }
  .contactUs__links {
    display: grid;
    grid-template-columns: repeat(3, 1fr); }
    .contactUs__links__info {
      display: flex;
      flex-direction: column;
      gap: 8px;
      padding: 24px;
      background-color: #f67100; }
      .contactUs__links__info:not(:last-child) {
        border-right: 1px solid #efeeee; }
      .contactUs__links__info h3 {
        font-size: 24px;
        line-height: 28px; }
      .contactUs__links__info h4,
      .contactUs__links__info a {
        font-size: 20px;
        line-height: 23px; }
      .contactUs__links__info--phones {
        display: flex;
        flex-direction: column; }
      .contactUs__links__info--social {
        display: flex;
        flex-direction: row;
        gap: 24px; }

@media (min-width: 768px) and (max-width: 1439px) {
  .contactUs__info__left {
    flex: 1; }
  .contactUs__info__right {
    flex: 1; }
  .contactUs__links {
    grid-template-columns: repeat(4, 1fr); }
    .contactUs__links .box1 {
      grid-column-start: 1;
      grid-column-end: 5;
      border-bottom: 1px solid #efeeee;
      border-right: none; }
    .contactUs__links .box2 {
      grid-column-start: 1;
      grid-column-end: 3; }
    .contactUs__links .box3 {
      grid-column-start: 3;
      grid-column-end: 5; } }

@media (max-width: 767px) {
  .contactUs {
    margin-top: 60px; }
    .contactUs__info {
      flex-direction: column;
      gap: 24px; }
      .contactUs__info__left {
        flex: 1; }
      .contactUs__info__right {
        flex: 1;
        display: flex;
        min-height: 436px; }
    .contactUs__links {
      grid-template-columns: repeat(4, 1fr); }
      .contactUs__links .box1,
      .contactUs__links .box2,
      .contactUs__links .box3 {
        grid-column-start: 1;
        grid-column-end: 5;
        border-bottom: 1px solid #efeeee;
        border-right: none; }
      .contactUs__links .box3 {
        border-bottom: none; } }

.priceBanner {
  position: relative;
  height: 800px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 51.5%, #292d33 95.37%), url("/src/assets/introBg.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }
  .priceBanner__team {
    position: absolute;
    height: 80%;
    width: 70%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 51.5%, #292d33 95.37%), url("/src/assets/priceBanner.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    bottom: 0;
    right: 50%;
    transform: translateX(50%); }

@media (min-width: 768px) and (max-width: 1439px) {
  .priceBanner {
    height: 600px; }
    .priceBanner__team {
      position: absolute;
      height: 70%;
      width: 100%; } }

@media (max-width: 767px) {
  .priceBanner {
    height: 300px; }
    .priceBanner__team {
      position: absolute;
      height: 70%;
      width: 100%; } }

.description {
  margin-top: 160px;
  display: flex;
  flex-direction: row;
  gap: 28px;
  height: 800px; }
  .description__left {
    flex: 0.32;
    display: flex;
    flex-direction: column;
    gap: 32px; }
    .description__left__top {
      display: flex;
      flex-direction: column;
      gap: 16px; }
      .description__left__top--title {
        font-family: 'Onest';
        font-size: 32px;
        line-height: 38px; }
      .description__left__top--subtitle {
        color: #f67100; }
    .description__left__bottom {
      display: flex;
      flex-direction: column;
      gap: 16px; }
      .description__left__bottom__title {
        font-size: 20px;
        line-height: 23px; }
      .description__left__bottom__list {
        display: flex;
        flex-direction: column;
        gap: 16px; }
        .description__left__bottom__list__line {
          display: flex;
          flex-direction: row;
          justify-content: center;
          align-items: center;
          gap: 16px; }
          .description__left__bottom__list__line--circle {
            min-width: 10px;
            min-height: 10px;
            border-radius: 10px;
            background-color: #f67100; }
  .description__right {
    flex: 0.68;
    border-radius: 2px;
    background-image: url("/src/assets/priceImg.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain; }

@media (min-width: 768px) and (max-width: 1439px) {
  .description {
    flex-direction: column;
    gap: 24px;
    min-height: 1043px; }
    .description__left {
      flex: 0.3;
      gap: 24px; }
      .description__left__bottom__list {
        display: flex;
        flex-direction: column;
        align-items: flex-start; }
    .description__right {
      flex: 0.7;
      background-size: cover; } }

@media (max-width: 767px) {
  .description {
    flex-direction: column;
    gap: 24px;
    min-height: 1018px; }
    .description__left {
      flex: 0.6;
      gap: 24px; }
      .description__left__bottom__list {
        display: flex;
        flex-direction: column;
        align-items: flex-start; }
    .description__right {
      flex: 0.4;
      background-size: cover; } }

.price {
  margin-top: 160px; }
  .price .container {
    display: flex;
    flex-direction: column;
    gap: 24px; }
  .price__header {
    display: flex;
    flex-direction: row;
    justify-content: space-between; }
    .price__header__text {
      display: flex;
      flex-direction: column;
      gap: 16px; }
      .price__header__text--title {
        font-family: 'Onest';
        font-size: 32px;
        line-height: 38px; }
      .price__header__text--subtitle {
        color: #f67100; }
    .price__header__img {
      cursor: pointer;
      width: 42px;
      height: 42px;
      background-image: url("/src/assets/Arrow.svg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover; }
  .price__categories {
    display: flex;
    flex-direction: row;
    justify-content: space-between; }
    .price__categories--category {
      cursor: pointer;
      flex: 1;
      padding: 16px 24px;
      border: 1px solid rgba(161, 161, 161, 0.2);
      font-size: 24px;
      line-height: 28px;
      text-align: center;
      transition: all 0.3s ease; }
      .price__categories--category.active {
        border: none;
        background-color: #f67100; }
  .price__prices {
    display: none;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px; }
    .price__prices__title {
      grid-column-start: 1;
      grid-column-end: 3;
      color: #f67100; }
    .price__prices__container {
      max-width: 100%;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      padding: 16px 24px;
      border: 1px solid rgba(161, 161, 161, 0.2); }
      .price__prices__container h4,
      .price__prices__container p {
        font-size: 20px;
        line-height: 23px; }
    .price__prices.active {
      display: grid; }
  .price__footer {
    max-width: 50%; }

@media (min-width: 768px) and (max-width: 1439px) {
  .price__categories {
    flex-wrap: wrap; }
    .price__categories--category {
      flex: 1;
      min-width: 50%; }
  .price__prices {
    grid-template-columns: repeat(1, 1fr);
    gap: 24px;
    column-gap: 0; }
    .price__prices__container {
      grid-column-start: 1;
      grid-column-end: 1; }
  .price__footer {
    max-width: 100%; } }

@media (max-width: 767px) {
  .price {
    margin-top: 60px; }
    .price__categories {
      display: flex;
      flex-direction: column;
      justify-content: space-between; }
    .price__prices {
      grid-template-columns: repeat(1, 1fr);
      gap: 24px;
      column-gap: 0; }
      .price__prices__container {
        grid-column-start: 1;
        grid-column-end: 1; }
        .price__prices__container p {
          min-width: max-content;
          display: flex;
          align-items: center; } }
