*{
margin: 0;
padding: 0;
box-sizing: border-box;
}

body {
font-family: "Syne Mono", monospace;
background: #b0603e;
color: #f3f3d6;
}

.hero {
min-height: 100vh;
width: 100%;
position: relative;
overflow: hidden;

background-image: url("assets/hero-bg.png");
background-size: cover;
background-position: center;
background-repeat: no-repeat;

display: flex;
align-items: center;
justify-content: center;

padding: 48px 22px;
}

.menu-button {
position: absolute;
top: 38px;
right: 30px;
width: 40px;
height: 30px;

background: none;
border: none;

display: flex;
flex-direction: column;
justify-content: space-between;
}

.menu-button span {
height: 5px;
width: 100%;
background: #f3f3d6;
border-radius: 999px;
}

.hero-content {
width: 100%;
max-width: 430px;

display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}

.hero-logo {
width: 100%;
max-width: 310px;
height: auto;
margin-bottom: 60px;
}

.hero-info {
margin-top: -130px;
    margin-bottom: 50px;

font-size: 25px;
line-height: 1.35;
letter-spacing: 1px;

text-shadow: 0 3px 12px rgba(71, 54, 43, 0.45);
}

.hero-buttons {
display: flex;
flex-direction: column;
gap: 24px;
align-items: center;
margin-top: -20px;
}

.hero-button {
width: 180px;
height: 60px;

display: flex;
justify-content: center;
align-items: center;

background: #f3f3d6;
color: #e87c34;

border-radius: 999px;

text-decoration: none;
text-transform: uppercase;

font-size: 18px;
letter-spacing: 1px;

box-shadow: 6px 5px 0 rgba(71, 54, 43, 0.75);
}
.ticket-page {
min-height: 100vh;
width: 100%;
position: relative;
overflow-x: hidden;

background-image: url("assets/ticket-bg.png");
background-size: cover;
background-position: center;
background-repeat: no-repeat;

font-family: "Syne Mono", monospace;
color: #f3f3d6;
}

.ticket-header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 105px;

display: flex;
align-items: center;
justify-content: space-between;

padding: 22px 30px;

background: rgba(176, 96, 62, 0.38);
backdrop-filter: blur(6px);
z-index: 20;
}

.ticket-header-logo {
width: 145px;
height: auto;
display: block;
}

.ticket-menu {
width: 38px;
height: 28px;

background: none;
border: none;

display: flex;
flex-direction: column;
justify-content: space-between;
}

.ticket-menu span {
display: block;
width: 100%;
height: 3px;
border-radius: 999px;
background: #f3f3d6;
}

.ticket-content {
min-height: 100vh;
padding: 100px 18px 70px;

display: flex;
flex-direction: column;
align-items: center;
}

.ticket-table {
width: 100%;
max-width: 390px;
height: auto;
display: block;
margin-bottom: 30px;
}

.ticket-cta {
width: 220px;
min-height: 65px;

display: flex;
align-items: center;
justify-content: center;

background: #f3f3d6;
color: #e87c34;

border-radius: 999px;

text-align: center;
text-decoration: none;
text-transform: uppercase;

font-size: 20px;
line-height: 1.25;
letter-spacing: 1px;

box-shadow: 8px 8px 0 rgba(0, 0, 0, 0.85);
}
.hero-button,
.ticket-cta {
transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.hero-button:hover,
.ticket-cta:hover {
transform: translateY(-3px);
filter: brightness(1.04);
box-shadow: 7px 7px 0 rgba(71, 54, 43, 0.65);
}

.hero-button:active,
.ticket-cta:active {
transform: translateY(2px);
box-shadow: 3px 3px 0 rgba(71, 54, 43, 0.65);
}
.ticket-header {
height: 115px;
padding: 24px 54px;
}

.ticket-header-logo {
width: 190px;
}

.ticket-menu {
width: 38px;
height: 28px;
}

.ticket-menu span {
height: 3px;
}

.ticket-content {
min-height: auto;
padding: 150px 40px 120px;
}

.ticket-table {
width: min(92vw, 980px);
max-width: none;
margin-bottom: 80px;
}

.ticket-cta {
width: 285px;
min-height: 72px;
font-size: 22px;
box-shadow: 5px 5px 0 rgba(71, 54, 43, 0.65);
}
.artists-page {
min-height: 100vh;
background-image: url("assets/hero-bg.png");
background-size: cover;
background-position: center top;
background-attachment: fixed;
color: #f3f3d6;
font-family: "Syne Mono", monospace;
overflow-x: hidden;
}

.artists-header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 92px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 22px 30px;
background: rgba(176, 96, 62, 0.22);
backdrop-filter: blur(3px);
z-index: 20;
}

.artists-logo {
width: 130px;
height: auto;
}

.artists-menu {
width: 38px;
height: 28px;
background: none;
border: none;
display: flex;
flex-direction: column;
justify-content: space-between;
}

.artists-menu span {
display: block;
width: 100%;
height: 3px;
border-radius: 999px;
background: #f3f3d6;
}

.artists-hero {
padding: 135px 24px 28px;
text-align: center;
}

.artists-hero h1 {
color: #f3f3d6;
font-size: 52px;
line-height: 1;
text-transform: uppercase;
text-align: center;
text-shadow: 5px 5px 0 rgba(71, 54, 43, 0.65);
}

.artists-list {
padding: 25px 24px 45vh;
display: flex;
flex-direction: column;
align-items: center;
gap: 82px;
}

.artists-list p {
width: 100%;
max-width: 360px;
margin: 0;
font-size: 30px;
line-height: 1.25;
text-align: center;
color: rgba(71, 54, 43, 0.55);
opacity: 0.55;
transform: scale(1);
transform-origin: center center;
transition: transform 0.35s ease, opacity 0.35s ease, color 0.35s ease;
}

.artists-list p.is-active {
color: #47362b;
opacity: 1;
transform: scale(1.55);
}

@media (min-width: 900px) {
.artists-logo {
width: 170px;
}

.artists-hero {
padding-top: 155px;
padding-bottom: 45px;
}

.artists-hero h1 {
font-size: 78px;
}

.artists-list {
gap: 110px;
}

.artists-list p {
max-width: 900px;
font-size: 52px;
}
}
.artists-list {
padding: 80px 24px 45vh !important;
gap: 95px !important;
}

.artists-list p {
font-size: 30px !important;
line-height: 1.25 !important;
text-align: center !important;
color: rgba(71, 54, 43, 0.45);
opacity: 0.45;
transform: scale(1);
transform-origin: center center;
transition: transform 0.25s ease, opacity 0.25s ease, color 0.25s ease;
}

.artists-list {
padding: 80px 24px 45vh !important;
gap: 95px !important;
}

