@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:ital,wght@0,100..900;1,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

@font-face {
	font-family: 'shiro-icon';
	src: url('../fonts/shiro-icon.eot?56132354');
	src: url('../fonts/shiro-icon.eot?56132354#iefix') format('embedded-opentype'),
		url('../fonts/shiro-icon.woff2?56132354') format('woff2'),
		url('../fonts/shiro-icon.woff?56132354') format('woff'),
		url('../fonts/shiro-icon.ttf?56132354') format('truetype'),
		url('../fonts/shiro-icon.svg?56132354#shiro-icon') format('svg');
	font-weight: normal;
	font-style: normal;
}


/* HELPER VARIABLES */

:root {
	--color-amarelo-solar: #FEDD00;
	--color-laranja-vital: #FAA31F;
	--color-laranja-dominante: #F05125;
	--color-vermelho-material: #EC2127;
	--color-magenta-cosmopolita: #EA2262;
	--color-violeta-sintetico: #AC2885;
	--color-roxo-galatico: #724D9F;
	--color-azul-espacial: #0072BC;
	--color-azul-hibrido: #1B94D2;
	--color-azul-dinamico: #00ACCC;
	--color-azul-genetico: #00A99D;
	--color-verde-natural: #009C72;
	--color-verde-oceano: #3FBA8D;
	--color-verde-energetico: #83C559;

	--color-contrast: #00cc44;
	/* --color-contrast: #0273e6;
	--color-contrast: #b50700; */
	
	/* https://isotropic.co/tool/hex-color-to-css-filter/ */
		--tint-white: invert(100%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(103%) contrast(103%);
		--tint-gray: invert(69%) sepia(0%) saturate(640%) hue-rotate(242deg) brightness(89%) contrast(88%);

		--tint-amarelo-solar: invert(86%) sepia(37%) saturate(2729%) hue-rotate(354deg) brightness(105%) contrast(110%);
		--tint-laranja-vital: invert(73%) sepia(36%) saturate(2793%) hue-rotate(344deg) brightness(101%) contrast(96%);
		--tint-laranja-dominante: invert(36%) sepia(86%) saturate(1158%) hue-rotate(343deg) brightness(94%) contrast(100%);
		--tint-vermelho-material: invert(15%) sepia(95%) saturate(4160%) hue-rotate(350deg) brightness(98%) contrast(88%);
		--tint-magenta-cosmopolita: invert(21%) sepia(73%) saturate(4302%) hue-rotate(329deg) brightness(96%) contrast(91%);
		--tint-violeta-sintetico: invert(21%) sepia(77%) saturate(2013%) hue-rotate(293deg) brightness(94%) contrast(94%);
		--tint-roxo-galatico: invert(37%) sepia(28%) saturate(1224%) hue-rotate(225deg) brightness(85%) contrast(85%);
		--tint-azul-espacial: invert(30%) sepia(79%) saturate(1566%) hue-rotate(181deg) brightness(91%) contrast(101%);
		--tint-azul-hibrido: invert(50%) sepia(69%) saturate(1504%) hue-rotate(170deg) brightness(86%) contrast(89%);
		--tint-azul-dinamico: invert(42%) sepia(70%) saturate(819%) hue-rotate(147deg) brightness(105%) contrast(109%);
		--tint-azul-genetico: invert(40%) sepia(17%) saturate(5252%) hue-rotate(146deg) brightness(104%) contrast(101%);
		--tint-verde-natural: invert(55%) sepia(54%) saturate(7090%) hue-rotate(141deg) brightness(91%) contrast(101%);
		--tint-verde-oceano: invert(60%) sepia(69%) saturate(339%) hue-rotate(107deg) brightness(89%) contrast(96%);
		--tint-verde-energetico: invert(76%) sepia(29%) saturate(717%) hue-rotate(52deg) brightness(88%) contrast(90%);

		--tint-contrast: invert(76%) sepia(55%) saturate(6162%) hue-rotate(98deg) brightness(97%) contrast(101%);
		/* --tint-contrast: invert(29%) sepia(64%) saturate(4116%) hue-rotate(198deg) brightness(97%) contrast(99%);
		--tint-contrast: invert(7%) sepia(85%) saturate(7493%) hue-rotate(2deg) brightness(101%) contrast(101%); */
		
	--color-theme: var(--color-laranja-dominante);
	--color-theme-inverse: var(--color-white);
	--tint-theme: var(--tint-laranja-dominante);

	--color-lightergray: #F5F6F7;
	--color-lightgray: #ddd;
	--color-gray: #999;
	--color-darkgray: #696969;
	--color-darkergray: #2D3432;

	--color-placeholder: #6D6D6D;
	--color-blue: #133FAA;
	--color-background: #dfdfdf;

	--color-black: #444;
	--color-dark: #000;
	--color-white: #FFFFFF;
	--color-white-transp: #FFFFFFEE;

	--shadow-light: rgba(0, 0, 0, 0.2) 0px 2px 8px 0px;
	--shadow-medium: rgba(0, 0, 0, 0.1) 3px 4px 8px;
	--shadow-dark: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;;
	--shadow-big: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;

	--container-width: min(1200px, 100vw);
	--container-margin: calc( ( 100vw - var(--container-width) ) / 2 );
	--container-gap: 1.5em;
	
	--separator-stroke: 2px solid var(--color-black);
	
	--icon-width: 2.6em;
	--icon-width-small: 1.8em;
	--overflow-margin: max(1em, 1.75vw);
	--top-margin: 9em;
	--event-card-min-height: 15em;

	--swiper-navigation-color: var(--color-theme);
	--swiper-theme-color: var(--color-theme);
	--swiper-pagination-color: var(--color-theme);
}

body.color1, body.color2{
	--color-theme: var(--color-azul-dinamico);
	--tint-theme: var(--tint-azul-dinamico);
}

body.color3, body.color4{
	--color-theme: var(--color-azul-dinamico);
	--tint-theme: var(--tint-azul-dinamico);
}

body.color5, body.color6{
	--color-theme: var(--color-amarelo-solar);
	--tint-theme: var(--tint-amarelo-solar);
	--color-theme-inverse: var(--color-darkgray);
}

body.color7, body.color8{
	--color-theme: var(--color-laranja-vital);
	--tint-theme: var(--tint-laranja-vital);
}

body.color9, body.color10{
	--color-theme: var(--color-laranja-dominante);
	--tint-theme: var(--tint-laranja-dominante);
}

body.color11, body.color12{
	--color-theme: var(--color-vermelho-material);
	--tint-theme: var(--tint-vermelho-material);
}

body.color13, body.color14{
	--color-theme: var(--color-magenta-cosmopolita);
	--tint-theme: var(--tint-magenta-cosmopolita);
}

body.color15, body.color16{
	--color-theme: var(--color-violeta-sintetico);
	--tint-theme: var(--tint-violeta-sintetico);
}

body.color17, body.color18{
	--color-theme: var(--color-roxo-galatico);
	--tint-theme: var(--tint-roxo-galatico);
}

body.color19, body.color20{
	--color-theme: var(--color-azul-espacial);
	--tint-theme: var(--tint-azul-espacial);
}

body.color21, body.color22{
	--color-theme: var(--color-azul-hibrido);
	--tint-theme: var(--tint-azul-hibrido);
}

body.color23, body.color24{
	--color-theme: var(--color-verde-natural);
	--tint-theme: var(--tint-verde-natural);
}

/* Chrome, Edge and Safari */
*::-webkit-scrollbar {
	height: 4px;
	width: 10px;
  }
  *::-webkit-scrollbar-track {
	border-radius: 0px;
	background-color: var(--color-white);
  }

  *::-webkit-scrollbar-thumb {
	border-radius: 20px;
	background-color: #A6A6A6;
  }
  
  *::-webkit-scrollbar-thumb:hover {
	background-color: #696969;
  }
  
  *::-webkit-scrollbar-thumb:active {
	background-color: var(--color-theme);
  }



/* DOCUMENT AND BODY LEVEL */

html, body {
	min-width: 320px;
	width: 100%;
	max-width: 100%;
	min-height: 100vh;
	padding: 0;
	margin: 0;
	overflow-x: clip;
	
	scroll-behavior: smooth;
	scrollbar-gutter: stable;
}

body {
	font-family: "Calibre", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	color: var(--color-black);
	
	/* text-rendering: optimizeLegibility; */
	-webkit-font-smoothing: antialiased;
	line-height: 1;
	font-size: 1.1em;
}

html:has(body.menu-expanded){
	overflow: hidden;
	scrollbar-gutter: initial;
}

h1, h2, h3, h4, h5, h6{

	overflow-wrap: break-word;
	word-wrap: break-word;
	
	-ms-word-break: break-word;
	word-break: break-word;
/* 	
	-ms-hyphens: auto;
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto; */
}

a {
	color: var(--color-black);
	outline: 0;
}

b{
	font-weight: 600;
}

u{
	text-decoration: none !important; 
}

/* HELPER */

.wrap{
    width: 85%;
    margin: 0 auto;
    max-width: 1400px;
}

.force-break {
	overflow-wrap: break-word;
	word-wrap: break-word;
	
	-ms-word-break: break-word;
	word-break: break-word;
	
	-ms-hyphens: auto;
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}

.mda-type{
    font-size: 1.25em;
    font-weight: 700;
    text-transform: lowercase;
    color: var(--color-theme);
    margin-bottom: .4em;
	& a{
		color: var(--color-theme);
	}
}

.mda-title{
	font-size: 1.8em;
	text-transform: uppercase;
	color: var(--color-theme);
	font-weight: 800;
	display: inline-block;
	text-wrap: balance;
}

.mda-title2{
	font-weight: 800;
	text-wrap: balance;
}

.mda-title::before{
	content: "";
	display: block;
	width: 33%;
	min-width: 200px;
	height: .15em;
	background-color: var(--color-theme);
	margin-bottom: .2em;
}

.mda-header{
	margin-bottom: 4em;
}

.mda-section{
	font-size: 1.8em;
	text-transform: lowercase;
	color: var(--color-black);
	font-weight: 900;
}

.mda-description{
    font-size: 1.6em;
    font-weight: 300;
    line-height: 1.05;
    text-wrap: balance;
}

.mda-subdescription{
    font-size: 1.2em;
    font-weight: 400;
    line-height: 1.1;
    margin-right: 5%;
}

@media (width < 800px) {
	.mda-subdescription{
		font-size: 1.1em;
	}
}

.mda-description p{
	text-wrap: balance;
}

header > .mda-description{
	margin-top: 1em;
}

/* HEADER */

body > header {
	position: fixed;
    width: 100%;
	z-index: 99;
}

.header-nav{
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: auto auto auto;
	width: 100%;
}
.header-nav .logo {
	grid-row-end: span 1;
	position: relative;
	background-color: var(--color-white); 
}


.home .header-nav .logo{
	pointer-events: none;
}
.home .header-nav .logo img{
	pointer-events: none;
	opacity: 0;
    margin-left: .75em;
	background: var(--color-white);
}

	.home.scrolled-hero .header-nav .logo{
		pointer-events: initial;
	}

	.home.scrolled-hero .header-nav .logo img{
		opacity: 1;
	}

.header-nav .logo img{
    width: 218px;
    height: 70px;
	max-width: inherit;
	margin-left: .5em;
}

.header-nav .upper-menu {
	display: flex;
	align-items: center;
	background-color: var(--color-white);
}

	.lang-menu{
		display: flex;
		flex-wrap: nowrap;
		gap: .5em;
		font-size: .9em;
		text-transform: uppercase;
		height: 2.75rem;
		align-items: center;
		padding: 0 1.25em 0 1.5em;
		font-weight: 700;
	}

	.lang-menu li:not(:last-child)::after {
		align-self: stretch;
		content: '';
		border: 1px solid var(--color-lightgray);
		margin-left: .5em;
	}

	.lang-menu li a.active {
		font-weight: 700;
		cursor: auto;
	}

	.lang-menu li:has(a.active) {
		display: none;
	}

.header-nav .social-btns{
    display: flex;
    gap: .5em;
    height: 2.75rem;
    align-items: center;
    padding: 0 .5em;
}

	.header-nav .social-btn{
		display: block;
		width: 1.4em;
		height: 1.4em;
		background-position: center;
		background-repeat: no-repeat;
	}
	
	.header-nav .social-btn.instagram{ background-image: url('../images/icon-circle-black-social-instagram.svg'); }
	.header-nav .social-btn.linkedin{ background-image: url('../images/icon-circle-black-social-linkedin.svg'); }
	.header-nav .social-btn.youtube{ background-image: url('../images/icon-circle-black-social-youtube.svg'); }
	.header-nav .social-btn.tiktok{ background-image: url('../images/icon-circle-black-social-tiktok.svg'); }
	.header-nav .social-btn.spotify{ background-image: url('../images/icon-circle-black-social-spotify.svg'); }
	.header-nav .social-btn.threads{ background-image: url('../images/icon-circle-black-social-threads.svg'); }

.header-nav .accessibility{
	display: flex;
	height: 2.75rem;
	align-items: center;
	padding: 0 .65em;
	position: relative;
}

	.header-nav .accessibility-btn{
		background-color: #133FAA;
		border-radius: 50%;
		display: block;
		width: 1.8em;
		height: 1.8em;
		background-image: url('../images/icon-full-white-acessibilidade.svg');
		background-position: center;
		background-repeat: no-repeat;
	}
	
.header-nav .accessibility-box{
    background-color: var(--color-blue);
    color: var(--color-white);
    right: 0;
    bottom: -1em;
    transform: translateY(100%);
    position: absolute;
    padding: 1.2em 1.75em 1.2em 1.2em;
	border-radius: 1em;

	display: flex;
	flex-direction: column;
	gap: .75em;

	opacity: 0;
	transition: all .5s ease;
	pointer-events: none;
}

.accessibility-expanded .header-nav .accessibility-box{
	opacity: 1;
	pointer-events: all;
	right: 1em;
}

#accessibility-libras{
	color: var(--color-white);
	font-weight: 500;
	display: flex;
	gap: .75em;
	align-items: center;
	white-space: nowrap;
	cursor: pointer;
	padding: 0 0.25em;
}

