/* ΛΑΛΑ site plumbing — textures, party mode, splide/menu overrides, responsive.
   DESIGN classes (lala-hero, lala-event-card, …) now live as Bricks Global Classes:
   manage them in the builder's class manager. */

/* ΛΑΛΑ global styles — ported from lalaspiti.com Customizer CSS (Elementor build)
   Selector adaptations for Bricks are marked with [brx]. */

::-webkit-scrollbar {
width: 8px;
	background: #fff;
}

::-webkit-scrollbar-track {
background: white;
}

::-webkit-scrollbar-thumb {
background: black;
	background: #e5279d;
}

::-webkit-scrollbar-thumb:hover {
background: #e5279d;
}

::selection {
background: #fcc1e2;
	color: #000000;
}

html, body {
background: linear-gradient(135deg, #ff94fa 40%, #79edff), #ff94fa;
	font-family: "Advent Pro", sans-serif;
	background-attachment: fixed;
	scroll-behavior: smooth;
	min-height: 100%; /* [brx] height:100% + Bricks' flex-column body squeezes main to its min-height */
	overflow-x: hidden;
	overflow-y: auto;
}

/* [brx] Bricks renders body as a flex column; without this, a 100%-tall body
   squeezes header/main/footer instead of letting the body scroll like prod */
body > #brx-header,
body > #brx-content,
body > #brx-footer {
flex-shrink: 0;
}

body {
transition: background .3s ease-in-out;
}

/* [brx] main content wrapper */
main#brx-content {
position: relative;
	min-height: calc(100vh - 350px);
	z-index: 3;
}

/* [brx] header/footer stacking */
#brx-footer {
position: relative;
	z-index: 4;
}

#brx-header {
z-index: 4;
	position: relative;
}

.textured, .timeline-divider, .timeline__item:after, .timeline:not(.timeline--horizontal):before, .timeline-nav-button {
background:            url("https://lalaspiti.yellowquark.com/wp-content/uploads/2023/04/texture.png");
	background-repeat:     no-repeat;
	background-position:   center 0;
	background-color:      rgba(255, 240, 0, 0.8)!important;
	background-blend-mode: color-burn;
	background-size:       cover;
	display:               flex;
	justify-content:       center;
	align-items:           center;
	transition: none;
}

.yass-container {
position: fixed;
	bottom: 20px;
	right: 24px;
	width: 88px;
	height: 88px;
	transition: 1s linear;
	z-index: 10;
	cursor: pointer;
}

.yass-container.minify {
transform: scale(0);
}

.yass-container .yass {
background: linear-gradient(-135deg, #fcb1ec 40%, #6192ee);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	animation: spin 0.6s linear infinite;
	animation-play-state: paused;
	text-shadow: 0 0 2px rgba(255, 255, 255, 0.68), 0 0 5px rgba(255, 255, 255, 0.68), 0 0 2px rgba(255, 255, 255, 0.68);
	cursor: pointer;
	background: url("https://lalaspiti.yellowquark.com/wp-content/uploads/2023/04/new-textures.gif");
	background-size: 400px;
	font-weight: 700;
	width: 88px;
	height: 88px;
	border-radius: 50%;
	color: #ffffff;
	transition: 0.2s ease-in-out;
	box-shadow: 1px 1px 10px 2px rgba(0, 0, 0, 0.2117647059);
}

.yass-container .yass span::after {
content: "";
	font-size: 35px;
	color: #ffffff;
	width: calc(100% - 10px);
	height: calc(100% - 10px);
	position: absolute;
	left: 5px;
	right: 0;
	bottom: 0;
	top: 5px;
	background: rgba(0, 0, 0, 0.05);
	background: url("https://lalaspiti.yellowquark.com/wp-content/uploads/2023/04/yass.svg");
	background-color: rgba(255, 240, 0, 0.82);
	background-size: 110%;
	background-repeat: no-repeat;
	background-position: center center;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	line-height: 120px;
	font-weight: 200;
}

@keyframes spin {
from { transform: rotate(0); }
	to   { transform: rotate(360deg); }
}

.neonText.textured {
width: 105vw;
	background-size: 100%;
	background-color: rgba(255, 240, 0, 0.82);
	box-shadow: 0 0 50px white;
	line-height: 25vw;
	padding: 40px;
	transform: translateX(-20px) rotate(-2deg);
	color: #fff;
	text-shadow: 0 0 .3rem #ffffff, 0 0 .9rem #ffffff, 0 0 1.7rem #ffffff, 0 0 1rem #ffffff, 0 0 1.8rem #ffffff, 0 0px 3.9rem #e5279d;
	font-size: 25vw;
	font-weight: 100;
}

.noise {
opacity: .15;
	height: 900vh;
	transform: translateZ(0);
	width: 100%;
	pointer-events: none;
	top: 0;
	position: fixed;
	background: url("https://lalaspiti.yellowquark.com/wp-content/uploads/2023/04/noise.gif");
	-webkit-animation: noise 10s ease-in-out infinite;
	animation: noise 10s ease-in-out infinite;
}

.vaporwave-grid-container {
margin: auto;
	height: 120vmin;
	width: 100%;
	perspective: 100px;
	display: flex;
	position: fixed;
	align-items: center;
	justify-content: center;
	transform: translate3d(-1px, -1px, -1px);
	pointer-events: none;
	transition: all 0.25s linear;
}

.vaporwave-grid {
transform: rotateX(50deg) translate3d(1px, 1px, 1px);
	width: 1000%;
	height: 140vmin;
}

.vaporwave-grid div {
background: url("https://lalaspiti.yellowquark.com/wp-content/uploads/2023/04/grid.svg");
	width: 100%;
	height: 100%;
	display: block;
	filter: blur(0.05vw);
	transition: 0.2s linear;
}

.vaporwave-grid.animated {
animation: vaporwave 1s infinite linear both;
}

@keyframes vaporwave {
0%   { transform: rotateX(50deg) translate3d(1px, 1px, 1px); }
	100% { transform: rotateX(50deg) translate3d(1px, -22%, 1px); }
}

.contact-button {
transform: rotate(-2deg);
	margin-right: -40%;
}

.social-button {
width: 44px;
	height: 44px;
	border-radius: 50%;
	padding: 8px!important;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-size: 28px!important;
	font-weight: 400;
}

.social-button i {
margin: 0;
	width: 100%;
	height: 100%;
}

.social-button span {
display: none;
}

/* [brx] loop carousel cards (Bricks slider uses splide, not swiper) */
.latest-events .splide__slide {
height: auto!important;
}

.latest-events .splide__list {
padding-bottom: 14px!important;
	padding-right: 14px!important;
}

/* cookie banner (when consent plugin is added) */
.cmplz-cookiebanner .cmplz-title {
font-size: 20px!important;
}

.cmplz-cookiebanner.cmplz-show {
box-shadow: 0 20px 40px black;
	border: solid 7px black;
}





/* ===== Header ===== */
#brx-header {
position: sticky;
	top: 0;
	box-shadow: 0 5px 30px rgba(0, 0, 0, .24);
}



