/*
Theme Name: MNDS child
Template: Impreza
Version: 1.0
Author: Kerim Garbouj
Theme URI: http://impreza.us-themes.com/
Author URI: https://mnds.agency/
*/



/* ==========================================================================
   VARIABLES
   ========================================================================== */
:root {
}

/* ==========================================================================
   GLOBAL STYLES
   ========================================================================== */
* {
    -webkit-font-smoothing: antialiased;
}

@media (max-width: 900px) {

}

a .w-nav-title {
    text-decoration: none !important;
}

.l-section.height_huge {
    padding-top: 10rem;
    padding-bottom: 10rem;
}

/* Cases
   ========================================================================== */

/* States
   ========================================================================== */

.nowrap {
    white-space: nowrap;
}

.overflow-hidden {
    overflow: hidden;
}

.unset-max-width,
.unset-max-width * {
    max-width: unset;
}

.backdrop {
    backdrop-filter: blur(2px);
}

.mix-difference {
	mix-blend-mode: difference;
}

.filter-invert {
	filter: invert(1);
}

.fade-in-wrapper {
    opacity: 0.3;
	filter: grayscale(1);
	transform: translateX(0);
    transition:
		filter 0.4s ease-out,
        opacity 0.4s ease-out,
        transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.fade-in-wrapper.is-visible {
    opacity: 1;
	filter: grayscale(0);
	transform: translateX(-2rem);
}

.show-text .wpb_text_column {
	opacity: 0;
	transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.show-text:hover .wpb_text_column {
	animation: text-focus-in .3s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

@keyframes text-focus-in {
  0% {
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    filter: blur(0px);
    opacity: 1;
  }
}



/* Typography
   ========================================================================== */

.home h1 {

}

h1.heading-alt {

}

h1 em,
h2 em,
h3 em,
h4 em,
h5 em,
h6 em {
    font-style: normal;
}

h4 em {
	text-transform: none;
    font-weight: 400;
    font-style: italic;
    color: var(--color-neutrals-70);
    font-size: 0.6em;
    display: block;
    line-height: 1.8;
}

h1 small {
    font-size: 65%;
    display: block;
    margin-top: -0.1em;
    position: relative;
}

#page-footer a,
.breadcrumbs a,
a.w-nav-anchor {
    text-decoration: none;
}

b, strong {
    font-weight: 900;
}

blockquote {
    padding: 0.6rem 0;
    font-family: 'quinn-display';
    font-weight: 400;
    font-style: italic;
    line-height: 1.1;
    font-size: 2.3rem;
}
blockquote::before {
    content: '';
}

/* HTML Elements
   ========================================================================== */
ul {
    margin-left: 1rem;
}

ul li {

}

ol {

}

ol li {

}

small {

}

sup {

}

blockquote {

}

blockquote + p {

}

.color_alternate code {
    background: var(--color-content-bg);
}

/* Forms
   ========================================================================== */
input[type=checkbox] {

}
input[type=checkbox]:checked {

}

input[type=checkbox]:checked::before {

}

/* Gravity forms specific */
.gform_required_legend {
    display: none;
}

.gform_fileupload_rules {
    margin-top: -.5rem !important;
}


/* ==========================================================================
   PAGE BUILDER BLOCKS
   ========================================================================== */

/* Buttons
   ========================================================================== */
.w-btn {
    white-space: nowrap;
}
.w-btn .w-btn-label{
	position: relative;
    top: 0;
}

.w-btn .w-nav-title{
	position: relative;
}


.w-btn.us-btn-style_1,
.w-btn.us-btn-style_2{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  transition: all 0.6s cubic-bezier(.215,.61,.355,1);
  cursor: pointer;
  z-index: 0;
  box-shadow: 0 0px 7px -5px rgba(0, 0, 0, 0.5);
}

.w-btn.us-btn-style_1:hover {
  background: rgb(193, 228, 248);
}

.w-btn.us-btn-style_1:active {
  transform: scale(0.97);
}

.hoverEffect {
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

.hoverEffect div {
  	/* background: #5A2FD6;
	background: linear-gradient(90deg, #F4D7D2 10%, #5A2FD6 25%, #3B1C9E 51%, #5A2FD6 60%, #C49A72 100%);*/
	border-radius: 40rem;
	width: 14rem;
	height: 14rem;
	transition: 0.6s;
	filter: blur(20px);
	animation: effect infinite 12s linear;
	opacity: 0.7;
}
.us-btn-style_2 .hoverEffect div {
	/* background: linear-gradient(90deg, #5A2FD6 10%, #F4D7D2 25%, #F4D7D2 51%, #F4D7D2 60%, #5A2FD6 100%); */
}


.w-btn.us-btn-style_1:hover .hoverEffect div,
.w-btn.us-btn-style_2:hover .hoverEffect div {
  opacity: 0;
}

.w-btn.us-btn-style_1 .w-btn-label,
.w-btn.us-btn-style_1 .w-btn-label + i,
.w-btn.us-btn-style_2 .w-btn-label,
.w-btn.us-btn-style_2 .w-btn-label + i{
    position: relative;
    z-index: 2;
    transition: all .6s cubic-bezier(.215,.61,.355,1);
}
.w-btn.us-btn-style_1:hover .w-btn-label + i,
.w-btn.us-btn-style_2:hover .w-btn-label + i{
    transform: translate(5px, -3px);
}

@keyframes effect {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/* Text
   ========================================================================== */


/* Lists
   ========================================================================== */

.list-caps ul,
.list-caps-alt ul{
    line-height: 1.1;
}

/* .list-caps ul li,
.list-caps-alt ul li{
	transition: var(--ease);
    	--ease: all 500ms ease;
}

.list-caps-group .wpb_wrapper:hover ul li{
	margin-left: 0 !important;
}

.list-caps ul li {
	margin-left: 1rem;
}
.list-caps ul li:nth-child(2n) {
	margin-left: 0;
}

.list-caps ul li:nth-child(3n) {
	margin-left: 2rem;
}
.list-caps ul li:nth-child(4n) {
	margin-left: 1rem;
}
.list-caps ul li:nth-child(5n) {
	margin-left: 2rem;
}

.list-caps-alt ul li {
	margin-left: 2rem;
}
.list-caps-alt ul li:nth-child(2n) {
	margin-left: .5rem;
}

.list-caps-alt ul li:nth-child(3n) {
	margin-left: 0;
}
.list-caps-alt ul li:nth-child(4n) {
	margin-left: 2rem;
}
.list-caps-alt ul li:nth-child(5n) {
	margin-left: 0;
}*/

/* Images
   ========================================================================== */
.w-image img {

}

.w-image {
    animation-duration: 0.8s !important;
}

/* Video
   ========================================================================== */
.w-video-h {
    height: 100%;
}

/* Home hero: pinned stage with zooming video + trail
   (animated by js/custom-child-theme-script.js) */
.l-section:has(.mnds-hero-chrome) {
    --mnds-vh: 1vh;
    --mnds-hero-travel: 150;        /* pinned scroll distance (zoom + hold), in % of the viewport height */
    --mnds-hero-top: var(--wp-admin--admin-bar--height, 0px);
    --mnds-hero-video-width: calc(17 * var(--mnds-vh));
    min-height: 0 !important;
    padding: 0 !important;
    overflow-x: clip;
}

@supports (height: 1svh) {
    .l-section:has(.mnds-hero-chrome) {
        --mnds-vh: 1svh;
    }
}

@media (max-width: 600px) {
    .l-section:has(.mnds-hero-chrome) {
        --mnds-hero-top: 0px;
    }
}

/* Impreza hides overflow on the canvas on small screens, which would unpin the sticky stage */
.l-canvas:has(.mnds-hero-chrome) {
    overflow: visible;
    overflow: clip;
}

.l-section:has(.mnds-hero-chrome) .l-section-h,
.l-section:has(.mnds-hero-chrome) .g-cols,
.l-section:has(.mnds-hero-chrome) .wpb_column,
.l-section:has(.mnds-hero-chrome) .vc_column-inner {
    overflow: visible !important;
}

.l-section:has(.mnds-hero-chrome) .l-section-h {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.l-section:has(.mnds-hero-chrome) .vc_column-inner {
    min-height: calc((100 + var(--mnds-hero-travel)) * var(--mnds-vh));
    padding: 0;
}

.l-section:has(.mnds-hero-chrome) .vc_column-inner > .wpb_wrapper {
    position: sticky;
    top: var(--mnds-hero-top);
    display: flex;
    flex-direction: column;
    align-items: center;
    height: calc(100 * var(--mnds-vh) - var(--mnds-hero-top));
    padding-top: calc(5 * var(--mnds-vh));
    box-sizing: border-box;
}

.l-section.mnds-hero-bg-moved {
    background-image: none !important;
}

.mnds-hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    will-change: transform;
    pointer-events: none;
}

/* Logo, title and spacing follow the viewport height, so the video and the woman under it fit on any screen */
.mnds-hero-chrome {
    --vwrapper-gap: calc(1.4 * var(--mnds-vh)) !important;
    flex: 0 0 auto;
    width: 100%;
    pointer-events: none;
}

/* The zoomed video ends on top of the title and lead, the logo stays above it */
.w-image.mnds-hero-logo {
    position: relative;
    z-index: 2;
    width: min(calc(22.5 * var(--mnds-vh)), 60vw) !important;
}

h1.mnds-hero-title {
    font-size: min(calc(5.6 * var(--mnds-vh)), 8.6vw) !important;
    line-height: 1;
}

.mnds-hero-chrome .w-separator.size_medium {
    height: calc(1.5 * var(--mnds-vh));
}

.mnds-hero-chrome + .w-separator.size_medium {
    height: calc(3 * var(--mnds-vh));
}

.mnds-hero-logo img {
    transform-origin: 0 0;
    will-change: transform;
}

.mnds-hero-title,
.mnds-hero-lead {
    transform-origin: 50% 0;
    will-change: transform, opacity;
}

.mnds-hero-docked .mnds-hero-logo {
    visibility: hidden;
}

.l-section:has(.mnds-hero-chrome) .w-grid {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    width: 100%;
}

.l-section:has(.mnds-hero-chrome) .w-grid-list {
    position: relative;
    display: block !important;
    width: var(--mnds-hero-video-width);
    aspect-ratio: 9 / 16;
    margin: 0 auto;
}

.l-section:has(.mnds-hero-chrome) .w-grid-item {
    --mnds-zoom: 1;
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    animation: none !important;
    transform-origin: 0 0;
    will-change: transform;
    pointer-events: none;
}

/* Resting trail before the script takes over (and for reduced motion) */
.l-section:has(.mnds-hero-chrome) .w-grid-item:nth-child(1) { z-index: 5; }
.l-section:has(.mnds-hero-chrome) .w-grid-item:nth-child(2) { z-index: 4; opacity: 0.58 !important; filter: grayscale(1); transform: translate(55%, -8.4%); }
.l-section:has(.mnds-hero-chrome) .w-grid-item:nth-child(3) { z-index: 3; opacity: 0.38 !important; filter: grayscale(1); transform: translate(110%, -16.8%); }
.l-section:has(.mnds-hero-chrome) .w-grid-item:nth-child(4) { z-index: 2; opacity: 0.22 !important; filter: grayscale(1); transform: translate(165%, -25.2%); }
.l-section:has(.mnds-hero-chrome) .w-grid-item:nth-child(5) { z-index: 1; opacity: 0.12 !important; filter: grayscale(1); transform: translate(220%, -33.6%); }
.l-section:has(.mnds-hero-chrome) .w-grid-item:nth-child(n+6) { display: none; }

.l-section:has(.mnds-hero-chrome) .w-grid-item-h,
.l-section:has(.mnds-hero-chrome) .w-video-h {
    height: 100%;
}

.l-section:has(.mnds-hero-chrome) .w-grid-item .w-video {
    width: 100%;
    max-width: none !important;
    height: 100%;
    aspect-ratio: auto !important;
    box-sizing: border-box;
    border: calc(1px * var(--mnds-zoom)) solid var(--color-neutrals-100, #151314) !important;
    border-radius: calc(1.2rem * (1 + (var(--mnds-zoom) - 1) * 0.15)) !important;
    overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
    .l-section:has(.mnds-hero-chrome) .vc_column-inner {
        min-height: 0;
    }

    .l-section:has(.mnds-hero-chrome) .vc_column-inner > .wpb_wrapper {
        position: static;
        height: auto;
        padding-bottom: 3rem;
    }
}


/* Containers
   ========================================================================== */


/* Breadcrumb
   ========================================================================== */


/* Iconbox
   ========================================================================== */


/* Timeline
   ========================================================================== */

/* Caroussel
   ========================================================================== */


/* Pop-up
   ========================================================================== */



/* Flip box
   ========================================================================== */

.w-flipbox-front {
    justify-content: flex-end;
    align-items: flex-start;
    text-align: left;
    padding: 1rem;
}

.w-flipbox-front .w-flipbox-front-title {
	font-size: 6rem !important;
	line-height: 0.9;
    font-family: 'vesterbro-vf';
    font-style: italic;
    font-weight: 500;
    color: var(--color-bordeaux) !important;
}

.w-flipbox-front .w-flipbox-front-desc {
	font-family: 'Open Sans';
    text-transform: uppercase;
    color: var(--color-bordeaux);
    font-weight: 400;
    font-size: 1.6rem;
    margin: 0;
    line-height: 1;
}

.w-flipbox-back {
    padding: 0;
    justify-content: center;
}
.w-flipbox-back .w-flipbox-back-h {
    padding: 2rem;
    border: 1px solid var(--color-dark-purple);
    margin: .5rem;
    height: stretch;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    border-radius: .3rem;
    overflow-y: scroll;
}


/* Social lists
   ========================================================================== */


/* Custom classes
   ========================================================================== */
.number-highlight strong,
.number-highlight b {
	font: italic 500 1.8em / 0.7 vesterbro-vf !important;
}

.backdrop-filter {
	background: rgba(255, 255, 255, 0.4);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    padding: 2.5rem 2.5rem;
	transition: all .3s;
}

.backdrop-filter:hover {
	background: rgba(255, 255, 255, 0.7);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0);
}


/* ==========================================================================
   GRIDS
   ========================================================================== */

/* General
   ========================================================================== */

.w-grid .w-grid-list {

}

.w-grid .no-results {

}

.w-grid-preloader {

}


/* Grid layout: {name}
   ========================================================================== */


/* ==========================================================================
   HEADER
   ========================================================================== */

/* Home hero: the header logo starts hidden and fades in (via the script) once the hero logo has faded out */
@media (prefers-reduced-motion: no-preference) {
    body:has(.mnds-hero-chrome) #page-header .w-image {
        opacity: 0;
    }
}

#page-header.mnds-measure,
#page-header.mnds-measure * {
    transition: none !important;
}

.home.header_hor .l-header.pos_fixed~.l-main>.l-section:first-of-type>.l-section-h {
    padding-top: 0;
}

#page-header {
	mix-blend-mode: difference;
}

/* Mobile menu: while it is open (Impreza adds .w-nav-open to <html>) the header stops blending,
   so the fullscreen menu shows its real colours on its own dark background */
html.w-nav-open #page-header {
	mix-blend-mode: normal;
	transition-delay: 0s;
}

#page-header .w-nav.type_mobile.m_layout_fullscreen .w-nav-list.level_1,
html.w-nav-open #page-header::after {
	background: var(--color-neutrals-100, #151314);
}


body.header_hor .w-nav.type_mobile.m_layout_fullscreen.header_is_visible .w-nav-list.level_1,
body.header_hor .l-header.sticky .w-nav.type_mobile.m_layout_fullscreen.header_is_visible .w-nav-list.level_1{
    top: 0;
	margin-top: 0;
    background: var(--color-neutrals-100);
    justify-content: center;
    align-items: center !important;
}
html.w-nav-open .w-nav-icon,
html.w-nav-open .l-header .w-image {
    position: relative;
    z-index: 99;
	opacity: 1!important;
}

.w-nav .w-nav-list.level_1 {
	display: flex;
    flex-direction: column;
    gap: .2rem;
    justify-content: flex-start;
    align-items: flex-start!important;
	margin-top: 3rem;
}

.w-nav a.w-nav-anchor.level_1 {
    line-height: 1.2 !important;
    min-height: 2em !important;
    line-height: 1 !important;
}

body.header_hor .w-nav.type_mobile.m_layout_dropdown .w-nav-list.level_1 {
    left: unset;
    width: min-content;
}

.l-subheader.at_bottom .l-subheader-cell.at_left {
    align-items: flex-start;
}
.w-nav.type_desktop.open_on_hover.dropdown_height .w-nav-item:hover>.w-nav-list, 
.w-nav.type_desktop.dropdown_height .w-nav-item.opened>.w-nav-list {
    position: relative;
    display: flex;
    flex-direction: column;
} 
.l-subheader.at_bottom {
    position: absolute;
    width: 100%;
}

.header_hor .l-header.pos_fixed~.l-main>.l-section:first-of-type>.l-section-h {
	padding-top: 5.2rem;
}

li.current-menu-item a {
	color: var(--color-light-purple);
}

.sub-item {
    text-align: right;
}
.sub-item a {
    align-items: flex-end;
    justify-content: flex-end;
    font-size: 1em !important;
    padding: 0.1rem 1rem !important;
    line-height: 2.2 !important;
}

a.w-nav-anchor.level_1 {
    display: flex;
    flex-direction: row;
}
.w-nav-arrow:before {
    font-weight: 100;
    font-size: 1em;
}
/* Header: Search
   ========================================================================== */


/* Header: Language switcher
   ========================================================================== */


/* Header: Sticky styles
   ========================================================================== */
#page-header.sticky {

}