#accessibility-libras img{
	display: none;
}

#accessibility-libras::after{
	content:'libras';
}

#accessibility-libras::before{
    display: block;
    content: ' ';
    width: 2.25em;
    height: 2.25em;
    background-position: center;
    background-size: cover;
	background-image: url(../images/icon-circle-white-libra.svg);
}

.header-nav .accessibility-box button{
    color: var(--color-white);
	font-weight: 500;
	display: flex;
	gap: .75em;
	align-items: center;
	white-space: nowrap;
}

.header-nav .accessibility-box button::before{
    display: block;
    content: ' ';
    width: 2.25em;
    height: 2.25em;
    background-position: center;
    background-size: cover;
}

	.header-nav .accessibility-box button.libra::before{
		background-image: url(../images/icon-circle-white-libra.svg);
	}
	.header-nav .accessibility-box button.contraste::before{
		background-image: url(../images/icon-circle-white-contraste.svg);
	}
	.header-nav .accessibility-box button.font-min::before{
		background-image: url(../images/icon-circle-white-font-min.svg);
	}
	.header-nav .accessibility-box button.font-max::before{
		background-image: url(../images/icon-circle-white-font-max.svg);
	}

.header-nav .menu-tools-wrap{
	grid-column-start: 2;
	margin-left: auto;
	height: 100%;
}

.header-nav .menu-tools{
	display: inline-flex;
	justify-content: end;
	align-items: center;
	height: 100%;
	border-radius: 0 0 0 1.5em;
	background: var(--color-white);
	padding-bottom: .25em;
}

.header-nav .prefeitura {
    display: inline-flex;
    gap: .5em;
    align-items: center;
    margin: .5em .75em;
}
.header-nav .prefeitura span {
	font-size: .6em;
	font-weight: 600;
}
.header-nav .prefeitura img{
	height: 1.8em;
}


/* ----- HEADER MENU ----- */

.header-menu {
    flex-grow: 10;
    display: flex;
	flex-direction: row-reverse;
    align-items: end;
	justify-content: center;
	margin-bottom: 0.3em;
}

.header-menu > ul{
    display: inline-flex;
    justify-content: center;
    gap: 1.5em;
    /* padding: 0 1.5em; */
    position: relative;
    align-items: baseline;
    width: fit-content;
	font-size: 1.1em;
}

.home .header-menu > ul{
	justify-content: start;
}

.header-menu li a{
	font-size: 1.1em;
	text-transform: lowercase;
	font-weight: 500;
	color: var(--color-darkgray);
	transition: all .3s ease;
	display: flex;
	gap: .35em;
	white-space: nowrap;
}

body:not(:has(.menu-expanded)) .header-menu .dropdown > a{ 
	cursor: default  !important;
}

.header-menu ul li.active > a{
	font-weight: 600;
	color: var(--color-dark);
}