.lala-logo-wrap .brxe-svg.logo svg,
.lala-logo-wrap svg.logo,
.brxe-svg.logo svg {
height: 40px;
	width: auto;
	display: block;
}

.lala-mainmenu .bricks-nav-menu > li > a {
font-family: 'Advent Pro', sans-serif;
	font-weight: 600;
	font-size: 20px;
	color: #16163f;
	padding: 0;
}

.lala-mainmenu .bricks-nav-menu {
column-gap: 36px;
}

.lala-search input[type="search"] {
background: transparent;
	border: none;
	border-bottom: 1px solid rgba(255,255,255,.5);
	color: #fff;
}

/* ===== Homepage ===== */
.lala-hero {
transform: rotate(-4deg);
	box-shadow: 8px 10px 0 0 #000000;
	width: 70%;
	margin: 120px auto 0 auto;
}

.lala-event-card-body {
padding: 8px 12px 16px 12px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.lala-spotify-slides {
margin-top: -22px; padding-bottom: 80px;
}

.lala-spotify-slides .brxe-shortcode {
width: 100%;
}

/* chevron gutters + dots below content on both carousels */
.latest-events .brxe-slider-nested,
.lala-spotify-slides .brxe-slider-nested {
padding: 0 56px;
}

.latest-events .splide__track,
.lala-spotify-slides .splide__track {
overflow: hidden;
}

.latest-events .splide__arrow--prev,
.lala-spotify-slides .splide__arrow--prev {
left: 6px;
}

.latest-events .splide__arrow--next,
.lala-spotify-slides .splide__arrow--next {
right: 6px;
}

.latest-events .splide__pagination,
.lala-spotify-slides .splide__pagination {
position: static;
	margin-top: 16px;
	padding: 0;
	width: 100%;
	justify-content: center;
	display: flex;
	transform: none!important;
	left: auto!important;
}

.latest-events .splide__arrow,
.lala-spotify-slides .splide__arrow {
background: transparent;
}

/* button hover (kit: black bg + magenta text) */
.bricks-button:hover {
background-color: #000000!important;
	color: #E5279D!important;
	transition: .2s ease-in-out;
}

/* ===== Footer ===== */
#brx-footer a {
color: #fff;
}

/* full-bleed header & footer bars (prod spans edge to edge), content boxed at 1200 */
#brx-header .lala-utilbar,
#brx-header .lala-gradbar,
#brx-footer > .brxe-container {
width: 100%;
	max-width: 100%;
}

#brx-header .lala-utilbar {
padding-left: max(16px, calc((100% - 1200px) / 2));
	padding-right: max(16px, calc((100% - 1200px) / 2));
}

#brx-header .lala-gradbar {
padding-left: max(8px, calc((100% - 1200px) / 2));
	padding-right: max(8px, calc((100% - 1200px) / 2));
}