/* ==========================================================================
   NAVIGATION
   ========================================================================== */


/* Mobile navigation
   ========================================================================== */
/* Nav default */

/* Nav open */

/* ==========================================================================
   FOOTER
   ========================================================================== */
#page-footer {
    position: relative;
    z-index: 3;
}
#page-footer .wpb_text_column a {
    text-decoration: none;
}




/* ==========================================================================
   SHORTCODES
   ========================================================================== */

/* {shortcode_name}
   ========================================================================== */



/* ==========================================================================
    PAGE TEMPLATES:  ARCHIVES
   ========================================================================== */

/* Grids
   ========================================================================== */

/* Filters
   ========================================================================== */


/* Sorting
   ========================================================================== */

/* Archive {post_type_name}
   ========================================================================== */


/* Archive search
   ========================================================================== */


/* Pagination
   ========================================================================== */
.pagination .nav-links {
    margin-top: 6rem;
}
.pagination .nav-links .page-numbers {
    text-decoration: none;
    display: flex;
    width: 3rem;
    height: 3rem;
    justify-content: center;
    align-items: center;
    padding: 0.5rem;
    aspect-ratio: 1/1;
    border-radius: 1rem;
}


/* ==========================================================================
   PAGE TEMPLATES: DETAIL
   ========================================================================== */

