/* Judit Varga 2.0 — shared live and local design layer. */
:root {
  --news:#e8ff00;
  --news-list:color-mix(in srgb,var(--news) 76%,white 24%);
  --news-list-hover:color-mix(in srgb,var(--news) 56%,white 44%);
  --news-control:color-mix(in srgb,var(--news) 72%,white 28%);
}

/* One continuous composition for each of the three existing card grids. */
body.editorial-site #music.music-art-section {
  --section-base:linear-gradient(145deg,#2465ed 0%,#174ed8 54%,#0a318f 100%);
  background:var(--section-base) !important;
  color:#fff;
}
.music-image-card picture,.film-stage-card picture {display:block;width:100%;height:100%}
.music-image-card picture img,.film-stage-card picture img {display:block;width:100%;height:100%;object-fit:cover}
/* Keep the original cream-and-royal-blue wave colours in every grid layout. */
.music-image-card picture {position:relative}
.music-image-card picture::after {content:none}
.music-image-card:nth-child(3n+1) {--tile-x:0%}
.music-image-card:nth-child(3n+2) {--tile-x:50%}
.music-image-card:nth-child(3n) {--tile-x:100%}
.music-image-card:nth-child(-n+3) {--tile-y:0%}
.music-image-card:nth-child(n+4) {--tile-y:100%}
.music-image-card .v2-card-title {
  position:absolute;z-index:3;left:clamp(18px,2.1vw,30px);bottom:clamp(18px,2.1vw,30px);
  max-width:calc(100% - 36px);pointer-events:none;color:#fff;
  font:900 clamp(1.55rem,3vw,3.7rem)/.89 "Inter Tight",Arial,sans-serif;
  letter-spacing:-.05em;text-transform:uppercase;
  text-shadow:0 2px 7px rgba(0,12,48,.84),0 0 13px rgba(0,12,48,.5);
}
.music-image-card:nth-child(n):hover picture img {transform:scale(1.018);filter:saturate(1.48) brightness(1.1) contrast(1.07)}

