/*
	Autor: 
		PUM! estudio

	Index:
		0 -- Variables
		1 -- Main
		2 -- Layers
		3 -- Boxes
			-- Slider
*/

@charset "UTF-8";




/* 0 -- Variables */

:root {
	--box-p-t-l: var(--unit-12);
	--box-p-b-l: var(--unit-12);
	--box-p-t: var(--unit-8);
	--box-p-b: var(--unit-8);
	--box-p-t-s: var(--unit-20);
	--box-p-b-s: var(--unit-20);

	@media ( max-width: 720px ) { 
		--box-p-t-l: var(--unit-8);
		--box-p-b-l: var(--unit-8);
		--box-p-t: var(--unit-6);
		--box-p-b: var(--unit-6);
		--box-p-t-s: var(--unit-10);
		--box-p-b-s: var(--unit-10);
	} 
}




/* 1 -- Main */


.main img,
.main video { display: block; width: 100%;}

@container style(--size-m: true) {
	.main { padding-top: var(--unit-22);}
}
@container style(--size-s: true) {
	.main { padding-top: var(--unit-16);}
}


/* 2 -- Layers */

.layers { position: relative; color: var(--c-white); --c-txt: var(--c-white)}
.layers-fg { position: relative; z-index: 2;}
.layers-bg { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; overflow: hidden;}
.layers-bg img,
.layers-bg video { width: 100%; height: 100%; object-fit: cover;}
.layers-bg::after { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--c-black); opacity: .4; }




/* 3 -- Boxes */

.box { padding-top: var(--box-p-t); padding-bottom: var(--box-p-b);}
.box.box-l { padding-top: var(--box-p-t-l); padding-bottom: var(--box-p-b-l);}
.box.box-s { padding-top: var(--box-p-t-s); padding-bottom: var(--box-p-b-s);}

.box-of-h { overflow: hidden;}

/* -- Hero Slider */
.box-hero .unit-slider { overflow: hidden; border-radius: .2rem;}
.box-hero .unit-slider .unit-slider-item { flex-shrink: 0; display: flex; min-height: 60rem;}
.box-hero .unit-slider .unit-slider-item .unit-card { padding: var(--unit-10) var(--unit-10) var(--unit-16) var(--unit-10);}
.box-hero .unit-slider .unit-slider-item .unit-card-txt { padding: 0;}
.box-hero .unit-slider .flickity-page-dots { width: auto; bottom: var(--unit-10); left: var(--unit-10); z-index: 2; text-align: left; display: flex; flex-direction: row; align-items: center; gap: var(--unit-4);}
.box-hero .unit-slider .flickity-page-dots .dot { width: var(--unit-6); height: var(--unit); background: var(--c-white); border-radius: 0; opacity: 1; margin: 0;}
.box-hero .unit-slider .flickity-page-dots .dot.is-selected { background: var(--c-yellow);}

@container style(--size-m: true) {	
	.box-hero .unit-slider .unit-slider-item .unit-card { padding: var(--unit-5) var(--unit-5) var(--unit-11) var(--unit-5);}
	.box-hero .unit-slider .flickity-page-dots { bottom: var(--unit-6); left: var(--unit-5); gap: var(--unit-3);}
	
}

@container style(--size-s: true) {	
	.box-hero .unit-slider .unit-slider-item { min-height: 30rem;}
	
}

/* -- Grid (Slider Mobile) */
.box-grid.box-slider { overflow: hidden;}
.box-grid.box-slider .unit-slider-mob { row-gap: var(--unit-5);}
.box-grid.box-slider .unit-slider-mob .flickity-page-dots { display: none;}

@container style(--size-s: true) {	
	.box-grid.box-slider .unit-card .unit-card-txt { padding-right: var(--unit-2);}
	
}

/* -- Featured */
.box-featured {  min-height: 50rem; padding: var(--unit-12) var(--unit-8); margin: var(--unit-15) calc(var(--padd) + var(--padd-main));}

@container style(--size-s: true) {	
	.box-featured { min-height: 30rem; padding: var(--unit-6); }
}

/* -- Grid */
.box-grid .unit-grid > .f-row { row-gap: var(--unit-6);}
.box-grid .unit-card .unit-media { aspect-ratio: 3/4;}
.box-grid .unit-card .unit-card-txt { padding-right: var(--unit-4);}

@container style(--size-s: true) {	
	.box-grid .unit-grid .unit-grid-item:nth-child(odd) { padding-right: var(--unit-3);}
	.box-grid .unit-grid .unit-grid-item:nth-child(even) { padding-left: var(--unit-3);}
}

.box.box-l.box-grid.box-projects { --box-p-b-l: var(--unit-40);}
.box-grid.box-projects .unit-media { aspect-ratio: 1/1;}
.box-grid.box-projects .border-b-top::before { margin-bottom: var(--unit-3);}

@container style(--size-m: true) {	
	.box.box-l.box-grid.box-projects { --box-p-b-l: var(--unit-20);}
}
@container style(--size-s: true) {	
	.box.box-l.box-grid.box-projects { --box-p-b-l: var(--unit-10);}
}