.artists-list p {
font-size: 30px !important;
line-height: 1.25 !important;
text-align: center !important;
color: rgba(71, 54, 43, 0.45);
opacity: 0.45;
transform: scale(1);
transform-origin: center center;
transition: transform 0.25s ease, opacity 0.25s ease, color 0.25s ease;
}
.artists-list p {
transform-origin: center center !important;
transition: transform 0.3s ease, opacity 0.3s ease, color 0.3s ease !important;
}
.artists-list {
padding: 35px 24px 120px !important;
gap: 28px !important;
}

.artists-list p {
width: 100% !important;
max-width: 360px !important;
margin: 0 !important;

font-size: 28px !important;
line-height: 1.2 !important;
text-align: center !important;

color: #47362b !important;
opacity: 1 !important;

transform: none !important;
transition: none !important;
}

.artists-hero {
padding-bottom: 28px !important;
}

.artists-hero h1 {
color: #f3f3d6 !important;
text-align: center !important;
text-shadow: 5px 5px 0 rgba(71, 54, 43, 0.65) !important;
}
.artist-timetable-button {
width: 220px;
height: 52px;

display: flex;
justify-content: center;
align-items: center;

margin: 0 auto 42px;

background: #f3f3d6;
color: #e87c34;

border-radius: 999px;

text-decoration: none;
text-transform: uppercase;

font-size: 20px;
letter-spacing: 1px;

box-shadow: 5px 5px 0 rgba(71, 54, 43, 0.65);

transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.artist-timetable-button:hover {
transform: translateY(-3px);
filter: brightness(1.04);
box-shadow: 7px 7px 0 rgba(71, 54, 43, 0.65);
}

.artist-timetable-button:active {
transform: translateY(2px);
box-shadow: 3px 3px 0 rgba(71, 54, 43, 0.65);
}
.coming-soon-page {
min-height: 100vh;
width: 100%;

display: flex;
align-items: center;
justify-content: center;

background-image: url("assets/hero-bg.png");
background-size: cover;
background-position: center;
background-repeat: no-repeat;

color: #f3f3d6;

font-family: "Syne Mono", monospace;
text-align: center;
}
.coming-soon-page h1 {
font-size: 42px;
font-weight: 400;
letter-spacing: 1px;
color: #f3f3d6;
text-shadow: 2px 2px 0 rgba(71, 54, 43, 0.65);
}
.coming-back {
position: absolute;
top: 28px;
left: 28px;

color: #f3f3d6;
text-decoration: none;
font-size: 18px;
text-shadow: 2px 2px 0 rgba(71, 54, 43, 0.65);
}
@media (min-width: 900px) {
.artists-header {
position: fixed;
}

.artist-timetable-button {
position: fixed;
top: 28px;
left: 50%;
transform: translateX(-50%);
margin: 0;
z-index: 30;
}

.artist-timetable-button:hover {
transform: translateX(-50%) translateY(-3px);
}

.artist-timetable-button:active {
transform: translateX(-50%) translateY(2px);
}

.artists-hero {
padding-top: 115px !important;
padding-bottom: 25px !important;
}

.artists-list {
padding-top: 10px !important;
}
}
@media (min-width: 1000px) {
.artists-list p {
font-size: 36px !important;
}
}
@media (max-width: 899px) {
.artists-hero {
padding-bottom: 25px !important;
}

.artists-list {
padding-top: 0 !important;
}
}
@media (max-width: 899px) {
.artists-hero {
padding-top: 115px !important;
}
}
@media (max-width: 899px) {
.artists-list {
margin-top: 30px !important;
}
}
@media (max-width: 899px) {
.artists-title {
margin-top: 70px !important;
}
}
.ticket-header {
justify-content: space-between !important;
}

.ticket-header-logo {
width: 130px !important;
height: auto !important;
object-fit: contain !important;
}

@media (min-width: 900px) {
.ticket-header-logo {
width: 170px !important;
}
}
.ticket-header {
padding-left: 0 !important;
}

.ticket-header-logo {
margin-left: 0 !important;
}
.ticket-header,
.artists-header {
height: 92px !important;
padding: 22px 30px !important;
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
}

.ticket-header-logo,
.artists-logo {
width: 130px !important;
height: auto !important;
margin-left: 0 !important;
transform: none !important;
}

.ticket-menu,
.artists-menu {
width: 38px !important;
height: 28px !important;
}
.ticket-header-logo,
.artists-logo {
transform: translate(-12px, 8px) !important;
}
.ticket-table {
transform: translateY(-60px) !important;
}
.ticket-cta {
transform: translateY(-140px) !important;
}
.gallery-page {
min-height: 100vh;
background-image: url("assets/hero-bg.png");
background-size: cover;
background-position: center top;
background-repeat: no-repeat;
font-family: "Syne Mono", monospace;
color: #f3f3d6;
overflow-x: hidden;
}

.gallery-header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 92px;
padding: 22px 30px;

display: flex;
align-items: center;
justify-content: space-between;

background: rgba(176, 96, 62, 0.22);
backdrop-filter: blur(3px);
z-index: 20;
}

.gallery-logo {
width: 130px;
height: auto;
transform: translate(-12px, 20px);
}

.gallery-menu {
width: 38px;
height: 28px;
background: none;
border: none;

display: flex;
flex-direction: column;
justify-content: space-between;
}

.gallery-menu span {
display: block;
width: 100%;
height: 3px;
border-radius: 999px;
background: #f3f3d6;
}

.gallery-content {
width: 100%;
min-height: 100vh;
padding: 125px 24px 80px;

display: flex;
flex-direction: column;
align-items: center;
}

.gallery-content h1 {
margin: 0 0 26px;
font-size: 48px;
text-transform: uppercase;
color: #f3f3d6;
text-shadow: 5px 5px 0 rgba(71, 54, 43, 0.65);
}

.gallery-content h2 {
margin: 0 0 55px;
font-size: 54px;
color: #f3f3d6;
text-shadow: 5px 5px 0 rgba(71, 54, 43, 0.65);
}

.gallery-card {
width: min(82vw, 520px);
height: 145px;
margin-bottom: 42px;

display: flex;
align-items: center;
justify-content: center;

text-decoration: none;
background-size: cover;
background-position: center;

position: relative;
overflow: hidden;
}

.gallery-card::before {
content: "";
position: absolute;
inset: 0;
background: rgba(71, 54, 43, 0.45);
}

.gallery-card span {
position: relative;
z-index: 2;

color: #f3f3d6;
font-size: 34px;
text-transform: uppercase;
text-align: center;
text-shadow: 4px 4px 0 rgba(71, 54, 43, 0.75);
}

.gallery-aftermovie {
background-image: url("assets/aftermovie.jpg");
}

.gallery-photos {
background-image: url("assets/galeria-kepek.jpg");
}

@media (min-width: 900px) {
.gallery-logo {
width: 170px;
}

.gallery-content h1 {
font-size: 72px;
}

.gallery-content h2 {
font-size: 82px;
}

.gallery-card {
width: 620px;
height: 170px;
}

.gallery-card span {
font-size: 44px;
}
}
.gallery-card {
width: 620px;
height: 170px;
}

