/*!
Theme Name: MMG Artists
Theme URI: https://lime-agency.io/
Author: Lime Agency
Author URI: https://lime-agency.io/
Description: MMG Artists Theme
Version: 1.0.0
Text Domain: mmg-artists
*/

/* Font */
@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;700&display=swap");

@font-face {
	font-display: swap;
	font-family: ProximaNova;
	font-style: normal;
	font-weight: 400;
	src: url(assets/fonts/ProximaNova-Regular.woff2) format("woff2");
}

@font-face {
	font-display: swap;
	font-family: HostGrotesk;
	font-style: normal;
	font-weight: 400;
	src: url(assets/fonts/HostGrotesk-Regular.woff2) format("woff2");
}

@font-face {
	font-display: swap;
	font-family: HostGrotesk;
	font-style: normal;
	font-weight: 800;
	src: url(assets/fonts/HostGrotesk-ExtraBold.woff2) format("woff2");
}

@font-face {
	font-display: swap;
	font-family: LayGrotesk;
	font-style: normal;
	font-weight: 400;
	src: url(assets/fonts/LayGrotesk-Regular.woff2) format("woff2");
}

@font-face {
	font-display: swap;
	font-family: LayGrotesk;
	font-style: normal;
	font-weight: 500;
	src: url(assets/fonts/LayGrotesk-Medium.woff2) format("woff2");
}

@font-face {
	font-display: swap;
	font-family: LayGrotesk;
	font-style: normal;
	font-weight: 600;
	src: url(assets/fonts/LayGrotesk-Semibold.woff2) format("woff2");
}

@font-face {
	font-display: swap;
	font-family: LayGrotesk;
	font-style: normal;
	font-weight: 700;
	src: url(assets/fonts/LayGrotesk-Bold.woff2) format("woff2");
}

@font-face {
	font-display: swap;
	font-family: Didot;
	font-style: normal;
	font-weight: 400;
	src: url(assets/fonts/Didot-Regular.woff2) format("woff2");
}

@font-face {
	font-display: swap;
	font-family: Didot;
	font-style: italic;
	font-weight: 400;
	src: url(assets/fonts/Didot-Italic.woff2) format("woff2");
}

@font-face {
	font-display: swap;
	font-family: Didot;
	font-style: normal;
	font-weight: 700;
	src: url(assets/fonts/Didot-Bold.woff2) format("woff2");
}

/* Root */
:root {
	--font-family-proxima-nova: "ProximaNova", sans-serif;
	--font-family-jet-brains-mono: "JetBrainsMono", sans-serif;
	--font-family-host-grotesk: "HostGrotesk", sans-serif;
	--font-family-lay-grotesk: "LayGrotesk", sans-serif;
	--font-family-didot: "Didot", sans-serif;
	--content-width: 100rem;
}

/* Header */
.admin-bar .header {
	top: 32px;
}

.admin-bar .banner--fixed {
	top: 32px;
}

.admin-bar .banner--fixed .banner__wrap {
    min-height: calc(var(--banner-height) - 32px);
}

.admin-bar .header-menu__popup {
	top: 32px;
    height: calc(100vh - 32px);
}

@media (max-width: 782px) {
	.admin-bar .header {
		top: 46px;
	}

	.admin-bar .banner--fixed {
		top: 46px;
	}

	.admin-bar .banner--fixed .banner__wrap {
		min-height: calc(var(--banner-height) - 46px);
	}

	.admin-bar .header-menu__popup {
		top: 46px;
		height: calc(100vh - 46px);
	}
}

@media (max-width: 600px) {
    #wpadminbar {
        position: fixed;
    }
}

.header-menu__btn {
	font-family: var(--font-family-jet-brains-mono);
}

@media (min-width: 61rem) {
	.header-menu__menu {
		font-size: 1.75rem;
	}
}

.header-menu__menu > li > a {
    font-family: var(--font-family-host-grotesk);
    font-weight: 800;
}

.header-menu__list > li > a {
	font-family: var(--font-family-host-grotesk);
}

.header-locations {
	font-family: var(--font-family-jet-brains-mono);
}

.header-locations__list>li>a,
.header-menu__list>li>a {
    display: inline-flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 0.5rem;
}

.header-locations__list > li > a .wpml-ls-flag + span,
.header-menu__list > li > a .wpml-ls-flag + span {
    margin-left: 0;
}

.header-menu__list>li:not([class])>a {
	font-size: 1rem;
}

@media (max-width: 61rem) {
	.header-menu__list>li:not([class])>a {
		font-size: 0.75rem;
	}
}

.header-menu__list>li:not([class])>a>i {
	font-size: 1.75rem;
}

/* Body */
.page-light .img-text__text-block,
.page-light .section-text__text-block {
	color: rgba(0, 0, 0, .8);
}

.page-light .section-text-contact__value {
	color: rgba(0, 0, 0, .5);
}

/* Footer */
.footer__copyright {
	text-transform: uppercase;
    font-size: 0.8rem;
}