.header-menu > ul ul{
	flex-direction: column;
	gap: .25em;
    padding: 1em 2em 1em 1.5em;
	margin-left: -1.5em;
	margin-top: -.2em;
	display: flex;
	background-color: var(--color-white);	
	position: absolute;
    bottom: 0;
    transform: translateY(110%);
	opacity: 0;
	transition: all .3s ease;
	pointer-events: none;
}


@media (width >= 1024px) {
	body:not(.menu-expanded) .header-menu > ul li:hover ul{
		display: flex;
		opacity: 1;
		transform: translateY(100%);
		pointer-events: auto;
	}
	body:not(.menu-expanded) .header-menu > ul li:hover .caret::after{
		content: '\E847';
	}
}

.header-menu > ul ul a{
	font-weight: 400;
}

.header-menu a .caret::after{
    content: '\E80E';
    font-family: 'shiro-icon';
    color: var(--color-gray);
    font-weight: 400;
    font-size: .8em;
}

body.menu-expanded .header-menu a.expanded .caret::after{
	content: '\E847';
}

.header-menu > ul li:hover::after{
	color: var(--color-theme);
}

.header-menu > ul li:hover > a {
	color: var(--color-dark);
}

.menu-toggle{
	display: none;
	padding: .25em 1em;
}
.menu-toggle::before{
	content: '\E805';
	font-family: 'shiro-icon';
    font-size: 1.6em;
	display: block;
}

body.menu-expanded.home .header-nav .logo{
	opacity: 1 !important;
}

body.menu-expanded .upper-menu{
	overflow-x: hidden;
    overflow-y: auto;
}

@media (width < 1280px) {

	.header-nav{
		grid-template-columns: auto 1fr auto;
	}

	
	body.home:not(.scrolled-hero) .header-nav{
		grid-template-columns: 12fr auto auto;
	}
	
	body.home:not(.scrolled-hero) .header-nav .logo{
		background-color: transparent;
	}
	body.menu-expanded .header-nav .logo{
		background-color: var(--color-white);
	}

	body .header-nav .logo img{
		/* width: 200px;
		height: 65px; */
		margin-left: .25em;
	}

	body.home.mobile:not(.scrolled-hero) .header-nav {
        grid-template-columns: 15fr 1fr auto;
    }

	.header-menu {
		justify-content: end;
		display: none;
	}

	body.menu-expanded .header-menu {
		justify-content: end;
		display: none;
	}
	.menu-toggle{
		display: block;
	}
	
	.header-nav .upper-menu {
		align-items: center;
		justify-content: end;
	}
	body.home:not(.scrolled-hero) .header-nav .upper-menu {
		border-radius: 0 0 0 1em;
	}

	.header-nav .menu-tools-wrap{
		grid-column-start: -1;
		align-self: center;
		background: var(--color-white);
	}

	.header-nav .menu-tools {
		padding-bottom: 0;
	}

	.social-btns{
		display: none !important;
	}

	ul.lang-menu {
		padding: 0 .25em;
	}
	ul.lang-menu li::not(:has(.active)){
		display: none !important;
	}
	.prefeitura{
		position: fixed;
		bottom: 0;
		right: 0;
		background: var(--color-white);
		border-radius: .5em 0 0 0;
		margin: 0 !important;
		padding: .25em .5em;
		width: 100%;
        justify-content: center;
	}
	.lang-menu li:has(.active) {
		display: none;
	}
	.lang-menu li:not(:first-child)::before {
		display: none;
	}

	.home-hero-logo {
		padding: 1em 2em 0 .8em !important;
	}
	.home-hero-logo img {
		height: 10vh !important;
	}

	.header-menu > ul ul{
		transform: none;
		display: none;
		pointer-events: auto;
		opacity: 1;
	}
	.home-expo::after {
		display: none;
	}
}

@media (width < 800px) {
	.header-nav{
		height: 50px;
	}
	.header-nav .logo img{
		width: 156px;
		height: 50px;
	}
}

body.menu-expanded > header{
	height: 100vh;
	background-color: var(--color-white);
}

body.menu-expanded > header > div{
	height: 100vh;
}

body.menu-expanded .menu-toggle::before{
	content: "\E820";
}

body.menu-expanded .social-btns{
    position: fixed;
    bottom: 1.5em;
    left: 0.5em;
    display: flex !important;
    font-size: 1.25em;
}

body.menu-expanded .upper-menu nav{
    position: absolute;
    width: 100%;
	height: 72.5%;
    inset: 15% 0 10% 0;
    overflow: auto;
    display: block;
    flex-direction: column-reverse;
	justify-content: start;
    align-items: start;
	background: var(--color-white);
}

body.menu-expanded .header-menu{
	justify-content: start;
}

body.menu-expanded .header-menu .menu-toggle{
	position: absolute;
	top: 0;
	right: 0;
}
body.menu-expanded .header-menu > ul{
	display: flex;
	flex-direction: column;
	gap: .5em;
	padding: 0 1em;
	font-size: 1.5em;
}

body.menu-expanded .header-menu > ul > li > a{
	font-weight: 700;
	margin-bottom: .25em;
}
body.menu-expanded .header-menu ul ul{
    position: relative !important;
    padding: .25em 1.5em 1.5em 1.5em;
    font-size: .85em;
    gap: .35em;
}
body.menu-expanded .header-menu ul ul.dropdown-menu.expand{
	display: flex !important;
	column-gap: 2em;
	column-width: 150px;
}

header.main > div > h2 a{
	text-transform: uppercase;
	color: var(--color-theme);
}

.section-separator{
	grid-column: content-start / content-end;
	display: block;
	content: '';
	border-top: var(--separator-stroke);
	margin: 2em 0;
}

/* ------------ */

.breadcrumb{
	display: flex;
	flex-wrap: wrap;
	gap: .75em;
	padding: 0.25em 1em;
	margin-bottom: 3em;
	font-size: .7em;
	color: var(--color-darkgray);
}

.breadcrumb li{
	display: flex;
	flex-wrap: nowrap;
	gap: .75em;
}

.breadcrumb li:not(:first-child)::before{
	content: '>';
}

/* MAIN */

main,
.container-grid {
	display: grid;
	grid-template-columns: [full-start] var(--container-margin) 
						   [content-start] 1fr 1fr 
						   [col1-3] 1fr 1fr 1fr 
						   [col2-3] 1fr 1fr 
						   [content-end] var(--container-margin) 
						   [full-end];
	gap: 0 var(--container-gap);
	width: 100vw;
}

main.exhibition-item{
	grid-template-rows: [hero] 60vh [tools] 6em [content] auto;
}

main > .title {
	grid-column-start: content-start;
	grid-column-end: content-end;
	grid-row-start: hero;
	grid-row-end: span 1;
	align-self: end;
	color: white;
	margin-bottom: 3em;
	z-index: 8;
}

main > .title h2{
	font-size: clamp(2.5em, 6vw, 4.5em);
    max-width: 85%;
	text-shadow: 2px 2px 10px rgba(0, 0, 0, .8);
	line-height: .9;
}

main > .title h3{
	background-color: var(--color-theme);
	text-transform: uppercase;
	display: inline-block;
    padding: .25em 0.75em;
    font-weight: 600;
    font-size: 0.8em;
    letter-spacing: 0.5px;
}

main > .title h2 span{
	display: block;
	font-weight: 300;
	font-size: .65em;
}

main > .hero {
	grid-column: full-start / content-end;
	grid-row: hero / span 2;
	/* background-attachment: fixed; */
	background-size: cover;
	background-position: 50% 50%;
	box-shadow: inset 0 -200px 250px #000000cc, inset 0 -20px 40px #000;
	border-radius: 0 0 4em 0;
}

main:not(:has(.hero)) {
	padding-top: var(--top-margin);
}

.home main {
	padding-top: 5em;
}

main > aside{
	grid-column: col2-3 / content-end;
	grid-row: content / span 1;
	background-color: var(--color-white);
	position: relative;
}

main > aside.side-menu{
	margin: 0 0 0 2em;
	position: sticky;
    top: var(--top-margin);
	text-transform: lowercase;
	font-weight: 400;
	letter-spacing: .01em;
	/* text-align: end; */
}

main > aside.side-menu::before{
	content: "";
	display: block;
	width: 33%;
	height: 2px;
	background: var(--color-black);
	position: absolute;
    /* right: 0; */
    left: 0;
	top: .25em;
}

main > aside.side-menu ul{
	margin-top: 1em;
	display: flex ;
    /* align-items: end; */
    flex-direction: column;
    gap: .25em;
}