.gallery-card span {
font-size: 44px;
}
.gallery-card {
box-shadow: 10px 10px 0 rgba(71, 54, 43, 0.75) !important;
transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.gallery-card:hover {
transform: translateY(-4px);
box-shadow: 14px 14px 0 rgba(71, 54, 43, 0.75) !important;
filter: brightness(1.05);
}

.gallery-card:active {
transform: translateY(2px);
box-shadow: 6px 6px 0 rgba(71, 54, 43, 0.75) !important;
}
@media (max-width: 899px) {
.gallery-card {
width: min(78vw, 520px) !important;
height: 145px !important;
margin-left: auto !important;
margin-right: auto !important;
}
}
.ticket-table-code {
color: #f3f3d6 !important;
}

.ticket-table-code h1 {
font-size: 52px !important;
color: #f3f3d6 !important;
text-shadow: 5px 5px 0 rgba(71, 54, 43, 0.65) !important;
}

.ticket-table-code th,
.ticket-table-code td,
.ticket-table-code span,
.ticket-table-code s {
color: #f3f3d6 !important;
}

@media (min-width: 900px) {
.ticket-table-code h1 {
font-size: 78px !important;
}
}
@media (max-width: 899px) {

.ticket-table-code {
width: 95%;
margin: 110px auto 40px;
}

.ticket-table-code h1 {
font-size: 36px !important;
margin-bottom: 24px;
}

.ticket-table-code table {
table-layout: fixed;
width: 100%;
}

.ticket-table-code th,
.ticket-table-code td {
font-size: 9px;
padding: 4px 2px;
word-break: break-word;
}

.ticket-table-code span {
font-size: 7px;
}

.ticket-table-code th:first-child,
.ticket-table-code td:first-child {
width: 24%;
}
}
.ticket-table {
width: min(92vw, 980px) !important;
max-width: none !important;
display: block !important;
margin: 120px auto 80px !important;
transform: translateY(-40px) !important;
}

.ticket-table-code {
display: none !important;
}
.ticket-table {
width: 95vw !important;
max-width: 620px !important;
margin: 15px auto 85px !important;
display: block !important;
transform: translateY(-35px) !important;
}
.ticket-table {
display: block !important;
margin-left: auto !important;
margin-right: auto !important;
transform: translateY(-80px) !important;
}
.ticket-content {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
}

.ticket-table {
display: block !important;
margin-left: auto !important;
margin-right: auto !important;
transform: translateY(-50px, -80px) !important;
position: relative !important;
left: 40 !important;
right: 0 !important;
}
.ticket-table {
transform: translate(-25px, -80px) !important;
}
@media (min-width: 900px) {
img[src="assets/logo-arato.png"].hero-logo {
width: 620px !important;
max-width: 400px !important;
}
}
@media (min-width: 900px) {
.hero-logo {
transform: translateY(-60px) !important;
}
}
@media (min-width: 900px) {
.hero-info {
transform: translateY(-70px) !important;
}

.hero-buttons {
transform: translateY(-70px) !important;
}
}
@media (min-width: 900px) {
.hero-info p {
font-size: 32px !important;
line-height: 1.25 !important;
}
}
.hero-socials {
position: absolute;
right: 38px;
bottom: 100px;

display: flex;
flex-direction: column;
align-items: center;
gap: 12px;
}

.soundcloud-button {
background: #1f1813;
color: #f3f3d6;

padding: 10px 16px;
border-radius: 999px;

font-family: "Syne Mono", monospace;
font-size: 13px;
line-height: 1.1;
text-decoration: none;
text-transform: uppercase;

box-shadow: 4px 4px 0 rgba(71, 54, 43, 0.65);
}

.social-icons {
display: flex;
gap: 12px;
}

.social-icons a {
width: 28px;
height: 28px;

display: flex;
align-items: center;
justify-content: center;

background: #f3f3d6;
color: #b0603e;

border-radius: 50%;
text-decoration: none;

font-family: "Syne Mono", monospace;
font-size: 18px;
font-weight: bold;
}

@media (max-width: 899px) {
.hero-socials {
right: 22px;
bottom: 200px;
transform: scale(0.85);
transform-origin: bottom right;
}
}
.hero-socials {
bottom: 10px !important;
}
@media (max-width: 899px) {
.hero-content {
transform: translateY(-10px) !important;
}

.hero-socials {
bottom: 10px !important;
}
}
.hero-socials {
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: 0px !important;

display: flex !important;
flex-direction: row !important;
align-items: flex-end !important;
justify-content: space-between !important;

padding: 0 10px !important;
width: 100% !important;
}

.soundcloud-button {
margin: 0 !important;
}

.social-icons {
margin: 0 !important;
}
@media (max-width: 899px) {
.hero-socials {
bottom: -100px !important;
padding: 0 0px !important;
}

.soundcloud-button {
transform: scale(0.8) !important;
transform-origin: bottom left !important;
padding: 12px 22px !important;
font-size: 10px !important;
}

.social-icons a {
width: 34px !important;
height: 34px !important;
font-size: 20px !important;
}
}
@media (max-width: 899px) {
.hero-socials {
width: 100vw !important;
left: 50% !important;
right: auto !important;
transform: translateX(-50%) !important;

bottom: 0px !important;

display: flex !important;
flex-direction: row !important;
justify-content: space-between !important;
align-items: center !important;

padding: 10px !important;
box-sizing: border-box !important;

}

.soundcloud-button {
transform: none !important;
}

.social-icons {
transform: none !important;
}
}
@media (min-width: 900px) {
.hero-content {
transform: translateY(-40px) !important;
}

.hero-socials {
transform: translateY(-10px) !important;
}
}
@media (min-width: 900px) {
.hero-socials {
width: 100vw !important;
left: 50% !important;
right: auto !important;
bottom: 38px !important;

transform: translateX(-50%) !important;

display: flex !important;
flex-direction: row !important;
justify-content: space-between !important;
align-items: center !important;

padding: 0 35 px !important;
box-sizing: border-box !important;

}

.soundcloud-button {
margin: 0 !important;
}

.social-icons {
margin: 0 !important;
}
}
@media (min-width: 900px) {
.hero-socials {
position: fixed !important;
left: 0 !important;
right: 0 !important;
bottom: 35px !important;
width: 100% !important;

display: block !important;
transform: none !important;
padding: 0 !important;

}

.soundcloud-button {
position: fixed !important;
left: -500px !important;
bottom: 10px !important;
transform: none !important;
}

.social-icons {
position: fixed !important;
right: -500px !important;
bottom: 10px !important;
transform: none !important;
}
}
.instagram-icon {
width: 34px !important;
height: 34px !important;
border-radius: 50% !important;
background: #f3f3d6 !important;

display: flex !important;
align-items: center !important;
justify-content: center !important;
}

.instagram-icon svg {
width: 21px !important;
height: 21px !important;

fill: none !important;
stroke: #b0603e !important;
stroke-width: 2.2 !important;
stroke-linecap: round !important;
stroke-linejoin: round !important;
}
.social-icons a {
width: 34px !important;
height: 34px !important;

display: flex !important;
align-items: center !important;
justify-content: center !important;
}

.instagram-icon svg {
width: 18px !important;
height: 18px !important;
}

.social-icons a:not(.instagram-icon) {
font-size: 20px !important;
line-height: 1 !important;
}
.fullscreen-menu {
position: fixed;
inset: 0;
z-index: 9999;

display: none;
flex-direction: column;
align-items: center;

background-image:
linear-gradient(rgba(112, 59, 34, 0.82), rgba(112, 59, 34, 0.82)),
url("assets/hero-bg.png");
background-size: cover;
background-position: center;

font-family: "Syne Mono", monospace;
color: #f3f3d6;
}

.fullscreen-menu.is-open {
display: flex;
}

.menu-close {
position: absolute;
top: 34px;
right: 42px;

background: none;
border: none;

color: #f3f3d6;
font-size: 56px;
font-family: "Syne Mono", monospace;
cursor: pointer;
}

.menu-logo {
width: 150px;
margin-top: 42px;
margin-bottom: 52px;
}

.menu-links {
display: flex;
flex-direction: column;
align-items: center;
gap: 34px;
}

.menu-links a {
color: #f3f3d6;
text-decoration: none;
text-transform: uppercase;

font-size: 42px;
line-height: 1;

text-shadow: 4px 4px 0 rgba(71, 54, 43, 0.65);
transition: color 0.2s ease, transform 0.2s ease;
}

.menu-links a:hover {
color: #e87c34;
transform: scale(1.06);
}

@media (max-width: 899px) {
.menu-logo {
width: 120px;
margin-top: 38px;
margin-bottom: 44px;
}

.menu-links {
gap: 30px;
}

.menu-links a {
font-size: 34px;
}

.menu-close {
top: 26px;
right: 30px;
font-size: 48px;
}
}
.menu-button {
position: fixed !important;
top: 34px !important;
right: 34px !important;
z-index: 10000 !important;
pointer-events: auto !important;
}

.fullscreen-menu {
z-index: 9999 !important;
}

.fullscreen-menu:not(.is-open) {
display: none !important;
}

.fullscreen-menu.is-open {
display: flex !important;
}
.ticket-title {
margin: 130px auto 20px !important;

font-family: "Syne Mono", monospace !important;
font-size: 48px !important;
line-height: 1 !important;

color: #f3f3d6 !important;
text-align: center !important;
text-transform: uppercase !important;

text-shadow: 5px 5px 0 rgba(71, 54, 43, 0.65) !important;
}

@media (min-width: 900px) {
.ticket-title {
font-size: 72px !important;
margin-top: 120px !important;
}
}

@media (max-width: 899px) {
.ticket-title {
font-size: 40px !important;
margin-top: 115px !important;
margin-bottom: 12px !important;
}
}
.ticket-title {
margin-top: -25px !important;
margin-bottom: 28px !important;
position: relative !important;
z-index: 2 !important;
}

.ticket-table {
margin-top: -130px !important;
transform: translate(-30px, -20px) !important;
}
.ticket-cta {
transform: translateY(-200px) !important;
}
@media (min-width: 900px) {
.ticket-table {
width: 72vw !important;
max-width: 1100px !important;
display: block !important;

margin-left: auto !important;
margin-right: auto !important;

transform: translate(0, -10px) !important;

}
}
/* MOBIL: gomb marad a táblázat után */
@media (max-width: 899px) {
.ticket-cta {
position: static !important;
transform: none !important;
margin: 24px auto 70px !important;
}
}

/* WEB: gomb felmegy a menüsávba középre */
@media (min-width: 900px) {
.ticket-cta {
position: fixed !important;
top: 34px !important;
left: 50% !important;
transform: translateX(-50%) !important;

margin: 0 !important;
z-index: 10001 !important;

}
}
@media (min-width: 900px) {
.ticket-cta {
width: 220px !important;
min-height: 54px !important;
font-size: 16px !important;
line-height: 1.15 !important;
padding: 5px 18px !important;
}
}
@media (min-width: 900px) {
.ticket-cta {
top: 18px !important;
}
}
@media (max-width: 899px) {
.ticket-table.jpg {
margin-top: 80px !important;
}
}
@media (max-width: 899px) {
.ticket-table {
margin-top: -84px !important;
transform: translate(-30px, 20px) !important;
}

.ticket-cta {
margin-top: 10px !important;
transform: translateY(-35px) !important;
}
}
@media (max-width: 899px) {
.ticket-cta {
transform: translateY(-100px) !important;
}
}
@media (max-width: 899px) {
.artists-hero {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
}

.artists-title {
order: 1 !important;
}

.artist-timetable-button {
order: 2 !important;
margin-top: 15px !important;
margin-bottom: 10px !important;
}
}
@media (max-width: 899px) {
.artists-title {
transform: translateY(-45px) !important;
}
}
@media (min-width: 900px) {
.artists-title {
margin-bottom: 70px !important;
}

.artists-list {
margin-top: 60px !important;
}
}
@media (min-width: 900px) {
.artists-list {
transform: translateY(10px) !important;
}
}
@media (min-width: 900px) {
.artists-title {
transform: translateY(60px) !important;
}
}
@media (min-width: 900px) {
.artists-title {
transform: translateY(40px) !important;
}
}
@media (min-width: 900px) {
.artists-list {
transform: translateY(-60px) !important;
}
}
.fullscreen-menu .menu-logo {
content: url("assets/menu-logo.png") !important;
width: 90px !important;
height: auto !important;
margin-top: 42px !important;
margin-bottom: 35px !important;
}
.fullscreen-menu.is-open ~ .menu-button,
body:has(.fullscreen-menu.is-open) .menu-button,
body:has(.fullscreen-menu.is-open) .artists-menu,
body:has(.fullscreen-menu.is-open) .ticket-menu,
body:has(.fullscreen-menu.is-open) .gallery-menu {
display: none !important;
}
body:has(.hero) {
overflow: hidden !important;
}

.hero {
height: 100vh !important;
min-height: 100vh !important;
overflow: hidden !important;
}
@media (min-width: 900px) {

.hero-content {
transform: translateY(50px);
}
}
@media (min-width: 900px) {
body .hero .hero-content {
transform: translateY(-5px) !important;
}
}
@media (min-width: 900px) {

.hero-socials a,
.soundcloud-button {
transition: all 0.25s ease;
}

.hero-socials a:hover {
transform: translateY(-3px) scale(1.1);
opacity: 0.85;
}

.soundcloud-button:hover {
transform: translateY(-3px) scale(1.05);
box-shadow: 0 10px 25px rgba(0,0,0,0.25);
}

}
@media (max-width: 899px) {
html,
body {
height: 100%;
overflow: hidden !important;
}

.hero {
width: 100vw !important;
height: 100svh !important;
min-height: 100svh !important;
overflow: hidden !important;
}

.hero-content {
transform: translateY(-35px) scale(0.88) !important;
transform-origin: center top !important;
}

.hero-logo {
max-width: 260px !important;
}

.hero-info p {
font-size: 27px !important;
line-height: 1.15 !important;
}

.hero-buttons {
gap: 17px !important;
}

.hero-button {
width: 230px !important;
min-height: 58px !important;
font-size: 23px !important;
}

.hero-socials {
bottom: -130px !important;
}

.soundcloud-button {
transform: scale(0.90) !important;
transform-origin: bottom left !important;
}

.social-icons a {
width: 33px !important;
height: 33px !important;
}
}
@media (max-width: 899px) {
.hero-content {
transform: translateY(-25px) !important;
padding-top: 90px !important;
}

.hero-logo {
max-width: 250px !important;
margin-bottom: 95px !important;
}

.hero-info {
margin-bottom: 75px !important;
}

.hero-info p {
font-size: 30px !important;
line-height: 1.25 !important;
}

.hero-buttons {
gap: 20px !important;
}

.hero-button {
width: 200px !important;
min-height: 38px !important;
font-size: 20px !important;
}

.hero-socials {
bottom: 0px !important;
}
}
.countdown {
margin: 18px 0 26px;
font-family: "Syne Mono", monospace;
color: #f3f3d6;
font-size: 22px;
text-align: center;
text-shadow: 3px 3px 0 rgba(71, 54, 43, 0.65);
}

@media (max-width: 899px) {
.countdown {
font-size: 18px;
margin: 12px 0 20px;
}
}
.countdown {
position: fixed !important;
top: 75px !important;
left: 3px !important;

margin: 30 !important;
z-index: 50 !important;

font-size: 17px !important;
text-align: left !important;
}
@media (max-width: 899px) {
.hero-content {
transform: translateY(-55px) !important;
}

.countdown {
position: static !important;
margin: 10px 0 40px !important;
font-size: 28px !important;
text-align: center !important;
}

.hero-logo {
margin-bottom: 200px !important;
}

.hero-info {
margin-bottom: 150 !important;
}

.hero-info p {
font-size: 28px !important;
line-height: 1.15 !important;
}

.hero-buttons {
transform: translateY(-50px) !important;
gap: 18px !important;
}

.hero-socials {
bottom: -60px !important;
}

.soundcloud-button {
transform: scale(0.90) !important;
transform-origin: bottom left !important;
}

.social-icons {
transform: translateY(5px) !important;
}
}
@media (max-width: 899px) {
.hero-info {
position: relative !important;
top: -30px !important;
}

.hero-info p {
position: relative !important;
top: -90px !important;
}
}
@media (min-width: 900px) {
.hero-countdown {
position: fixed !important;
top: 65px !important;
left: 150px !important;
right: auto !important;
bottom: auto !important;
transform: none !important;
margin: 0 !important;
color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;
z-index: 99999 !important;
}
}
@media (max-width: 899px) {
.hero-info p {
text-shadow: 2px 2px 0 rgba(71, 54, 43, 0.75) !important;
}

.hero-logo {
max-width: 300px !important;
width: 300px !important;
}

.countdown {
width: max-content !important;
max-width: none !important;
white-space: nowrap !important;


color: #e7bff5 !important;
font-size: 22px !important;
text-shadow: 2px 2px 0 rgba(71, 54, 43, 0.55) !important;

}
}
@media (max-width: 899px) {
body .hero .countdown,
body .hero #countdown {
color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;
}
}
@media (max-width: 899px) {
.countdown {
top: 420px !important;
}
}
@media (max-width: 899px) {
.hero-buttons {
transform: translateY(-85px) !important;
}
}
.hero-logo {
filter: drop-shadow(4px 4px 0 rgba(71, 54, 43, 0.7));
}
@media (min-width: 900px) {
.countdown,
#countdown {
position: fixed !important;
top: 42px !important;
left: 42px !important;

color: #e7bff5 !important;
-webkit-text-fill-color: #7b4bb3 !important;

font-size: 18px !important;
text-align: left !important;
white-space: nowrap !important;

margin: 0 !important;
z-index: 1000 !important;

text-shadow: 2px 2px 0 rgba(71, 54, 43, 0.55) !important;

}