.footer__copyright a:not(:hover) {
    text-decoration: underline;
}

/* Hero Home */
.banner--first {
	position: absolute;
}

.banner--first .banner__title {
    font-family: var(--font-family-host-grotesk);
    font-weight: 800;
    color: var(--color-black);
}

/* Hero */
.hero__title {
	font-family: var(--font-family-lay-grotesk);
	font-weight: 700;
    --title-font-size: 5rem;
}

@media (max-width: 61rem) {
    .hero__title {
        --title-font-size: 4rem;
    }
}

@media (max-width: 47rem) {
    .hero__title {
        --title-font-size: 3rem;
    }
}

@media (max-width: 29rem) {
    .hero__title {
        --title-font-size: 2.5rem;
    }
}

/* Content */
.text-block ol li:not(:last-child),
.text-block ul li:not(:last-child) {
	margin-bottom: 0.25rem;
}

.section-text__text-block {
	text-align: left;
	font-family: var(--font-family-proxima-nova);
	font-weight: 400;
}

.section-text__text-block {
    font-size: 0.875rem;
}

@media (min-width: 61rem) {
	.section-text__text-block {
		font-size: 1.25rem;
	}
}

/* About */
.section-about {
    --section-padding-y: 3rem;
}

@media (max-width: 29rem) {
    .section-about {
        --section-padding-y: 1.5rem;
    }
}

.section-about .section-text__text-block {
	text-align: left;
	font-size: 0.875rem;
}

@media (min-width: 61rem) {
	.section-about .section-text__text-block {
		font-size: 1.25rem;
	}
}

.section-text__title {
	margin: 1.25rem 0;
	text-align: center;
	text-transform: uppercase;
	font-family: var(--font-family-lay-grotesk);
	font-weight: 700;
	letter-spacing: 4%;
}

@media (min-width: 61rem) {
	.section-text__title {
		margin: 1.75rem 0;
		font-size: 2.5rem;
	}
}

.section-text__subtitle {
	font-family: var(--font-family-didot);
	font-size: 1.5rem;
	line-height: 1;
}

@media (min-width: 61rem) {
	.section-text__subtitle {
		font-size: 2.25rem;
	}
}

.section-text__subtitle > :not(:last-child) {
    margin-bottom: 1.25rem;
}

@media (min-width: 61rem) {
	.section-text__subtitle > :not(:last-child) {
		margin-bottom: 2.25rem;
	}
}

.section-about .row {
	--col-gap: 5rem;
	row-gap: 3.5rem;
}

@media (max-width: 61rem) {
	.section-about .row {
		--col-gap: 1.5rem;
		row-gap: 1.5rem;
	}
}

.section-about .row .section-text__subtitle {
	margin-bottom: 1.25rem;
	font-style: italic;
}

@media (min-width: 61rem) {
	.section-about .row .section-text__subtitle {
		margin-bottom: 2.25rem;
	}
}

.section-text-contact__title {
	font-family: var(--font-family-jet-brains-mono);
	font-weight: 700;
}

.section-text-contact__value {
	font-family: var(--font-family-jet-brains-mono);
	font-weight: 400;
}

.section-text-contact__value a:hover u {
	text-decoration: none;
}

.section-text-contact__soc>li>a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: auto;
    height: auto;
    background-color: transparent;
    border-radius: 0;
}

.section-text-contact__soc>li>a i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--soc-link-size);
    height: var(--soc-link-size);
    background-color: hsla(0,0%,85%,.23);
    border-radius: var(--soc-link-size);
}


/* Gallery */
@media (max-width: 61rem) {
	.gallery {
		--cols-gap: 2.625rem;
	}
}

.gallery-grid-1 {
    --cols-count: 1;
}

@media (min-width: 62rem) {
    .gallery-grid-2 {
        --cols-count: 2;
    }
}

.gallery > li > video {
    display: block;
    height: auto;
    width: 100%;
}

.gallery-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    font-family: var(--font-family-didot);
}

.gallery-card img,
.gallery-card video {
    display: block;
    height: auto;
    width: 100%;
}

.gallery-card__title {
	margin-top: 0.25rem;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 0.9375rem;
	line-height: 1;
	letter-spacing: 0.08em;
}

.gallery-card__description {
	font-weight: 500;
	font-size: 0.6875rem;
	line-height: 1;
	letter-spacing: 0.06em;
}

/* Projects */
.banner:not(.banner--first) {
	display: block;
	background-color: var(--color-white);
	color: var(--color-black);
}

.banner:not(.banner--first) .banner__container--mobile {
    position: relative;
    min-height: auto;
    margin-bottom: 1.25rem;
    overflow: hidden;
}

@media (min-width: 62rem) {
	.banner:not(.banner--first) .banner__container--mobile {
		--banner-height: 100%;
	    background-color: var(--color-black);
	}
}

.banner:not(.banner--first) .banner__wrap {
    min-height: auto;
    padding: 0;
}

.banner:not(.banner--first) .banner__bg {
	position: relative;
	display: block;
}