/* -- List */
.box-list .box-list-item { padding: var(--unit-2) 0; border-top: var(--border-1-b); text-decoration: none;}
.box-list .box-list-item.disabled { border-color: var(--c-black-500);}
.box-list .box-list-item.disabled * { border-color: var(--c-black-500); color: var(--c-black-500);}
.box-list .box-list-item.disabled.hover .cta-primary { color: var(--c-white); border-color: var(--c-black);}
.box-list .box-list-item:has(.cta-list-item) { cursor: pointer;}
.box-list .box-list-item:has(.cta-list-item) .box-list-item-content { max-height: 0; overflow: hidden; transition: all .8s var(--bezier);}
.box-list .box-list-item.active .box-list-item-content { max-height: 100cqh;}
.box-list .box-list-item.active .icon:after { transform: rotate(-180deg); background-image: var(--icon-b-less);}

/* -- List (Guía) */
.box-list.box-guide .box-list-item { display: block; padding: var(--unit-2) var(--unit-5) var(--unit-8) 0;}
.box-list.box-guide .box-list-item.hover { background-color: var(--c-yellow);}
.box-list.box-guide .box-list-item .txt-h2 { transition: all .4s var(--bezier);}
.box-list.box-guide .box-list-item .icon { transition: all .4s var(--bezier);}
.box-list.box-guide .box-list-item.hover .txt-h2 { transform: translateX(var(--unit-4));}
.box-list.box-guide .box-list-item.hover .icon { transform: translateX(var(--unit-2));}

@container style(--size-m: true) {	
	.box-list.box-guide .box-list-item { padding: var(--unit-2) var(--unit-2) var(--unit-6) 0;}
	.box-list.box-guide .box-list-item.hover .txt-h2 { transform: translateX(var(--unit-2));}
	.box-list.box-guide .box-list-item.hover .icon { transform: translateX(var(--unit));}
	
}

/* -- Text */
.box-text .unit-media { width: auto; height: auto; max-height: 64rem; min-width: 100%;}

.box-translate * { color: var(--c-black-400); font-style: italic;}

/* -- Filter */
.box-list.box-filter { position: relative;}
.box-list.box-filter .filter-link { padding-top: var(--unit-4);}

@container style(--size-m: true) {	
	.box-filter:has(.unit-filter-btns) > .col-main { padding: 0;}
	.box-filter:has(.unit-filter-btns) .col9-12 { padding: 0 var(--padd-main);}
	.box-list.box-filter .filter-link { padding: 0 calc(var(--padd) + var(--padd-main)) var(--unit-2);}
	
}

/* -- Cards (Horizontales) */
.box-cards-item .unit-card { width: 100%; display: flex; flex-direction: row; justify-content: start;}
.box-cards-item:nth-child(even) .unit-card { justify-content: end;}
.box-cards-item .unit-card-in:before { content: ''; display: block; width: 30%; height: .1rem; background-color: var(--c-black); margin-left: var(--padd); margin-bottom: var(--unit-8);}
.box-cards-item .unit-media { aspect-ratio: 16/9;}

@container style(--size-m: true) {	
	.box-cards-item .unit-card-in:before { width: 40%; margin-bottom: var(--unit-3);}
	
}

/* -- Ficha Artista */
.box-artist .box-artist-title-s { display: none;}
.box-artist .box-artist-title a,
.box-artist .box-artist-title-s a { text-decoration: none;}

@container style(--size-m: true) {	
	.box-artist .box-artist-title { display: none;}
	.box-artist .box-artist-title-s { display: flex;}
}

.box-media-full .unit-media img,
.box-media-full .unit-media video { aspect-ratio: 7/3;}

@container style(--size-s: true) {	
	.box-media-full .unit-media img,
	.box-media-full .unit-media video { aspect-ratio: 1/1;}
}

/* -- 404 */
.box-404 { height: 90vh;}
.box-404 a { text-decoration: underline; text-decoration-thickness: 0.05em; text-underline-offset: 0.15em;}
.box-404 .col-main,
.box-404 .box-404-in { height: 100%;}
.box-404 .txt-h0 { font-size: 23rem; font-weight: 400; line-height: 1em; letter-spacing: 0;}

@container style(--size-m: true) {	
	.box-404 .txt-h0 { font-size: 8rem;}
}


/* -- Desplegable de texto */
.box-text-drop .box-text-drop-item .box-text-drop-content { max-height: 0; overflow: hidden; transition: all .8s var(--bezier);}
.box-text-drop .box-text-drop-item.active .box-text-drop-content { max-height: 100000cqh;}
.box-text-drop .box-text-drop-item.active .icon:after { transform: rotate(-180deg); background-image: var(--icon-b-less);}


body.page-template-page-convocatorias-historico,
body.page-template-page-convocatorias-historico .header { background-color: var(--c-black-100);}
/* The end -- :P */