main > aside.side-menu li.active a{
	font-weight: 600;
}

main > aside .aside-wrap{
	position: sticky;
	top: var(--top-margin);
}

@media (width < 800px) {

	.home main {
		padding-top: 3em;
	}

	main > .title {
		margin-bottom: 1em;
	}

	main > aside{
		grid-column: content-start / content-end;
		grid-row: auto;
		grid-row: tools / span 2;
		z-index: 1;
	}

	main > aside .aside-wrap{
		position: relative;
		top: initial;
	}

	.side-menu{
		display: none;
	}
}

main > article{
	grid-column: content-start / col2-3;
	grid-row: tools / span 2;
	background: white;
	position: relative;
	z-index: 1;
}

main > article.exhibition::before{
	content: "";
	position: absolute;
	inset: 0 0 0 0;
	width: calc(100% + 2 * var(--overflow-margin) );
	height: calc(8em + var(--overflow-margin));
	background: var(--color-white);
	z-index: -1;
	margin-left: calc(-1 * var(--overflow-margin));
	margin-right: calc(-1 * var(--overflow-margin));
	margin-top: calc(-1 * var(--overflow-margin));
	border-radius: 0 3em 0 0;
}

main .left-col{
	grid-column: content-start / col2-3;
}

main .right-col{
	grid-column: col2-3 / content-end;
}


.container{
	grid-column: content-start / content-end;

}

.container-right{
	grid-column: content-start / full-end;
	padding: 1.5em 0 1.5em 2em;
}

.button-block{
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-wrap: wrap;
    gap: .75em 2em;
    padding: 0 1.5em;
    max-width: 20em;
    margin: 1em auto 2em auto;
}

.secundary-info{
    font-weight: 400;
}

.button-block-age{
	text-align: center;
    margin: 0 auto;
    width: fit-content;
}

.button-block-hour,
.button-block-marker,
.button-block-venue,
.button-block-access{
	display: flex;
	gap: .75em;
    align-items: start;
	font-weight: 700;
	font-size: .9em;
}

.exhibition-item .button-block-hour,
.exhibition-item .button-block-marker,
.exhibition-item .button-block-venue,
.exhibition-item .button-block-access{
    align-items: center;
}

.button-block-hour::before,
.button-block-marker::before,
.button-block-venue::before,
.button-block-access::before{
	flex: 0 0 var(--icon-width);
	content: '';
	width: var(--icon-width);
	height: var(--icon-width);
	background-repeat: no-repeat;
	background-size: cover;
}

.button-block-venue::before{ background-image: url('../images/icon-circle-black-marker.svg'); }
.button-block-access::before{ background-image: url('../images/icon-circle-black-accessibility.svg'); }
.button-block-hour::before{ background-image: url('../images/icon-circle-black-hour.svg'); }
.button-block-marker::before{ background-image: url('../images/icon-circle-black-marker.svg'); }

.button-block .btn{
	width: 100%;
}

.service-block{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1em 1.5em;
    justify-content: space-around;
    margin: 2em auto;
	flex-wrap: wrap;
}

.service-block > div{
	max-width: 16em;
    font-size: 0.9em;
    font-weight: 600;
}

.text-btn{
	display: inline-flex;
	flex-direction: column;
    gap: 1em;
	margin-top: .75em;
	@media (width < 1024px) {
		margin-right: 2em;
	}
	@media (width < 1024px) {
		margin-right: 0;
	}
}

@media (width < 800px) {

	.button-block{
		padding: 0;
		max-width: none;
	}

	main.exhibition-item{
		grid-template-rows: [hero] 40vh [tools] 0 [content] auto;
	}

	main > article,
	main .left-col,
	main .right-col{
		grid-column: content-start / content-end;
		grid-row: auto;
	}

	main > article.exhibition::before{
		display: none;
	}

}

.full{
	grid-column: full-start / full-end;
}

.full-right{
	grid-column: content-start / full-end;
}

main > .item-gallery{
	grid-column: full-start / full-end;
	background: var(--color-gray);
	min-height: 20vh;
	margin: 2em 0;
}

main > .quote{
	grid-column: full-start / full-end;
	min-height: 20vh;

	background-attachment: fixed;
	background-size: cover;
	background-position: center;
	
	display: flex;
	justify-content: center;
	align-items: center;

	box-shadow: inset 0 -200px 280px #000, inset 0 -20px 40px #000;
	margin: 7.5em 0 0 0;
}

main > .quote quote{
	margin: 3em auto;
	color: #FFFFFF;
	max-width: var(--container-width);
	text-align: center;
	font-size: 2em;
	font-family: 'Calibre', sans-serif;
	font-weight: 700;
	text-shadow: 2px 2px 6px #000000;
}

/* ------ */

.side-left{
	grid-column: content-start / col1-3;
}
.side-right{
	grid-column: col2-3 / content-end;
}
.main-left{
	grid-column: content-start / col2-3;
}
.main-right{
	grid-column: col1-3 / content-end;
}

@media (width < 1024px) {
	.side-left,
	.side-right,
	.main-left,
	.main-right{
		grid-column: content-start / content-end;
	}
}

/* DATE / HOUR */

.hour,
.date{
	display: inline-flex;
	align-items: baseline;
	gap: .2em;
}

.date .date-day{ font-weight: 700; }
.date .date-month{     
	font-weight: 400;
    text-transform: lowercase;
    font-size: 1.15em;
}
.date .date-year{ font-weight: 700;}
.date .date-week{
    color: var(--color-darkgray);
	font-weight: 400;
	font-size: .7em;
}

.date .date-separator::before{ 
	font-family: 'shiro-icon';
	font-size: .75em;
	content: '\E815';
	color: var(--color-theme);
	margin: 0 .25em;
}

.clock .hour-separator::before{
	font-family: 'shiro-icon';
	font-size: .75em;
	content: '\E815';
	margin: 0 .15em;
    color: var(--color-theme);
}

.clock .hour-digit{
	font-weight: 600;
}

.clock .hour-character{
	font-weight: 400;
	margin: 0 .05em;
	font-size: 1.1em;
}


/* ELEMENTS */

.shareBtn::before{
	font-family: 'shiro-icon';
	content: '\E849';
	font-size: .8rem;
	font-weight: 400;
	color: var(--color-lightgray);
	border-color: var(--color-lightgray);
	border-width: 1px;
	border-style: solid;
	width: 1.75em;
	height: 1.75em;
	padding-top: .1em;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	border-radius: 50%;
	transform: translateY(-.5em);
	transition: all .3s ease;
	margin: 0 .75em;
}

.shareBtn:hover::before{
	color: var(--color-white);
	background: var(--color-lightgray);
}

/* -----  HOME -------- */

.btn{
    border-width: 1px;
	border-style: solid;
	border-color: var(--color-gray);
    border-radius: 2em;

	height: fit-content;
	width: fit-content;

    display: inline-flex;
	justify-content: space-between;
	gap: .8em;
    align-items: center;

	font-weight: 600;
	color: var(--color-gray);
	text-transform: uppercase;
	transition: all .2s ease;
	padding: .2em 1em;
	max-width: 18em;
	cursor: pointer;
	text-decoration: none !important;
}

.btn.size-small{
	font-size: .65em;
	min-height: 2.4em;
}

.btn.size-small span{
	font-size: 1.2em;
	line-height: 1.2;
}

.btn span{
    width: min-content;
	white-space: nowrap;
}

.btn.outline-hover:hover{
	border-color: var(--color-theme);
	color: var(--color-theme);
}

.btn:not(.outline-hover):hover{
	opacity: .85;
}

.btn.selected{
	border-color: var(--color-gray);
	color: var(--color-white);
	background-color: var(--color-gray);
}

.btn.outline-color{
	border-color: var(--color-theme);
	color: var(--color-theme);
}

.btn.colored,
.btn.tickets {
	border-color: var(--color-theme);
	background-color: var(--color-theme);
	color: #fff;
}

.btn:is(.tickets,.map,.search,.more,.event,.next){
    padding: 0 0 0 1em;
}

.btn:is(.tickets,.map,.search,.more,.event,.next)::after{
	display: block;
    content: '';
    width: 1.8em;
    height: 1.8em;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    margin: 0.3em 0.75em 0.3em 0;
}


