﻿.home-slider {
  position: relative;
  overflow: hidden;
  height: 620px; }
  .home-slider .slides {
    display: flex;
    transition: transform 0.8s ease;
    height: 100%; }
  .home-slider .slide {
    min-width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center; }
    .home-slider .slide .content {
      text-align: left;
      color: white;
      width: 40%;
      margin-left: auto; }
      @media (max-width: 991px) {
        .home-slider .slide .content {
          text-align: center;
          width: 90%;
          margin: auto; } }
      .home-slider .slide .content__inner {
        max-width: 570px; }
      .home-slider .slide .content h2, .home-slider .slide .content p {
        opacity: 0;
        transform: translateY(30px);
        transition: all 0.6s ease;
        display: block;
        max-width: 600px; }
      .home-slider .slide .content .btn {
        opacity: 0;
        transform: translateY(30px);
        transition: all 0.6s ease; }
      .home-slider .slide .content h2 {
        transition-delay: .4s;
        font-family: gilroyheavy, sans-serif;
        font-size: 75px;
        font-style: normal;
        font-weight: 900;
        line-height: 120%;
        /* 90px */
        margin-bottom: 30px; }
        @media (max-width: 991px) {
          .home-slider .slide .content h2 {
            font-size: 58px;
            line-height: 1.1; } }
      .home-slider .slide .content p {
        transition-delay: .6s;
        font-size: 25px; }
      .home-slider .slide .content .btn {
        margin-top: 50px;
        transition-delay: .8s; }
    .home-slider .slide.active .content h2,
    .home-slider .slide.active .content p,
    .home-slider .slide.active .content .btn {
      opacity: 1;
      transform: translateY(0); }
  .home-slider .pagination {
    position: absolute;
    bottom: 30px;
    border-radius: 50px;
    padding: 17px 18px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    gap: 25px;
    background-color: #201F23; }
    .home-slider .pagination.hide {
      display: none; }
    .home-slider .pagination span {
      width: 8px;
      height: 8px;
      background: #fff;
      border-radius: 50%;
      position: relative;
      z-index: 1; }
    .home-slider .pagination svg#pacman-icon {
      position: absolute;
      top: 4px;
      left: 0;
      z-index: 2;
      transition: left 0.4s ease;
      pointer-events: none;
      width: 21.08px; }

.featured {
  text-align: center;
  margin-top: 100px; }
  .featured h2 {
    color: #201F23;
    margin-bottom: 30px; }
  .featured .grid-pattern {
    margin-top: -200px;
    height: 295px; }
  .featured .categories {
    padding: 0 16px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 5px;
    align-items: start; }
    @media (max-width: 992px) {
      .featured .categories {
        grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 575px) {
      .featured .categories {
        grid-template-columns: 1fr; } }
    .featured .categories a {
      position: relative;
      padding-bottom: 90%;
      overflow: hidden; }
      .featured .categories a:hover .img {
        transform: scale(1.08); }
      .featured .categories a .img {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-size: cover;
        background-position: center;
        transition: transform .5s; }
      .featured .categories a .name {
        position: absolute;
        text-align: center;
        background-color: #FF0000;
        color: #fff;
        bottom: 20px;
        color: #FFF;
        font-family: gilroyheavy, sans-serif;
        font-size: 19px;
        font-weight: 400;
        line-height: 1;
        text-transform: uppercase;
        padding: 10px 17px;
        width: 60%;
        left: 50%;
        transform: translateX(-50%); }

.about {
  display: flex;
  flex-wrap: wrap; }
  .about .img-ctn {
    width: 100%; }
    @media (min-width: 992px) {
      .about .img-ctn {
        width: 50%; } }
    .about .img-ctn img {
      height: 100%;
      object-fit: cover; }
  .about .text-ctn {
    width: 100%;
    color: #fff;
    background-color: #005BC5;
    padding: 50px 25px;
    display: flex;
    flex-wrap: wrap;
    align-content: center; }
    @media (min-width: 992px) {
      .about .text-ctn {
        width: 50%; } }
    @media (min-width: 1400px) {
      .about .text-ctn {
        padding: 100px; } }
    .about .text-ctn h2 {
      margin-bottom: 30px; }
      @media (max-width: 991px) {
        .about .text-ctn h2 {
          text-align: center; } }
  .about .btn {
    margin-top: 50px; }
    @media (max-width: 991px) {
      .about .btn {
        margin-left: auto;
        margin-right: auto; } }

@keyframes munch {
  0% {
    transform: rotate(0deg) scaleY(1); }
  25% {
    transform: rotate(-5deg) scaleY(0.95); }
  50% {
    transform: rotate(5deg) scaleY(0.9); }
  75% {
    transform: rotate(-5deg) scaleY(0.95); }
  100% {
    transform: rotate(0deg) scaleY(1); } }

.slider-icon svg {
  transition: transform 0.3s ease; }

.slider-icon.is-munching {
  animation: munch 0.6s ease; }

#featured h2 {
  font-size: 43px; }