.hero-info p {
text-shadow: 2px 2px 0 rgba(71, 54, 43, 0.75) !important;
}
}
@media (min-width: 900px) {
body .hero #countdown.countdown {
position: fixed !important;
top: 28px !important;
left: -500px !important;
right: auto !important;

transform: none !important;
margin: 0 !important;

color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;

font-size: 18px !important;
white-space: nowrap !important;
text-align: left !important;

z-index: 10001 !important;


}

.hero-info p {
text-shadow: 4px 4px 0 rgba(71, 54, 43, 0.75) !important;
}
}
.hero {
width: 100vw;
height: 100svh;
overflow: hidden;
}

.hero-content {
max-width: 520px;
width: min(90vw, 520px);
}

.hero-logo {
width: clamp(220px, 22vw, 360px);
}

.hero-info p {
font-size: clamp(22px, 2.2vw, 34px);
}

.hero-button {
width: clamp(180px, 16vw, 260px);
}
@media (min-width: 900px) {
#countdown {
left: 100px !important;
top: 42px !important;
}

.soundcloud-button {
left: -480px !important;
bottom: 10px !important;
}

.social-icons {
right: -480px !important;
bottom: 10px !important;
}
}
@media (min-width: 900px) {
body #countdown.countdown {
position: fixed !important;
top: 60px !important;
left: 70px !important;
right: auto !important;
bottom: auto !important;

transform: none !important;
translate: none !important;

margin: 0 !important;
z-index: 99999 !important;

color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;

}
}
@media (min-width: 900px) {
.hero-countdown {
position: fixed !important;
top: 65px !important;
left: 10px !important;
right: auto !important;
bottom: auto !important;

transform: none !important;
margin: 0 !important;

color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;

z-index: 99999 !important;

}
}
@media (min-width: 900px) {
#countdown {
position: fixed !important;
top: 60px !important;
left: 100px !important;
right: auto !important;
bottom: auto !important;
transform: none !important;
margin: 0 !important;

color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;
z-index: 999999 !important;

}
}
@media (min-width: 900px) {
body .hero #countdown.countdown {
position: fixed !important;
top: 28px !important;
left: -480px !important;
right: auto !important;

transform: none !important;
margin: 0 !important;

color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;

font-size: 18px !important;
white-space: nowrap !important;
text-align: left !important;

z-index: 99999 !important;

}
}
@media (min-width: 900px) {
.hero-logo {
width: 210px !important;
max-width: 210px !important;
}

.hero-info p {
text-shadow: 2px 2px 0 rgba(71, 54, 43, 0.55) !important;
}
}
@media (min-width: 900px) {

.hero-info p {
display: flex !important;
justify-content: center !important;
align-items: center !important;
gap: 12px !important;

white-space: nowrap !important;

}
}
@media (min-width: 900px) {
.hero-buttons {
transform: translateY(-50px) !important;
}
}
.menu-button {
transition: all 0.3s ease;
}