.btn.tickets::after{ background-image: url('../images/icon-full-white-tickets.svg'); }
.btn.map::after{ background-image: url('../images/btn-marker.svg'); }
.btn.search::after{ background-image: url('../images/btn-search-w_new.svg'); }
.btn.more::after{ background-image: url('../images/icon-full-black-more.svg'); opacity: .6 }
.btn.event::after{ background-image: url('../images/icon-full-black-calendar.svg'); filter: var(--tint-white); width: 1.2em; height: 1.2em; }
.btn.next::after{ background-image: url('../images/icon-full-black-next.svg'); filter: var(--tint-gray); width: 1.2em; height: 1.2em; }

.btn.next:hover::after{ filter: var(--tint-theme); }


.btn.colored.next::after{ filter: var(--tint-white); }

.btn.more:hover::after{ opacity: 1; filter: var(--tint-theme) }

.btn.colored:hover,
.btn.tickets:hover {
	color: #fff;
}

.btn.hover-theme:hover,
.btn.more:hover {
	border-color: var(--color-theme);
	color: var(--color-theme);
}

button.icon-search::before{
	display: block;
	content: ' ';
	width: .9em;
	height: .9em;
	background-position: center;
	background-size: cover;
	background-image: url('../images/btn-search.svg');
	opacity: .7;
	transition: opacity .2s ease;
}

button.icon-search:hover::before{
	opacity: 1;
}

@media (width < 800px) {
	/* .btn{ font-size: 0.75em; } */
	.btn span{ font-size: 1.2em; }
}

/*  --------- */

.home-hero{
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 75vh;
	position: relative;
	overflow: clip;
}

.home-hero::before{
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 1;
	background: rgb(0,0,0);
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.15) 80%, rgba(0, 0, 0, 0.35) 100%);
}

.home-hero::after{
	content: '';
	display: block;
	width: 90px;
	height: 90px;
	bottom: -1px;
	right: 0;
	position: absolute;
	z-index: 2;
	background-image: url('../images/round.svg');
}

