/**
 * Main front-end styles.
 * Base styles live in style.css; theme.json handles most design tokens.
 *
 * @package Nairuz
 */

ul,
ol {
  color: var(--grimo-grey-04);
}

.site-header {
  padding: 3.2rem 0;
  position: relative;
  z-index: 1;
}
body:not(.home) .site-header {
  background: #2d2d2d;
}
.site-header .site-header__content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
}
.main-logo__wrapper img {
  max-height: 56px;
}

.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute;
  height: 1px;
  width: 1px;
  overflow: hidden;
}

/* Navigation */
.menu {
  display: flex;
  flex-wrap: wrap;
  gap: 2.3rem;
  list-style: none;
  margin: 0;
  padding: 0;
  color: var(--grimo-white);
  line-height: 1;
}
.main-navigation ul {
  gap: 3.2rem;
}
.main-navigation ul a {
  position: relative;
  padding: 1.3rem 0;
  padding: 13px 0;
}
.main-navigation li:not(:last-child) a::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  height: 2px;
  width: 0;
  background: var(--grimo-yellow);
  transition: all 0.3s ease-in-out;
}
.main-navigation li.current-menu-item:not(:last-child) a::after,
.main-navigation li:not(:last-child):hover a::after {
  width: 100%;
  left: 0;
}
.main-navigation li:last-child a {
  padding-left: 32px;
  padding-right: 32px;
  background: #1cb76099;
  border-radius: 90px;
}
.main-navigation li:last-child a:hover {
  background: var(--grimo-green-secondary);
}

.site-body .social-medias .menu-item:first-child,
footer .social-medias .menu-item:first-child {
  display: none;
}
.social-menu {
  gap: 1.6rem;
  display: none;
}
.social-menu a[target="_blank"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ffb63699;
  width: 44px;
  height: 44px;
  border-radius: 90px;
  font-size: 0;
}
.social-menu a[target="_blank"]:hover {
  background: var(--grimo-yellow);
}
.social-menu a::before {
  display: inline-block;
  line-height: 0;
}
.social-menu a[href*="linkedin"]::before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M16 8C17.5913 8 19.1174 8.63214 20.2426 9.75736C21.3679 10.8826 22 12.4087 22 14V21H18V14C18 13.4696 17.7893 12.9609 17.4142 12.5858C17.0391 12.2107 16.5304 12 16 12C15.4696 12 14.9609 12.2107 14.5858 12.5858C14.2107 12.9609 14 13.4696 14 14V21H10V14C10 12.4087 10.6321 10.8826 11.7574 9.75736C12.8826 8.63214 14.4087 8 16 8Z' fill='white'/%3E%3Cpath d='M6 9H2V21H6V9Z' fill='white'/%3E%3Cpath d='M4 6C5.10457 6 6 5.10457 6 4C6 2.89543 5.10457 2 4 2C2.89543 2 2 2.89543 2 4C2 5.10457 2.89543 6 4 6Z' fill='white'/%3E%3C/svg%3E");
}
.social-menu a[href*="instagram"]::before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M17.5 6.5H17.51M7 2H17C19.7614 2 22 4.23858 22 7V17C22 19.7614 19.7614 22 17 22H7C4.23858 22 2 19.7614 2 17V7C2 4.23858 4.23858 2 7 2ZM16 11.37C16.1234 12.2022 15.9813 13.0522 15.5938 13.799C15.2063 14.5458 14.5931 15.1514 13.8416 15.5297C13.0901 15.9079 12.2384 16.0396 11.4078 15.9059C10.5771 15.7723 9.80976 15.3801 9.21484 14.7852C8.61992 14.1902 8.22773 13.4229 8.09407 12.5922C7.9604 11.7616 8.09207 10.9099 8.47033 10.1584C8.84859 9.40685 9.45419 8.79374 10.201 8.40624C10.9478 8.01874 11.7978 7.87659 12.63 8C13.4789 8.12588 14.2649 8.52146 14.8717 9.12831C15.4785 9.73515 15.8741 10.5211 16 11.37Z' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.social-menu a[href*="youtube"]::before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M22.5401 6.42C22.4213 5.94541 22.1794 5.51057 21.8387 5.15941C21.4981 4.80824 21.0708 4.55318 20.6001 4.42C18.8801 4 12.0001 4 12.0001 4C12.0001 4 5.12008 4 3.40008 4.46C2.92933 4.59318 2.50206 4.84824 2.16143 5.19941C1.8208 5.55057 1.57887 5.98541 1.46008 6.46C1.1453 8.20556 0.991319 9.97631 1.00008 11.75C0.988863 13.537 1.14285 15.3213 1.46008 17.08C1.59104 17.5398 1.83839 17.9581 2.17823 18.2945C2.51806 18.6308 2.9389 18.8738 3.40008 19C5.12008 19.46 12.0001 19.46 12.0001 19.46C12.0001 19.46 18.8801 19.46 20.6001 19C21.0708 18.8668 21.4981 18.6118 21.8387 18.2606C22.1794 17.9094 22.4213 17.4746 22.5401 17C22.8524 15.2676 23.0064 13.5103 23.0001 11.75C23.0113 9.96295 22.8573 8.1787 22.5401 6.42Z' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M9.75008 15.02L15.5001 11.75L9.75008 8.48V15.02Z' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Search form */
.header-search {
  max-width: 551px;
  width: 100%;
}
.search-form {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  border: 1px solid var(--grimo-grey-01);
  background: var(--grimo-white);
  border-radius: 48px;
  padding: 1rem 1.6rem;
}
.search-form .search-submit {
  line-height: 0;
}
.search-form label {
  display: block;
  width: 100%;
}
.search-form .search-field {
  border: 0;
  font-size: 1.4rem;
  width: 100%;
  outline: none;
  background: none;
}