@media (min-width: 62rem) {
	.section-card,
	.section-cards {
	    --section-padding-y: 4.375rem;
	}
}

.section-cards {
	--section-col-lg: 58%;
	--section-col-sm: 42%;
}

.section-cards__list {
    justify-content: space-evenly;
}

.main-card {
	background-color: var(--color-white);
	color: var(--color-black);
}

.main-card__img {
	position: relative;
	object-fit: contain;
}

.main-card__inner {
	margin-top: 1.25rem;
	padding: 0;
}

@media (max-width: 61rem) {
    .section-card, 
    .section-cards {
        --section-padding-y: 2.625rem;
    }

	.section-cards__list {
		--col-gap: 2.625rem;
	}
}

.section-card + .section-cards .section-cards__wrap {
	padding-top: 0;
}

.banner__title,
.main-card__title {
	font-family: var(--font-family-didot);
	font-size: 0.9375rem;
	letter-spacing: 0.08em;
}

.banner__description,
.main-card__description {
	font-family: var(--font-family-didot);
	font-weight: 500;
	font-size: 0.6875rem;
	letter-spacing: 0.06em;
}

.banner__description>:not(:last-child) {
    margin-bottom: .75rem;
}

/* Projects Masonry */
.masonry-item {
    width: 100%;
    margin-bottom: 1.75rem;
}

.masonry-item--big {
    width: 100%; 
}

@media (min-width: 48rem) {
    .masonry-item {
        width: calc((100% - 1.25rem) / 2);
    }

    .masonry-item--big {
        width: 100%;
    }
}

@media (min-width: 62rem) {
    .masonry-item {
        width: calc((100% - 2.5rem) / 3);
    }

    .masonry-item--big {
        width: calc(((100% - 2.5rem) / 3) * 2 + 1.25rem);
    }
}

/* Project */
.section-img-preview__title {
	font-family: var(--font-family-didot);
}

.preview-info {
	font-family: var(--font-family-jet-brains-mono);
}

.preview-info__value {
    font-size: 1rem;
    font-weight: 400;
    text-decoration: none;
}

.preview-info__value a:not(:hover) {
	text-decoration: underline;
}

.preview-imgs__img--lg {
    padding-bottom: 100%;
}

@media (min-width: 48rem) {
	.preview-imgs__img--lg {
	    padding-bottom: 75vh;
	}
}

.preview-imgs__img--lg img,
.preview-imgs__img--lg video {
    object-fit: contain;
    object-position: top;
    transform: scale(1) !important;
}

.preview-imgs__img video {
    height: 100%;
    left: 0;
    object-fit: cover;
    position: absolute;
    top: 0;
    width: 100%
}

/* Locations */
.section-locations .section-text__text-block {
	margin-bottom: 1.5rem;
	font-size: 0.875rem;
}

@media (min-width: 61rem) {
	.section-locations .section-text__text-block {
		max-width: 55rem;
		margin: 0 auto 1.75rem;
		font-size: 1.25rem;
	}
}

.location-card {
	display: block;
	font-family: var(--font-family-didot);
}

@media (max-width: 79rem) {
	.section-img-preview__wrap {
		padding-bottom: 0;
	}

	.section-img-preview__col--img {
		background-color: var(--color-white);
		position: relative;
	}
}

.location-card__title {
	font-weight: 700;
	font-size: 3rem;
}

@media (max-width: 61rem) {
    .location-card__title {
        font-size: 2.5rem;
    }

}

@media (max-width: 47rem) {
    .location-card__title {
        font-size: 2rem;
    }
}

@media (max-width: 29rem) {
    .location-card__title {
        font-size: 1.5rem;
    }
}

/* CTA */
.section-cta__title {
	font-family: var(--font-family-didot);
	font-size: 1.5rem;
}

.section-cta__title:not(:last-child) {
    margin-bottom: 1.25rem;
}

.section-cta__description {
	font-family: var(--font-family-proxima-nova);
    font-size: 0.8rem;
}

.section-cta__description:not(:last-child) {
    margin-bottom: 1.25rem;
}

.section-cta__btn-box:not(:last-child) {
    margin-bottom: 1.5rem;
}

.wpml-ls-current-language a:after {
    left: 0 !important;
    right: 0 !important;
}

.header-menu__popup._active {
    background: hsl(0deg 0% 100% / 20%) !important;
    backdrop-filter: blur(1rem) !important;
}


@media (min-width: 62rem) {
    .header-menu__popup {
        --popup-padding-x: 2rem;
    }
}

@media (min-width: 97.5rem) {
    .header-menu__popup {
        --popup-padding-x: 5.5rem;
    }
}

.banner:after, .main-card:after{
    display: none !important;
}

@media (max-width: 47rem) {
	.header:not(.header--light) {
		background-color: var(--color-white);
		border-bottom-color: var(--color-black);
		color: var(--color-black);
	}

	.banner {
		background: #fff;
	}

	.banner--first, .wrapper:has(.banner--fixed) {
		margin-top: 4rem;
	}
}