.home-hero video{
    position: absolute;
    inset: 0 0 0 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.home-hero-logo{
    position: absolute;
    bottom: -2px;
    left: 0;
    background-color: #FFFFFF;
    padding: 2em 4em 0 2em;
    border-radius: 0 3em 0 0;
    z-index: 9;
    padding: 1em 1.25em 0 0.5em;
}

.home-hero-logo img{
    aspect-ratio: 300 / 95;
    width: auto;
    height: 13.5vh;
}

	body.mobile .home-hero {
		height: 50vh;
	}
	
	body.mobile .home-hero-logo {
		padding: 1em 2em 0 .8em;
	}
	
	body.mobile .home-hero-logo img {
		height: 10vh;
	}

/* -- */

	.home-intro{
		margin-bottom: 2em;
	}

	.home-intro h2{
		font-size: 2em;
		font-weight: 800;
	}
	.home-intro h3{
		font-size: 1.8em;
		font-weight: 300;
	}

	.home-permanent{
		display: grid;
		grid-template-columns: 22% auto;
		gap: 1.5em var(--container-gap);
		margin: 2em 0 4em 0;
		width: 100%;
	}

	.home-permanent-swiper {
		overflow: hidden;
		border-radius: 0 0 0 5em;
		background-color: #000;
	}
	.home-permanent-swiper .permanent-swiper {
		height: 100%;
		max-height: 70vh;
	}

	.home-permanent-swiper .swiper-slide img{
		width: 100%;
		height: 100%;
		object-fit: cover;
		transform: scale(1.25);
		filter: blur(3em) brightness(0);
		transition: all 2s ease;
	}
	
	.home-permanent-swiper .swiper-slide.swiper-slide-active img{
		transform: scale(1);
		filter: blur(0) brightness(1);
	}

	.home-permanent-title {
		font-size: 1.6em;
	}

	@media (width < 1024px) {
		.home-permanent{
			grid-template-columns: auto;
		}
	}

/* -- */

.home-expo{
	height: 70vh;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	margin: 2em 0 5em 0;
	position: relative;
}

.home-expo::after{
    content: '';
    width: calc( var(--container-margin) + var(--container-gap) );
    height: 5em;
    position: absolute;
    left: 0;
	bottom: -1px;
    border-radius: 0 2em 0 0;
    z-index: 10;
    background: var(--color-white);
}

.home-expo-box{
    width: min(70vw, 500px);
	background-color: #FFFFFF;
	position: absolute;
	top: 0;
	right: -10%;
    padding: 1em 3em 2em 2.5em;
    transition: all .5sease-out;
    z-index: 10;
    border-radius: 0 0 0 3em;
}

.home-expo-title{
	font-size: 1.6em;
}

.home-expo-date{
	font-size: 1.1em;
	margin-top: .5em;
}

.exhibition-swiper-slide.swiper-slide-active .home-expo-box{
	right: 0;
}

.exhibition-swiper-slide[data-number='1'] .home-expo-box{
	top: auto;
	bottom: 0;
	padding: 2em 2em 1em 2.5em;
	border-radius: 3em 0 0 0 ;
}

@media (width < 800px) {
	.home-expo-box {
		padding: .5em 1em 1.5em 1.5em;
	}
	.mda-description {
		font-size: 1.25em;
	}
}

/* ---- */

.home-highlight{
	grid-column-start: content-start;
	grid-column-end: content-end;
	margin-bottom: 4em;
}

.home-highlight > h2{
	margin-bottom: .5em;
}

.home-highlight-filters{
    display: flex ;
    gap: .5em .5em;
    flex-wrap: wrap;
}

.card.card-creativework .card-thumb {
	border-radius: 2rem 0 0 0;
}

.card.card-creativework .card-text--title {
	font-size: 1.3em;
}

.card.card-creativework img {
    aspect-ratio: 1.65;
}

.home-highlight .card.card-creativework .card-text--description {
	display: none;
}

/* ---- */

.noEvent{
	color: #eee !important;
	border-color: transparent !important;
}

.home-header{
	display: flex;
	gap: 1em;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.5em;
}

.home-events-tabs-wraper{
	position: relative;
}

.home-events-tabs-wraper::after{
	position: absolute;
	top: 0;
	right: -1.5em;
	content: '';
	display: block;
	height: 100%;
	width: 1.5em;
	background: rgb(255,255,255);
	background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
}

.home-events-tabs{
	display: flex;
	gap: 1.5em;
	margin-top: .5em;
	overflow-x: auto;
    overflow-y: hidden;
	scroll-snap-type: x proximity;
	font-size: 1em;
}

.home-events-tabs li,
.home-events-tabs div{
	scroll-snap-align: start;
}

.home-events-tabs button{
	font-size: 1.2em;
    color: var(--color-darkgray);
	margin-bottom: -5px;
	border-bottom: 8px solid transparent;
	padding-left: 0;
	padding-right: 0;
	line-height: 1;
}

.home-events-tabs button.closed{
	color: var(--color-lightgray);
	border-bottom-color: transparent;
	
	& .date-week{
		color: var(--color-lightgray);
	}
}

.home-events-tabs button.closed:hover{
	border-bottom-color: var(--color-lightgray);
	border-bottom-color: transparent;
}

.home-events-tabs button:hover{
	border-bottom: 8px solid var(--color-darkgray);
}

.home-events-tabs button.current{
	color: var(--color-theme) !important;
	border-bottom: 8px solid var(--color-theme) !important;

	& .date-week{
		color: var(--color-theme) !important;
	}	
}

.home-events-date{
	display: none;
    flex-direction: column;
    gap: 2em;
	margin: 1em 0 2em 0;
	opacity: 0;
}

.home-events-date.current{ 
	display: flex; 

	opacity: 1;
	animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: .5s;
}

@keyframes fadeInOpacity {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}


.home-events-group{
	display: grid;
	grid-template-columns: max(25%, 260px) 1fr;
}

.home-events-group-title{
	grid-column-end: span 2;
	display: flex;
	align-items: baseline;
	justify-content: end;
	margin-right: 2em;
	padding-bottom: .5em;
}
.home-events-group-title h3{
	flex-grow: 20;
	margin-bottom: .5em;
}
.home-events-group-title h3 span:not(:empty){
	font-weight: 400;
	margin-right: .5em;
}

.home-events-group-head{
	flex: 0 0 max(175px, 25%);
	min-height: var(--event-card-min-height);
	overflow: clip;
	position: relative;
	border-radius: 0em 0 0 2em;
}

.home-events-group-head-date{
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--color-white);
    padding: .5em 1em;
    border-radius: 0 0 1em 0;
}
.home-events-group-head img{
	position: absolute;
	inset: 0 0 0 0;
	z-index: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.home-events-group-empty{
    display: flex ;
    flex-direction: column;
	/* min-height: var(--event-card-min-height); */
	min-height: 10em;
    overflow: clip;
    border-radius: 0em 0 0 2em;
    width: 100%;
    background-color: var(--color-lightergray);
    justify-content: center;
    align-items: start;
    font-size: 1.6em;
    font-weight: 700;
    padding: 0 10%;
    color: var(--color-theme);
    text-align: center;
}
.home-events-group-empty .subtexto{
	font-weight: 400;
	display: block;
}

.home-events-group-items{
	display: flex;
	justify-content: space-between;
	padding: 1em 0;
	width: 100%;
	background-color: var(--color-lightergray);
	min-width: 1px;
}
.home-events-group-items-wraper{
	width: 100%;
}
.home-events-group-items-wraper .swiper{
	width: 100%;
	padding: 0 1em;
}
.home-events-group-items-wraper .swiper-slide{
	height: auto !important;
	min-height: var(--event-card-min-height);
}

@media (width < 800px) {

	.home-header{
		flex-direction: column;
		gap:.5em;
		align-items: start;
	}

	.home-events-stage{
		grid-column: content-start / full-end;
	}
	.home-events-stage .swiper-button-prev,
	.home-events-stage .swiper-button-next{
		display: none;
	}
	.home-events-group-head{
		grid-column-end: span 2;
		border-radius: 2em 0 0 0;
	}
	.home-events-group-items{
		grid-column-end: span 2;
	}
}

/* -------- */

.warning{
	border-radius: 1.75em; 
	margin: 2.5em 0; 
	background: var(--color-theme); 
	padding: 1.5em;
	color: var(--color-white);
    display: grid;
    grid-template-columns: max(25%, 200px) auto;
	gap: 1.5em var(--container-gap);
}
.warning .warning-text{
	color: var(--color-white);
	font-size: 1.2em;
}
.warning .warning-text p{
    text-wrap: balance;
}
.warning .warning-text h3{
	margin-bottom: .25em;
}
.warning .mda-title{
	color: var(--color-white);
}
.warning .mda-title::before{
	background-color: var(--color-white);
}

@media (width < 800px) {
	.warning{
		grid-template-columns:auto;
	}
}

/* -------- */

.events-item{
	background-color: #fff;
	border: 1px solid var(--color-white);
	border-radius: .5em;
	padding: 1em 1em .75em 1em;
	justify-content: space-between;
	transition: all .3s ease;
	display: flex !important;
	flex-direction: column;
}

.events-item.swiper-slide{
	width: 15em !important;
}

.events-item:hover{
	border-color: var(--color-lightgray);
}

.event-head{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.event-body	{
    flex-grow: 10;
    display: flex;
    flex-direction: column;
}

.event-name{
	font-weight: 700;
    font-size: 1.25em;
}

.mda-title .additionalName,
.event-name .additionalName{
	font-weight: 300;
}

.event-type{
    /* font-size: 1em; */
    font-weight: 700;
    color: var(--color-theme);
    text-transform: lowercase;
    margin-bottom: 0.15em;
}
.event-description{
    font-size: .85em;
    color: var(--color-darkergray);
	margin-top: 1em;
}

.event-info{
	display: flex;
    flex-direction: column;
    font-size: .9em;
    font-weight: 600;
	border-top: 1px solid var(--color-lightgray);
	gap: .25em;
	padding-top: .75em;
	margin-top: .75em;
}

.event-info > :empty{
	display: none;
}

.event-info .date .date-year {
	font-weight: 600;
}
.event-info .date .date-month {
	font-weight: 400;
}
.event-info .rate {
	margin-top: .25em;
}

	.clock,
	.venue,
	.calendar{
		display: flex;
		align-items: center;
		gap: .5em;
	}

	.clock:empty,
	.venue:empty,
	.calendar:empty{
		display: none;
	}
	
	.clock::before,
	.venue::before,
	.calendar::before{
		display: block;
		content: '';
		width: 1.3em;
		height: 1.3em;
		background-position: center;
		background-size: cover;
		flex-shrink: 0;
		filter: var(--tint-theme);
	}
	
	.clock::before{ background-image: url('../images/icon-full-black-hour.svg'); }
	.venue::before{ background-image: url('../images/icon-full-black-marker.svg'); }
	.calendar::before{ background-image: url('../images/icon-full-black-calendar.svg'); }

	.venue-value{
		font-weight: 600;
	}

	.event-rate{
		border: 0 !important;
	}

		.rate{
			display: block;
			width: fit-content;
			background-color: var(--color-white);
			border-radius: 1em;
			padding: 0.2em .5em;
			color: var(--color-theme);
			border: 1px solid var(--color-theme);
			font-weight: 500;
		}
	
	.additional-info{
		margin: .5em 0;
		display: flex;
		flex-direction: column;
	}
	.additional-info-item{
		color: var(--color-theme);
		font-weight: 700;
	}

.eventSwiper {
	width: 100%;
}

	.eventNext,
	.eventPrev {
		position:  relative !important;
		top: auto !important;
		left: auto !important;
		right: auto !important;
		display: inline-block;
		z-index: auto !important;
		height: auto !important;
		margin: 0 .25em !important;
	}

	.eventNext::after{
		font-family: 'shiro-icon' !important;
		font-size: 1.25em !important;
		content: '\E815' !important;
		color: var(--color-black) ;
	} 
	.eventPrev::after {
		font-family: 'shiro-icon' !important;
		font-size: 1.25em !important;
		content: '\E814' !important;
		color: var(--color-black);
	}

	.eventPrev.swiper-button-disabled::after,
	.eventNext.swiper-button-disabled::after{
		color: var(--color-lightgray) ;
	}


/* FOOTER */

body > footer{
	margin-top: 5em;
	background-color: var(--color-lightergray);
	border-top: 0.3em solid var(--color-theme);
}

.footer{
	display: flex;
	justify-content: space-between;
	background: var(--color-background);
	color: var(--color-darkgray);
}

.footer a{
	color: var(--color-theme-inverse);
	transition: all .2s ease;
	font-weight: 600;
}
.footer a:hover{
	color: var(--color-black);
}

.footer-nav{
	display: flex;

	justify-content: space-between;
    gap: 3em 5em;
	width: 100%;
    padding: 2em 1.5em 4em 1.5em;
	background: var(--color-theme);
	color: var(--color-theme-inverse);

}

@media (width < 800px) {
	.footer-nav{
		flex-direction: column;
	}
	/* .footer-info{
		margin: 0 0 0 3.75em;
	} */
}

footer .logo{
    flex-shrink: 0;
}
footer .logo img{
    aspect-ratio: 300 / 50;
    width: auto;
    height: 0.85em;
    margin-top: -0.3em;
}

.footer-menu {
	display: flex;
	flex-wrap: wrap;
	gap: 2em;
	/* font-size: .9em; */
}

.footer-menu li{
	width: 200px;
}

.footer-menu li > a[role="button"]{
	font-weight: 700;
	opacity: 1;
	margin-bottom: .5em;
	text-transform: uppercase;
	font-size: .9em;
}
.footer-menu li > a{
	font-weight: 400;
	opacity: .9;
	display: block;
}

.footer-menu li > a:hover{
	opacity:1;
	color: var(--color-theme-inverse);
}

.footer-menu ul ul{
    display: flex;
    flex-direction: column;
    gap: .2em;
}

.footer-info{
	display: flex;
	flex-direction: column;
	gap: 3em;
	flex-grow: 5;
}

.footer-service{
    display: flex;
    gap: 2em;
	flex-wrap: wrap;
	gap: 1em 4em;
	justify-content: start;
}

.footer-credits{
    text-align: right;
    font-size: .8em;
}

footer .footer-service .button-block-hour::before,
footer .footer-service .button-block-marker::before {
    filter: var(--tint-white);
}


body.color6 footer .footer-service .button-block-hour::before,
body.color6 footer .footer-service .button-block-marker::before {
    filter: var(--tint-gray);
}

body.color6 footer  .logo img {
    filter: var(--tint-gray);
}

.footer-credits-block{
	font-size: .9em;
}


footer .button-block-hour,
footer .button-block-marker{
	align-items: start;
}


/* -- */

.sponsor{
	margin: 4em 0 0 0;
}

.logos{
	display: flex;
	flex-direction: column;
	gap: 3em;
	margin: 5.5em 0;
}

.logos-group{
	display: flex;
    gap: 3em 4.5em;
	flex-wrap: wrap;
	align-items: end;
}

.logos-item{
	display: flex;
	flex-direction: column;
    gap: 0.35em;
}

.logos-item .assignment{
	font-size: .6em;
	font-weight: 600;
	text-transform: uppercase;
	/* border-bottom: 1px dotted var(--color-gray); */
	/* padding-bottom: 0.5em; */
}

.logos-list{
	display: flex;
    gap: 0em 2em;
	flex-wrap: wrap;
}

.footer-logo{
	display: flex;
	height: 2.3em;
	aspect-ratio: 1;

	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.footer-logo span{
	display: none;
}

.logos-list.big{
	/* height: 3.5em; */
	gap: 0 2em;
}

.logos-list.big .footer-logo {
	height: 3.5em;
}

.logos-list.medium .footer-logo {
	height: 2.75em;
}

.footer-logo.aguas-do-rio { background-image: url('../images/logos/aguas-do-rio.svg');     aspect-ratio: 1.35; }
.footer-logo.arcelormittal { background-image: url('../images/logos/arcelormittal.svg');     background-size: 100%; aspect-ratio: 1.9; background-position-y: 10%; }
.footer-logo.b3 { background-image: url('../images/logos/b3.svg');     aspect-ratio: .7; }
.footer-logo.bloomberg { background-image: url('../images/logos/bloomberg.svg');     aspect-ratio: 1.6; }
.footer-logo.caterpillar { background-image: url('../images/logos/caterpillar.svg'); aspect-ratio: 1.5; }
.footer-logo.ccr { background-image: url('../images/logos/ccr.svg'); aspect-ratio: 0.5; }
.footer-logo.motiva { background-image: url('../images/logos/motiva.svg'); aspect-ratio: 1.6; }
.footer-logo.colgate { background-image: url('../images/logos/colgate.svg'); aspect-ratio: .9; }
.footer-logo.curta-on { background-image: url('../images/logos/curta-on.svg') }
.footer-logo.dataprev { background-image: url('../images/logos/dataprev.svg') }
.footer-logo.egtc { background-image: url('../images/logos/egtc.svg');    aspect-ratio: .85; }
.footer-logo.ems { background-image: url('../images/logos/ems.svg');    aspect-ratio: 1.2; background-size: 85%; }
.footer-logo.engie-brasil { background-image: url('../images/logos/engie-brasil.svg');    aspect-ratio: 1.6; }
.footer-logo.ey { background-image: url('../images/logos/ey.svg');     aspect-ratio: 1.1; background-position-y: 15%; }
.footer-logo.fitch-ratings { background-image: url('../images/logos/fitch-ratings.svg');    aspect-ratio: 1.7; }
.footer-logo.fundacao-roberto-marinho { background-image: url('../images/logos/fundacao-roberto-marinho.svg'); aspect-ratio: 2.3; }
.footer-logo.granado { background-image: url('../images/logos/granado.svg');     aspect-ratio: 1.5; }
.footer-logo.grupo-globo { background-image: url('../images/logos/grupo-globo.svg'); aspect-ratio: 1.9; }
.footer-logo.ibm { background-image: url('../images/logos/ibm.svg');    aspect-ratio: 1.5; }
.footer-logo.idg { background-image: url('../images/logos/idg.svg');    aspect-ratio: 2.6; }
.footer-logo.instituto-cultural-vale { background-image: url('../images/logos/instituto-cultural-vale.svg');     aspect-ratio: 1.35; }
.footer-logo.lei-de-incentivo-a-cultura { background-image: url('../images/logos/lei-de-incentivo-a-cultura.svg');     aspect-ratio: 1.25; }
.footer-logo.luz-ferreira-advogados { background-image: url('../images/logos/luz-ferreira-advogados.svg');    aspect-ratio: 1.5; }
.footer-logo.mercado-livre { background-image: url('../images/logos/mercado-livre.svg');     aspect-ratio: 1.9; }
.footer-logo.ministerio-da-cultura { background-image: url('../images/logos/ministerio-da-cultura.svg'); aspect-ratio: 4; }
.footer-logo.mix-fm { background-image: url('../images/logos/mix-fm.svg') }
.footer-logo.piaui { background-image: url('../images/logos/piaui.svg'); aspect-ratio: 1.5; }
.footer-logo.rede-d-or { background-image: url('../images/logos/rede-d-or.svg');    aspect-ratio: 1.5; }
.footer-logo.rio-prefeitura-cultura { background-image: url('../images/logos/rio-prefeitura-cultura.svg'); aspect-ratio: 3.5; }
.footer-logo.rio-prefeitura-cultura-pro { background-image: url('../images/logos/rio-prefeitura-cultura-pro.svg'); aspect-ratio: 5; }
.footer-logo.santander { background-image: url('../images/logos/santander.svg'); aspect-ratio: 3; }
.footer-logo.sbm-offshore { background-image: url('../images/logos/sbm-offshore.svg') }
.footer-logo.shell { background-image: url('../images/logos/shell.svg');        aspect-ratio: .7; }
.footer-logo.sul-america-paradiso { background-image: url('../images/logos/sul-america-paradiso.svg');    aspect-ratio: 1.8; }
.footer-logo.tag { background-image: url('../images/logos/tag.svg');     aspect-ratio: 1.6; }
.footer-logo.technipfmc { background-image: url('../images/logos/technipfmc.svg');    aspect-ratio: 2.1; }
.footer-logo.volvo { background-image: url('../images/logos/volvo.svg'); aspect-ratio: 2; }
.footer-logo.white-martins { background-image: url('../images/logos/white-martins.svg'); aspect-ratio: 1.8; }
.footer-logo.sulamerica { background-image: url('../images/logos/sulamerica.svg'); aspect-ratio: 1.8; }
.footer-logo.renner { background-image: url('../images/logos/renner.svg'); aspect-ratio: 1.8; }
.footer-logo.vale { background-image: url('../images/logos/vale.svg'); aspect-ratio: 1.1; }


/* ---  SCHEDULE  --- */

#schedule-events{
	transition: all .5s ease;
	display:flex; 
	gap: 1.25em;
	width: fit-content;
}

.schedule-events-wrap{
	background-color: var(--color-lightergray);
	position: relative;
	padding: 1.25em 0;
	margin-top: 1em;
}

.schedule-events-navigation{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 60;
	padding: 0;
	opacity: .25;
	transition: all .3s ease;
}

.schedule-events-navigation:hover{
	opacity: 1;
}

.schedule-events-navigation::before{
	font-family: 'shiro-icon';
	font-size: 1.75em;
	padding: .5em;
}

.schedule-events-navigation.disabled{ display: none; }

.schedule-events-navigation.prev{ left: 0; }
.schedule-events-navigation.next{ right: 0; }

.schedule-events-navigation.prev::before{ content: '\E814'; }
.schedule-events-navigation.next::before{ content: '\E815'; }

.schedule-card{
	background: #fff;
	border: 1px solid transparent;
    opacity: 0.4;
    filter: grayscale(.5);
	transition: all .3s ease;
	width: 15em;
	min-height: 12em;
}

.schedule-card:hover{
	opacity: 1;
	filter: none;
	border-color: transparent;
}

.schedule-card.current{
	opacity: 1;
	filter: none;
    border-color: var(--color-lightgray);
}

.schedule-card.today{
    border-color: var(--color-theme);
	border-width: 2px;
}

/*  --- FANCYBOX ---  */

div.default-item-ajax{
	width: 90vw;
	max-width: 800px;
	padding: 3em 2em 2em 2em;
	max-height: 90vh;
	border-radius: 2em 0 0 0;
	height: 70vh;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}

.fancybox-bg{
	background: var(--color-lightergray) !important;
}

.disclaimer{
	display: inline-flex !important;
	color: var(--color-gray) !important;
    display: flex;
    align-items: center;
    padding: .25em 0;
	font-weight: 600;
	color: #444;
	text-transform: uppercase;
	font-size: .9em;
    margin-top: .25em;
}

.default-item-ajax {
	opacity: 0;
	transition: opacity	.3s ease;
}
.default-item-ajax.loaded {
	opacity: 1;
}

.fancybox-navigation .fancybox-button--arrow_left {
    left: 1.75em !important;
}

.fancybox-navigation .fancybox-button--arrow_right {
    right: 1.75em !important;
}

.fancybox-slide--html {
	padding: 0 !important;
  }

/* ---- SEARCH ----- */

#search-box{
	background-color: var(--color-white-transp);
	backdrop-filter: blur(10px);
	position: fixed;
	inset: 0 0 0;
	display: none;
	justify-content: center;
	align-items: center;
	z-index: -1;
}

#search-form{
	background-color: var(--color-white-transp);
	backdrop-filter: blur(10px);
	position: fixed;
	inset: 0 0 0;
	display: flex;
	flex-direction: column;
	gap: 2em;
	justify-content: center;
	align-items: center;
	z-index: -1;
}