.menu-button:hover {
transform: scale(1.08);
filter: drop-shadow(0 0 12px rgba(231, 191, 245, 0.8));
}
@media (min-width: 900px) {
.menu-button,
.ticket-menu,
.artists-menu,
.gallery-menu {
transition: all 0.3s ease !important;
}

.menu-button:hover,
.ticket-menu:hover,
.artists-menu:hover,
.gallery-menu:hover {
transform: scale(1.08) !important;
filter: drop-shadow(0 0 12px rgba(231,191,245,0.8)) !important;
}
}
.fullscreen-menu.is-open ~ .ticket-cta {
display: none !important;
}
@media (max-width: 899px) {
.hero-content {
transform: translateY(-35px) !important;
}

.hero-logo {
width: 300px !important;
max-width: 300px !important;
margin-bottom: 200px !important;
}

.hero-info {
margin-bottom: 150px !important;
}

.hero-info p {
display: block !important;
white-space: normal !important;
font-size: 26px !important;
line-height: 1.15 !important;
text-align: center !important;
text-shadow: 3px 3px 0 rgba(71, 54, 43, 0.55) !important;
}

.hero-info p::after {
content: "";
}

.countdown {
position: absolute !important;
top: 425px !important;
left: 50% !important;
transform: translateX(-50%) !important;
white-space: nowrap !important;
font-size: 22px !important;
color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;
z-index: 20 !important;
}

.hero-buttons {
transform: translateY(-150px) !important;
gap: 18px !important;
}

.hero-socials {
bottom: -30px !important;
}
}
@media (max-width: 899px) {
.hero-info p {
font-size: 0 !important;
}

.hero-info p::before {
content: "július 16 - 20.\A Üllés, Jurtás Tanya";
white-space: pre-line !important;

display: block !important;
font-size: 26px !important;
line-height: 1.15 !important;
text-align: center !important;
color: #f3f3d6 !important;
-webkit-text-fill-color: #f3f3d6 !important;
text-shadow: 3px 3px 0 rgba(71, 54, 43, 0.55) !important;


}
}
@media (max-width: 899px) {
.hero-info {
width: 100% !important;
text-align: center !important;
}

.hero-info p {
text-align: center !important;
margin-left: auto !important;
margin-right: auto !important;
}

.hero-info p::before {
text-align: center !important;
margin-left: auto !important;
margin-right: auto !important;
}
}
@media (min-width: 900px) {
body .hero #countdown.countdown {
top: 18px !important;
}
}
@media (min-width: 900px) {
.ticket-page .fullscreen-menu.is-open .ticket-cta {
display: none !important;
}

.ticket-page .menu-logo-link {
display: block !important;
text-decoration: none !important;
}

.ticket-page .menu-logo-link:hover .menu-logo {
transform: scale(1.05) !important;
}
}
.menu-logo-link {
display: block !important;
text-decoration: none !important;
}