.breadcrumbs {
  font-size: 1.4rem;
  margin-bottom: 3.8rem;
}

.breadcrumbs__list {
  display: flex;
  gap: 0.25rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.breadcrumbs__item + .breadcrumbs__item::before {
  content: " | ";
  margin: 0 0.25rem;
  opacity: 0.6;
}

.breadcrumbs__list .breadcrumbs__item--current {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.section__eyebrown {
  font-size: 1.2rem;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 2.4rem;
  color: var(--grimo-green-secondary);
  letter-spacing: 6px;
}
.section__heading {
  margin: 0 0 4.8rem;
  line-height: 4rem;
}
.section__description {
  margin-top: 0;
}

.cta-btn {
  margin-top: 4.8rem;
}
.cta-btn__link .wp-block-button__link {
  padding: 1rem 3.2rem;
}

.cta-btn__link.cta-btn__link-yellow .wp-block-button__link {
  background: var(--grimo-yellow);
  color: var(--grimo-black);
}
.cta-btn__link.cta-btn__link-yellow .wp-block-button__link:hover {
  background: var(--grimo-light-yellow);
}

.cta-btn__link.cta-btn__link-green .wp-block-button__link {
  background: var(--grimo-green-primary);
  color: var(--grimo-white);
}
.cta-btn__link.cta-btn__link-green .wp-block-button__link:hover {
  background: var(--grimo-green-secondary);
}

.slick-arrow {
  position: absolute;
  z-index: 1;
  top: 50%;
  transform: translate(0, -50%);
  line-height: 0;
  background: var(--grimo-white);
  width: 44px;
  height: 44px;
  text-align: center;
  border-radius: 90px;
  color: var(--grimo-green-secondary);
  font-size: 0;
}
.slick-arrow::before {
  line-height: 0;
  display: inline-block;
}
.slick-prev {
  left: 15px;
}
.slick-next {
  right: 15px;
}
.slick-prev::before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 19 19' fill='none'%3E%3Cpath d='M17.3335 9.16668L1.00016 9.16667M1.00016 9.16667L9.16683 17.3333M1.00016 9.16667L9.16683 1.00001' stroke='%231CB760' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.slick-next::before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 19 19' fill='none'%3E%3Cpath d='M1 9.16667H17.3333M17.3333 9.16667L9.16667 1M17.3333 9.16667L9.16667 17.3333' stroke='%231CB760' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.slick-dots {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  margin: 0;
  line-height: 0;
  list-style: none;
}
.slick-dots button {
  font-size: 0;
  width: 33px;
  height: 2px;
  background: var(--grimo-grey-01);
}
.slick-dots .slick-active button {
  background: var(--grimo-yellow);
}

#wpcf7-f76-p7-o1 {
  margin-top: 3.2rem;
  position: relative;
}
.newsletter-form p {
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
}
.newsletter-form input {
  padding: 1.2rem 3.2rem;
  border: 0;
  border-radius: 90px;
  max-width: 340px;
  width: 100%;
}
.newsletter-form input::placeholder {
  color: var(--grimo-grey-02);
}
.newsletter-form button {
  color: var(--grimo-green-primary);
}
.newsletter-form button:hover {
  color: var(--grimo-green-secondary);
}
.wpcf7 .wpcf7-spinner {
  position: absolute;
  right: 0;
  margin: 0 1.2rem;
}
.wpcf7 .wpcf7-not-valid-tip {
  position: absolute;
  left: 0;
}
.wpcf7 form .wpcf7-response-output {
  position: relative;
  left: 0;
  padding: 5px;
  margin: 30px 0 0;
  font-size: 12px;
  border-radius: 110px;
  padding-left: 10px;
}

body .wp-block-cover,
body .wp-block-cover-image,
body :where(.wp-block-group.has-background) {
  padding: 0;
}

.talk-with-us {
  position: relative;
  background: var(--grimo-off-white);
  padding: 8rem 0;
}
.talk-with-us__img-wrapper,
.talk-with-us__banner::before {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 50%;
  overflow: hidden;
  transition: all 0.5s ease-in-out;
}
.talk-with-us__banner::before {
  content: "";
  width: 100%;
  background: var(--grimo-black);
  opacity: 0.6;
}
.talk-with-us__banner {
  position: relative;
  transition: all 0.5s ease-in-out;
  height: 100%;
}
.talk-with-us__img-wrapper:hover .talk-with-us__banner::before {
  opacity: 0;
}
.talk-with-us__banner img {
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.talk-with-us__col-img:hover .talk-with-us__banner {
  transform: scale(1.05);
}
.talk-with-us__col-cta {
  padding: 0 3.2rem;
  max-width: 513px;
  width: 100%;
  margin: 0 auto !important;
}
.talk-with-us__col-cta .section__eyebrown {
  color: var(--grimo-blue);
}

.footer-sitemap {
  background: var(--grimo-green-primary);
  padding: 3.2rem 0 8.3rem;
}
.footer-sitemap p {
  color: var(--grimo-white);
}
.footer-sitemap .footer-col__title {
  font-size: 2.4rem;
  font-weight: 700;
  color: var(--grimo-green-secondary);
  margin-bottom: 32px;
}
.footer-wrapper {
  display: flex;
  gap: 30px;
}
.footer-col {
  width: 100%;
  padding: 0 32px;
}
.footer-col__brand {
  max-width: 388px;
}
.footer-col__menu {
  max-width: 287px;
}
.footer-col__info {
  max-width: 415px;
  padding-right: 0;
}
.footer-col .custom-logo {
  height: 72px;
}
.footer-description {
  margin: 3.2rem 0;
  color: var(--grimo-white);
}
.footer-sitemap #footer-social-menu a[target="_blank"] {
  background: var(--grimo-green-secondary);
}
.footer-sitemap #footer-social-menu a[target="_blank"]:hover {
  background-color: #ffb63699;
}
.footer-sitemap #footer-menu {
  flex-direction: column;
}
.footer-sitemap .info-list p,
.footer-sitemap .info-list p a {
  display: flex;
  gap: 8px;
  font-size: 1.4rem;
}
.footer-sitemap .info-list p a {
  align-items: center;
}
.footer-sitemap .info-list p a + a {
  margin-left: 24px;
}
.footer-sitemap .info-list p .label {
  text-decoration: underline;
}
.footer-sitemap .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  min-width: 24px;
  height: 24px;
  text-align: center;
  background: var(--grimo-green-secondary);
  border-radius: 90px;
}
.footer-sitemap .info-list p:not(:first-of-type) {
  margin-top: 24px;
}