#search-toggle{
    display: flex;
    gap: .5em;
	padding: 0 1.5em;
}

#search-toggle span{
    display: none;
}

@media (width < 1280px) {
	body.menu-expanded.search-expanded .header-menu{
		display: none !important;
	}

	body.menu-expanded.search-expanded > header > div {
		height: auto !important;
	}

	#search-toggle{
		margin: 0 0 1.5em 1.5em;
        padding: 0 1.25em 1.25em 0;
        font-size: 1.25em;
        border-bottom: 2px solid #000;
	}
	#search-toggle span{
		display: block;
	}
}

body.search-expanded #search-box{
	display: flex;
}


#search-form .search-input{
	display: flex;
	width: min(800px, 80%);
	align-items: end;
}

#search-form .search-input input{
	font-size: 2em;
	border: 0;
	outline: 0;
	border-bottom: 3px solid var(--color-black);
	padding: 0.15em 0;
	width: 100%;
	background: transparent;
	font-weight: 600;
}


#search-form .search-input input::placeholder { 
	font-weight: 300;
	color: var(--color-theme);
}


#search-form .search-input button::before{
	content: '';
	display: block;
	width: 1.6em;
	height: 1.6em;
	background-image: url('../images/icon-full-black-search.svg');
	background-repeat: no-repeat;
	object-fit: cover;
	margin: 0 .5em;
}