.menu-logo-link:hover .menu-logo {
transform: scale(1.05) !important;
}
.gallery-logo {
top: 15px !important;
}
@media (max-width: 899px) {
.fullscreen-menu .menu-logo {
margin-top: 65px !important;
}

.fullscreen-menu .menu-links {
margin-top: 30px !important;
}
}
@media (max-width: 899px) {
.fullscreen-menu .menu-links {
gap: 40px !important;
}
}
@media (min-width: 900px) and (max-width: 1199px) {

.hero-logo {
width: 260px !important;
}

.hero-info p {
font-size: 28px !important;
line-height: 1.4 !important;
}

.hero-buttons {
margin-top: 60px !important;
}

.hero-button {
width: 260px !important;
height: 70px !important;
font-size: 22px !important;
}

.hero-countdown {
top: 30px !important;
left: 30px !important;
font-size: 18px !important;
}
}
@media (min-width: 900px) and (max-width: 1199px) {
.hero-content {
transform: translateY(-40px) !important;
}

.hero-logo {
width: 360px !important;
max-width: 360px !important;
}

.hero-info p {
font-size: 32px !important;
line-height: 1.25 !important;
}

.hero-buttons {
transform: translateY(60px) !important;
gap: 24px !important;
}

.hero-button {
width: 300px !important;
height: 78px !important;
font-size: 24px !important;
}

.menu-button {
top: 42px !important;
right: 42px !important;
}
}
@media screen and (min-width: 900px) and (max-width: 1199px) {
body .hero .hero-content {
transform: translateY(-80px) !important;
}

body .hero .hero-logo {
width: 420px !important;
max-width: 420px !important;
}

body .hero .hero-info,
body .hero .hero-info p {
font-size: 36px !important;
line-height: 1.25 !important;
}

body .hero .hero-links,
body .hero .hero-buttons {
transform: translateY(90px) !important;
gap: 28px !important;
}

body .hero .hero-links a,
body .hero .hero-button {
width: 320px !important;
height: 82px !important;
font-size: 24px !important;
}
}
@media (min-width: 900px) and (max-width: 1199px) {

}

body .hero #countdown.countdown {
position: absolute !important;
top: 510px !important;
left: 50% !important;
transform: translateX(-50%) !important;

display: block !important;
width: max-content !important;
white-space: nowrap !important;

font-size: 24px !important;
color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;

z-index: 20 !important;
}
/* 1. MOBIL — 0–767px */

@media (max-width: 767px) {
@media (max-width: 767px) {
#countdown.countdown {
position: absolute !important;
top: 435px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: max-content !important;
white-space: nowrap !important;
text-align: center !important;
font-size: 16px !important;
color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;
z-index: 20 !important;
}
}
@media (max-width: 767px) {
html,
body {
height: auto !important;
min-height: 100% !important;
overflow-y: auto !important;
overflow-x: hidden !important;
}

body:has(.artists-page) {
overflow-y: auto !important;
}

.artists-page {
min-height: 100vh !important;
height: auto !important;
overflow: visible !important;
}
}
@media (max-width: 767px) {
html,
body.artists-body {
height: auto !important;
min-height: 100% !important;
overflow-x: hidden !important;
overflow-y: auto !important;
position: static !important;
}

body.artists-body main.artists-page {
display: block !important;
height: auto !important;
min-height: 100vh !important;
max-height: none !important;
overflow: visible !important;
position: relative !important;
}

body.artists-body .artists-hero {
height: auto !important;
min-height: auto !important;
max-height: none !important;
overflow: visible !important;
position: relative !important;
}

body.artists-body .artists-list {
display: flex !important;
flex-direction: column !important;
height: auto !important;
min-height: auto !important;
max-height: none !important;
overflow: visible !important;
position: relative !important;
padding-bottom: 320px !important;
}
}
@media (max-width: 767px) {

/* countdown feljebb */
body .hero #countdown.countdown {
top: 420px !important;
}

/* SoundCloud ikon feljebb */
body .hero .soundcloud-button {
bottom: 42px !important;
}