body.editorial-site #film.film-stage-section {
  --section-base:linear-gradient(145deg,#168b70 0%,#0d6d62 48%,#072d39 100%);
  background:var(--section-base) !important;
  color:#fff;
}
.film-stage-section :is(.eyebrow,h2,.film-stage-intro,.text-link) {color:#fff}
.film-stage-section .text-link {border-bottom-color:#fff}
.film-stage-card {background:#042d34}
.film-stage-card::before,.film-stage-card .film-card-lines {display:none !important}
.film-stage-card picture img {filter:none}
.film-stage-card:nth-child(n):hover picture img {transform:scale(1.018);filter:saturate(1.48) brightness(1.07) contrast(1.04)}
.film-stage-card:nth-child(n) .film-stage-title {
  top:6.5%;bottom:auto;left:6.5%;right:5%;z-index:3;
  max-width:89%;color:#fff;font:900 clamp(1.25rem,6.1cqw,3rem)/.9 "Inter Tight",Arial,sans-serif;
  letter-spacing:-.045em;text-transform:uppercase;
  text-shadow:0 2px 7px rgba(0,20,22,.86),0 0 12px rgba(0,20,22,.55);
}
.film-stage-card.black .film-stage-title {color:#fff}

/* The menu colours echo the two new section backgrounds. */
.nav-wrap nav a:nth-child(3):hover,.nav-wrap nav a:nth-child(3):focus-visible {background:#2e70e9;color:#fff;border-color:var(--ink)}
.nav-wrap nav a:nth-child(4):hover,.nav-wrap nav a:nth-child(4):focus-visible {background:#14856d;color:#fff;border-color:var(--ink)}
.nav-wrap nav a:nth-child(6):hover,.nav-wrap nav a:nth-child(6):focus-visible {background:var(--news);color:#0a0a0a;border-color:var(--ink)}

/* Shared Film + Stage palette for category, catalogue and every work page. */
body.editorial-site :is(.film-category-page,.film-catalogue-page,.work-page.film-mode) {
  --film-subpage-green:#0d6d62;
  --film-subpage-paper:#d8eee8;
  --section-base:linear-gradient(145deg,#168b70 0%,#0d6d62 48%,#072d39 100%);
  background:var(--section-base) !important;
  color:#fff !important;
}
.film-category-page .inline-back,.film-catalogue-page .inline-back,.work-page.film-mode .inline-back {color:#fff !important}
.film-catalogue-page .catalogue-group-title {color:#fff !important}
.film-category-page .category-work-row:hover,.film-category-page .category-work-row:focus-visible {background:#c4e8dd}
.film-catalogue-page .catalogue-controls {color:#071b0d}
.work-page.film-mode .detail-panel {--detail-surface:var(--film-subpage-paper)}
#music-category-title,#film-category-title {font-size:clamp(2.4rem,7.2vw,7.5rem);overflow-wrap:normal}
/* Music facts and catalogue headings echo the blue cards; Film keeps petrol. */
.work-page.editorial-detail .detail-layout :is(.detail-facts,.detail-prelude) > .work-field {
  background:linear-gradient(115deg,#1555c8 0%,#123fa3 55%,#252475 100%);
  color:#fff;
  border-color:rgba(255,255,255,.38);
}
.work-page.editorial-detail.film-mode .detail-layout :is(.detail-facts,.detail-prelude) > .work-field {
  background:linear-gradient(115deg,#010809 0%,#052c39 58%,#0a4658 100%);
}
.work-page.editorial-detail .detail-layout :is(.detail-facts,.detail-prelude) > .work-field :is(a,span,strong) {color:inherit}
.editorial-catalogue .catalogue-group-title {
  background:linear-gradient(115deg,#1555c8 0%,#123fa3 55%,#252475 100%) !important;
  color:#fff !important;
}
.music-category-page .work-subsection h3 {
  background:linear-gradient(115deg,#1555c8 0%,#123fa3 55%,#252475 100%) !important;
}
@media (max-width:600px) {
  .music-category-page .work-subsection h3.is-long-title {
    font-size:clamp(1.25rem,7vw,2.8rem) !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    hyphens:none !important;
  }
}
.film-catalogue-page .catalogue-group-title {
  background:linear-gradient(115deg,#010809 0%,#052c39 58%,#0a4658 100%) !important;
  color:#fff !important;
}

/* News adopts Upcoming's editorial rows. The colour steps stay inside each section's hue. */
.news-section .news-home-list {display:block;border:0;background:var(--news-list)}
.news-section .news-home-row {background:var(--news-list);transition:background-color .18s ease}
.news-section .news-home-row:hover,.news-section .news-home-row:focus-visible {background:var(--news-list-hover)}
.news-catalogue-page .news-catalogue-list {background:var(--news-list)}
.news-catalogue-page .news-catalogue-row {background:var(--news-list)}
.news-catalogue-page .news-catalogue-row:hover,.news-catalogue-page .news-catalogue-row:focus-visible {background:var(--news-list-hover)}
.news-detail-page.editorial-detail {--detail-surface:var(--news-list);--detail-ink:#0a0a0a}
.dates :is(#upcoming-home-list,.recent-list),.upcoming-page :is(#upcoming-all-list,#upcoming-past-list) {background:#ff7650}
.dates :is(#upcoming-home-list,.recent-list) .date-row,.upcoming-page :is(#upcoming-all-list,#upcoming-past-list) .date-row {background:#ff7650}
.dates :is(#upcoming-home-list,.recent-list) .date-row:hover,.dates :is(#upcoming-home-list,.recent-list) .date-row:focus-visible,
.upcoming-page :is(#upcoming-all-list,#upcoming-past-list) .date-row:hover,.upcoming-page :is(#upcoming-all-list,#upcoming-past-list) .date-row:focus-visible {background:#ff9476}
.dates :is(#upcoming-home-list,.recent-list) .date-row:hover,
.upcoming-page :is(#upcoming-all-list,#upcoming-past-list) .date-row:hover,
.news-section .news-home-row:hover {padding-left:.35rem;padding-right:.35rem}
.news-catalogue-head h1 {max-width:13ch;overflow-wrap:normal}

/* Matching information scale and placement across the four home sections. */
.dates-head .dates-note,.news-hero .news-intro {
  max-width:30rem;
  margin:0;
  font:750 1.12rem/1.28 "Inter Tight",Arial,sans-serif;
  text-align:left;
}
.dates-head .dates-note a {color:inherit;text-decoration:underline;text-underline-offset:.16em}
.dates-head .dates-note {flex:0 1 auto;width:clamp(14rem,24vw,30rem)}
body.editorial-site #dates .dates-head h2 {
  white-space:nowrap;overflow-wrap:normal;word-break:normal;
}
body.editorial-site #dates .dates-head h2 .upcoming-gap {margin-right:.04em}
.news-hero-side {justify-self:end;max-width:30rem}
.news-section .dates-more {color:inherit}

/* The four complete lists use the same header geometry and control bar. */
.upcoming-page {inset:78px 0 0;z-index:24}
.upcoming-page-inner,.news-catalogue-inner {max-width:1600px;padding:5vw 5.5vw 8vw}
.upcoming-page .inline-back {text-decoration:none}
.upcoming-page .inline-back:hover,.upcoming-page .inline-back:focus-visible {text-decoration:none}
.catalogue-head.upcoming-page-head,.catalogue-head.news-catalogue-head {margin:0 0 2.4rem;align-items:end}
.catalogue-head.upcoming-page-head .catalogue-intro,
.catalogue-head.news-catalogue-head .catalogue-intro {
  justify-self:end;max-width:31rem;margin:0 0 .4rem;
  font-size:clamp(1rem,1.25vw,1.25rem);line-height:1.35;font-weight:700;
}
.upcoming-page .catalogue-head h1 {
  margin:0;font-size:clamp(2.5rem,7.5vw,8rem);line-height:.78;
  letter-spacing:-.07em;white-space:nowrap !important;overflow-wrap:normal !important;word-break:normal;
}
.news-catalogue-page .catalogue-head h1 {
  margin:0;font-size:clamp(3.5rem,7.7vw,8.5rem);line-height:.78;
  overflow-wrap:normal !important;word-break:normal;
}
.film-catalogue-page .catalogue-head h1 {overflow-wrap:normal !important;word-break:normal}
.news-catalogue-page .catalogue-controls.news-catalogue-controls,
.upcoming-page .catalogue-controls.upcoming-controls {
  grid-template-columns:minmax(220px,1.3fr) minmax(180px,.8fr) minmax(180px,.8fr) auto;
  align-items:stretch;gap:0;margin-bottom:1.1rem;
  border:0;border-radius:var(--editorial-radius);box-shadow:var(--editorial-shadow);overflow:hidden;
}
.news-catalogue-page .catalogue-controls.news-catalogue-controls {background:var(--news-control)}
.upcoming-page .catalogue-controls.upcoming-controls {background:#ffe0d2}
.news-catalogue-page .catalogue-controls.news-catalogue-controls label,
.upcoming-page .catalogue-controls.upcoming-controls label {
  min-width:0;gap:.55rem;padding:.9rem 1rem;border-right:1px solid var(--ink);
}
.news-catalogue-page .catalogue-controls.news-catalogue-controls :is(input,select),
.upcoming-page .catalogue-controls.upcoming-controls :is(input,select) {
  width:100%;min-width:0;min-height:0;padding:0;border:0;border-radius:0;
  box-shadow:none;background:transparent;color:inherit;font:800 1rem "Inter Tight",Arial,sans-serif;
}
.news-catalogue-page .catalogue-controls.news-catalogue-controls .catalogue-reset,
.upcoming-page .catalogue-controls.upcoming-controls .catalogue-reset {
  min-height:0;padding:0 1.2rem;border:0;border-radius:0 var(--editorial-radius) var(--editorial-radius) 0;
  background:rgba(255,255,255,.32);
}
.news-catalogue-page .catalogue-controls.news-catalogue-controls .catalogue-reset:hover,
.upcoming-page .catalogue-controls.upcoming-controls .catalogue-reset:hover {background:rgba(255,255,255,.6)}

@media(max-width:980px) {
  .dates-head {align-items:flex-start;flex-direction:column}
  .dates-head .dates-note {width:min(100%,30rem)}
  .news-hero-side {justify-self:start}
  .catalogue-head.upcoming-page-head .catalogue-intro,
  .catalogue-head.news-catalogue-head .catalogue-intro {justify-self:start}
  .news-catalogue-page .catalogue-controls.news-catalogue-controls,
  .upcoming-page .catalogue-controls.upcoming-controls {grid-template-columns:repeat(2,minmax(0,1fr))}
  .news-catalogue-page .catalogue-controls.news-catalogue-controls label:nth-child(2),
  .upcoming-page .catalogue-controls.upcoming-controls label:nth-child(2) {border-right:0}
  .news-catalogue-page .catalogue-controls.news-catalogue-controls label:nth-child(3),
  .upcoming-page .catalogue-controls.upcoming-controls label:nth-child(3) {border-top:1px solid var(--ink)}
  .news-catalogue-page .catalogue-controls.news-catalogue-controls .catalogue-reset,
  .upcoming-page .catalogue-controls.upcoming-controls .catalogue-reset {
    grid-column:auto;justify-self:stretch;border-top:1px solid var(--ink);border-radius:0 0 var(--editorial-radius) 0;
  }
  .music-image-card .v2-card-title {font-size:clamp(1.45rem,3.8vw,2.8rem)}
  .music-image-card:nth-child(2n+1) {--tile-x:0%}
  .music-image-card:nth-child(2n) {--tile-x:100%}
  .music-image-card:nth-child(-n+2) {--tile-y:0%}
  .music-image-card:nth-child(n+3):nth-child(-n+4) {--tile-y:50%}
  .music-image-card:nth-child(n+5) {--tile-y:100%}
}
@media(max-width:650px) {
  .upcoming-page-inner {padding:8vw 5.5vw 8vw}
  .film-catalogue-page .catalogue-head h1 {font-size:clamp(3.5rem,13vw,5rem)}
  .news-catalogue-page .catalogue-controls.news-catalogue-controls,
  .upcoming-page .catalogue-controls.upcoming-controls {grid-template-columns:minmax(0,1fr)}
  .news-catalogue-page .catalogue-controls.news-catalogue-controls label,
  .upcoming-page .catalogue-controls.upcoming-controls label {border-right:0;border-bottom:1px solid var(--ink)}
  .news-catalogue-page .catalogue-controls.news-catalogue-controls label:nth-child(3),
  .upcoming-page .catalogue-controls.upcoming-controls label:nth-child(3) {border-top:0}
  .news-catalogue-page .catalogue-controls.news-catalogue-controls .catalogue-reset,
  .upcoming-page .catalogue-controls.upcoming-controls .catalogue-reset {min-height:52px;border-top:0;border-radius:0 0 var(--editorial-radius) var(--editorial-radius)}
}
@media(max-width:600px) {
  .music-image-card .v2-card-title {font-size:clamp(1.8rem,7.5vw,3rem)}
  .film-stage-card:nth-child(n) .film-stage-title {font-size:clamp(1.25rem,6.1cqw,2.35rem)}
  .film-stage-card picture {
    position:relative;background-color:#021719;
    background-image:url("art/film-mobile-master-v2.png"),linear-gradient(110deg,#010809,#063448,#0a4658);
    background-size:auto 600%,cover;background-position:50% var(--tile-y),center;
    background-repeat:no-repeat;
    transition:filter .22s ease;
  }
  .film-stage-card picture img {opacity:0}
  .film-stage-card:hover picture {filter:saturate(1.45) brightness(1.07)}
  .film-stage-card picture::after {
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(100deg,rgba(0,0,0,.24),transparent 48%,rgba(0,59,79,.16));
  }
  .music-image-card:nth-child(n),.film-stage-card:nth-child(n) {--tile-x:0%}
  .music-image-card.music-image-card:nth-child(1),.film-stage-card:nth-child(1) {--tile-y:0%}
  .music-image-card.music-image-card:nth-child(2),.film-stage-card:nth-child(2) {--tile-y:20%}
  .music-image-card.music-image-card:nth-child(3),.film-stage-card:nth-child(3) {--tile-y:40%}
  .music-image-card.music-image-card:nth-child(4),.film-stage-card:nth-child(4) {--tile-y:60%}
  .music-image-card.music-image-card:nth-child(5),.film-stage-card:nth-child(5) {--tile-y:80%}
  .music-image-card.music-image-card:nth-child(6),.film-stage-card:nth-child(6) {--tile-y:100%}
}

/* Consistent presentation for the four complete lists. Their content and colours stay distinct. */
:is(.editorial-catalogue,.news-catalogue-page,.upcoming-page) {
  --complete-list-radius:var(--editorial-radius);
  --complete-list-shadow:var(--editorial-shadow);
  --complete-list-divider:var(--editorial-divider);
}
.editorial-catalogue .catalogue-group,
.news-catalogue-page .news-catalogue-list,
.upcoming-page :is(#upcoming-all-list,#upcoming-past-list) {
  border:0;border-radius:var(--complete-list-radius);
  box-shadow:var(--complete-list-shadow);overflow:hidden;
}
.news-catalogue-page .news-catalogue-list {margin-top:0}
.editorial-catalogue .catalogue-work-row + .catalogue-work-row,
.news-catalogue-page .news-catalogue-row + .news-catalogue-row,
.upcoming-page .date-row + .date-row {border-top:var(--complete-list-divider)}
.editorial-catalogue .catalogue-work-row,
.news-catalogue-page .news-catalogue-row,
.upcoming-page :is(#upcoming-all-list,#upcoming-past-list) .date-row {
  box-sizing:border-box;min-height:6rem;padding:1.15rem 1.35rem;
  gap:1rem 1.5rem;transition:background-color .18s ease;
}
.editorial-catalogue .catalogue-work-title,
.news-catalogue-page .news-catalogue-row strong,
.upcoming-page .date-row .date-work strong {
  font:900 clamp(1.2rem,1.85vw,2rem)/1.06 "Inter Tight",Arial,sans-serif;
  letter-spacing:-.03em;
}
.editorial-catalogue :is(.catalogue-work-meta,.catalogue-work-year),
.news-catalogue-page .news-catalogue-row :is(time,.news-row-type,.news-row-language),
.upcoming-page .date-row :is(time,.date-work small,.date-venue) {
  font-size:clamp(.82rem,1vw,1rem);line-height:1.3;font-weight:750;
}
.editorial-catalogue .catalogue-controls .catalogue-reset {background:rgba(255,255,255,.32)}
.editorial-catalogue .catalogue-controls .catalogue-reset:hover {background:rgba(255,255,255,.6)}
body.editorial-site :is(.catalogue-page,.film-catalogue-page,.upcoming-page,.news-catalogue-page) .inline-back {
  text-decoration:none;white-space:nowrap;
}
body.editorial-site :is(.catalogue-page,.film-catalogue-page,.upcoming-page,.news-catalogue-page) .inline-back:focus-visible {
  outline:2px solid currentColor;outline-offset:4px;
}
@media(max-width:700px) {
  .editorial-catalogue .catalogue-work-row,
  .news-catalogue-page .news-catalogue-row,
  .upcoming-page :is(#upcoming-all-list,#upcoming-past-list) .date-row {
    min-height:0;padding:1rem 1.1rem;gap:.6rem 1rem;
  }
  .editorial-catalogue .catalogue-work-title,
  .news-catalogue-page .news-catalogue-row strong,
  .upcoming-page .date-row .date-work strong {font-size:clamp(1.2rem,4.3vw,1.55rem)}
}

/* Home-section display titles share one type scale. The long Upcoming title
   only reduces at phone width so it always remains one word. */
body.editorial-site {
  --home-section-title-size:clamp(5.5rem,9.2vw,10.2rem);
}
body.editorial-site #about .about-title h2,
body.editorial-site #music .music-hero-head h2,
body.editorial-site #film .film-stage-head h2,
body.editorial-site #dates .dates-head h2,
body.editorial-site #news #news-title,
body.editorial-site #contact .contact-block-main h2 {
  font-size:var(--home-section-title-size);
  line-height:.78;
  font-weight:900;
}
@media(max-width:600px) {
  body.editorial-site {--home-section-title-size:clamp(3.4rem,18vw,6.6rem)}
  body.editorial-site #dates .dates-head h2 {
    font-size:min(var(--home-section-title-size),17vw);
  }
}

/* A word may move to the next line, but its letters must stay together.
   The CONTACT title scales to its own panel width instead of breaking. */
body.editorial-site :is(h1,h2,h3,p,a,strong,span,small,button,label) {
  overflow-wrap:normal !important;
  word-break:normal !important;
  hyphens:none !important;
}
body.editorial-site .contact-block-main {container-type:inline-size}
body.editorial-site #contact .contact-block-main h2 {
  font-size:clamp(2.7rem,13.5cqw,6.4rem);
  white-space:nowrap;
}
body.editorial-site #contact .contact-block h2.contact-long-title {
  font-size:clamp(2rem,8cqw,4.25rem);
}
/* Programmatic route focus is for screen readers; interactive controls retain
   their visible keyboard focus styles. */
body.editorial-site :is(h1,h2,h3)[tabindex="-1"]:focus {outline:none}