/*!
Theme Name: munit
Theme URI: https://www.munitcomunicazione.com/
Author: Your Design Studio Name
Author URI: https://www.mazzmedia.com/
Description: munit is a modern, clean, and flexible WordPress theme designed for creative design studios. Showcase your portfolio, services, and team with a stylish and responsive layout.
Version: 1.0.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: munit
Tags: portfolio, design, creative, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, responsive-layout

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

munit is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

* {
  font-family: "Roboto", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1 strong,
h2 strong,
h3 strong,
h4 strong,
h5 strong,
h6 strong,
.h1 strong,
.h2 strong,
.h3 strong,
.h4 strong,
.h5 strong,
.h6 strong,
.font-ubuntu {
  font-family: "Ubuntu", sans-serif;
}
.group:hover .submenu-content.three-col {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  position: relative;
  left: 54px;
  top: -5px;
  width: 96.5%;
}

.ml-custom {
  margin-left: 8px;
  @media screen and (min-width: 1024px) {
    margin-left: 40px;
  }
}

.history-custom-h {
  height: auto;
  @media screen and (min-width: 1024px) {
    height: 600px;
  }
}

@media screen and (max-width: 1023.3px) {
  .gfield_consent_label {
    display: inline-block !important;
  }
  .group:hover .submenu-content.three-col {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    position: relative;
    left: 8px;
    top: 0;
    width: 100%;
  }
}

.group:hover .submenu-content {
  border-radius: 20px;
  position: relative;
  top: -5px;
  min-width: 320px;
  padding: 40px 40px;
}
.three-col .submenu li.title {
  grid-column: 1 / -1;
}

@media screen and (min-width: 1280px) and (max-width: 1535px) {
  .group:hover .submenu-content.three-col {
    left: 15px !important;
    width: 99% !important;
  }
}

@media screen and (min-width: 1536px) {
  .three-col span.absolute {
    width: 110px;
    left: 120px;
  }
}
@media screen and (min-width: 1280px) and (max-width: 1535px) {
  .three-col span.absolute {
    width: 110px;
    left: 120px;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1279px) {
  .three-col span.absolute {
    width: 110px;
    left: 90px;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1279px) {
  .three-col span.absolute {
    width: 110px;
    left: 100px;
  }
}

@media screen and (min-width: 1024px) {
  .mainlogo {
    margin-top: 50px !important;
  }
}

.contentp p {
  margin-bottom: 15px !important;
}

.contentp h1,
.contentp h2,
.contentp h3,
.contentp h4,
.contentp h5,
.contentp h6 {
  font-size: revert-layer !important;
  font-weight: revert-layer !important;
}

.contentp ul {
  list-style: circle;
  padding-left: 20px;
  margin-bottom: 15px;
}

.pb-12 {
  padding-bottom: 3rem;
}

.history-bar div.relative::before {
  content: "";
  position: absolute;
  top: 0px;
  left: -196px;
  z-index: -1;
  width: 40px;
  height: calc(100% + 12px);
  transform: scaleY(0);
  transform-origin: top center;
  opacity: 0;
  transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.4s ease;
  will-change: transform, opacity;
  clip-path: polygon(
    0 0,
    2% 0,
    50% 12px,
    100% 0,
    100% 0,
    100% calc(100% - 10px),
    100% calc(100% - 12px),
    50% 100%,
    2% calc(100% - 12px),
    0 calc(100% - 10px)
  );
}

:root {
  --kf-enter: 0.5s;
  --kf-exit: 0.5s;
  --kf-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --kf-ease-in: cubic-bezier(0.12, 0, 0.39, 0);
}

.history-bar div.relative:nth-child(odd)::before {
  background: #518eb7;
}
.history-bar div.relative:nth-child(even)::before {
  background: #20628f;
}

.history-bar div.relative:last-of-type::before {
  height: calc(380px + 10px);
}

.history-bar div.relative.revealed::before {
  transform: scaleY(1);
  opacity: 1;
}
.history-bar div.relative.leaving-up::before {
  transform: scaleY(0);
  opacity: 0;
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.1, 0, 0.39, 0);
  will-change: transform, opacity;
}

@media screen and (min-width: 768px) and (max-width: 1279px) {
  .history-bar div.relative::before {
    left: -155px !important;
  }
}

.history-bar div.relative .kf-card {
  opacity: 0;
  transform: translateY(-100px);
  transition: transform var(--kf-enter) var(--kf-ease-out),
    opacity var(--kf-enter) var(--kf-ease-out);
  will-change: transform, opacity;
  backface-visibility: hidden;
}

.history-bar div.relative.revealed .kf-card {
  opacity: 1;
  transform: translateY(0);
}

.history-bar div.relative.leaving-up .kf-card {
  transition-duration: var(--kf-exit);
  transition-timing-function: var(--kf-ease-in);
  opacity: 0;
  transform: translateY(-100px);
}

.history-bar div.relative:not(.revealed) {
  filter: grayscale(0.06) opacity(0.95);
  transition: filter 0.1s ease;
}

.history-bar.instant-bars div.kf-step::before {
  transform: translateY(-100px);
  transition: transform 0.3s ease;
}

.history-bar.instant-bars div.kf-step.revealed .kf-card {
  transition-delay: 0.4s !important;
}

@media (prefers-reduced-motion: reduce) {
  .history-bar div.relative::before,
  .history-bar div.relative .kf-card,
  .history-bar div.relative {
    transition: none !important;
  }
  .history-bar div.relative::before {
    transform: none !important;
    opacity: 1 !important;
  }
  .history-bar div.relative .kf-card {
    transform: none !important;
    opacity: 1 !important;
  }
}

.gfield.gravity-dropdown,
.gravity-upload {
  grid-column: span 2 / span 2 !important;
}

.gfield.gravity-dropdown select {
  width: 100%;
  background: transparent;
  border-bottom: 1px solid black;
  padding-bottom: 3px;
}

.gravity-upload .gfield_validation_message {
  display: none !important;
}

.invisible {
  visibility: hidden;
}

.alert-success {
  background-color: #d1fae5;
  border: 1px solid #34d399;
  color: #065f46;
  padding: 1rem 1.25rem;
  border-radius: 0.5rem;
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.95rem;
  margin-bottom: 20px;
}

.alert-success svg {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  fill: currentColor;
}

.alert-success button {
  position: absolute;
  top: 0.85rem;
  right: 0.75rem;
  background: transparent;
  border: none;
  color: inherit;
  cursor: pointer;
  font-size: 1rem;
}

@media screen and (min-width: 1280px) and (max-width: 1535px) {
  .banner-dec .title {
    font-size: 17px;
  }
  .banner-dec .text {
    font-size: 14px;
    padding-right: 10px;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1279px) {
  .banner-dec .title {
    font-size: 13px;
  }
  .banner-dec .text {
    font-size: 10px;
    padding-top: 5px;
    padding-right: 10px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .banner-dec .pt-4 {
    padding-top: 0px !important;
    margin-top: 0px !important;
  }
  .banner-dec .title {
    font-size: 13px;
  }
  .banner-dec .text {
    font-size: 10px;
    padding-top: 5px;
    padding-right: 10px;
  }
}
@media screen and (max-width: 767px) {
  .banner-dec .pt-4 {
    padding-top: 0px !important;
    margin-top: 0px !important;
  }
  .banner-dec .title {
    font-size: 16px;
  }
  .banner-dec .text {
    font-size: 12px;
    padding-top: 5px;
    padding-right: 10px;
  }
}

@media screen and (min-width: 1150px) and (max-width: 1535px) {
  .mainlogo {
    position: absolute;
    top: 30px;
    left: -20px;
    width: 220px;
  }
}
@media screen and (max-width: 1149px) {
  .mainlogo {
    position: absolute;
    top: 20px;
    left: -10px;
    width: 180px;
  }
}

.px-0 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

@media screen and (max-width: 1023px) {
  .mobile-bg-cover {
    background-size: cover;
  }

  #navbarNav .submenu {
    position: inherit;
    display: block;
  }
  #navbarNav .submenu .submenu-content {
    display: block;
    box-shadow: none;
    padding: 0px;
  }
  .mobile-header video {
    max-width: 180px !important;
  }

  #navbarNav {
    overflow-y: scroll;
    height: 80vh;
  }

  li.group span.absolute.z-0 {
    display: none;
  }
}

header {
  z-index: 999 !important;
}

.w-100 {
  width: 100% !important;
}

@media screen and (min-width: 991px) {
  .box-image-our-group .button-absolute {
    bottom: 55px;
    right: 35px;
  }
}
@media screen and (max-width: 992px) {
  .box-image-our-group .button-absolute {
    bottom: 20px;
    right: 20px;
  }
}