/* Facebook + Instagram ikonok feljebb */
body .hero .social-icons {
bottom: 22px !important;
}@media (max-width: 767px) {

body .hero .soundcloud-button,
body .hero .soundcloud {
position: absolute !important;
left: 18px !important;
bottom: 0px !important;
z-index: 50 !important;
}

body .hero .social-icons,
body .hero .hero-socials {
position: absolute !important;
right: 18px !important;
bottom: 5px !important;
z-index: 50 !important;
}
}
}

}
/* 2. TABLET — 768–1199px */

@media (min-width: 768px) and (max-width: 1199px) {
@media (min-width: 768px) and (max-width: 1199px) {
#countdown.countdown {
position: absolute !important;
top: 620px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: max-content !important;
white-space: nowrap !important;
text-align: center !important;
font-size: 22px !important;
color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;
z-index: 20 !important;
}
}@media (min-width: 768px) and (max-width: 1199px) {
body .hero #countdown.countdown {
position: absolute !important;
top: 380px !important;
left: 50% !important;
transform: translateX(-50%) !important;

width: max-content !important;
white-space: nowrap !important;
text-align: center !important;

font-size: 35px !important;
color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;
z-index: 999 !important;

}
}
/* TABLET — 768–1199px */
/* Ezt a TABLET blokkodba tedd, és ezeket az értékeket állítgasd. */

@media (min-width: 768px) and (max-width: 1199px) {

/* HERO TARTALOM EGÉSZ MOZGATÁSA */
body .hero .hero-content {
transform: translateY(-50px) !important;
}

/* LOGÓ MÉRET + HELYZET */
body .hero .hero-logo {
width: 500px !important;
max-width: 700px !important;
margin-bottom: 300px !important;
transform: translateY(0px) !important;
}

/* DÁTUM + HELYSZÍN MÉRET + HELYZET */
body .hero .hero-info {
transform: translateY(-250px) !important;
margin-bottom: 36px !important;
}

body .hero .hero-info p {
font-size: 0 !important;
text-align: center !important;
}

body .hero .hero-info p::before {
content: "július 16 - 20. Üllés, Jurtás Tanya";
white-space: pre-line !important;
display: block !important;


font-size: 45px !important;
line-height: 1.5 !important;
text-align: center !important;

color: #f3f3d6 !important;
-webkit-text-fill-color: #f3f3d6 !important;
text-shadow: 2px 2px 0 rgba(71, 54, 43, 0.55) !important;


}

/* COUNTDOWN MÉRET + HELYZET */
body .hero #countdown.countdown {
position: absolute !important;
top: 520px !important;
left: 50% !important;
transform: translateX(-50%) !important;

font-size: 34px !important;
white-space: nowrap !important;
color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;
z-index: 20 !important;

}

/* GOMBOK HELYZET + TÁVOLSÁG */
body .hero .hero-buttons {
transform: translateY(-180px) !important;
gap: 29px !important;
}

/* GOMBOK MÉRET */
body .hero .hero-button {
width: 340px !important;
height: 78px !important;
font-size: 28px !important;
}

/* SOUNDCLOUD IKON HELYZET + MÉRET */
body .hero .soundcloud-button {
left: -190px !important;
bottom: -100px !important;
transform: scale(1.15) !important;
transform-origin: left bottom !important;
}

/* FB + INSTA IKONOK HELYZET + MÉRET */
body .hero .social-icons {
right: -190px !important;
bottom: -100px !important;
gap: 16px !important;
}

body .hero .social-icons a {
width: 52px !important;
height: 52px !important;
font-size: 24px !important;
}

/* HAMBURGER MÉRET + HELYZET */
body .hero .menu-button {
top: 42px !important;
right: 42px !important;
}

body .hero .menu-button span {
width: 54px !important;
height: 7px !important;
margin: 8px 0 !important;
}
}
@media (min-width: 768px) and (max-width: 1199px) {

body .hero .hero-info p {
font-size: 34px !important;
line-height: 1.15 !important;
text-align: center !important;
white-space: nowrap !important;


color: #f3f3d6 !important;
-webkit-text-fill-color: #f3f3d6 !important;
text-shadow: 2px 2px 0 rgba(71, 54, 43, 0.55) !important;


}

body .hero .hero-info p::before {
content: none !important;
}

body .hero .menu-button {
display: block !important;
position: absolute !important;
top: 42px !important;
right: 42px !important;
z-index: 9999 !important;


background: none !important;
border: none !important;


}

body .hero .menu-button span {
display: block !important;
width: 54px !important;
height: 7px !important;
margin: 8px 0 !important;
border-radius: 999px !important;
background: #f3f3d6 !important;
}
}
@media (min-width: 768px) and (max-width: 1199px) {
.fullscreen-menu .menu-logo {
width: 190px !important;
margin-top: 65px !important;
margin-bottom: 60px !important;
}

.fullscreen-menu .menu-links {
gap: 55px !important;
}

.fullscreen-menu .menu-links a {
font-size: 60px !important;
line-height: 1.1 !important;
}
}
/* TABLET — JEGYEK OLDAL */

@media (min-width: 768px) and (max-width: 1199px) {

.ticket-header-logo {
width: 200px !important;
}

.ticket-menu {
top: 70px !important;
right: 42px !important;
}

.ticket-menu span {
width: 54px !important;
height: 50px !important;
margin: 50px 0 !important;
}

.ticket-content {
padding-top: 200px !important;
}

.ticket-title {
font-size: 90px !important;
line-height: 1 !important;
margin-bottom: 35px !important;
}

.ticket-table {
width: 92% !important;
max-width: 850px !important;
transform: scale(1.08) !important;
transform-origin: top center !important;
}

.ticket-cta {
width: 330px !important;
height: 84px !important;
font-size: 27px !important;
top: 28px !important;
}
}
@media (min-width: 768px) and (max-width: 1199px) {

.ticket-title {
-webkit-text-stroke: 0 !important;
font-weight: inherit !important;
}

.ticket-header {
top: 0px !important;
left: 2px !important;
right: 52px !important;
}

.ticket-header-logo {
width: 190px !important;
max-width: 190px !important;
transform: translateY(15px) !important;
}
}
@media (min-width: 768px) and (max-width: 1199px) {
.ticket-header {
height: 150px !important;
padding-top: 35px !important;
padding-bottom: 35px !important;
}
}
@media (min-width: 768px) and (max-width: 1199px) {
.ticket-menu {
display: block !important;
position: absolute !important;
top: 58px !important;
right: 52px !important;
z-index: 9999 !important;

background: none !important;
border: none !important;
padding: 0 !important;
margin: 0 !important;
}
.ticket-menu span {
display: block !important;
width: 58px !important;
height: 8px !important;
margin: 9px 0 !important;
border-radius: 999px !important;
background: #f3f3d6 !important;
}
}
@media (min-width: 768px) and (max-width: 1199px) {
.ticket-page .fullscreen-menu.is-open .ticket-cta,
.ticket-page .fullscreen-menu.is-open ~ .ticket-cta,
.ticket-page:has(.fullscreen-menu.is-open) .ticket-cta {
display: none !important;
}
}
@media (max-width: 1199px) {
body:has(.artists-page),
.artists-page {
height: auto !important;
min-height: 100vh !important;
overflow-y: auto !important;
}

.artists-list {
height: auto !important;
max-height: none !important;
overflow: visible !important;
padding-bottom: 160px !important;
}
}
@media (max-width: 767px) {
html,
body {
height: auto !important;
min-height: 100% !important;
overflow-y: auto !important;
}

body:has(.artists-page),
main.artists-page,
.artists-page,
.artists-hero,
.artists-list {
height: auto !important;
max-height: none !important;
overflow: visible !important;
}

.artists-list {
padding-bottom: 220px !important;
}
}
@media (max-width: 767px) {
html,
body {
height: auto !important;
min-height: 100% !important;
overflow-y: auto !important;
overflow-x: hidden !important;
}

main.artists-page,
.artists-page {
height: auto !important;
min-height: 100vh !important;
overflow-y: visible !important;
overflow-x: hidden !important;
}

.artists-page {
background-attachment: scroll !important;
}

.artists-hero,
.artists-list {
height: auto !important;
min-height: auto !important;
max-height: none !important;
overflow: visible !important;
}

.artists-list {
padding-bottom: 320px !important;
}
}
@media (max-width: 767px) {
html,
body {
height: auto !important;
min-height: 100% !important;
overflow-x: hidden !important;
overflow-y: scroll !important;
}

body {
position: static !important;
}

main.artists-page {
display: block !important;
position: relative !important;

height: auto !important;
min-height: 160vh !important;

overflow: visible !important;
overflow-y: visible !important;

background-attachment: scroll !important;

}

.artists-hero {
position: relative !important;
height: auto !important;
min-height: auto !important;
overflow: visible !important;
}

.artists-list {
position: relative !important;
display: flex !important;
flex-direction: column !important;


height: auto !important;
min-height: auto !important;
max-height: none !important;

overflow: visible !important;
transform: none !important;

padding-bottom: 420px !important;

}
}
/* TABLET — FELLÉPŐK OLDAL */