.site-info__wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  flex-wrap: wrap;
  padding: 24px 0;
}
.site-info__wrapper p {
  font-size: 1.2rem;
  color: var(--grimo-black-contrast);
}
.site-info__wrapper .copy .label {
  display: inline-block;
  margin-right: 24px;
}

.error404 main,
.page-template-default:not(.home) main {
  margin: 4rem 0;
}
.error-404 {
  margin-bottom: 4.8rem;
}
.error-404 .page-header {
  margin-bottom: 2.4rem;
}

@media (max-width: 1299px) {
  .main-navigation ul {
    gap: 1.5rem;
  }
}

@media (max-width: 1199px) {
  .site-header .site-header__content {
    gap: 15px;
  }
  .main-navigation ul,
  .social-menu {
    gap: 1rem;
  }
  .main-navigation li:last-child a {
    padding-left: 16px;
    padding-right: 16px;
  }

  .footer-col__menu {
    max-width: 230px;
  }
  .footer-col {
    padding: 0;
  }
}

@media (max-width: 991px) {
  .site-header {
    padding: 3.2rem 0 1.6rem;
  }
  .main-navigation li:not(:last-child) {
    display: none;
  }

  .main-logo__wrapper {
    display: flex;
    align-items: center;
    gap: 32px;
  }
  .menu-mobile__toggle {
    color: var(--grimo-white);
  }
  .main-navigation li:last-child a {
    padding-left: 32px;
    padding-right: 32px;
  }

  .main-logo__wrapper .main-logo__branding img {
    max-height: 39px;
  }

  .menu-mobile__wrapper {
    position: fixed;
    top: 0;
    bottom: 0;
    left: -100%;
    width: 100%;
    background: transparent;
    z-index: 999;
    transition: all 0.3s ease-in-out;
  }

  .menu-mobile__overlay {
    position: absolute;
    inset: 0;
    background: rgb(26 26 26 / 50%);
    cursor: pointer;
  }
  .menu-mobile__wrapper.opend {
    left: 0;
  }
  #menu-mobile {
    position: relative;
    z-index: 1;
    max-width: 80%;
    width: 100%;
    background: var(--grimo-off-white);
  }

  body.menu-mobile-open {
    overflow: hidden;
  }
  .menu-mobile__header {
    background: var(--grimo-black-contrast);
    padding: 2.4rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .menu-mobile__header img {
    max-height: 39px;
  }

  .site-body .menu-mobile__body {
    height: calc(100vh - 87px - 148px);
    height: calc(100dvh - 87px - 148px);
    overflow: auto;
  }

  .menu-mobile__home .menu-mobile__home-link {
    display: block;
    background: var(--grimo-green-primary);
    padding: 2rem;
    color: var(--grimo-white);
  }
  .menu-mobile__menu {
    padding: 3.2rem 2rem 1.5rem;
  }
  .menu-mobile__menu .menu {
    flex-direction: column;
    gap: 0;
  }
  .menu-mobile__menu .menu a {
    display: block;
    padding: 1.7rem 0;
    color: var(--grimo-black);
  }
  .menu-mobile__menu .menu li {
    border-bottom: 1px solid var(--grimo-grey-01);
  }
  .menu-mobile__menu .primary-menu.menu li:last-child {
    display: none;
  }
  .menu-mobile__menu #primary-menu li:last-child,
  .menu-mobile__footer .social-menu li:first-child {
    display: none;
  }
  .menu-mobile__footer {
    background: var(--grimo-green-primary);
    padding: 3.2rem 2rem;
  }
  .menu-mobile__social-medias-title {
    color: var(--grimo-white);
    text-align: center;
    margin-bottom: 1.6rem;
  }
  .menu-mobile__footer .social-menu {
    justify-content: center;
    gap: 1.6rem;
  }
  .menu-mobile__footer .social-menu a[target="_blank"] {
    background: var(--grimo-green-secondary);
  }

  .section__heading {
    margin: 0 0 3.2rem;
    line-height: 3.2rem;
  }

  .slick.mobile-slick,
  .slick.centered-auto-width {
    display: block !important;
  }
  .slick.mobile-slick {
    margin: 0 -15px;
  }

  .slick.mobile-slick .slick-slide {
    margin: 0 15px;
  }
  .slick.mobile-slick .slick-slide.post {
    padding: 0;
  }
  .slick.centered-auto-width .slick-slide:not(:last-of-type) {
    margin-right: 5.5rem;
  }
  .slick.centered-auto-width .slick-dots,
  .slick.mobile-slick .slick-dots {
    justify-content: center;
    margin-top: 2rem;
    gap: 2px;
  }
  .slick.centered-auto-width .slick-dots button,
  .slick.mobile-slick .slick-dots button {
    width: 8px;
    height: 8px;
    border-radius: 8px;
  }

  .talk-with-us {
    padding-top: 0;
  }
  .talk-with-us .container {
    max-width: 100%;
    padding: 0;
  }
  .wp-block-group.talk-with-us__cols {
    grid-template-columns: 1fr;
    gap: 60px;
  }
  .talk-with-us__img-wrapper {
    position: initial;
    width: 100%;
  }
  .talk-with-us__col-cta {
    padding: 0 1.5rem;
  }

  .footer-sitemap {
    padding: 3.2rem 0;
  }
  .footer-wrapper {
    flex-wrap: wrap;
  }
}

@media (max-width: 767px) {
  .site-info__wrapper {
    justify-content: center;
    gap: 16px;
  }
}

@media (max-width: 400px) {
  .main-logo__wrapper {
    gap: 15px;
  }
  .main-navigation li:last-child a {
    padding-left: 15px;
    padding-right: 15px;
    font-size: 14px;
  }
}