#search-form .search-filters{
	display: flex;
	gap: 1em;
	flex-wrap: wrap;
	width: min(800px, 80%);
	justify-content: center;
}

#search-form .search-filters .btn:has(input:checked){
	border-color: var(--color-gray);
	color: var(--color-white);
	background-color: var(--color-gray);
}

#search-form .search-filters .btn input{
	display: none;
}

#search-form .search-filters input{
	display: flex;
	gap: 1em;
	flex-wrap: wrap;
	width: min(800px, 80%);
	justify-content: center;
}

.project-landing{
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 450px), 1fr));
	gap: 1.5em;
	margin-top: 2em;
}
.project-landing-item{
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: .5em;
    border: 1px solid var(--color-lightgray);
    color: var(--color-theme);
    font-weight: 700;
    padding: 1em 2em;
    text-align: center;
    border-color: var(--color-lightgray);
    transition: all .3s ease;
    font-size: 1.5em;
}
.project-landing-item:hover{
	box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
}

 /* ----  CARD EXHIBITION LANDING  ---- */  

.exhibition-landing-grid{
	display: flex;
	flex-direction: column;
	gap: 5em 3.5em;
}

.card-exhibition-landing{
	display: flex;
	gap: 3em;
	flex-direction: row;
}
.card.card-exhibition-landing{
	display: flex;
	gap: 1.5em 2em;
	flex-direction: row;
}
.card.card-exhibition-landing .card-content{
	flex: 0 0 20%;
}

.card.card-exhibition-landing .card-content h3{
	margin-bottom: 0;
	font-size: .9em;
}
.card.card-exhibition-landing .card-content h2{
	font-size: 2em;
}
.card.card-exhibition-landing .card-content .mda-description{
	margin-top: 1em;
	font-size: 1.25em;
}
.card.card-exhibition-landing .card-thumb{
	max-height: 70vh;
	flex-grow: 10;
	border-radius: 0 0 0 5em;
}
.card.card-exhibition-landing .card-thumb img{
    width: 100%;
    aspect-ratio: 12 / 6
}
.card.card-exhibition-landing .card-date{
    font-size: 1.25em;
}
.card.card-exhibition-landing .btn{
    margin-top: 2em;
	font-size: .8em;
}

.exhibition-landing-upcoming{
	margin: 5em 0 2em 0;
	grid-column: content-start / content-end;
	text-align: center;
}
.btn-action{
	display: inline-block;
	border: 2px solid var(--color-darkgray);
	border-radius: 2em;
	margin: 0 auto;
	padding: .5em 1.5em;
	font-size: 1.75em;
	font-weight: 600;
	color: var(--color-darkgray);
	transition: all .3s ease;
}
.btn-action:hover {
	border-color: var(--color-theme);
	color: var(--color-theme);
}

@media (width < 800px) {
	.card.card-exhibition-landing {
		flex-direction: column;
	}
	.card.card-exhibition-landing .card-info {
		/* display: flex; */
		gap: 2em;
		margin-right: 1em;
		align-items: end;
	}
	.card.card-exhibition-landing .card-content .mda-description {
		font-size: 1.1em;
	}

	.btn-action{
		font-size: 1.25em;
	}

}

.openStatus{
	display: flex ;
}
.openStatus0{
	color: var(--color-vermelho-material);
}
.openStatus1{
	color: var(--color-laranja-vital);
}
.openStatus2{
	color: var(--color-verde-natural);
}
.openStatus3{
	color: var(--color-vermelho-material);
}


/* -------------  CONTRAST ---------------- */

	body.contrast,
	body.contrast * {
		--color-theme: var(--color-contrast);
		--tint-theme: var(--tint-contrast);	

		--color-lightergray: #FFFFFF;
		--color-lightgray: #FFFFFF;
		--color-gray: #000000;
		--color-darkgray: #000000;
		--color-darkergray: #000000;

		--color-placeholder: #999;
		--color-blue: #133FAA;
		--color-background: #ffffff;

		--color-black: #000000 !important;
		--color-dark: #000000;
		--color-white: #FFFFFF;
		--color-white-transp: #FFFFFFEE;

		--swiper-navigation-color: var(--color-contrast);
		--swiper-theme-color: var(--color-contrast);
		--swiper-pagination-color: var(--color-contrast);
	}

	body.contrast .mda-description,
	body.contrast .mda-description p,
	body.contrast .mda-subdescription,
	body.contrast .mda-subdescription p{
		font-weight: 400;
	}

	body.contrast .article-description,
	body.contrast .article-description p{
		font-weight: 400;
	}
	  

	body.contrast img,
	body.contrast video {
		filter: saturate(0) contrast(1.5) !important;
	}
	
	body.contrast .footer-logo,
	body.contrast main > .hero {
		filter: saturate(0) contrast(1.5) !important;
	}
	body.contrast main > .hero {
		/* z-index: 10; */
		box-shadow: inset 0 -350px 600px #000000dd, inset 0 -20px 40px #000;
	}

	body.contrast .aside-wrap,
	body.contrast .events-item {
		border-color: var(--color-black) !important;
	}

	.caption-link-ImageObject{
		display: none;
	}


	/* --- EVENT --- */

	
	.event-page{
		grid-column: content-start / content-end;

		display: grid;
		grid-template-columns: [content-start] 1fr 1fr 
							   [col1-3] 1fr 1fr 1fr 
							   [col2-3] 1fr 1fr 
							   [content-end];
		gap: 0 var(--container-gap);
	}
	
	.default-item-ajax .event-page{
		grid-template-columns: [content-start] 1fr 1fr 
							   [col1-3] 1fr 1fr  
							   [col2-3] 1fr 1fr 
							   [content-end];
	}

	.event-page header{
		grid-column: content-start / col2-3;
	}
	.event-page article{
		grid-column: content-start / col2-3;
		margin-top: 3em;
	}
	
	.event-page aside{
		grid-column: col2-3 / content-end;
		grid-row: span 2;
		align-self: start;
	}

	.event-page aside .aside-wrap{
		position: sticky;
		top: var(--top-margin);
		border: 1px solid var(--color-lightgray);
		border-radius: .5em;
		padding: 1em 1em;
		display: flex;
		flex-direction: column;
		gap: .25em;
	}

	@media (width < 800px) {
		.event-page{
			display: block;
		}
		.event-page aside,
		.event-page header,
		.event-page article {
			grid-column: content-start / content-end;
		}
	}

	.event-page .ispartof{
		margin-top: 1em;
		font-size: 1.4em;
	}

	.event-page .url-btn{
		margin-top: 1.5em;
	}

	.superevent-grid.card-grid{
	    grid-template-columns: repeat(auto-fill, minmax(min(100%, 400px), 1fr));
		margin-top: 1em;
	}
	.superevent-grid .card{
		text-decoration: none !important;
		flex-direction: row;
	} 
	.superevent-grid .card .card-thumb {
		flex: 0 0 50%;
	}
	.superevent-grid .card .card-text--type,
	.superevent-grid .card .card-text--program {
		font-size: 1.1em;
	}