/* Detail {post_type_name}
   ========================================================================== */


/* ==========================================================================
   PAGE SPECIFIC STYLES
   ========================================================================== */




/* PAGE {page_name}
   ========================================================================== */

/* PAGE Home
   ========================================================================== */
.mnds-hero-logo {
    width: min(12.5rem, 48vw);
    margin: 0 auto;
    pointer-events: auto;
}

.mnds-hero-logo img {
    display: block;
    width: 100%;
    height: auto;
}

.mnds-hero-title {
    text-align: center;
    margin: 0;
}

.mnds-hero-lead {
    margin: 0;
    max-width: 28rem;
    text-align: center;
    font-family: "Open Sans", sans-serif;
    font-size: 1rem;
    line-height: 1.4;
    color: #2a2a2a;
}

.mnds-letter {
    position: absolute;
    z-index: 0;
    font-family: quinn-display, "Times New Roman", serif;
    font-style: italic;
    line-height: 0.7;
    color: #1c1c1c;
    opacity: 0.14;
    pointer-events: none;
}

.mnds-letter-m {
    right: -4vw;
    bottom: 8vh;
    font-size: min(46vw, 32rem);
    transform: rotate(-20deg);
}

.mnds-label {
    letter-spacing: 0.08em;
}

.mnds-card {
    border-radius: 1.1rem;
}

.mnds-step {
    border-radius: 1rem;
}


/* CASES
   ========================================================================== */


/* ==========================================================================
   WORDPRESS PAGES
   ========================================================================== */

/* PAGE {page_name}
   ========================================================================== */

/* ==========================================================================
   ANIMATIONS
   ========================================================================== */

[class*="us_animate_"] {
    opacity: 0;
    animation-duration: 0.4s;
    animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-fill-mode: both;
}

/* Animation classes
   ========================================================================== */
.fade-down,
.fade-down-fast {
    opacity: 0;
    animation-duration: 1.5s;
    animation-name: fade-down;
    animation-delay: .25s;
    animation-direction: normal;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(.215,.61,.355,1);
}

.fade-down-fast {
    animation-duration: 1s;
    animation-delay: 0;
}


/* Animation types
   ========================================================================== */
@keyframes fade-down {
    from {
        opacity: 0;
        transform: translate3d(0, -40px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}