@media (min-width: 768px) and (max-width: 1199px) {

.artists-header {
height: 150px !important;
padding-top: 38px !important;
padding-bottom: 38px !important;
}

.artists-logo {
width: 200px !important;
max-width: 200px !important;
transform: translateY(10px) !important;
}

.artists-timetable-btn {
width: 370px !important;
min-height: 88px !important;
font-size: 35px !important;
line-height: 1.1 !important;
}

.artists-hero {
padding-top: 170px !important;
padding-bottom: 70px !important;
}

.artists-hero h1 {
font-size: 96px !important;
line-height: 0.95 !important;
margin-bottom: 70px !important;
text-align: center !important;
}

.artists-list {
padding: 0px 24px 25vh !important;
gap: 64px !important;
transform: translateY(-20px) !important;
}

.artists-list p {
max-width: 900px !important;
font-size: 48px !important;
line-height: 1.2 !important;
text-align: center !important;
}

.artists-menu {
display: block !important;
position: absolute !important;
top: 58px !important;
right: 52px !important;
z-index: 9999 !important;

background: none !important;
border: none !important;
padding: 0 !important;
margin: 0 !important;

}

.artists-menu span {
display: block !important;
width: 58px !important;
height: 8px !important;
margin: 9px 0 !important;
border-radius: 999px !important;
background: #f3f3d6 !important;
}
}
@media (min-width: 768px) and (max-width: 1199px) {

.artists-hero h1 {
-webkit-text-stroke: 0 !important;
filter: none !important;
}

.artists-hero .artists-timetable,
.artists-hero .timetable-button,
.artists-hero .timetable-btn,
.artists-hero a[href*="timetable"] {
width: 330px !important;
height: 84px !important;
min-height: 84px !important;
font-size: 27px !important;
line-height: 92px !important;
padding: 0 !important;
}
}
/* TABLET — GALÉRIA OLDAL, artist méretek alapján */

@media (min-width: 768px) and (max-width: 1199px) {

.gallery-header {
height: 190px !important;
padding-top: 55px !important;
padding-bottom: 55px !important;
}

.gallery-logo {
width: 240px !important;
max-width: 240px !important;
transform: translateY(20px) !important;
}

.gallery-menu {
top: 70px !important;
right: 60px !important;
}

.gallery-menu span {
width: 68px !important;
height: 9px !important;
margin: 10px 0 !important;
}

.gallery-content {
padding-top: 210px !important;
padding-bottom: 90px !important;
}

.gallery-content h1 {
font-size: 110px !important;
line-height: 0.95 !important;
margin-bottom: 25px !important;
text-align: center !important;
-webkit-text-stroke: 0 !important;
}

.gallery-content h2 {
font-size: 90px !important;
line-height: 0.95 !important;
margin-bottom: 90px !important;
text-align: center !important;
-webkit-text-stroke: 0 !important;
}

.gallery-card {
width: 620px !important;
min-height: 150px !important;
font-size: 54px !important;
}

.gallery-aftermovie {
margin-bottom: 70px !important;
}
}
@media (min-width: 768px) and (max-width: 1199px) {

.gallery-menu {
display: block !important;
position: absolute !important;
top: 70px !important;
right: 60px !important;
z-index: 9999 !important;

background: none !important;
border: none !important;
padding: 0 !important;
margin: 0 !important;

}

.gallery-menu span {
display: block !important;
width: 68px !important;
height: 9px !important;
margin: 10px 0 !important;
border-radius: 999px !important;
background: #f3f3d6 !important;
}

.gallery-content h1,
.gallery-content h2 {
-webkit-text-stroke: 0 !important;
filter: none !important;
}
}
@media (min-width: 768px) and (max-width: 1199px) {
.gallery-content h1,
.gallery-content h2 {
-webkit-text-stroke: 0 !important;
filter: none !important;
text-shadow: 3px 3px 0 rgba(71, 54, 43, 0.55) !important;
}
}
@media (min-width: 768px) and (max-width: 1199px) {
.gallery-content h1,
.gallery-content h2 {
color: #f3f3d6 !important;
-webkit-text-fill-color: #f3f3d6 !important;

-webkit-text-stroke: 0 !important;

text-shadow: 7px 7px 0 rgba(71, 54, 43, 0.65) !important;
filter: none !important;

}
}
}
/* 3. DESKTOP — 1200px felett */

@media (min-width: 1200px) {
@media (min-width: 1200px) {
body.ticket-page:has(.fullscreen-menu.is-open) .ticket-cta {
display: none !important;
}
}
/* style.css-be */

.ticket-cta.is-hidden {
display: none !important;
}
@media (min-width: 1200px) {
body .hero #countdown.countdown {
position: fixed !important;
top: 13px !important;
left: -470px !important;
right: auto !important;
bottom: auto !important;

transform: none !important;
margin: 0 !important;

color: #e7bff5 !important;
-webkit-text-fill-color: #e7bff5 !important;
white-space: nowrap !important;
z-index: 9999 !important;


}
}
}