/* ===== Inner pages ===== */
/* gallery grid */
.lala-gallery {
width: 100%;
}

/* flip cards (About: Τι κάνουμε) */
.lala-flip {
perspective: 1000px; min-height: 400px;
}

.lala-flip-front, .lala-flip-back {
position: absolute;
	inset: 0;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: 6px 6px 0 #000;
}

/* about layout */
.lala-about-text {
position: sticky; top: 140px;
}

/* forms */
.lala-form input, .lala-form select, .lala-form textarea {
border: 2px solid #000;
	border-radius: 0;
	background: #fff;
}

.lala-form label {
font-weight: 600;
}

/* press cards */
.lala-press-card {
background: #fff;
	box-shadow: 10px 10px 0 #000;
	display: flex;
	flex-direction: row;
	gap: 24px;
	padding: 24px;
	align-items: center;
}



/* events page tiles */
.lala-event-tile {
position: relative;
	display: block;
	overflow: hidden;
	box-shadow: 6px 6px 0 #000;
	background: #E5279D;
}

/* filter bar */
.lala-filterbar ul, .lala-filterbar {
display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: center;
	list-style: none;
	padding: 0;
}



/* resident cards */
.lala-resident-card {
background: rgba(255, 255, 255, 0.76);
	border: 7px solid #000;
	display: flex;
	flex-direction: column;
}

/* supporter hover swap (Υποστήριξέ μας) */
.lala-supporter {
position: relative; width: 300px; flex-shrink: 0;
}

/* single event (prod: content directly on gradient, white links, right-aligned bold date) */
.lala-single-event {
margin: 0 auto;
}

/* legal / plain pages */
body.page-template-default #brx-content > .page,
body.page-template-default article.page {
max-width: 900px;
	margin: 40px auto 80px;
	background: #fff;
	padding: 32px;
	box-shadow: 10px 10px 0 #000;
}

/* events: Erga artists box (prod: #FFFFFFC2 + 7px black border) */
.lala-erga-box {
background: rgba(255, 255, 255, 0.76);
	border: 7px solid #000;
	padding: 24px 28px;
}

/* residencies: slider hard shadow + intro width */
.lala-resid-slider {
box-shadow: 10px 10px 0 #000;
}

/* support: supporter blink + hue animation, quote text-stroke, ways rows */
.lala-supporter .lala-supporter-before {
animation: supporter 4s linear infinite;
}

@keyframes supporter {
0% { opacity: 1; }
	10% { filter: hue-rotate(0deg); }
	11% { filter: hue-rotate(50deg); }
	12% { filter: hue-rotate(0deg); }
	60% { opacity: 1; }
	61% { opacity: 0.1; }
	65% { opacity: 0.1; }
	66% { opacity: 1; }
	80% { filter: hue-rotate(0deg); }
	81% { filter: hue-rotate(150deg); }
	82% { filter: hue-rotate(0deg); }
	100% { opacity: 1; }
}

/* about: full-bleed collage + overlaid black box with yellow bars */
.lala-about-hero {
position: relative;
}



.lala-slide-img img {
	width: 100%;
	height: 420px;
	object-fit: cover;
	display: block;
}

/* ===== Contact card (prod: white 680px card, 6px black border, pink field borders) ===== */
.lala-contact-card {
	background: #fff;
	border: 6px solid #000;
	width: 680px;
	max-width: 100%;
}
.lala-form input:not([type="submit"]), .lala-form select, .lala-form textarea {
	border: 2px solid #E5279D!important;
	border-radius: 0!important;
	background: transparent!important;
}
.lala-form label { font-weight: 600; color: #000; }

/* mobile: no carousel arrows, tighter gutters (section padding provides the 20px) */



/* =======================================================================
   RESPONSIVE LAYER  — class-driven so it works on both languages.
   .lala-grid = grid container | .lala-row = horizontal flex | .lala-sect = page section
   ======================================================================= */

/* every section keeps breathing room on small screens */




/* burger: black, never the default blue */
.bricks-mobile-menu-toggle,
.bricks-mobile-menu-toggle .bar,
#brx-header .bricks-mobile-menu-toggle { color: #000!important; }
.bricks-mobile-menu-toggle .bar { background-color: #000!important; }

/* residency slide images (the class sits ON the img element) */
img.lala-slide-img {
	width: 100%;
	height: 420px;
	object-fit: cover;
	display: block;
}

/* popups must fit small screens too */


/* ===== mobile round 2 ===== */




/* residencies slider: frame hugs the image, no fixed height, one slide per view */
.lala-resid-slider,
.lala-resid-slider .splide__track,
.lala-resid-slider .splide__list,
.lala-resid-slider .splide__slide,
.lala-resid-slider .brxe-block {
	height: auto!important;
	min-height: 0!important;
}
img.lala-slide-img {
	width: 100%;
	height: auto!important;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	display: block;
}