/* Generated by scripts/build-font-subsets.py. All characters and original font fallbacks retained. */
@font-face {
  font-family: Tabac;
  src: url('/static/fonts/tabac-light-e1f465f1dd0b83f49d58.woff2') format('woff2'), url('/brand/tabac-sans-light.woff2') format('woff2');
  font-weight: 300 500;
  font-display: swap;
}
@font-face {
  font-family: Tabac;
  src: url('/static/fonts/tabac-semibold-bd6c3580940fd5f42751.woff2') format('woff2'), url('/brand/tabac-sans-semibold.woff2') format('woff2');
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: Tabac;
  src: url('/static/fonts/tabac-bold-9ac0aa9bc85a17b0ce95.woff2') format('woff2'), url('/brand/tabac-sans-bold.woff2') format('woff2');
  font-weight: 700 900;
  font-display: swap;
}
:root {
  --paper: #f6f1e9;
  --cream: #fffcf6;
  --sand: #ece3d3;
  --ink: #221816;
  --muted: #5f524c;
  --red: #c0101c;
  --wine: #6a0f1c;
  --wine-deep: #480a13;
  --line: #e3d9c9;
  --gutter: clamp(22px, 4.2vw, 84px);
  --header: 90px;
  --radius: 22px;
  --motion-quick: 160ms;
  --motion-response: 220ms;
  --motion-enter: 320ms;
  --motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --control-label-offset: 0.1em;
  font-family: Tabac, Arial, sans-serif;
  color: var(--ink);
  font-synthesis: none;
  background: var(--paper);
  color-scheme: light;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  --anchor-gap: 30px;
  scroll-padding-top: calc(var(--header) + var(--anchor-gap));
  scrollbar-gutter: stable;
}
body {
  margin: 0;
  font-size: 17px;
  line-height: 1.55;
  /* Editorial names, credits and URLs must wrap even without word spaces. */
  overflow-wrap: anywhere;
}
.navigation-status {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
#navigation-progress {
  position: fixed;
  inset: 0 0 auto;
  height: 3px;
  z-index: 200;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}
#navigation-progress::after {
  content: '';
  display: block;
  width: 35%;
  height: 100%;
  background: var(--red);
}
html[data-navigation="loading"] #navigation-progress { opacity: 1; }
html[data-navigation="loading"] #navigation-progress::after { animation: navigation-loading 1.2s ease-in-out infinite; }
@keyframes navigation-loading { from { transform: translateX(-100%); } to { transform: translateX(390%); } }
#navigation-error {
  position: fixed;
  inset: auto 16px 20px;
  z-index: 200;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 20px;
  width: min(560px, calc(100% - 32px));
  margin-inline: auto;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--cream);
  box-shadow: 0 8px 32px #2b232225;
}
#navigation-error p { width: 100%; margin: 0; font-size: 16px; }
#navigation-error button { min-height: 44px; font-size: 14px; }
@media (prefers-reduced-motion: reduce) {
  html[data-navigation="loading"] #navigation-progress::after { width: 100%; animation: none; }
}
a {
  color: inherit;
  text-decoration: none;
}
button,
input,
select,
textarea {
  font: inherit;
}
button {
  cursor: pointer;
  color: inherit;
}
button,
a,
input,
summary,
select {
  -webkit-tap-highlight-color: transparent;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
summary:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #bd691e;
  outline-offset: 5px;
}
button {
  border: 0;
}
button:disabled {
  cursor: default;
  opacity: 0.36;
}
svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
}
img {
  display: block;
  max-width: 100%;
}
h1,
h2,
h3,
h4,
p {
  margin: 0;
}
h2 {
  font-size: clamp(32px, 3.1vw, 46px);
  font-weight: 600;
  line-height: 1.13;
  letter-spacing: -1.4px;
}
h3 {
  font-size: 26px;
  font-weight: 600;
  line-height: 1.22;
  letter-spacing: -0.65px;
}
h4 {
  font-size: 22px;
  line-height: 1.25;
  letter-spacing: -0.35px;
}
p + p {
  margin-top: 16px;
}
button svg,
a svg {
  pointer-events: none;
}
[hidden] {
  display: none !important;
}
.svg-library {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}
.skip-link {
  position: fixed;
  top: -100px;
  left: 20px;
  z-index: 200;
  background: var(--cream);
  padding: 14px 24px;
  border-radius: 6px;
  color: var(--wine);
}
.skip-link:focus {
  top: 10px;
}
.muted {
  color: var(--muted);
}
.red {
  color: var(--red);
}
.flip {
  transform: rotate(180deg);
}
.text-small {
  font-size: 0.85em;
}
.text-large {
  font-size: 1.25em;
}
.text-wine {
  color: var(--wine);
}
.text-red {
  color: var(--red);
}
.text-muted {
  color: var(--muted);
}
.site-header {
  min-height: var(--header);
  padding: 0 var(--gutter);
  display: flex;
  align-items: center;
  gap: clamp(25px, 3.2vw, 60px);
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 250, 241, 0.98);
  border-bottom: 1px solid #64321415;
  backdrop-filter: blur(16px);
}
/* The official logo, the only allowed variant (docs/brand/README.md). The
   image box is the logo plus an even margin of 2.4 % of its height. The
   vector file stays sharp at every size: 52px high, 40px on phones, 60px
   from 1440px and 66px from 1600px, where the navigation is larger. */
.brand {
  display: block;
  flex-shrink: 0;
  line-height: 0;
}
.brand-logo {
  display: block;
  width: 139px;
  height: 52px;
}
.primary-nav {
  display: flex;
  align-self: stretch;
  align-items: stretch;
  justify-content: center;
  gap: clamp(15px, 1.5vw, 29px);
  font-size: 15px;
  white-space: nowrap;
  flex: 1;
}
.primary-nav a {
  display: flex;
  align-items: center;
  position: relative;
}
.primary-nav a::after {
  position: absolute;
  content: '';
  height: 3px;
  left: 0;
  right: 0;
  bottom: 20px;
  background: var(--red);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--motion-response) var(--motion-ease);
}
.primary-nav a[aria-current] {
  color: var(--red);
  font-weight: 600;
}
.primary-nav a:hover::after,
.primary-nav a:focus-visible::after,
.primary-nav a[aria-current]::after {
  transform: scaleX(1);
}
.header-actions {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-left: auto;
  white-space: nowrap;
}
.language-picker {
  position: relative;
  flex-shrink: 0;
}
.header-support {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  gap: 8px;
  min-width: 44px;
  min-height: 44px;
  padding: 11px 17px;
  border: 1px solid var(--wine);
  border-radius: 999px;
  color: var(--cream);
  background: var(--wine);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition: background-color var(--motion-response), box-shadow var(--motion-response);
}
.header-support svg { width: 18px; height: 18px; }
.header-support:hover { background: var(--red); border-color: var(--red); }
.header-support:focus-visible { outline: 2px solid var(--wine); outline-offset: 4px; }
.language-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 88px;
  min-height: 44px;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: var(--ink);
  background: transparent;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  list-style: none;
  cursor: pointer;
  user-select: none;
  transition: background 0.15s, border-color 0.15s;
}
.language-trigger::-webkit-details-marker { display: none; }
.language-trigger::marker { content: ''; }
.language-trigger > svg { width: 18px; height: 18px; color: var(--wine); }
.language-trigger > .language-chevron { width: 12px; height: 12px; color: var(--muted); transition: transform var(--motion-response) var(--motion-ease); }
.language-trigger:is(:hover, :focus-visible) { background: #eee6d980; }
.language-picker[open] > .language-trigger { background: #eee6d980; border-color: var(--line); }
.language-picker[open] .language-chevron { transform: rotate(180deg); }
.languages {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  z-index: 2;
  display: grid;
  gap: 2px;
  width: 216px;
  max-width: calc(100vw - 32px);
  max-height: calc(100dvh - var(--header) - 24px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--cream);
  box-shadow: 0 12px 32px #2b23221f, 0 2px 6px #2b232208;
}
.languages a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 48px;
  padding: 10px 12px;
  border-radius: 10px;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.3;
  text-decoration: none;
  transition: background 0.15s;
}
.languages a:is(:hover, :focus-visible) { background: #eee6d980; color: var(--wine); }
.languages a[aria-current] { background: var(--sand); color: var(--wine); font-weight: 600; }
.languages a > svg { width: 17px; height: 17px; flex-shrink: 0; }
.languages a:focus-visible, .language-trigger:focus-visible { outline-offset: 2px; }
.menu-toggle {
  display: none;
  width: 43px;
  height: 43px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: transparent;
  padding: 12px;
}
.menu-toggle span {
  display: block;
  background: var(--ink);
  height: 1.5px;
  margin: 5px 0;
  transition: transform var(--motion-response) var(--motion-ease);
}
.menu-toggle[aria-expanded='true'] span:first-child {
  transform: translateY(3.25px) rotate(45deg);
}
.menu-toggle[aria-expanded='true'] span:last-child {
  transform: translateY(-3.25px) rotate(-45deg);
}
.mobile-menu {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--cream);
  padding: 10px var(--gutter) 24px;
  box-shadow: 0 15px 20px #2b232215;
  /* The header can wrap with enlarged text; its actual height sets the menu's
     available space, including short landscape viewports. */
  max-height: calc(100dvh - 100%);
  overflow: auto;
}
.mobile-menu a {
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  display: block;
  font-size: 18px;
}
.mobile-menu a[aria-current] {
  color: var(--red);
  font-weight: 600;
}
.hero {
  --hero-photo-start: 38%;
  min-height: 430px;
  position: relative;
  isolation: isolate;
  background: var(--wine);
  overflow: hidden;
  color: var(--cream);
}
.hero-home {
  min-height: 555px;
}
.hero-photo {
  position: absolute;
  inset: 0 0 0 var(--hero-photo-start);
  z-index: -2;
}
.hero-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    90deg,
    #650f19 0%,
    #650f19 var(--hero-photo-start),
    #650f1980 51%,
    #1d100b08 73%
  );
}
.hero::after {
  content: '';
  position: absolute;
  inset: auto 0 0;
  height: 110px;
  background: linear-gradient(transparent, #2c110d55);
  z-index: -1;
}
.hero-content {
  padding: 26px var(--gutter) 55px;
  max-width: 880px;
}
.eyebrow {
  font-size: 11px;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: 1.7px;
  display: flex;
  align-items: center;
  gap: 11px;
  text-transform: uppercase;
}
.hero h1 {
  font-size: clamp(54px, 5.25vw, 82px);
  font-weight: 600;
  line-height: 1.035;
  letter-spacing: -2.8px;
  margin: 23px 0 25px;
  max-width: 790px;
  text-wrap: balance;
}
.hero-home h1 {
  font-size: clamp(64px, 6.1vw, 94px);
  line-height: 1;
  max-width: 780px;
}
.hero h1 em {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 400;
  font-size: 0.93em;
  letter-spacing: -3px;
}
.hero-description {
  font-size: 19px;
  line-height: 1.5;
  color: #f4ded6;
  max-width: 490px;
}
.hero-home .hero-description {
  margin-bottom: 26px;
}
.photo-credit {
  position: absolute;
  bottom: 14px;
  right: var(--gutter);
  font-size: 10px;
  text-shadow: 0 1px 5px #000;
  color: #fff;
  max-width: 65%;
  text-align: right;
}
.button {
  display: inline-flex;
  min-width: 0;
  max-width: 100%;
  justify-content: center;
  align-items: center;
  gap: 25px;
  border: 1px solid transparent;
  border-radius: 50px;
  padding: 15px 25px;
  min-height: 53px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  text-align: left;
}
.button svg {
  width: 20px;
  height: 20px;
}
/* Tabac's visible letterforms sit above their line-box centre. Lower only the
   label ink: icons, control borders, focus rings and hit areas stay centred. */
.control-label {
  position: relative;
  top: var(--control-label-offset);
  min-width: 0;
}
:where(.button, .text-link, .text-button, .footer-link, .filter-chip,
    .donation-cta, .support-qr-save, .support-contact-link, .social-link,
    .header-support, .language-trigger, .languages a,
    .page-sidebar nav > a, .video-external, [data-video-stop]) > svg {
  position: relative;
  top: 0;
}
.button-cream {
  background: var(--cream);
  color: var(--wine);
}
.button-cream:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) {
  background: #ede0c7;
}
.button-red {
  background: var(--red);
  color: var(--cream);
}
.button-red:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) {
  background: var(--wine);
}
.button-outline {
  color: var(--cream);
  background: transparent;
  border-color: #e3c9c166;
}
.button-outline:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) {
  background: #ffffff13;
}
.text-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  font-size: 14px;
  font-weight: 600;
  color: var(--wine);
  padding-bottom: 3px;
}
.text-link svg {
  width: 18px;
  height: 18px;
  transition: transform var(--motion-response) var(--motion-ease);
}
.text-link:is(:hover, :focus-visible) {
  text-decoration: underline;
  text-underline-offset: 5px;
}
.text-button {
  border: 0;
  background: transparent;
  padding: 3px 0;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 14px;
  color: var(--wine);
  font-weight: 600;
}
.text-button:not(:disabled):is(:hover, :focus-visible) {
  text-decoration: underline;
  text-underline-offset: 5px;
}
.text-button svg {
  width: 17px;
  height: 17px;
}
.round-button {
  display: inline-grid;
  place-items: center;
  width: 43px;
  height: 43px;
  min-width: 43px;
  border: 1px solid #bdae99;
  border-radius: 50%;
  background: transparent;
  transition: background 0.2s;
  color: var(--wine);
}
.round-button svg {
  width: 19px;
  height: 19px;
}
.round-button:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) {
  background: #e6dccb;
}
.home-intro-band {
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 23px var(--gutter);
  background: var(--sand);
  border-bottom: 1px solid #d5c9b6;
}
.home-intro-band > span {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  border-right: 1px solid #bdae99;
  padding-right: 28px;
}
.home-intro-band p {
  font-size: 17px;
  color: #5a483d;
}
.home-intro-band button {
  margin-left: auto;
  background: transparent;
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 14px;
  color: var(--wine);
  font-weight: 600;
}
.home-intro-band button:hover {
  text-decoration: underline;
  text-underline-offset: 5px;
}
.home-intro-band button svg {
  width: 18px;
  height: 18px;
}
.page-content {
  padding: 0 var(--gutter);
  max-width: 2000px;
  margin: 0 auto;
}
.page-sections {
  min-width: 0;
}
.page-section {
  padding-top: 64px;
  /* The page already keeps an anchor target the header's height and the
     anchor gap below the top; a section lands right at the sticky header's
     edge instead (the header counted once), and its own top padding is the
     space above its heading. Arriving from a homepage card or the page menu,
     no title stands half under the header. */
  scroll-margin-top: calc(-1 * var(--anchor-gap));
}
/* Round 3 · competition · point 34: the old address of a section that gave
   way to others (#downloads, #fees) is an anchor at the top of its successor
   and lands exactly where that section does (render.js). */
.page-section.has-old-anchor { position: relative; }
.section-alias { position: absolute; top: 0; left: 0; scroll-margin-top: calc(-1 * var(--anchor-gap)); }
.page-section:last-child {
  padding-bottom: 30px;
}
.section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 35px;
  margin-bottom: 27px;
}
.section-heading:has(> div:empty) {
  display: none;
}
.section-heading .eyebrow {
  margin-bottom: 13px;
}
.section-heading h2 {
  max-width: 900px;
}
.section-intro {
  max-width: 960px;
  margin: -5px 0 27px;
}
.page-lead {
  font-size: 23px;
  max-width: 950px;
  padding-top: 42px;
}
.rich-text {
  overflow-wrap: anywhere;
}
.rich-text p + p {
  margin-top: 15px;
}
.rich-text h2,
.rich-text h3,
.rich-text h4 {
  margin: 28px 0 13px;
}
.rich-text h2:first-child,
.rich-text h3:first-child {
  margin-top: 0;
}
.rich-text h2 {
  font-size: 31px;
  letter-spacing: -0.8px;
}
.rich-text h3 {
  font-size: 25px;
}
.rich-text h4 {
  font-size: 21px;
}
.rich-text ul,
.rich-text ol {
  padding-left: 23px;
  margin: 17px 0;
}
.rich-text li + li {
  margin-top: 8px;
}
.rich-text a {
  color: var(--wine);
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}
.rich-text a:hover {
  color: var(--red);
}
.rich-text hr {
  border: 0;
  border-top: 1px solid var(--line);
  margin: 25px 0;
}
.rich-text strong {
  font-weight: 600;
}
.text-panel {
  background: var(--cream);
  border: 1px solid #e6ded1;
  border-radius: var(--radius);
  padding: 34px 38px;
  color: #5c4e47;
}
.text-panel > div + div {
  border-top: 1px solid var(--line);
  padding-top: 27px;
  margin-top: 27px;
}
.text-panel > p,
.text-panel > ul,
.text-panel > ol {
  max-width: 1060px;
}
.text-panel .text-link {
  margin-top: 17px;
}
.with-sidebar {
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
  gap: clamp(28px, 4vw, 70px);
}
.page-sidebar {
  padding-top: 60px;
}
.page-sidebar nav {
  position: static;
  top: var(--sidebar-offset, calc(var(--header) + 32px));
  padding: 3px 7px 8px 0;
}
@media (min-width: 761px) {
  .page-sidebar nav[data-sticky='true'] {
    position: sticky;
  }
}
.small-label {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.4px;
  color: #705946;
}
.page-sidebar .small-label {
  margin-bottom: 14px;
}
.page-sidebar nav > a:not(.button) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
  line-height: 1.4;
  color: #61544b;
}
.page-sidebar nav > a:not(.button) svg {
  width: 14px;
  height: 14px;
  opacity: 0;
}
.page-sidebar nav > a[aria-current='location'] {
  color: var(--wine);
  font-weight: 600;
}
.page-sidebar nav > a[aria-current='location'] svg,
.page-sidebar nav > a:is(:hover, :focus-visible) svg {
  opacity: 1;
}
.sidebar-registration {
  width: 100%;
  font-size: 13px;
  gap: 10px;
  padding: 15px 17px;
  margin-top: 24px;
}
.sidebar-registration svg {
  width: 16px;
  height: 16px;
}
.content-grid {
  display: grid;
  gap: 23px;
}
.columns-1 {
  grid-template-columns: 1fr;
}
.columns-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.columns-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.columns-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.content-card {
  background: var(--cream);
  border: 1px solid #e3d9c9;
  border-radius: var(--radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.content-card:nth-child(even) {
  background: #ede6d8;
}
.content-card-body {
  padding: 28px 29px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 1;
}
.content-card-body h3 {
  margin-bottom: 15px;
}
.content-card-body .tag {
  margin-bottom: 14px;
}
.content-card-body .rich-text {
  color: var(--muted);
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 22px;
}
.content-card-body > .text-link {
  margin-top: auto;
  padding-top: 5px;
}
.card-image {
  aspect-ratio: 1.65;
  overflow: hidden;
  background: var(--sand);
}
.card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: filter var(--motion-response) ease;
}
.tag {
  display: inline-flex;
  align-items: center;
  border: 1px solid #ccbba4;
  background: #f3ebdf;
  color: #664734;
  padding: 4px 9px;
  border-radius: 30px;
  font-size: 10px;
  line-height: 1.4;
  font-weight: 600;
  letter-spacing: 0.1px;
}
.facts-grid {
  display: grid;
  background: var(--sand);
  border: 1px solid #ddcfb9;
  border-radius: var(--radius);
  padding: 29px 10px;
  row-gap: 28px;
}
.fact {
  min-width: 0;
  padding: 0 27px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.fact strong {
  font-size: 25px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -0.5px;
}
.fact > .rich-text {
  font-size: 19px;
  color: var(--wine);
  font-weight: 600;
  line-height: 1.4;
}
.fact small {
  color: var(--muted);
  font-size: 12px;
}
.fact .text-link {
  font-size: 12px;
  margin-top: 10px;
}
.section-facts .section-heading {
  margin-bottom: 20px;
}
.document-list {
  background: var(--cream);
  border: 1px solid #e4dbcd;
  border-radius: var(--radius);
  padding: 3px 30px;
}
.document-row {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 25px 0;
  border-bottom: 1px solid var(--line);
}
.document-row:last-child {
  border: 0;
}
.document-icon {
  width: 46px;
  height: 49px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #ede3d2;
  color: var(--wine);
  flex-shrink: 0;
}
.document-icon svg {
  width: 23px;
  height: 23px;
}
.document-row > div {
  flex: 1;
}
.document-row h3 {
  font-size: 22px;
  margin: 0 0 3px;
}
.document-row h3 a:hover {
  color: var(--wine);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.document-row small {
  color: var(--muted);
  font-size: 12px;
}
.document-row .rich-text {
  font-size: 15px;
  color: var(--muted);
  margin-top: 8px;
}
.document-row > .round-button {
  margin-left: auto;
}
.faq-list {
  border-top: 1px solid #cbbfaf;
}
.faq-list details {
  border-bottom: 1px solid #cbbfaf;
}
.faq-list summary,
.news-entry summary {
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
  list-style: none;
  cursor: pointer;
  font-size: 21px;
  font-weight: 600;
  line-height: 1.35;
  padding: 24px 0;
}
.faq-list summary::-webkit-details-marker,
.news-entry summary::-webkit-details-marker,
.person-card summary::-webkit-details-marker,
.gallery-entry summary::-webkit-details-marker,
.guestbook-entry summary::-webkit-details-marker {
  display: none;
}
.faq-list summary svg,
.news-entry summary > svg,
.person-card summary svg,
.gallery-entry summary svg,
.guestbook-entry summary > svg {
  width: 20px;
  height: 20px;
  transition: transform var(--motion-response) var(--motion-ease);
  color: var(--wine);
}
details:not(.language-picker)[open] > summary > svg,
details:not(.language-picker)[open] > summary .text-link svg {
  transform: rotate(45deg);
}
.answer {
  padding: 0 50px 27px 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.7;
  max-width: 1050px;
}
.answer .text-link {
  margin-top: 16px;
}
.quote-panel {
  margin: 0;
  padding: 40px 50px;
  border-radius: var(--radius);
  background: var(--sand);
  color: var(--wine);
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr);
  gap: 5px 20px;
}
.quote-panel > span {
  font-family: Georgia, serif;
  font-size: 95px;
  line-height: 1;
}
.quote-panel .rich-text {
  font-size: clamp(23px, 2.3vw, 33px);
  line-height: 1.45;
  max-width: 1000px;
}
.quote-panel cite {
  grid-column: 2;
  font-style: normal;
  color: var(--muted);
  font-size: 14px;
  margin-top: 18px;
}
.news-carousel {
  min-width: 0;
}
.carousel-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 46px) / 3);
  gap: 23px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  scroll-padding: 0;
  padding-bottom: 4px;
}
.carousel-track::-webkit-scrollbar {
  display: none;
}
.news-card {
  scroll-snap-align: start;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.news-card-image {
  aspect-ratio: 1.82;
  overflow: hidden;
  display: block;
  background: var(--sand);
}
.news-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: filter var(--motion-response) ease;
}
.news-card-content {
  padding: 25px 27px 27px;
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
}
.card-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 13px;
  font-size: 11px;
  color: var(--muted);
}
.news-card h3 {
  font-size: 25px;
  margin-bottom: 13px;
}
.news-card h3 a:hover {
  color: var(--wine);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.news-card p {
  font-size: 15px;
  color: var(--muted);
  line-height: 1.55;
  margin-bottom: 22px;
}
.news-card .text-link {
  margin-top: auto;
}
.carousel-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 25px;
  margin-top: 23px;
}
.carousel-controls {
  display: flex;
  gap: 10px;
}
.news-list {
  border-top: 1px solid #cbbfaf;
}
.news-entry {
  border-bottom: 1px solid #cbbfaf;
  scroll-margin-top: calc(var(--header) + 20px);
}
.news-entry summary {
  padding: 30px 0;
  align-items: flex-start;
  gap: 35px;
}
.news-meta {
  flex: 0 0 165px;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 11px;
  font-size: 13px;
  font-weight: 400;
  color: var(--muted);
}
.news-heading {
  font-size: 28px;
  flex: 1;
  hyphens: auto;
}
.news-summary {
  display: block;
  font-size: 16px;
  line-height: 1.6;
  font-weight: 400;
  color: var(--muted);
  margin-top: 11px;
  max-width: 850px;
}
.news-entry summary > svg {
  margin-top: 6px;
}
.news-expanded {
  padding: 0 50px 35px 200px;
}
.news-expanded > .rich-text {
  max-width: 850px;
  color: var(--muted);
}
.news-photo {
  max-height: 420px;
  width: 100%;
  max-width: 850px;
  object-fit: cover;
  border-radius: 17px;
  margin-bottom: 24px;
}
.news-expanded small {
  display: block;
  margin-top: 15px;
  font-size: 11px;
}
.filter-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
  font-size: 14px;
}
.filter-row label {
  font-weight: 600;
}
.filter-row select {
  min-width: 220px;
}
.filter-row > span {
  margin-left: auto;
  color: var(--muted);
  font-size: 13px;
}
select {
  border: 1px solid #c9baa5;
  border-radius: 10px;
  background: var(--cream);
  color: var(--ink);
  padding: 10px 35px 10px 13px;
  min-height: 43px;
  max-width: 100%;
}
.people-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 21px;
  align-items: start;
}
.person-card {
  background: var(--cream);
  border-radius: var(--radius);
  border: 1px solid var(--line);
  overflow: hidden;
}
.person-card > .person-summary {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 23px;
  padding: 25px;
}
.person-card > summary {
  cursor: pointer;
}
.person-portrait {
  width: 108px;
  height: 132px;
  object-fit: cover;
  border-radius: 13px;
  flex: none;
}
.person-monogram {
  width: 90px;
  height: 110px;
  min-width: 2.2em;
  min-height: 1.6em;
  white-space: nowrap;
  line-height: 1;
  display: grid;
  place-items: center;
  flex: none;
  border-radius: 13px;
  background: #e8deca;
  color: var(--wine);
  font-size: 35px;
  font-family: Georgia, serif;
}
.person-heading {
  display: flex;
  flex: 1 1 12ch;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}
.person-heading > small {
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--wine);
  font-weight: 600;
  margin-bottom: 6px;
}
.person-heading strong {
  font-size: 23px;
  line-height: 1.2;
}
.person-heading > span:not(.text-link) {
  font-size: 13px;
  line-height: 1.4;
  color: var(--muted);
  margin-top: 7px;
}
.person-heading .text-link {
  font-size: 12px;
  margin-top: 15px;
}
.person-heading .text-link svg {
  width: 14px;
  height: 14px;
}
.person-bio {
  padding: 0 26px 27px;
  color: var(--muted);
  font-size: 15px;
}
.venue-card {
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 27px;
  display: flex;
  gap: 20px;
}
.venue-icon {
  width: 39px;
  height: 39px;
  border: 1px solid #cbbba5;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  color: var(--wine);
}
.venue-icon svg {
  width: 20px;
  height: 20px;
}
.venue-card .eyebrow {
  font-size: 10px;
  margin-bottom: 7px;
}
.venue-card h3 {
  font-size: 23px;
  margin-bottom: 9px;
}
.venue-card p,
.venue-card .rich-text {
  font-size: 15px;
}
.venue-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  margin-top: 19px;
}
.venue-actions:empty {
  display: none;
}
.venue-actions .text-link {
  min-width: 0;
  max-width: 100%;
}
.partner-category + .partner-category {
  margin-top: 37px;
}
.partner-category > h3 {
  font-size: 21px;
  color: #74634f;
  margin-bottom: 20px;
}
.partner-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 21px;
}
.partner-card {
  align-self: start;
  padding: 25px;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.partner-logo {
  height: 104px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.partner-logo img {
  max-width: 100%;
  max-height: 95px;
  object-fit: contain;
}
.partner-card h3,
.partner-card h4 {
  font-size: 21px;
  margin-bottom: 12px;
}
.partner-card p,
.partner-card .rich-text {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.55;
  margin-bottom: 18px;
}
.partner-card .text-link {
  font-size: 12px;
  margin-top: auto;
}
.video-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 23px;
}
.video-image {
  aspect-ratio: 16/9;
  position: relative;
  display: block;
  background: var(--wine);
}
.video-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.video-image::after {
  content: '';
  position: absolute;
  inset: 0;
  background: #22070625;
  transition: background 0.2s;
}
.video-image:hover::after {
  background: #22070600;
}
.play-icon {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  background: var(--cream);
  color: var(--wine);
  width: 58px;
  height: 58px;
  border-radius: 50%;
  display: grid;
  place-items: center;
}
.play-icon svg {
  width: 23px;
  height: 23px;
  transform: translateX(1px);
}
.gallery-list {
  display: flex;
  flex-direction: column;
  gap: 22px;
  max-width: 960px;
}
.gallery-entry {
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}
.gallery-entry > summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 30px;
  padding: 23px;
  cursor: pointer;
}
.gallery-cover {
  width: 220px;
  aspect-ratio: 1.55;
  border-radius: 13px;
  overflow: hidden;
  background: var(--sand);
  flex-shrink: 0;
}
.gallery-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.gallery-entry summary > span:last-child {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 11px;
}
.gallery-entry summary strong {
  font-size: 29px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -0.6px;
}
.gallery-entry summary .muted {
  font-size: 15px;
}
.gallery-entry summary .text-link {
  font-size: 13px;
  margin-top: 5px;
}
.gallery-images {
  padding: 0 24px 24px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 280px));
  gap: 18px;
  align-items: start;
}
.gallery-images figure {
  margin: 0;
  min-width: 0;
}
.gallery-images button {
  display: block;
  width: 100%;
  max-width: 280px;
  aspect-ratio: 3 / 2;
  padding: 0;
  border-radius: 11px;
  overflow: hidden;
  background: var(--sand);
  cursor: zoom-in;
}
.gallery-images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: filter var(--motion-response) ease;
}
.gallery-images figcaption {
  font-size: 10px;
  color: var(--muted);
  margin-top: 7px;
  overflow-wrap: anywhere;
}
.gallery-body {
  padding: 0 25px 25px;
  color: var(--muted);
  font-size: 15px;
}
.guestbook-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  align-items: start;
}
.guestbook-entry {
  background: var(--sand);
  border-radius: var(--radius);
  padding: 25px 29px;
}
.guestbook-entry summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.guestbook-entry summary > span {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.quote-mark {
  font-family: Georgia, serif;
  font-size: 55px;
  color: var(--wine);
  height: 43px;
  line-height: 1;
}
.guestbook-entry strong {
  font-size: 24px;
  line-height: 1.25;
  font-weight: 600;
}
.guestbook-entry small {
  font-size: 12px;
  color: var(--muted);
  margin-top: 10px;
}
.guestbook-entry > .rich-text {
  font-size: 16px;
  color: #615140;
  margin-top: 22px;
}
.agenda-tools {
  display: grid;
  grid-template-columns: 1fr 1.17fr;
  gap: 25px;
  align-items: stretch;
}
.map-card {
  background: var(--sand);
  border: 1px solid #dacdb7;
  border-radius: var(--radius);
  padding: 29px 28px 23px;
  overflow: hidden;
}
.map-heading h3 {
  margin: 9px 0 10px;
  font-size: 27px;
  max-width: 350px;
}
.map-heading > p:last-child {
  font-size: 13px;
  color: var(--muted);
  max-width: 340px;
}
.swiss-map {
  width: 100%;
  height: auto;
  min-height: 230px;
  max-height: 330px;
  margin: 12px 0 8px;
  overflow: visible;
}
.swiss-shape {
  fill: #f7f0e2;
  stroke: #c7b69a;
  stroke-width: 1.5;
  stroke-linejoin: round;
}
.map-point {
  fill: var(--wine);
  stroke: none;
  cursor: pointer;
}
.map-point .map-pulse {
  fill: #b801011d;
  transition: fill 0.2s;
}
.map-point text {
  font-size: 14px;
  stroke: #f7f0e2;
  stroke-width: 3px;
  paint-order: stroke;
  fill: var(--wine);
  font-weight: 600;
}
.map-point:is(:hover, :focus-visible) .map-pulse,
.map-point.is-selected .map-pulse {
  fill: #b8010155;
}
.map-point:focus {
  outline: 0;
}
.map-point:focus-visible .map-pulse {
  stroke: var(--wine);
  stroke-width: 3px;
}
.map-locations {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 0;
}
.filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 1px solid #c4b294;
  border-radius: 25px;
  padding: 6px 10px;
  background: transparent;
  font-size: 11px;
  color: #604933;
}
.filter-chip svg {
  width: 12px;
  height: 12px;
}
.filter-chip:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible),
.filter-chip.is-selected {
  background: var(--wine);
  color: var(--cream);
  border-color: var(--wine);
}
.calendar-card {
  align-self: start;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 29px;
}
.calendar-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.calendar-heading h3 {
  font-size: 27px;
  margin-top: 9px;
}
.calendar-controls {
  display: flex;
  gap: 8px;
}
.calendar-controls .round-button {
  width: 36px;
  height: 36px;
  min-width: 36px;
}
.calendar-hint {
  font-size: 13px;
  color: var(--muted);
  margin-top: 10px;
  max-width: 470px;
}
.calendar-months {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 25px;
  margin-top: 29px;
}
.calendar-month h4 {
  font-size: 17px;
  letter-spacing: -0.15px;
  margin-bottom: 14px;
  text-transform: capitalize;
}
.month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 3px;
  text-align: center;
  font-size: 12px;
}
.weekday {
  font-size: 10px;
  color: #807060;
  padding: 3px 0 10px;
}
.calendar-day {
  width: 100%;
  aspect-ratio: 1;
  min-height: 27px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-size: 12px;
  color: #776553;
  position: relative;
  padding: 0;
  background: transparent;
}
.calendar-day.has-events {
  color: var(--wine);
  font-weight: 700;
  background: #eadbcb;
  cursor: pointer;
}
.calendar-day.has-events::after {
  content: '';
  position: absolute;
  bottom: 3px;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--red);
}
.calendar-day.has-events:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) {
  background: var(--wine);
  color: var(--cream);
}
.calendar-day.is-today {
  outline: 1px solid var(--red);
  outline-offset: -2px;
}
.calendar-day.is-selected {
  background: var(--wine);
  color: var(--cream);
}
.calendar-day.is-selected::after {
  background: var(--cream);
}
.calendar-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid var(--line);
  margin-top: 26px;
  padding-top: 16px;
}
.calendar-footer .text-button {
  font-size: 12px;
}
.event-list-heading {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 25px;
  margin: 45px 0 25px;
  scroll-margin-top: calc(var(--header) + 25px);
}
.event-list-heading h3 {
  font-size: 33px;
  margin-top: 9px;
}
.event-filters {
  display: flex;
  align-items: flex-end;
  gap: 20px;
  border-bottom: 1px solid #cbbfaf;
  padding-bottom: 25px;
}
.event-filters label {
  display: flex;
  flex-direction: column;
  gap: 7px;
  font-size: 12px;
  font-weight: 600;
  min-width: 210px;
}
.event-filters select {
  font-size: 14px;
  font-weight: 400;
  min-width: 0;
}
.results-count {
  font-size: 12px;
  margin-left: auto;
  color: var(--muted);
  padding-bottom: 12px;
}
.event-row {
  display: flex;
  align-items: flex-start;
  gap: 27px;
  padding: 29px 0;
  border-bottom: 1px solid #cbbfaf;
}
.event-date {
  width: 105px;
  min-width: 105px;
  display: flex;
  flex-direction: column;
  background: #e7ddc7;
  border-radius: 15px;
  padding: 17px 10px 13px;
  text-align: center;
  color: var(--wine);
}
.event-date time {
  font-size: 23px;
  line-height: 1.2;
  font-weight: 600;
  white-space: nowrap;
  letter-spacing: -0.5px;
}
.event-date > span {
  font-size: 12px;
  letter-spacing: 1px;
  margin-top: 7px;
}
.event-description {
  flex: 1;
  min-width: 0;
}
.event-description .card-meta:empty {
  display: none;
}
.event-description h3 {
  font-size: 25px;
  margin-bottom: 10px;
}
.event-description > p {
  font-size: 16px;
  color: var(--muted);
  max-width: 760px;
}
.event-meta {
  display: flex;
  gap: 10px 25px;
  flex-wrap: wrap;
  color: #755f50;
  font-size: 12px;
  margin-top: 15px;
}
.event-meta span {
  display: flex;
  gap: 7px;
  align-items: center;
}
.event-meta svg {
  width: 15px;
  height: 15px;
}
.event-link {
  font-size: 12px;
  flex-shrink: 0;
  margin-top: 31px;
}
.event-details {
  margin-top: 16px;
  font-size: 14px;
}
.event-details > summary {
  cursor: pointer;
  color: var(--wine);
  font-weight: 600;
}
.event-details > .rich-text {
  margin-top: 15px;
  color: var(--muted);
}
.empty-state {
  padding: 35px;
  text-align: center;
  background: #ebe3d4;
  color: var(--muted);
  border-radius: var(--radius);
  margin-top: 20px;
  font-size: 16px;
}
.fallback-note {
  background: #f2e1c2;
  border: 1px solid #dcc79f;
  border-radius: 10px;
  padding: 12px 18px;
  margin: 20px var(--gutter);
  color: #604422;
  font-size: 13px;
}
.rich-text .fallback-note,
.news-expanded .fallback-note {
  margin: 0 0 15px;
}
.preview-banner {
  background: #291e1d;
  color: var(--cream);
  padding: 12px 20px;
  text-align: center;
  font-size: 14px;
  position: relative;
  z-index: 60;
}
.closing-band {
  margin: 35px var(--gutter) 0;
  border-top: 1px solid var(--line);
  padding: 40px 0 47px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 35px;
}
.closing-band .eyebrow {
  font-size: 10px;
  margin-bottom: 11px;
}
.closing-band h2 {
  font-size: 33px;
  letter-spacing: -1px;
}
.closing-band p:not(.eyebrow) {
  font-size: 16px;
  color: var(--muted);
  margin-top: 10px;
}
.closing-band .button {
  flex: 0 1 auto;
}
.closing-band > div {
  min-width: 0;
  flex: 1 1 350px;
}
.site-footer {
  background: #4c1018;
  color: var(--cream);
  padding: 47px var(--gutter) 0;
}
.footer-top {
  display: flex;
  align-items: flex-start;
  gap: clamp(30px, 5vw, 90px);
  padding-bottom: 40px;
}
.footer-top > div:first-child {
  max-width: 350px;
}
.footer-tagline {
  font-size: 14px;
  color: #dfc4b9;
  max-width: 320px;
  line-height: 1.55;
  margin-top: 20px;
}
.footer-top .button {
  font-size: 12px;
  min-height: 45px;
  padding: 12px 18px;
  margin-top: 25px;
}
.footer-top .button svg {
  width: 16px;
  height: 16px;
}
.footer-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 13px 38px;
  margin-left: auto;
  font-size: 14px;
  padding-top: 6px;
}
.footer-nav a:hover {
  color: #f0d0b0;
  text-decoration: underline;
  text-underline-offset: 5px;
}
.footer-contact {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 300px;
  min-width: 210px;
  padding-top: 5px;
}
.footer-contact .eyebrow {
  color: #d3aa96;
  font-size: 10px;
  margin-bottom: 3px;
}
.footer-contact address {
  font-size: 13px;
  line-height: 1.65;
  font-style: normal;
  color: #dfc4b9;
}
.footer-contact a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--cream);
  font-size: 14px;
  gap: 24px;
}
.footer-contact svg {
  width: 16px;
  height: 16px;
}
.back-top {
  border-color: #ffffff50;
  color: var(--cream);
  margin-top: 7px;
}
.back-top svg {
  transform: rotate(-90deg);
}
.back-top:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) {
  background: #ffffff15;
}
.footer-bottom {
  border-top: 1px solid #ffffff25;
  padding: 19px 0 22px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 25px;
  font-size: 10px;
  color: #dec2b9;
}
.footer-bottom > div {
  display: flex;
  align-items: center;
  gap: 25px;
  flex-wrap: wrap;
}
.footer-design-credit {
  white-space: nowrap;
}
.footer-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.footer-link svg {
  width: 12px;
  height: 12px;
}
.footer-bottom a:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}
dialog {
  --dialog-close-inset: 20px;
  border: 0;
  padding: 0;
  max-height: calc(100dvh - 60px);
  max-width: calc(100vw - 40px);
  color: var(--ink);
  overscroll-behavior: contain;
}
dialog::backdrop {
  background: #240b10ae;
  backdrop-filter: blur(5px);
}
.content-dialog {
  border-radius: 25px;
  background: var(--cream);
  width: min(740px, 120dvh);
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0 35px 100px #1b0d1140;
}
.content-dialog[open] {
  display: flex;
  flex-direction: column;
}
.dialog-close {
  position: absolute;
  right: var(--dialog-close-inset);
  top: var(--dialog-close-inset);
  z-index: 3;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 0;
  background: var(--cream);
  color: var(--wine);
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  flex: 0 0 44px;
}
.dialog-close svg { width: 22px; height: 22px; }
.dialog-toolbar {
  display: flex;
  flex: 0 0 auto;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  position: relative;
  z-index: 4;
  padding: var(--dialog-close-inset) var(--dialog-close-inset) 8px 32px;
  background: var(--cream);
}
.dialog-toolbar > .dialog-close {
  position: static;
  flex-shrink: 0;
  margin: 0;
}
.dialog-toolbar-label {
  min-width: 0;
  color: var(--wine);
  font-size: 15px;
  font-weight: 600;
}
.dialog-media {
  position: relative;
  flex: 0 0 auto;
  background: var(--cream);
}
.dialog-media > .dialog-close {
  background: var(--cream);
  box-shadow: 0 2px 12px #2b23221a;
}
.support-dialog {
  width: 760px;
  max-width: calc(100vw - 48px);
  max-height: calc(100dvh - 48px);
  overflow: hidden;
  isolation: isolate;
}
.support-dialog > .dialog-toolbar {
  flex: 0 0 auto;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding: var(--dialog-close-inset) var(--dialog-close-inset) 8px 32px;
  background: var(--cream);
}
.support-toolbar-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--wine);
  font-size: 15px;
  font-weight: 600;
}
.support-toolbar-label svg { width: 19px; height: 19px; }
.support-dialog .dialog-close { flex-shrink: 0; }
.dialog-image {
  display: block;
  width: 100%;
  height: min(270px, 40dvh);
  object-fit: cover;
}
.dialog-content {
  padding: 35px 40px 40px;
}
.dialog-content > .eyebrow {
  margin-bottom: 12px;
}
.dialog-content > h2 {
  font-size: 42px;
  margin-bottom: 22px;
}
.dialog-content > .rich-text {
  font-size: 17px;
  line-height: 1.7;
  color: var(--muted);
}
.dialog-content > .button,
.dialog-content > .text-link {
  margin-top: 25px;
}
/* The rounded shell never scrolls. Its media/header stays reachable and the native
   scrollbar lives inside this inset body, clear of both rounded corners. */
.dialog-scroll {
  /* Positioned descendants (the hidden «new window» hint of a document link)
     scroll with the text; otherwise they would make the dialog frame itself
     scrollable, and reading that hint could shift the photo and close button. */
  position: relative;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  margin: 0 10px 16px 0;
  scrollbar-gutter: stable;
  scroll-padding: 20px;
}
.dialog-scroll:focus-visible { outline-offset: -3px; }
:is(.dialog-scroll, .lightbox figcaption) {
  scrollbar-width: thin;
  scrollbar-color: #a6907f transparent;
}
:is(.dialog-scroll, .lightbox figcaption)::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
:is(.dialog-scroll, .lightbox figcaption)::-webkit-scrollbar-track,
:is(.dialog-scroll, .lightbox figcaption)::-webkit-scrollbar-corner {
  background: transparent;
}
:is(.dialog-scroll, .lightbox figcaption)::-webkit-scrollbar-thumb {
  background: #a6907f;
  border-radius: 999px;
}
:is(.dialog-scroll, .lightbox figcaption)::-webkit-scrollbar-thumb:hover {
  background: #806555;
}
.support-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  grid-template-areas: "intro payment" "story payment";
  grid-template-rows: min-content 1fr;
  align-items: start;
  column-gap: 28px;
  padding: 24px 18px 8px 32px;
}
.support-intro { grid-area: intro; min-width: 0; }
.support-intro h2 { font-size: 34px; line-height: 1.12; letter-spacing: -0.6px; overflow-wrap: anywhere; hyphens: manual; }
.support-story { grid-area: story; min-width: 0; margin-top: 20px; font-size: 16px; line-height: 1.6; color: var(--muted); overflow-wrap: anywhere; }
.support-story > :last-child { margin-bottom: 0; }
.support-actions { grid-area: payment; min-width: 0; padding: 20px; border-radius: 20px; background: var(--sand); overflow-wrap: anywhere; }
.support-actions.has-payment { color: var(--cream); background: #261e1d; }
.support-actions h3 { font-size: 19px; line-height: 1.3; }
.support-payment > h3 { text-align: center; }
.support-qr-frame { width: min(100%, 220px); margin: 16px auto; padding: 16px; background: #fff; border-radius: 14px; }
.support-dialog .donation-qr { display: block; width: 100%; height: auto; object-fit: contain; margin: 0; }
.support-scan-hint { font-size: 12px; line-height: 1.5; text-align: center; color: #e2d7cb; margin-bottom: 12px; }
.support-qr-save { display: flex; justify-content: center; align-items: center; gap: 10px; min-height: 44px; margin-top: 12px; border: 1px solid #76665e; border-radius: 999px; color: var(--cream); font-size: 13px; text-align: center; padding: 10px; }
.support-qr-save svg { width: 16px; height: 16px; flex-shrink: 0; }
.support-qr-save:hover { background: #ffffff12; }
.support-qr-save:focus-visible { outline-color: var(--cream); }
.support-dialog .bank-details { margin-top: 20px; border-top: 1px solid #76665e; padding-top: 20px; }
.support-dialog .bank-details h4 { font-size: 15px; margin-bottom: 8px; }
.support-dialog .bank-details p { font-size: 14px; line-height: 1.6; white-space: pre-line; overflow-wrap: anywhere; color: #e2d7cb; }
.support-contact > p { font-size: 14px; line-height: 1.6; margin: 12px 0 20px; color: var(--muted); }
.support-contact > .button { width: 100%; min-height: 48px; padding: 13px 15px; font-size: 14px; line-height: 1.4; gap: 12px; margin-bottom: 12px; }
.support-contact-link { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 36px; font-size: 14px; line-height: 1.45; color: var(--wine); }
.support-contact-link svg { width: 15px; height: 15px; flex-shrink: 0; }
.support-contact-link:hover { text-decoration: underline; text-underline-offset: 4px; }
/* Further ways to support (Round 2, point 58): quiet link rows on hairlines.
   Beside the payment block they close the text column level with its foot;
   on phones they follow it, so the donation itself stays first. */
.support-layout.has-ways {
  grid-template-areas: "intro payment" "story payment" "ways payment";
  grid-template-rows: min-content min-content 1fr;
}
.support-ways { grid-area: ways; align-self: end; min-width: 0; margin-top: 28px; }
.support-ways h3 { font-size: 15px; line-height: 1.3; font-weight: 600; color: var(--ink); margin-bottom: 6px; }
.support-ways ul { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.support-ways li { border-bottom: 1px solid var(--line); }
.support-ways .support-way { display: flex; justify-content: space-between; align-items: center; gap: 16px; width: 100%; min-height: 48px; padding: 12px 0; line-height: 1.35; overflow-wrap: anywhere; }
.support-ways .support-way svg { flex-shrink: 0; }
/* An e-mail symbol stays in place on keyboard focus, as it does on hover. */
.support-ways .support-way[href^='mailto:']:focus-visible svg { transform: none; }
/* Round 3 (answer 5): until the further ways have a link the dialog shows
   none, and the title and text sit centred beside the payment block. */
@media (min-width: 621px) {
  .support-layout:not(.has-ways) {
    grid-template-areas: ". payment" "intro payment" "story payment" ". payment";
    grid-template-rows: 1fr min-content min-content 1fr;
  }
}
@media (max-width: 800px) {
  .support-layout { grid-template-columns: minmax(0, 1fr) 240px; column-gap: 24px; padding: 20px 12px 8px 24px; }
  .support-actions { padding: 18px; }
  .support-intro h2 { font-size: 30px; }
}
@media (max-width: 620px) {
  .support-dialog { max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); }
  .support-dialog > .dialog-toolbar { padding-left: 20px; }
  .support-scroll { margin-bottom: 12px; }
  .support-layout { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; grid-template-areas: "intro" "story" "payment"; gap: 12px; padding: 12px 10px 4px 20px; }
  .support-intro h2 { font-size: 24px; line-height: 1.1; letter-spacing: -0.3px; }
  .support-story { font-size: 14px; line-height: 1.45; margin-top: 0; }
  .support-actions { padding: 14px; border-radius: 16px; }
  .support-actions h3 { font-size: 17px; }
  .support-qr-frame { width: min(100%, 180px); padding: 12px; margin: 10px auto; }
  .support-qr-save { margin-top: 8px; font-size: 12px; padding: 8px; }
  .support-layout.has-ways { grid-template-areas: "intro" "story" "payment" "ways"; grid-template-rows: auto auto auto auto; }
  .support-ways { margin-top: 12px; }
}
@media (min-width: 621px) and (max-height: 450px) {
  .support-dialog { max-height: calc(100dvh - 24px); }
  .support-dialog > .dialog-toolbar { padding-left: 24px; }
  .support-scroll { margin-bottom: 12px; }
  .support-layout { grid-template-columns: minmax(0, 1fr) 220px; padding-block: 12px 4px; }
  .support-intro h2 { font-size: 28px; }
  .support-story { font-size: 14px; line-height: 1.5; margin-top: 14px; }
  .support-actions { padding: 14px; }
  .support-actions h3 { font-size: 17px; }
  .support-qr-frame { width: min(100%, 150px); padding: 10px; margin: 10px auto; }
  .support-qr-save { margin-top: 8px; padding: 8px; font-size: 12px; }
}

/* Round 3 · newsletter · sign-up window (server/render.js, newsletterDialog).
   The donation window's frame, toolbar and type in one column, because the
   form has a single field. Field and button share one row and one height on
   wider screens and stack on phones. Both button labels share one cell, so
   the button keeps its width while it works; the confirmation takes the
   field's place at its height, and the window keeps its top edge while a
   message lengthens it (site.js). */
.newsletter-dialog { width: 640px; }
.newsletter-layout { padding: 24px 22px 12px 32px; }
.newsletter-layout > h2 { font-size: 34px; line-height: 1.12; letter-spacing: -0.6px; }
.newsletter-intro { margin-top: 14px; font-size: 16px; line-height: 1.6; color: var(--muted); }
.newsletter-form { margin-top: 26px; }
.newsletter-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.newsletter-label { display: block; margin-bottom: 8px; font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--ink); }
.newsletter-row { display: flex; gap: 12px; }
.newsletter-input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 50px;
  margin: 0;
  padding: 12px 16px;
  border: 1px solid var(--line-strong);
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.4;
  transition: border-color var(--motion-quick) ease;
}
.newsletter-input:focus-visible { border-color: var(--wine); }
.newsletter-input[aria-invalid='true'] { border-color: var(--red); }
.newsletter-input:read-only { color: var(--muted); }
.newsletter-submit { flex: 0 0 auto; display: inline-grid; grid-template-areas: 'label'; place-items: center; }
.newsletter-submit > * { grid-area: label; }
.newsletter-submit-busy { display: inline-flex; align-items: center; gap: 10px; visibility: hidden; }
.newsletter-form.is-busy .newsletter-submit { cursor: progress; }
.newsletter-form.is-busy .newsletter-submit-idle { visibility: hidden; }
.newsletter-form.is-busy .newsletter-submit-busy { visibility: visible; }
.newsletter-spinner {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  border: 2px solid #fffcf640;
  border-top-color: var(--cream);
  border-radius: 50%;
  animation: video-loading .8s linear infinite;
}
.newsletter-error { margin-top: 8px; font-size: 14px; line-height: 1.45; color: var(--red); }
.newsletter-failure {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #f6e6e2;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink);
}
.newsletter-failure svg { width: 18px; height: 18px; margin-top: 2px; color: var(--red); }
:is(.newsletter-failure, .newsletter-privacy) a { color: var(--wine); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.newsletter-privacy { margin-top: 16px; font-size: 13px; line-height: 1.55; color: var(--muted); }
.newsletter-success {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 20px;
  border-radius: 16px;
  background: var(--sand);
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink);
}
.newsletter-success:focus { outline: none; }
.newsletter-success svg { box-sizing: content-box; width: 20px; height: 20px; padding: 10px; border-radius: 50%; background: var(--wine); color: var(--cream); }
.newsletter-success strong { font-weight: 600; }
.newsletter-address { overflow-wrap: anywhere; }
.newsletter-layout :is(.newsletter-intro, .newsletter-error, .newsletter-failure, .newsletter-success, .newsletter-privacy) { text-wrap: pretty; }
@media (prefers-reduced-motion: reduce) {
  .newsletter-spinner { animation: none; }
}
@media (max-width: 620px) {
  .newsletter-layout { padding: 12px 10px 8px 20px; }
  .newsletter-layout > h2 { font-size: 24px; line-height: 1.1; letter-spacing: -0.3px; }
  .newsletter-intro { margin-top: 10px; font-size: 14px; line-height: 1.5; }
  .newsletter-form { margin-top: 18px; }
  .newsletter-row { flex-direction: column; gap: 10px; }
  .newsletter-success { gap: 14px; padding: 14px 16px; font-size: 14px; }
}
@media (min-width: 621px) and (max-height: 450px) {
  .newsletter-layout { padding-block: 12px 4px; }
  .newsletter-layout > h2 { font-size: 28px; }
  .newsletter-intro { font-size: 14px; line-height: 1.5; }
  .newsletter-form { margin-top: 16px; }
}

.lightbox {
  width: min(1300px, calc(100vw - 40px));
  height: calc(100dvh - 60px);
  max-width: calc(100vw - 40px);
  background: #211817;
  border-radius: 17px;
  overflow: hidden;
  color: var(--cream);
}
.lightbox[open] {
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr) 70px;
  align-items: center;
  padding: 25px 10px;
}
.lightbox figure {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  min-height: 0;
  height: 100%;
  max-height: calc(100dvh - 110px);
  justify-content: center;
  gap: 16px;
}
.lightbox figure img {
  width: 100%;
  height: 0;
  min-height: 60px;
  flex: 1 1 0;
  max-width: 100%;
  object-fit: contain;
}
.lightbox figcaption {
  font-size: 12px;
  text-align: center;
  color: #e3cfc1;
  max-width: 850px;
  max-height: min(30dvh, 12em);
  flex: 0 0 auto;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  padding: 1px 3px;
}
.lightbox > .round-button:not(.dialog-close) {
  justify-self: center;
  color: var(--cream);
  border-color: #ceb6a688;
}
.lightbox > .round-button:not(.dialog-close):not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) {
  background: #ffffff20;
}
.lightbox > .dialog-close { color: var(--cream); background: #211817e6; }
.lightbox > .dialog-close:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) {
  background: #443332;
}
@media (max-width: 760px), (max-height: 450px) {
  dialog { --dialog-close-inset: 12px; }
}
@media (min-width: 1700px) {
  .hero-home {
    min-height: 620px;
  }
  .hero-home .hero-content {
    max-width: 1050px;
  }
  .hero-home h1 {
    font-size: 103px;
  }
  .hero-home .hero-description {
    font-size: 22px;
    max-width: 580px;
  }
  .primary-nav {
    font-size: 17px;
  }
  .hero:not(.hero-home) {
    min-height: 470px;
  }
  .hero:not(.hero-home) .hero-content {
    max-width: 1030px;
  }
  .hero:not(.hero-home) .hero-description {
    max-width: 620px;
  }
  .calendar-day {
    min-height: 32px;
  }
  .calendar-months {
    gap: 40px;
  }
  .swiss-map {
    max-height: 360px;
  }
  .content-card-body {
    padding: 31px 34px;
  }
  .page-section {
    padding-top: 75px;
  }
}
@media (max-width: 1250px) {
  :root {
    --gutter: 32px;
    --header: 82px;
  }
  .site-header {
    gap: 25px;
  }
  .primary-nav {
    gap: 16px;
    font-size: 13px;
  }
  .hero-content {
    max-width: 760px;
  }
  .hero h1 {
    font-size: 64px;
  }
  .hero-home h1 {
    font-size: 78px;
  }
  .hero-home {
    min-height: 530px;
  }
  .with-sidebar {
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 28px;
  }
  .page-sidebar nav > a:not(.button) {
    font-size: 13px;
  }
  .sidebar-registration {
    font-size: 12px;
    padding: 14px;
  }
  .content-grid {
    gap: 18px;
  }
  .columns-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .content-card-body {
    padding: 25px;
  }
  .carousel-track {
    gap: 20px;
    grid-auto-columns: calc((100% - 40px) / 3);
  }
  .news-card-content {
    padding: 23px;
  }
  .news-card h3 {
    font-size: 23px;
  }
  .people-grid {
    gap: 18px;
  }
  .person-card > .person-summary {
    padding: 22px;
    gap: 16px;
  }
  .person-portrait {
    width: 85px;
    height: 110px;
  }
  .person-heading strong {
    font-size: 21px;
  }
  .partner-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .footer-top {
    gap: 35px;
  }
  .footer-nav {
    gap: 13px 24px;
  }
  .footer-contact {
    min-width: 190px;
  }
  .footer-top > div:first-child {
    max-width: 290px;
  }
  .agenda-tools {
    grid-template-columns: 1fr 1.15fr;
    gap: 20px;
  }
  .calendar-card {
    padding: 24px;
  }
  .calendar-months {
    gap: 17px;
  }
  .map-card {
    padding: 25px 24px 20px;
  }
  .event-filters label {
    min-width: 180px;
  }
  .video-grid {
    gap: 20px;
  }
  .fact {
    padding: 0 20px;
  }
  .fact strong {
    font-size: 22px;
  }
}
@media (max-width: 1050px) {
  .primary-nav {
    display: none;
  }
  .menu-toggle {
    display: block;
  }
  .header-actions {
    gap: 25px;
  }
  .site-header {
    padding: 8px var(--gutter);
    flex-wrap: wrap;
    row-gap: 8px;
  }
  .hero-content {
    max-width: 740px;
  }
  .hero {
    --hero-photo-start: 31%;
  }
  .hero h1 {
    font-size: 62px;
  }
  .hero-description {
    max-width: 455px;
    font-size: 18px;
  }
  .home-intro-band {
    gap: 18px;
  }
  .home-intro-band > span {
    padding-right: 18px;
    font-size: 11px;
  }
  .home-intro-band p {
    font-size: 14px;
  }
  .home-intro-band button {
    font-size: 12px;
  }
  .hero-home h1 {
    font-size: 75px;
  }
  .with-sidebar {
    grid-template-columns: 175px minmax(0, 1fr);
    gap: 28px;
  }
  .with-sidebar .columns-3 {
    grid-template-columns: 1fr;
  }
  .with-sidebar .columns-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .with-sidebar .people-grid {
    grid-template-columns: 1fr;
  }
  .with-sidebar .facts-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 0;
  }
  .with-sidebar .facts-grid > .fact:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
  .text-panel {
    padding: 30px;
  }
  .section-heading h2 {
    font-size: 35px;
  }
  .carousel-track {
    grid-auto-columns: calc((100% - 21px) / 2);
    gap: 21px;
  }
  .agenda-tools {
    grid-template-columns: 1fr;
  }
  .map-card {
    display: grid;
    grid-template-columns: 1fr 1.3fr;
    gap: 0 30px;
    align-items: center;
  }
  .swiss-map {
    grid-column: 2;
    grid-row: 1/3;
    margin: 0;
    min-height: 230px;
  }
  .map-locations {
    align-self: start;
    max-width: 350px;
    margin-top: 20px;
  }
  .calendar-months {
    gap: 40px;
  }
  .month-grid {
    gap: 4px;
  }
  .calendar-day {
    min-height: 35px;
    max-height: 40px;
    aspect-ratio: auto;
  }
  .calendar-card {
    padding: 29px;
  }
  .partner-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .video-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .footer-top {
    flex-wrap: wrap;
    gap: 30px;
  }
  .footer-top > div:first-child {
    max-width: 300px;
  }
  .footer-nav {
    margin-left: auto;
  }
  .footer-contact {
    min-width: 180px;
    max-width: 230px;
  }
  .back-top {
    margin-left: auto;
  }
  .news-meta {
    flex-basis: 130px;
  }
  .news-entry summary {
    gap: 25px;
  }
  .news-expanded {
    padding-left: 155px;
  }
  .person-card > .person-summary {
    padding: 23px;
  }
  .person-portrait {
    width: 90px;
    height: 115px;
  }
}
@media (max-width: 760px) {
  :root {
    --gutter: 22px;
    --header: 76px;
    --radius: 18px;
  }
  body {
    font-size: 16px;
  }
  .site-header {
    gap: 15px;
  }
  .header-actions {
    gap: 16px;
  }
  .menu-toggle {
    width: 39px;
    height: 39px;
    padding: 10px;
  }
  .hero {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  .hero-photo {
    position: relative;
    inset: auto;
    order: 2;
    height: 240px;
    flex-shrink: 0;
    z-index: 0;
  }
  .hero::before {
    display: none;
  }
  .hero::after {
    z-index: 1;
    height: 65px;
  }
  .hero-content {
    position: relative;
    z-index: 2;
    padding: 20px var(--gutter) 24px;
    max-width: none;
  }
  .hero-home {
    min-height: 0;
  }
  .hero .eyebrow {
    font-size: 10px;
    letter-spacing: 1.5px;
  }
  .hero h1,
  .hero-home h1 {
    font-size: clamp(2rem, 7.6vw, 2.625rem);
    letter-spacing: -0.025em;
    line-height: 1.1;
    margin: 14px 0 16px;
    max-width: 640px;
  }
  .hero-home h1 em {
    letter-spacing: -0.025em;
  }
  .hero-description {
    font-size: 16px;
    max-width: 530px;
    line-height: 1.5;
  }
  .hero-home .hero-description {
    margin-bottom: 20px;
  }
  .hero .button {
    padding: 14px 21px;
    min-height: 49px;
    font-size: 14px;
    gap: 25px;
  }
  .photo-credit {
    font-size: 8px;
    bottom: 11px;
    right: 15px;
    z-index: 2;
    max-width: 90%;
  }
  .home-intro-band {
    display: grid;
    grid-template-columns: 1fr auto;
    padding: 20px var(--gutter);
    gap: 9px 15px;
    align-items: start;
  }
  .home-intro-band > span {
    font-size: 11px;
    letter-spacing: 0.5px;
    border: 0;
    padding: 0;
    grid-column: 1;
  }
  .home-intro-band p {
    font-size: 13px;
    grid-column: 1;
    max-width: 250px;
  }
  .home-intro-band button {
    font-size: 11px;
    grid-row: 1/3;
    grid-column: 2;
    max-width: 145px;
    gap: 7px;
    text-align: left;
    padding: 0;
    align-self: center;
  }
  .home-intro-band button svg {
    width: 16px;
    height: 16px;
  }
  .page-section {
    padding-top: 43px;
  }
  .section-heading {
    margin-bottom: 22px;
  }
  .section-heading h2 {
    font-size: 34px;
    letter-spacing: -1px;
  }
  .section-heading .eyebrow {
    font-size: 10px;
    margin-bottom: 12px;
  }
  .section-intro {
    font-size: 15px;
    margin-bottom: 23px;
  }
  .page-lead {
    padding-top: 33px;
    font-size: 20px;
  }
  .text-panel {
    padding: 25px 23px;
    font-size: 16px;
    line-height: 1.65;
  }
  .rich-text h2 {
    font-size: 28px;
  }
  .rich-text h3 {
    font-size: 24px;
  }
  .with-sidebar {
    display: block;
  }
  .page-sidebar {
    padding: 0;
    margin: 0 calc(-1 * var(--gutter));
    position: relative;
    z-index: 10;
  }
  .page-sidebar nav {
    position: static;
    display: flex;
    gap: 22px;
    align-items: center;
    overflow-x: auto;
    overflow-y: hidden;
    max-height: none;
    scrollbar-width: none;
    border-bottom: 1px solid var(--line);
    padding: 0 var(--gutter);
    background: var(--paper);
  }
  .page-sidebar nav::-webkit-scrollbar {
    display: none;
  }
  .page-sidebar .small-label,
  .page-sidebar .sidebar-registration {
    display: none;
  }
  .page-sidebar nav > a:not(.button) {
    flex-shrink: 0;
    white-space: nowrap;
    padding: 17px 0;
    border: 0;
    font-size: 12px;
  }
  .page-sidebar nav > a:not(.button) svg {
    display: none;
  }
  .content-grid {
    gap: 19px;
  }
  .columns-2,
  .columns-3,
  .columns-4,
  .with-sidebar .columns-4 {
    grid-template-columns: 1fr;
  }
  .page-home .columns-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page-home .columns-4 .card-image {
    aspect-ratio: 1.25;
  }
  .page-home .columns-4 .content-card-body {
    padding: 20px 18px;
  }
  .page-home .columns-4 h3 {
    font-size: 24px;
  }
  .page-home .columns-4 .rich-text {
    font-size: 14px;
  }
  .content-card-body {
    padding: 26px;
  }
  .content-card-body h3 {
    font-size: 27px;
    margin-bottom: 12px;
  }
  .content-card-body .rich-text {
    font-size: 16px;
  }
  .card-image {
    aspect-ratio: 1.65;
  }
  .facts-grid {
    padding: 24px 5px;
    gap: 28px 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .facts-grid > .fact:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
  .fact {
    padding: 0 20px;
  }
  .fact strong {
    font-size: 21px;
  }
  .fact > .rich-text {
    font-size: 17px;
  }
  .fact > .small-label {
    font-size: 9px;
    letter-spacing: 1.1px;
  }
  .fact small {
    font-size: 11px;
  }
  .document-list {
    padding: 1px 22px;
  }
  .document-row {
    padding: 23px 0;
    gap: 14px;
  }
  .document-icon {
    width: 36px;
    height: 43px;
    border-radius: 9px;
  }
  .document-icon svg {
    width: 20px;
    height: 20px;
  }
  .document-row h3 {
    font-size: 20px;
    line-height: 1.25;
  }
  .document-row small {
    font-size: 11px;
  }
  .document-row .rich-text {
    font-size: 14px;
  }
  .document-row > .round-button {
    width: 34px;
    height: 34px;
    min-width: 34px;
  }
  .document-row > .round-button svg {
    width: 16px;
    height: 16px;
  }
  .faq-list summary {
    font-size: 19px;
    padding: 22px 0;
    gap: 18px;
  }
  .answer {
    font-size: 16px;
    padding-right: 20px;
    padding-bottom: 24px;
  }
  .quote-panel {
    padding: 28px 25px;
    grid-template-columns: 33px minmax(0, 1fr);
    gap: 0 12px;
  }
  .quote-panel > span {
    font-size: 65px;
  }
  .quote-panel .rich-text {
    font-size: 24px;
  }
  .quote-panel cite {
    font-size: 12px;
  }
  .carousel-track {
    grid-auto-columns: calc((100% - 20px) / 2);
    gap: 20px;
  }
  .news-card-content {
    padding: 23px;
  }
  .news-card h3 {
    font-size: 24px;
  }
  .news-card p {
    font-size: 15px;
  }
  .card-meta {
    font-size: 10px;
    gap: 8px;
  }
  .carousel-bottom {
    margin-top: 20px;
  }
  .carousel-controls {
    gap: 8px;
  }
  .carousel-controls .round-button {
    width: 39px;
    height: 39px;
    min-width: 39px;
  }
  .news-entry summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 20px;
    gap: 15px;
    padding: 25px 0;
  }
  .news-meta {
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 12px;
    grid-column: 1;
  }
  .news-heading {
    font-size: 26px;
    grid-column: 1;
    grid-row: 2;
  }
  .news-summary {
    font-size: 15px;
    margin-top: 12px;
  }
  .news-entry summary > svg {
    grid-column: 2;
    grid-row: 2;
  }
  .news-expanded {
    padding: 0 0 27px;
  }
  .news-expanded > .rich-text {
    font-size: 16px;
  }
  .news-photo {
    max-height: 300px;
    border-radius: 13px;
  }
  .people-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .person-card > .person-summary {
    padding: 24px;
    gap: 22px;
  }
  .person-heading strong {
    font-size: 25px;
  }
  .person-portrait {
    width: 102px;
    height: 128px;
  }
  .person-heading > span:not(.text-link) {
    font-size: 14px;
  }
  .person-bio {
    font-size: 16px;
    padding: 0 25px 25px;
  }
  .filter-row {
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 22px;
    font-size: 13px;
  }
  .filter-row select {
    min-width: 180px;
    max-width: calc(100% - 110px);
  }
  .filter-row > span {
    font-size: 11px;
  }
  .venue-card {
    padding: 25px;
    gap: 17px;
  }
  .venue-card h3 {
    font-size: 25px;
  }
  .partner-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }
  .partner-card {
    padding: 23px;
  }
  .partner-logo {
    height: 85px;
    margin-bottom: 16px;
  }
  .partner-logo img {
    max-height: 80px;
  }
  .partner-card h3,
  .partner-card h4 {
    font-size: 22px;
  }
  .video-grid {
    gap: 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gallery-entry > summary {
    padding: 20px;
    gap: 21px;
  }
  .gallery-cover {
    width: 160px;
  }
  .gallery-entry summary strong {
    font-size: 25px;
  }
  .gallery-entry summary .eyebrow {
    font-size: 10px;
  }
  .gallery-entry summary .muted {
    font-size: 14px;
  }
  .gallery-entry summary .text-link {
    font-size: 12px;
  }
  .gallery-images {
    gap: 13px;
    padding: 0 20px 20px;
  }
  .guestbook-grid {
    grid-template-columns: 1fr;
  }
  .guestbook-entry {
    padding: 24px;
  }
  .agenda-tools {
    gap: 22px;
  }
  .map-card {
    grid-template-columns: 1fr;
    padding: 25px 24px;
  }
  .swiss-map {
    grid-column: 1;
    grid-row: auto;
    min-height: 220px;
    margin: 12px 0;
    max-height: 330px;
  }
  .map-locations {
    max-width: none;
    margin-top: 0;
  }
  .map-heading h3 {
    max-width: 380px;
    font-size: 27px;
  }
  .map-heading > p:last-child {
    font-size: 13px;
    max-width: none;
  }
  .map-point text {
    font-size: 14px;
  }
  .calendar-card {
    padding: 25px;
  }
  .calendar-months {
    gap: 20px;
    margin-top: 25px;
  }
  .calendar-day {
    min-height: 29px;
  }
  .calendar-heading h3 {
    font-size: 27px;
  }
  .calendar-month h4 {
    font-size: 17px;
  }
  .calendar-hint {
    font-size: 13px;
  }
  .month-grid {
    gap: 3px;
  }
  .event-list-heading {
    margin: 35px 0 23px;
    gap: 16px;
  }
  .event-list-heading h3 {
    font-size: 29px;
  }
  .event-list-heading > .text-button {
    font-size: 12px;
    max-width: 130px;
    text-align: right;
  }
  .event-filters {
    gap: 15px;
    flex-wrap: wrap;
    padding-bottom: 21px;
  }
  .event-filters label {
    flex: 1;
    min-width: 150px;
    max-width: 100%;
  }
  .event-filters select {
    width: 100%;
  }
  .results-count {
    margin: 0;
    flex-basis: 100%;
    padding: 0;
    font-size: 11px;
  }
  /* Keep the action on its own row so it cannot squeeze the event text. */
  .event-row {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: 16px 19px;
    padding: 26px 0;
  }
  .event-date {
    width: 86px;
    min-width: 86px;
    padding: 15px 8px 12px;
    border-radius: 13px;
  }
  .event-date time {
    font-size: 20px;
  }
  .event-date > span {
    font-size: 10px;
    margin-top: 5px;
  }
  .event-description {
    min-width: 0;
    width: auto;
  }
  .event-description h3 {
    font-size: 23px;
  }
  .event-description > p {
    font-size: 15px;
  }
  .event-meta {
    font-size: 11px;
    gap: 9px;
    flex-direction: column;
    margin-top: 13px;
  }
  .event-link {
    grid-column: 2;
    justify-self: start;
    margin: 0;
    font-size: 12px;
  }
  .closing-band {
    display: block;
    margin-top: 25px;
    padding: 32px 0 37px;
  }
  .closing-band h2 {
    font-size: 32px;
  }
  .closing-band p:not(.eyebrow) {
    font-size: 15px;
  }
  .closing-band .button {
    font-size: 14px;
    margin-top: 23px;
  }
  .site-footer {
    padding-top: 35px;
  }
  .footer-top {
    gap: 30px;
    padding-bottom: 30px;
  }
  .footer-top > div:first-child {
    flex-basis: 100%;
    max-width: none;
  }
  .footer-tagline {
    font-size: 14px;
    margin-top: 16px;
    max-width: 430px;
  }
  .footer-top .button {
    margin-top: 19px;
  }
  .footer-nav {
    margin: 0;
    gap: 13px 26px;
    flex: 1;
    font-size: 13px;
    grid-template-columns: 1fr;
    min-width: 150px;
  }
  .footer-contact {
    flex: 1;
    max-width: 280px;
    min-width: 160px;
  }
  .footer-contact address {
    font-size: 12px;
  }
  .footer-contact .text-link {
    font-size: 13px;
  }
  .footer-bottom {
    display: block;
    font-size: 10px;
    padding: 19px 0 24px;
  }
  .footer-bottom > div {
    margin-top: 13px;
    gap: 19px;
  }
  .content-dialog {
    border-radius: 20px;
    max-width: calc(100vw - 30px);
    max-height: calc(100dvh - 30px);
    scroll-padding-block-start: 70px;
  }
  .dialog-content {
    padding: 28px;
  }
  .dialog-content > h2 {
    font-size: 35px;
    margin-bottom: 20px;
  }
  .dialog-content > .rich-text {
    font-size: 16px;
  }
  .dialog-image {
    height: min(210px, 40dvh);
  }
  .dialog-toolbar {
    padding-left: 28px;
  }
  .lightbox {
    width: calc(100vw - 20px);
    max-width: calc(100vw - 20px);
    height: calc(100dvh - 30px);
    max-height: calc(100dvh - 30px);
  }
  .lightbox[open] {
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    padding: 15px 4px;
  }
  /* In a gallery the arrows keep the close button's distance from the panel
     edge. A single picture (a press clipping) keeps the full width. */
  .lightbox[open]:not(.is-single) {
    padding-inline: var(--dialog-close-inset);
  }
  .lightbox > .round-button:not(.dialog-close) {
    width: 44px;
    height: 44px;
    min-width: 44px;
  }
  .lightbox figure {
    max-height: calc(100dvh - 65px);
  }
  .lightbox figcaption {
    font-size: 10px;
  }
  .fallback-note {
    font-size: 12px;
    padding: 12px 15px;
  }
  .preview-banner {
    font-size: 12px;
    padding: 10px 16px;
  }
}
@media (max-width: 520px) {
  .hero-photo {
    height: 225px;
  }
  .hero-home .hero-photo {
    height: 250px;
  }
  .page-home .columns-4 {
    grid-template-columns: 1fr;
  }
  .page-home .columns-4 .card-image {
    aspect-ratio: 1.7;
  }
  .page-home .columns-4 .content-card-body {
    padding: 25px;
  }
  .page-home .columns-4 h3 {
    font-size: 28px;
  }
  .page-home .columns-4 .rich-text {
    font-size: 16px;
  }
  .carousel-track {
    grid-auto-columns: 88%;
    gap: 17px;
    overflow: visible;
    overflow-x: auto;
    margin-right: calc(-1 * var(--gutter));
    padding-right: var(--gutter);
    scroll-padding-right: var(--gutter);
  }
  .news-card h3 {
    font-size: 26px;
  }
  .partner-grid {
    gap: 14px;
  }
  .partner-card {
    padding: 20px 17px;
  }
  .partner-card h4 {
    font-size: 20px;
  }
  .partner-card p {
    font-size: 13px;
  }
  .partner-logo {
    height: 75px;
  }
  .partner-card .text-link {
    font-size: 11px;
    gap: 8px;
  }
  .video-grid {
    grid-template-columns: 1fr;
  }
  .gallery-entry > summary {
    display: block;
  }
  .gallery-cover {
    display: block;
    width: 100%;
    aspect-ratio: 1.85;
    margin-bottom: 20px;
  }
  .gallery-entry summary strong {
    font-size: 28px;
  }
  .gallery-images {
    gap: 13px;
  }
  .calendar-card {
    padding: 23px 19px;
  }
  .calendar-months {
    gap: 17px;
    grid-template-columns: 1fr;
  }
  .calendar-month:nth-child(2) {
    border-top: 1px solid var(--line);
    padding-top: 21px;
  }
  .calendar-month h4 {
    font-size: 19px;
    margin-bottom: 13px;
  }
  .calendar-day {
    min-height: 34px;
    font-size: 13px;
  }
  .weekday {
    font-size: 11px;
  }
  .calendar-heading h3 {
    font-size: 26px;
  }
  .calendar-card .eyebrow {
    font-size: 10px;
  }
  .calendar-controls {
    gap: 7px;
  }
  .calendar-controls .round-button {
    width: 33px;
    height: 33px;
    min-width: 33px;
  }
  .calendar-hint {
    margin-top: 13px;
  }
  .calendar-footer .text-button {
    font-size: 11px;
  }
  .map-card {
    padding: 24px 21px;
  }
  .map-point text {
    font-size: 16px;
  }
  .filter-chip {
    font-size: 11px;
  }
  .event-date {
    width: 73px;
    min-width: 73px;
    padding: 14px 7px;
  }
  .event-date time {
    font-size: 17px;
  }
  .event-row {
    gap: 16px;
  }
  .event-description {
    width: auto;
  }
  .event-description h3 {
    font-size: 22px;
  }
  .event-link {
    margin-left: 0;
  }
  .event-description > p {
    font-size: 14px;
  }
  .event-meta span {
    align-items: flex-start;
  }
  .event-filters label {
    min-width: 130px;
  }
  .person-card > .person-summary {
    padding: 21px;
    gap: 17px;
  }
  .person-portrait {
    width: 85px;
    height: 110px;
  }
  .person-heading strong {
    font-size: 23px;
  }
  .person-heading > span:not(.text-link) {
    font-size: 13px;
  }
  .person-monogram {
    width: 75px;
    height: 100px;
    font-size: 30px;
  }
  .fact {
    padding: 0 16px;
  }
  .fact strong {
    font-size: 19px;
  }
  .fact > .rich-text {
    font-size: 16px;
  }
  .fact .text-link {
    font-size: 11px;
  }
  .document-row {
    gap: 12px;
  }
  .document-row h3 {
    font-size: 19px;
  }
  .document-row > .round-button {
    border: 0;
    min-width: 20px;
    width: 20px;
  }
  .document-icon {
    width: 33px;
  }
  .quote-panel {
    grid-template-columns: 25px minmax(0, 1fr);
    padding: 26px 22px;
  }
  .quote-panel .rich-text {
    font-size: 23px;
  }
  .footer-nav {
    min-width: 130px;
  }
  .footer-contact {
    min-width: 150px;
  }
  .footer-contact a {
    overflow-wrap: anywhere;
  }
  .home-intro-band p {
    max-width: 220px;
  }
  .home-intro-band button {
    max-width: 118px;
  }
  .home-intro-band > span {
    font-size: 10px;
  }
}
@media (max-width: 380px) {
  :root {
    --gutter: 18px;
  }
  .header-actions {
    gap: 12px;
  }
  .menu-toggle {
    width: 36px;
    height: 36px;
    padding: 9px;
  }
  .hero-description {
    font-size: 16px;
  }
  .home-intro-band > span {
    font-size: 9px;
  }
  .home-intro-band p {
    font-size: 12px;
  }
  .home-intro-band button {
    font-size: 10px;
    max-width: 108px;
  }
  .section-heading h2 {
    font-size: 31px;
  }
  .text-panel {
    padding: 23px 20px;
  }
  .person-heading strong {
    font-size: 21px;
  }
  .person-portrait {
    width: 75px;
    height: 99px;
  }
  .partner-grid {
    grid-template-columns: 1fr;
  }
  .partner-logo {
    height: 95px;
  }
  .footer-top {
    gap: 26px;
  }
  .footer-nav {
    min-width: 120px;
  }
  .footer-contact {
    min-width: 150px;
  }
  .calendar-hint {
    font-size: 12px;
  }
  .event-list-heading > .text-button {
    max-width: 110px;
  }
  .event-description h3 {
    font-size: 20px;
  }
  .event-description > p {
    font-size: 14px;
  }
  .event-date {
    min-width: 66px;
    width: 66px;
  }
  .event-date time {
    font-size: 16px;
  }
  .event-link {
    margin-left: 0;
  }
  .calendar-controls .round-button {
    width: 31px;
    height: 31px;
    min-width: 31px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    transition: none !important;
    animation: none !important;
  }
  .button:hover {
    transform: none;
  }
}
.has-dialog {
  overflow: hidden;
  /* Replace only the space actually released by the page scrollbar. This also
     handles WebKit's custom scrollbars and leaves overlay scrollbars alone. */
  padding-inline-end: var(--dialog-scrollbar-gap, 0px);
}
.fact-number > strong {
  font-size: 37px;
  letter-spacing: -1px;
  color: var(--wine);
}
.fact-number > .rich-text {
  font-size: 16px;
  line-height: 1.6;
  font-weight: 400;
  color: var(--muted);
}
.section-action {
  margin-top: 21px;
}
.home-feature {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  background: var(--sand);
  border-radius: var(--radius);
  overflow: hidden;
}
.home-feature > figure {
  margin: 0;
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 370px;
}
/* Match both plain images and images inside the responsive <picture> wrapper. */
.home-feature > figure img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  position: absolute;
  inset: 0;
}
.home-feature > figure > figcaption {
  position: absolute;
  right: 14px;
  bottom: 12px;
  font-size: 9px;
  color: #fff;
  text-shadow: 0 1px 5px #000;
  max-width: calc(100% - 28px);
}
.home-feature-content {
  min-width: 0;
  padding: clamp(30px, 4vw, 60px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}
.home-feature-content > .eyebrow {
  margin-bottom: 17px;
}
.home-feature-content > h2 {
  font-size: clamp(32px, 3vw, 45px);
  margin-bottom: 21px;
  hyphens: auto;
}
.home-feature-content > .rich-text {
  color: #615140;
  font-size: 17px;
  line-height: 1.65;
}
.home-feature-content > .button {
  margin-top: 26px;
}
.home-feature-support {
  background: var(--wine);
  color: var(--cream);
}
.home-feature-support > figure {
  order: 2;
}
.home-feature-support .rich-text {
  color: #f0d9cc;
}
.home-feature-support .eyebrow {
  color: #e1b59f;
}
.page-home #about-link {
  padding-top: 15px;
}
.page-home #about-link .document-list {
  background: transparent;
  border: 0;
  padding: 0;
}
.page-home #about-link .document-row {
  padding: 0;
  gap: 12px;
}
.page-home #about-link .document-icon,
.page-home #about-link .round-button {
  display: none;
}
.page-home #about-link h3 {
  font-size: 14px;
  color: var(--wine);
  font-weight: 600;
}
.page-home #about-link h3 a {
  text-decoration: underline;
  text-underline-offset: 4px;
}
.prize-period {
  margin-top: 33px;
}
.prize-period > h3 {
  font-size: 24px;
  margin-bottom: 22px;
}
.prize-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  align-items: start;
}
.prize-card {
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}
.prize-card > summary {
  list-style: none;
  cursor: pointer;
  padding: 24px;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  min-height: 310px;
}
.prize-card > summary::-webkit-details-marker {
  display: none;
}
.prize-card .card-meta {
  gap: 6px;
  margin-bottom: 21px;
}
.prize-card time,
.prize-card .prize-date {
  font-size: 12px;
  color: var(--wine);
  margin-bottom: 11px;
  font-weight: 600;
}
.prize-card h3 {
  font-size: 24px;
  line-height: 1.2;
  margin-bottom: 19px;
}
.prize-location {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.5;
  margin-bottom: 20px;
}
.prize-location svg {
  width: 15px;
  height: 15px;
  margin-top: 1px;
}
.prize-card summary > .text-link {
  font-size: 12px;
  margin-top: auto;
  width: 100%;
  justify-content: space-between;
}
.prize-card summary > .text-link svg {
  width: 17px;
  height: 17px;
  transition: transform var(--motion-response) var(--motion-ease);
}
.prize-card[open] summary > .text-link svg {
  transform: rotate(45deg);
}
.prize-content {
  padding: 0 24px 24px;
  color: var(--muted);
  font-size: 15px;
}
.prize-content > p {
  font-size: 12px;
  margin-bottom: 13px;
  color: var(--wine);
}
.prize-content > .text-link {
  font-size: 12px;
  margin-top: 20px;
}
.prizes-list .event-filters > .text-button {
  margin: 0 0 10px 5px;
}
.prize-period:last-of-type .prize-card {
  background: #ebe4d8;
}
.rich-text figure {
  margin: 24px 0;
}
.rich-text figure > img,
.rich-text > img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 580px;
  border-radius: 16px;
  object-fit: contain;
}
.rich-text figcaption {
  font-size: 12px;
  color: var(--muted);
  margin-top: 9px;
}
.rich-text a.content-button {
  display: inline-flex;
  align-items: center;
  background: var(--red);
  color: var(--cream);
  border-radius: 30px;
  padding: 12px 22px;
  padding-top: calc(12px + var(--control-label-offset));
  padding-bottom: calc(12px - var(--control-label-offset));
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  margin: 8px 0;
}
.rich-text a.content-button:is(:hover, :focus-visible) {
  background: var(--wine);
}
@media (max-width: 1250px) {
  .prize-grid {
    gap: 17px;
  }
  .prize-card > summary {
    padding: 22px;
    min-height: 335px;
  }
  .prize-card h3 {
    font-size: 22px;
  }
  .prize-content {
    padding: 0 22px 22px;
  }
  .home-feature-content > .rich-text {
    font-size: 16px;
  }
  .home-feature > figure {
    min-height: 400px;
  }
}
@media (max-width: 1050px) {
  .prize-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .home-feature {
    grid-template-columns: minmax(0, 1fr);
  }
  .home-feature-content {
    padding: 30px;
  }
  .home-feature-content > h2 {
    font-size: 33px;
  }
  .home-feature-content > .rich-text {
    font-size: 16px;
  }
  .home-feature > figure {
    min-height: 0;
    aspect-ratio: 3 / 2;
  }
  .home-feature-support > figure {
    order: 0;
  }
  .event-filters label {
    min-width: 170px;
  }
  .event-filters {
    flex-wrap: wrap;
  }
  .results-count {
    white-space: nowrap;
  }
  .map-locations {
    max-height: 115px;
    overflow: auto;
    align-content: flex-start;
    padding-right: 4px;
  }
}
@media (max-width: 760px) {
  .home-feature {
    grid-template-columns: minmax(0, 1fr);
  }
  .home-feature > figure {
    min-height: 0;
    /* Width owns the stacked frame. A fixed height plus aspect-ratio makes
       a grid item shrink or overflow even when the outer card hides it. */
    height: auto;
  }
  .home-feature-content {
    padding: 29px 26px 31px;
  }
  .home-feature-content > h2 {
    font-size: 34px;
    max-width: 480px;
    margin-bottom: 19px;
  }
  .home-feature-content > .rich-text {
    font-size: 16px;
  }
  .home-feature-content > .button {
    font-size: 14px;
    margin-top: 23px;
  }
  .home-feature-support > figure {
    order: 0;
  }
  .home-feature-content > .eyebrow {
    font-size: 10px;
    margin-bottom: 13px;
  }
  .page-home #about-link {
    padding-top: 17px;
  }
  .prize-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }
  .prize-card > summary {
    min-height: 285px;
  }
  .prize-card h3 {
    font-size: 24px;
  }
  .prize-card .card-meta {
    margin-bottom: 18px;
  }
  .prizes-list .event-filters > .text-button {
    margin: 0 0 0 auto;
    font-size: 12px;
  }
  .prizes-list .results-count {
    flex-basis: auto;
  }
  .fact-number > strong {
    font-size: 33px;
  }
  .fact-number > .rich-text {
    font-size: 15px;
  }
  .map-locations {
    max-height: 100px;
  }
  .rich-text figure > img,
  .rich-text > img {
    max-height: 440px;
    border-radius: 12px;
  }
}
@media (max-width: 520px) {
  .prize-grid {
    grid-template-columns: 1fr;
  }
  .prize-card > summary {
    min-height: 0;
    padding: 25px;
  }
  .prize-card h3 {
    font-size: 27px;
    max-width: 400px;
  }
  .prize-content {
    padding: 0 25px 25px;
  }
  .prize-location {
    font-size: 13px;
  }
  .prize-card time,
  .prize-card .prize-date {
    font-size: 13px;
  }
  .prize-card summary > .text-link {
    margin-top: 5px;
  }
  .home-feature-content {
    padding: 27px 24px 30px;
  }
  .home-feature-content > h2 {
    font-size: 33px;
  }
  .fact-number > strong {
    font-size: 29px;
  }
  .fact-number > .rich-text {
    font-size: 14px;
  }
  .prize-period > h3 {
    font-size: 23px;
  }
}
@media print {
  .site-header,
  .page-sidebar,
  .closing-band,
  .footer-nav,
  .footer-top .button,
  .back-top,
  .carousel-controls,
  .calendar-controls,
  .dialog-close,
  dialog,
  .home-intro-band button {
    display: none !important;
  }
  body {
    font-size: 12px;
    background: #fff;
  }
  .hero {
    display: block;
    background: #fff;
    color: #000;
    min-height: 0;
  }
  .hero::before,
  .hero::after,
  .hero-photo,
  .photo-credit,
  .hero .button {
    display: none;
  }
  .hero-content {
    padding: 20px;
  }
  .hero h1,
  .hero-home h1 {
    font-size: 40px;
    color: #000;
  }
  .hero-description {
    color: #333;
  }
  .page-content,
  .with-sidebar {
    display: block;
    padding: 0 20px;
  }
  .page-section {
    padding-top: 25px;
  }
  .content-card,
  .text-panel,
  .news-card,
  .venue-card,
  .person-card {
    break-inside: avoid;
  }
  .carousel-track {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-flow: row;
    overflow: visible;
  }
  .site-footer {
    background: #fff;
    color: #000;
    padding: 25px 20px;
  }
  .footer-tagline,
  .footer-contact address,
  .footer-contact a {
    color: #333;
  }
  .footer-bottom {
    color: #333;
  }
  .footer-contact .eyebrow {
    color: #333;
  }
  .footer-top {
    padding: 0;
  }
  .content-grid {
    gap: 15px;
  }
  .agenda-tools {
    display: block;
  }
  .map-card {
    display: none;
  }
  .calendar-card {
    border: 0;
  }
  .news-expanded {
    padding-left: 0;
  }
  .news-entry:not([open]) .news-expanded {
    display: block;
  }
  .faq-list details:not([open]) .answer {
    display: block;
  }
}
/* Final content-driven layout safeguards. */
.partner-card {
  min-width: 0;
}
.partner-card h3,
.partner-card h4,
.partner-card p {
  overflow-wrap: anywhere;
}
@media (max-width: 560px) {
  .partner-grid {
    grid-template-columns: 1fr;
  }
}
.map-locations {
  max-height: 110px;
  overflow: auto;
  align-content: flex-start;
  padding-right: 4px;
}
.page-news .hero-photo img {
}
.event-row[data-category='concert'] .event-date {
  background: #dfe5d6;
  color: #35482d;
}
.event-row[data-category='masterclass'] .event-date {
  background: #e4ddec;
  color: #563968;
}
.event-row[data-category='competition'] .event-date {
  background: #eddbd3;
  color: var(--wine);
}
.prize-card[data-category='concert'] .card-meta .tag:first-child {
  background: #dfe5d6;
  border-color: #c0cbb3;
  color: #35482d;
}
.prize-card[data-category='masterclass'] .card-meta .tag:first-child {
  background: #e4ddec;
  border-color: #c5b6d2;
  color: #563968;
}
/* Legal information uses the same visual system, with a comfortable reading measure. */
.hero.hero-legal {
  min-height: 0;
  background: var(--wine, #650f19);
}
.hero-legal .hero-content {
  width: 100%;
  max-width: 1200px;
  padding-bottom: 3rem;
}
.hero-legal h1 {
  font-size: clamp(2.5rem, 4.4vw, 4.6rem);
  max-width: 22ch;
}
.hero-legal .hero-description {
  max-width: 65ch;
}
.page-privacy .page-content,
.page-legal .page-content {
  max-width: 1100px;
}
.page-privacy .rich-text,
.page-legal .rich-text {
  max-width: 80ch;
}

/* Per-image placement. All 101 slider positions are predeclared so the strict
   CSP can reject inline styles and the saved crop is present on first paint.
   Full image uses contain: the entire photograph stays visible in every frame.
   Tablet and mobile inherit desktop unless an editor supplies their own value. */
.image-placement.image-placement {
  object-fit: var(--crop-d-fit, contain);
  object-position: var(--crop-d-x, 50%) var(--crop-d-y, 50%);
}
.partner-logo .image-placement {
  width: 100%;
  height: 95px;
}
.section-item-image.image-placement {
  display: block;
  width: 100%;
  max-width: 720px;
  height: auto;
  aspect-ratio: 3 / 2;
  margin: 0 0 18px;
  border-radius: 13px;
  background: var(--sand);
}
.home-feature > figure > figcaption {
  background: #21160db3;
  padding: 3px 6px;
  border-radius: 4px;
}
.crop-d-x-0 { --crop-d-x: 0%; }
.crop-d-x-1 { --crop-d-x: 1%; }
.crop-d-x-2 { --crop-d-x: 2%; }
.crop-d-x-3 { --crop-d-x: 3%; }
.crop-d-x-4 { --crop-d-x: 4%; }
.crop-d-x-5 { --crop-d-x: 5%; }
.crop-d-x-6 { --crop-d-x: 6%; }
.crop-d-x-7 { --crop-d-x: 7%; }
.crop-d-x-8 { --crop-d-x: 8%; }
.crop-d-x-9 { --crop-d-x: 9%; }
.crop-d-x-10 { --crop-d-x: 10%; }
.crop-d-x-11 { --crop-d-x: 11%; }
.crop-d-x-12 { --crop-d-x: 12%; }
.crop-d-x-13 { --crop-d-x: 13%; }
.crop-d-x-14 { --crop-d-x: 14%; }
.crop-d-x-15 { --crop-d-x: 15%; }
.crop-d-x-16 { --crop-d-x: 16%; }
.crop-d-x-17 { --crop-d-x: 17%; }
.crop-d-x-18 { --crop-d-x: 18%; }
.crop-d-x-19 { --crop-d-x: 19%; }
.crop-d-x-20 { --crop-d-x: 20%; }
.crop-d-x-21 { --crop-d-x: 21%; }
.crop-d-x-22 { --crop-d-x: 22%; }
.crop-d-x-23 { --crop-d-x: 23%; }
.crop-d-x-24 { --crop-d-x: 24%; }
.crop-d-x-25 { --crop-d-x: 25%; }
.crop-d-x-26 { --crop-d-x: 26%; }
.crop-d-x-27 { --crop-d-x: 27%; }
.crop-d-x-28 { --crop-d-x: 28%; }
.crop-d-x-29 { --crop-d-x: 29%; }
.crop-d-x-30 { --crop-d-x: 30%; }
.crop-d-x-31 { --crop-d-x: 31%; }
.crop-d-x-32 { --crop-d-x: 32%; }
.crop-d-x-33 { --crop-d-x: 33%; }
.crop-d-x-34 { --crop-d-x: 34%; }
.crop-d-x-35 { --crop-d-x: 35%; }
.crop-d-x-36 { --crop-d-x: 36%; }
.crop-d-x-37 { --crop-d-x: 37%; }
.crop-d-x-38 { --crop-d-x: 38%; }
.crop-d-x-39 { --crop-d-x: 39%; }
.crop-d-x-40 { --crop-d-x: 40%; }
.crop-d-x-41 { --crop-d-x: 41%; }
.crop-d-x-42 { --crop-d-x: 42%; }
.crop-d-x-43 { --crop-d-x: 43%; }
.crop-d-x-44 { --crop-d-x: 44%; }
.crop-d-x-45 { --crop-d-x: 45%; }
.crop-d-x-46 { --crop-d-x: 46%; }
.crop-d-x-47 { --crop-d-x: 47%; }
.crop-d-x-48 { --crop-d-x: 48%; }
.crop-d-x-49 { --crop-d-x: 49%; }
.crop-d-x-50 { --crop-d-x: 50%; }
.crop-d-x-51 { --crop-d-x: 51%; }
.crop-d-x-52 { --crop-d-x: 52%; }
.crop-d-x-53 { --crop-d-x: 53%; }
.crop-d-x-54 { --crop-d-x: 54%; }
.crop-d-x-55 { --crop-d-x: 55%; }
.crop-d-x-56 { --crop-d-x: 56%; }
.crop-d-x-57 { --crop-d-x: 57%; }
.crop-d-x-58 { --crop-d-x: 58%; }
.crop-d-x-59 { --crop-d-x: 59%; }
.crop-d-x-60 { --crop-d-x: 60%; }
.crop-d-x-61 { --crop-d-x: 61%; }
.crop-d-x-62 { --crop-d-x: 62%; }
.crop-d-x-63 { --crop-d-x: 63%; }
.crop-d-x-64 { --crop-d-x: 64%; }
.crop-d-x-65 { --crop-d-x: 65%; }
.crop-d-x-66 { --crop-d-x: 66%; }
.crop-d-x-67 { --crop-d-x: 67%; }
.crop-d-x-68 { --crop-d-x: 68%; }
.crop-d-x-69 { --crop-d-x: 69%; }
.crop-d-x-70 { --crop-d-x: 70%; }
.crop-d-x-71 { --crop-d-x: 71%; }
.crop-d-x-72 { --crop-d-x: 72%; }
.crop-d-x-73 { --crop-d-x: 73%; }
.crop-d-x-74 { --crop-d-x: 74%; }
.crop-d-x-75 { --crop-d-x: 75%; }
.crop-d-x-76 { --crop-d-x: 76%; }
.crop-d-x-77 { --crop-d-x: 77%; }
.crop-d-x-78 { --crop-d-x: 78%; }
.crop-d-x-79 { --crop-d-x: 79%; }
.crop-d-x-80 { --crop-d-x: 80%; }
.crop-d-x-81 { --crop-d-x: 81%; }
.crop-d-x-82 { --crop-d-x: 82%; }
.crop-d-x-83 { --crop-d-x: 83%; }
.crop-d-x-84 { --crop-d-x: 84%; }
.crop-d-x-85 { --crop-d-x: 85%; }
.crop-d-x-86 { --crop-d-x: 86%; }
.crop-d-x-87 { --crop-d-x: 87%; }
.crop-d-x-88 { --crop-d-x: 88%; }
.crop-d-x-89 { --crop-d-x: 89%; }
.crop-d-x-90 { --crop-d-x: 90%; }
.crop-d-x-91 { --crop-d-x: 91%; }
.crop-d-x-92 { --crop-d-x: 92%; }
.crop-d-x-93 { --crop-d-x: 93%; }
.crop-d-x-94 { --crop-d-x: 94%; }
.crop-d-x-95 { --crop-d-x: 95%; }
.crop-d-x-96 { --crop-d-x: 96%; }
.crop-d-x-97 { --crop-d-x: 97%; }
.crop-d-x-98 { --crop-d-x: 98%; }
.crop-d-x-99 { --crop-d-x: 99%; }
.crop-d-x-100 { --crop-d-x: 100%; }
.crop-d-y-0 { --crop-d-y: 0%; }
.crop-d-y-1 { --crop-d-y: 1%; }
.crop-d-y-2 { --crop-d-y: 2%; }
.crop-d-y-3 { --crop-d-y: 3%; }
.crop-d-y-4 { --crop-d-y: 4%; }
.crop-d-y-5 { --crop-d-y: 5%; }
.crop-d-y-6 { --crop-d-y: 6%; }
.crop-d-y-7 { --crop-d-y: 7%; }
.crop-d-y-8 { --crop-d-y: 8%; }
.crop-d-y-9 { --crop-d-y: 9%; }
.crop-d-y-10 { --crop-d-y: 10%; }
.crop-d-y-11 { --crop-d-y: 11%; }
.crop-d-y-12 { --crop-d-y: 12%; }
.crop-d-y-13 { --crop-d-y: 13%; }
.crop-d-y-14 { --crop-d-y: 14%; }
.crop-d-y-15 { --crop-d-y: 15%; }
.crop-d-y-16 { --crop-d-y: 16%; }
.crop-d-y-17 { --crop-d-y: 17%; }
.crop-d-y-18 { --crop-d-y: 18%; }
.crop-d-y-19 { --crop-d-y: 19%; }
.crop-d-y-20 { --crop-d-y: 20%; }
.crop-d-y-21 { --crop-d-y: 21%; }
.crop-d-y-22 { --crop-d-y: 22%; }
.crop-d-y-23 { --crop-d-y: 23%; }
.crop-d-y-24 { --crop-d-y: 24%; }
.crop-d-y-25 { --crop-d-y: 25%; }
.crop-d-y-26 { --crop-d-y: 26%; }
.crop-d-y-27 { --crop-d-y: 27%; }
.crop-d-y-28 { --crop-d-y: 28%; }
.crop-d-y-29 { --crop-d-y: 29%; }
.crop-d-y-30 { --crop-d-y: 30%; }
.crop-d-y-31 { --crop-d-y: 31%; }
.crop-d-y-32 { --crop-d-y: 32%; }
.crop-d-y-33 { --crop-d-y: 33%; }
.crop-d-y-34 { --crop-d-y: 34%; }
.crop-d-y-35 { --crop-d-y: 35%; }
.crop-d-y-36 { --crop-d-y: 36%; }
.crop-d-y-37 { --crop-d-y: 37%; }
.crop-d-y-38 { --crop-d-y: 38%; }
.crop-d-y-39 { --crop-d-y: 39%; }
.crop-d-y-40 { --crop-d-y: 40%; }
.crop-d-y-41 { --crop-d-y: 41%; }
.crop-d-y-42 { --crop-d-y: 42%; }
.crop-d-y-43 { --crop-d-y: 43%; }
.crop-d-y-44 { --crop-d-y: 44%; }
.crop-d-y-45 { --crop-d-y: 45%; }
.crop-d-y-46 { --crop-d-y: 46%; }
.crop-d-y-47 { --crop-d-y: 47%; }
.crop-d-y-48 { --crop-d-y: 48%; }
.crop-d-y-49 { --crop-d-y: 49%; }
.crop-d-y-50 { --crop-d-y: 50%; }
.crop-d-y-51 { --crop-d-y: 51%; }
.crop-d-y-52 { --crop-d-y: 52%; }
.crop-d-y-53 { --crop-d-y: 53%; }
.crop-d-y-54 { --crop-d-y: 54%; }
.crop-d-y-55 { --crop-d-y: 55%; }
.crop-d-y-56 { --crop-d-y: 56%; }
.crop-d-y-57 { --crop-d-y: 57%; }
.crop-d-y-58 { --crop-d-y: 58%; }
.crop-d-y-59 { --crop-d-y: 59%; }
.crop-d-y-60 { --crop-d-y: 60%; }
.crop-d-y-61 { --crop-d-y: 61%; }
.crop-d-y-62 { --crop-d-y: 62%; }
.crop-d-y-63 { --crop-d-y: 63%; }
.crop-d-y-64 { --crop-d-y: 64%; }
.crop-d-y-65 { --crop-d-y: 65%; }
.crop-d-y-66 { --crop-d-y: 66%; }
.crop-d-y-67 { --crop-d-y: 67%; }
.crop-d-y-68 { --crop-d-y: 68%; }
.crop-d-y-69 { --crop-d-y: 69%; }
.crop-d-y-70 { --crop-d-y: 70%; }
.crop-d-y-71 { --crop-d-y: 71%; }
.crop-d-y-72 { --crop-d-y: 72%; }
.crop-d-y-73 { --crop-d-y: 73%; }
.crop-d-y-74 { --crop-d-y: 74%; }
.crop-d-y-75 { --crop-d-y: 75%; }
.crop-d-y-76 { --crop-d-y: 76%; }
.crop-d-y-77 { --crop-d-y: 77%; }
.crop-d-y-78 { --crop-d-y: 78%; }
.crop-d-y-79 { --crop-d-y: 79%; }
.crop-d-y-80 { --crop-d-y: 80%; }
.crop-d-y-81 { --crop-d-y: 81%; }
.crop-d-y-82 { --crop-d-y: 82%; }
.crop-d-y-83 { --crop-d-y: 83%; }
.crop-d-y-84 { --crop-d-y: 84%; }
.crop-d-y-85 { --crop-d-y: 85%; }
.crop-d-y-86 { --crop-d-y: 86%; }
.crop-d-y-87 { --crop-d-y: 87%; }
.crop-d-y-88 { --crop-d-y: 88%; }
.crop-d-y-89 { --crop-d-y: 89%; }
.crop-d-y-90 { --crop-d-y: 90%; }
.crop-d-y-91 { --crop-d-y: 91%; }
.crop-d-y-92 { --crop-d-y: 92%; }
.crop-d-y-93 { --crop-d-y: 93%; }
.crop-d-y-94 { --crop-d-y: 94%; }
.crop-d-y-95 { --crop-d-y: 95%; }
.crop-d-y-96 { --crop-d-y: 96%; }
.crop-d-y-97 { --crop-d-y: 97%; }
.crop-d-y-98 { --crop-d-y: 98%; }
.crop-d-y-99 { --crop-d-y: 99%; }
.crop-d-y-100 { --crop-d-y: 100%; }
.crop-d-cover { --crop-d-fit: cover; }
.crop-d-contain { --crop-d-fit: contain; }
.crop-t-x-0 { --crop-t-x: 0%; }
.crop-t-x-1 { --crop-t-x: 1%; }
.crop-t-x-2 { --crop-t-x: 2%; }
.crop-t-x-3 { --crop-t-x: 3%; }
.crop-t-x-4 { --crop-t-x: 4%; }
.crop-t-x-5 { --crop-t-x: 5%; }
.crop-t-x-6 { --crop-t-x: 6%; }
.crop-t-x-7 { --crop-t-x: 7%; }
.crop-t-x-8 { --crop-t-x: 8%; }
.crop-t-x-9 { --crop-t-x: 9%; }
.crop-t-x-10 { --crop-t-x: 10%; }
.crop-t-x-11 { --crop-t-x: 11%; }
.crop-t-x-12 { --crop-t-x: 12%; }
.crop-t-x-13 { --crop-t-x: 13%; }
.crop-t-x-14 { --crop-t-x: 14%; }
.crop-t-x-15 { --crop-t-x: 15%; }
.crop-t-x-16 { --crop-t-x: 16%; }
.crop-t-x-17 { --crop-t-x: 17%; }
.crop-t-x-18 { --crop-t-x: 18%; }
.crop-t-x-19 { --crop-t-x: 19%; }
.crop-t-x-20 { --crop-t-x: 20%; }
.crop-t-x-21 { --crop-t-x: 21%; }
.crop-t-x-22 { --crop-t-x: 22%; }
.crop-t-x-23 { --crop-t-x: 23%; }
.crop-t-x-24 { --crop-t-x: 24%; }
.crop-t-x-25 { --crop-t-x: 25%; }
.crop-t-x-26 { --crop-t-x: 26%; }
.crop-t-x-27 { --crop-t-x: 27%; }
.crop-t-x-28 { --crop-t-x: 28%; }
.crop-t-x-29 { --crop-t-x: 29%; }
.crop-t-x-30 { --crop-t-x: 30%; }
.crop-t-x-31 { --crop-t-x: 31%; }
.crop-t-x-32 { --crop-t-x: 32%; }
.crop-t-x-33 { --crop-t-x: 33%; }
.crop-t-x-34 { --crop-t-x: 34%; }
.crop-t-x-35 { --crop-t-x: 35%; }
.crop-t-x-36 { --crop-t-x: 36%; }
.crop-t-x-37 { --crop-t-x: 37%; }
.crop-t-x-38 { --crop-t-x: 38%; }
.crop-t-x-39 { --crop-t-x: 39%; }
.crop-t-x-40 { --crop-t-x: 40%; }
.crop-t-x-41 { --crop-t-x: 41%; }
.crop-t-x-42 { --crop-t-x: 42%; }
.crop-t-x-43 { --crop-t-x: 43%; }
.crop-t-x-44 { --crop-t-x: 44%; }
.crop-t-x-45 { --crop-t-x: 45%; }
.crop-t-x-46 { --crop-t-x: 46%; }
.crop-t-x-47 { --crop-t-x: 47%; }
.crop-t-x-48 { --crop-t-x: 48%; }
.crop-t-x-49 { --crop-t-x: 49%; }
.crop-t-x-50 { --crop-t-x: 50%; }
.crop-t-x-51 { --crop-t-x: 51%; }
.crop-t-x-52 { --crop-t-x: 52%; }
.crop-t-x-53 { --crop-t-x: 53%; }
.crop-t-x-54 { --crop-t-x: 54%; }
.crop-t-x-55 { --crop-t-x: 55%; }
.crop-t-x-56 { --crop-t-x: 56%; }
.crop-t-x-57 { --crop-t-x: 57%; }
.crop-t-x-58 { --crop-t-x: 58%; }
.crop-t-x-59 { --crop-t-x: 59%; }
.crop-t-x-60 { --crop-t-x: 60%; }
.crop-t-x-61 { --crop-t-x: 61%; }
.crop-t-x-62 { --crop-t-x: 62%; }
.crop-t-x-63 { --crop-t-x: 63%; }
.crop-t-x-64 { --crop-t-x: 64%; }
.crop-t-x-65 { --crop-t-x: 65%; }
.crop-t-x-66 { --crop-t-x: 66%; }
.crop-t-x-67 { --crop-t-x: 67%; }
.crop-t-x-68 { --crop-t-x: 68%; }
.crop-t-x-69 { --crop-t-x: 69%; }
.crop-t-x-70 { --crop-t-x: 70%; }
.crop-t-x-71 { --crop-t-x: 71%; }
.crop-t-x-72 { --crop-t-x: 72%; }
.crop-t-x-73 { --crop-t-x: 73%; }
.crop-t-x-74 { --crop-t-x: 74%; }
.crop-t-x-75 { --crop-t-x: 75%; }
.crop-t-x-76 { --crop-t-x: 76%; }
.crop-t-x-77 { --crop-t-x: 77%; }
.crop-t-x-78 { --crop-t-x: 78%; }
.crop-t-x-79 { --crop-t-x: 79%; }
.crop-t-x-80 { --crop-t-x: 80%; }
.crop-t-x-81 { --crop-t-x: 81%; }
.crop-t-x-82 { --crop-t-x: 82%; }
.crop-t-x-83 { --crop-t-x: 83%; }
.crop-t-x-84 { --crop-t-x: 84%; }
.crop-t-x-85 { --crop-t-x: 85%; }
.crop-t-x-86 { --crop-t-x: 86%; }
.crop-t-x-87 { --crop-t-x: 87%; }
.crop-t-x-88 { --crop-t-x: 88%; }
.crop-t-x-89 { --crop-t-x: 89%; }
.crop-t-x-90 { --crop-t-x: 90%; }
.crop-t-x-91 { --crop-t-x: 91%; }
.crop-t-x-92 { --crop-t-x: 92%; }
.crop-t-x-93 { --crop-t-x: 93%; }
.crop-t-x-94 { --crop-t-x: 94%; }
.crop-t-x-95 { --crop-t-x: 95%; }
.crop-t-x-96 { --crop-t-x: 96%; }
.crop-t-x-97 { --crop-t-x: 97%; }
.crop-t-x-98 { --crop-t-x: 98%; }
.crop-t-x-99 { --crop-t-x: 99%; }
.crop-t-x-100 { --crop-t-x: 100%; }
.crop-t-y-0 { --crop-t-y: 0%; }
.crop-t-y-1 { --crop-t-y: 1%; }
.crop-t-y-2 { --crop-t-y: 2%; }
.crop-t-y-3 { --crop-t-y: 3%; }
.crop-t-y-4 { --crop-t-y: 4%; }
.crop-t-y-5 { --crop-t-y: 5%; }
.crop-t-y-6 { --crop-t-y: 6%; }
.crop-t-y-7 { --crop-t-y: 7%; }
.crop-t-y-8 { --crop-t-y: 8%; }
.crop-t-y-9 { --crop-t-y: 9%; }
.crop-t-y-10 { --crop-t-y: 10%; }
.crop-t-y-11 { --crop-t-y: 11%; }
.crop-t-y-12 { --crop-t-y: 12%; }
.crop-t-y-13 { --crop-t-y: 13%; }
.crop-t-y-14 { --crop-t-y: 14%; }
.crop-t-y-15 { --crop-t-y: 15%; }
.crop-t-y-16 { --crop-t-y: 16%; }
.crop-t-y-17 { --crop-t-y: 17%; }
.crop-t-y-18 { --crop-t-y: 18%; }
.crop-t-y-19 { --crop-t-y: 19%; }
.crop-t-y-20 { --crop-t-y: 20%; }
.crop-t-y-21 { --crop-t-y: 21%; }
.crop-t-y-22 { --crop-t-y: 22%; }
.crop-t-y-23 { --crop-t-y: 23%; }
.crop-t-y-24 { --crop-t-y: 24%; }
.crop-t-y-25 { --crop-t-y: 25%; }
.crop-t-y-26 { --crop-t-y: 26%; }
.crop-t-y-27 { --crop-t-y: 27%; }
.crop-t-y-28 { --crop-t-y: 28%; }
.crop-t-y-29 { --crop-t-y: 29%; }
.crop-t-y-30 { --crop-t-y: 30%; }
.crop-t-y-31 { --crop-t-y: 31%; }
.crop-t-y-32 { --crop-t-y: 32%; }
.crop-t-y-33 { --crop-t-y: 33%; }
.crop-t-y-34 { --crop-t-y: 34%; }
.crop-t-y-35 { --crop-t-y: 35%; }
.crop-t-y-36 { --crop-t-y: 36%; }
.crop-t-y-37 { --crop-t-y: 37%; }
.crop-t-y-38 { --crop-t-y: 38%; }
.crop-t-y-39 { --crop-t-y: 39%; }
.crop-t-y-40 { --crop-t-y: 40%; }
.crop-t-y-41 { --crop-t-y: 41%; }
.crop-t-y-42 { --crop-t-y: 42%; }
.crop-t-y-43 { --crop-t-y: 43%; }
.crop-t-y-44 { --crop-t-y: 44%; }
.crop-t-y-45 { --crop-t-y: 45%; }
.crop-t-y-46 { --crop-t-y: 46%; }
.crop-t-y-47 { --crop-t-y: 47%; }
.crop-t-y-48 { --crop-t-y: 48%; }
.crop-t-y-49 { --crop-t-y: 49%; }
.crop-t-y-50 { --crop-t-y: 50%; }
.crop-t-y-51 { --crop-t-y: 51%; }
.crop-t-y-52 { --crop-t-y: 52%; }
.crop-t-y-53 { --crop-t-y: 53%; }
.crop-t-y-54 { --crop-t-y: 54%; }
.crop-t-y-55 { --crop-t-y: 55%; }
.crop-t-y-56 { --crop-t-y: 56%; }
.crop-t-y-57 { --crop-t-y: 57%; }
.crop-t-y-58 { --crop-t-y: 58%; }
.crop-t-y-59 { --crop-t-y: 59%; }
.crop-t-y-60 { --crop-t-y: 60%; }
.crop-t-y-61 { --crop-t-y: 61%; }
.crop-t-y-62 { --crop-t-y: 62%; }
.crop-t-y-63 { --crop-t-y: 63%; }
.crop-t-y-64 { --crop-t-y: 64%; }
.crop-t-y-65 { --crop-t-y: 65%; }
.crop-t-y-66 { --crop-t-y: 66%; }
.crop-t-y-67 { --crop-t-y: 67%; }
.crop-t-y-68 { --crop-t-y: 68%; }
.crop-t-y-69 { --crop-t-y: 69%; }
.crop-t-y-70 { --crop-t-y: 70%; }
.crop-t-y-71 { --crop-t-y: 71%; }
.crop-t-y-72 { --crop-t-y: 72%; }
.crop-t-y-73 { --crop-t-y: 73%; }
.crop-t-y-74 { --crop-t-y: 74%; }
.crop-t-y-75 { --crop-t-y: 75%; }
.crop-t-y-76 { --crop-t-y: 76%; }
.crop-t-y-77 { --crop-t-y: 77%; }
.crop-t-y-78 { --crop-t-y: 78%; }
.crop-t-y-79 { --crop-t-y: 79%; }
.crop-t-y-80 { --crop-t-y: 80%; }
.crop-t-y-81 { --crop-t-y: 81%; }
.crop-t-y-82 { --crop-t-y: 82%; }
.crop-t-y-83 { --crop-t-y: 83%; }
.crop-t-y-84 { --crop-t-y: 84%; }
.crop-t-y-85 { --crop-t-y: 85%; }
.crop-t-y-86 { --crop-t-y: 86%; }
.crop-t-y-87 { --crop-t-y: 87%; }
.crop-t-y-88 { --crop-t-y: 88%; }
.crop-t-y-89 { --crop-t-y: 89%; }
.crop-t-y-90 { --crop-t-y: 90%; }
.crop-t-y-91 { --crop-t-y: 91%; }
.crop-t-y-92 { --crop-t-y: 92%; }
.crop-t-y-93 { --crop-t-y: 93%; }
.crop-t-y-94 { --crop-t-y: 94%; }
.crop-t-y-95 { --crop-t-y: 95%; }
.crop-t-y-96 { --crop-t-y: 96%; }
.crop-t-y-97 { --crop-t-y: 97%; }
.crop-t-y-98 { --crop-t-y: 98%; }
.crop-t-y-99 { --crop-t-y: 99%; }
.crop-t-y-100 { --crop-t-y: 100%; }
.crop-t-cover { --crop-t-fit: cover; }
.crop-t-contain { --crop-t-fit: contain; }
.crop-m-x-0 { --crop-m-x: 0%; }
.crop-m-x-1 { --crop-m-x: 1%; }
.crop-m-x-2 { --crop-m-x: 2%; }
.crop-m-x-3 { --crop-m-x: 3%; }
.crop-m-x-4 { --crop-m-x: 4%; }
.crop-m-x-5 { --crop-m-x: 5%; }
.crop-m-x-6 { --crop-m-x: 6%; }
.crop-m-x-7 { --crop-m-x: 7%; }
.crop-m-x-8 { --crop-m-x: 8%; }
.crop-m-x-9 { --crop-m-x: 9%; }
.crop-m-x-10 { --crop-m-x: 10%; }
.crop-m-x-11 { --crop-m-x: 11%; }
.crop-m-x-12 { --crop-m-x: 12%; }
.crop-m-x-13 { --crop-m-x: 13%; }
.crop-m-x-14 { --crop-m-x: 14%; }
.crop-m-x-15 { --crop-m-x: 15%; }
.crop-m-x-16 { --crop-m-x: 16%; }
.crop-m-x-17 { --crop-m-x: 17%; }
.crop-m-x-18 { --crop-m-x: 18%; }
.crop-m-x-19 { --crop-m-x: 19%; }
.crop-m-x-20 { --crop-m-x: 20%; }
.crop-m-x-21 { --crop-m-x: 21%; }
.crop-m-x-22 { --crop-m-x: 22%; }
.crop-m-x-23 { --crop-m-x: 23%; }
.crop-m-x-24 { --crop-m-x: 24%; }
.crop-m-x-25 { --crop-m-x: 25%; }
.crop-m-x-26 { --crop-m-x: 26%; }
.crop-m-x-27 { --crop-m-x: 27%; }
.crop-m-x-28 { --crop-m-x: 28%; }
.crop-m-x-29 { --crop-m-x: 29%; }
.crop-m-x-30 { --crop-m-x: 30%; }
.crop-m-x-31 { --crop-m-x: 31%; }
.crop-m-x-32 { --crop-m-x: 32%; }
.crop-m-x-33 { --crop-m-x: 33%; }
.crop-m-x-34 { --crop-m-x: 34%; }
.crop-m-x-35 { --crop-m-x: 35%; }
.crop-m-x-36 { --crop-m-x: 36%; }
.crop-m-x-37 { --crop-m-x: 37%; }
.crop-m-x-38 { --crop-m-x: 38%; }
.crop-m-x-39 { --crop-m-x: 39%; }
.crop-m-x-40 { --crop-m-x: 40%; }
.crop-m-x-41 { --crop-m-x: 41%; }
.crop-m-x-42 { --crop-m-x: 42%; }
.crop-m-x-43 { --crop-m-x: 43%; }
.crop-m-x-44 { --crop-m-x: 44%; }
.crop-m-x-45 { --crop-m-x: 45%; }
.crop-m-x-46 { --crop-m-x: 46%; }
.crop-m-x-47 { --crop-m-x: 47%; }
.crop-m-x-48 { --crop-m-x: 48%; }
.crop-m-x-49 { --crop-m-x: 49%; }
.crop-m-x-50 { --crop-m-x: 50%; }
.crop-m-x-51 { --crop-m-x: 51%; }
.crop-m-x-52 { --crop-m-x: 52%; }
.crop-m-x-53 { --crop-m-x: 53%; }
.crop-m-x-54 { --crop-m-x: 54%; }
.crop-m-x-55 { --crop-m-x: 55%; }
.crop-m-x-56 { --crop-m-x: 56%; }
.crop-m-x-57 { --crop-m-x: 57%; }
.crop-m-x-58 { --crop-m-x: 58%; }
.crop-m-x-59 { --crop-m-x: 59%; }
.crop-m-x-60 { --crop-m-x: 60%; }
.crop-m-x-61 { --crop-m-x: 61%; }
.crop-m-x-62 { --crop-m-x: 62%; }
.crop-m-x-63 { --crop-m-x: 63%; }
.crop-m-x-64 { --crop-m-x: 64%; }
.crop-m-x-65 { --crop-m-x: 65%; }
.crop-m-x-66 { --crop-m-x: 66%; }
.crop-m-x-67 { --crop-m-x: 67%; }
.crop-m-x-68 { --crop-m-x: 68%; }
.crop-m-x-69 { --crop-m-x: 69%; }
.crop-m-x-70 { --crop-m-x: 70%; }
.crop-m-x-71 { --crop-m-x: 71%; }
.crop-m-x-72 { --crop-m-x: 72%; }
.crop-m-x-73 { --crop-m-x: 73%; }
.crop-m-x-74 { --crop-m-x: 74%; }
.crop-m-x-75 { --crop-m-x: 75%; }
.crop-m-x-76 { --crop-m-x: 76%; }
.crop-m-x-77 { --crop-m-x: 77%; }
.crop-m-x-78 { --crop-m-x: 78%; }
.crop-m-x-79 { --crop-m-x: 79%; }
.crop-m-x-80 { --crop-m-x: 80%; }
.crop-m-x-81 { --crop-m-x: 81%; }
.crop-m-x-82 { --crop-m-x: 82%; }
.crop-m-x-83 { --crop-m-x: 83%; }
.crop-m-x-84 { --crop-m-x: 84%; }
.crop-m-x-85 { --crop-m-x: 85%; }
.crop-m-x-86 { --crop-m-x: 86%; }
.crop-m-x-87 { --crop-m-x: 87%; }
.crop-m-x-88 { --crop-m-x: 88%; }
.crop-m-x-89 { --crop-m-x: 89%; }
.crop-m-x-90 { --crop-m-x: 90%; }
.crop-m-x-91 { --crop-m-x: 91%; }
.crop-m-x-92 { --crop-m-x: 92%; }
.crop-m-x-93 { --crop-m-x: 93%; }
.crop-m-x-94 { --crop-m-x: 94%; }
.crop-m-x-95 { --crop-m-x: 95%; }
.crop-m-x-96 { --crop-m-x: 96%; }
.crop-m-x-97 { --crop-m-x: 97%; }
.crop-m-x-98 { --crop-m-x: 98%; }
.crop-m-x-99 { --crop-m-x: 99%; }
.crop-m-x-100 { --crop-m-x: 100%; }
.crop-m-y-0 { --crop-m-y: 0%; }
.crop-m-y-1 { --crop-m-y: 1%; }
.crop-m-y-2 { --crop-m-y: 2%; }
.crop-m-y-3 { --crop-m-y: 3%; }
.crop-m-y-4 { --crop-m-y: 4%; }
.crop-m-y-5 { --crop-m-y: 5%; }
.crop-m-y-6 { --crop-m-y: 6%; }
.crop-m-y-7 { --crop-m-y: 7%; }
.crop-m-y-8 { --crop-m-y: 8%; }
.crop-m-y-9 { --crop-m-y: 9%; }
.crop-m-y-10 { --crop-m-y: 10%; }
.crop-m-y-11 { --crop-m-y: 11%; }
.crop-m-y-12 { --crop-m-y: 12%; }
.crop-m-y-13 { --crop-m-y: 13%; }
.crop-m-y-14 { --crop-m-y: 14%; }
.crop-m-y-15 { --crop-m-y: 15%; }
.crop-m-y-16 { --crop-m-y: 16%; }
.crop-m-y-17 { --crop-m-y: 17%; }
.crop-m-y-18 { --crop-m-y: 18%; }
.crop-m-y-19 { --crop-m-y: 19%; }
.crop-m-y-20 { --crop-m-y: 20%; }
.crop-m-y-21 { --crop-m-y: 21%; }
.crop-m-y-22 { --crop-m-y: 22%; }
.crop-m-y-23 { --crop-m-y: 23%; }
.crop-m-y-24 { --crop-m-y: 24%; }
.crop-m-y-25 { --crop-m-y: 25%; }
.crop-m-y-26 { --crop-m-y: 26%; }
.crop-m-y-27 { --crop-m-y: 27%; }
.crop-m-y-28 { --crop-m-y: 28%; }
.crop-m-y-29 { --crop-m-y: 29%; }
.crop-m-y-30 { --crop-m-y: 30%; }
.crop-m-y-31 { --crop-m-y: 31%; }
.crop-m-y-32 { --crop-m-y: 32%; }
.crop-m-y-33 { --crop-m-y: 33%; }
.crop-m-y-34 { --crop-m-y: 34%; }
.crop-m-y-35 { --crop-m-y: 35%; }
.crop-m-y-36 { --crop-m-y: 36%; }
.crop-m-y-37 { --crop-m-y: 37%; }
.crop-m-y-38 { --crop-m-y: 38%; }
.crop-m-y-39 { --crop-m-y: 39%; }
.crop-m-y-40 { --crop-m-y: 40%; }
.crop-m-y-41 { --crop-m-y: 41%; }
.crop-m-y-42 { --crop-m-y: 42%; }
.crop-m-y-43 { --crop-m-y: 43%; }
.crop-m-y-44 { --crop-m-y: 44%; }
.crop-m-y-45 { --crop-m-y: 45%; }
.crop-m-y-46 { --crop-m-y: 46%; }
.crop-m-y-47 { --crop-m-y: 47%; }
.crop-m-y-48 { --crop-m-y: 48%; }
.crop-m-y-49 { --crop-m-y: 49%; }
.crop-m-y-50 { --crop-m-y: 50%; }
.crop-m-y-51 { --crop-m-y: 51%; }
.crop-m-y-52 { --crop-m-y: 52%; }
.crop-m-y-53 { --crop-m-y: 53%; }
.crop-m-y-54 { --crop-m-y: 54%; }
.crop-m-y-55 { --crop-m-y: 55%; }
.crop-m-y-56 { --crop-m-y: 56%; }
.crop-m-y-57 { --crop-m-y: 57%; }
.crop-m-y-58 { --crop-m-y: 58%; }
.crop-m-y-59 { --crop-m-y: 59%; }
.crop-m-y-60 { --crop-m-y: 60%; }
.crop-m-y-61 { --crop-m-y: 61%; }
.crop-m-y-62 { --crop-m-y: 62%; }
.crop-m-y-63 { --crop-m-y: 63%; }
.crop-m-y-64 { --crop-m-y: 64%; }
.crop-m-y-65 { --crop-m-y: 65%; }
.crop-m-y-66 { --crop-m-y: 66%; }
.crop-m-y-67 { --crop-m-y: 67%; }
.crop-m-y-68 { --crop-m-y: 68%; }
.crop-m-y-69 { --crop-m-y: 69%; }
.crop-m-y-70 { --crop-m-y: 70%; }
.crop-m-y-71 { --crop-m-y: 71%; }
.crop-m-y-72 { --crop-m-y: 72%; }
.crop-m-y-73 { --crop-m-y: 73%; }
.crop-m-y-74 { --crop-m-y: 74%; }
.crop-m-y-75 { --crop-m-y: 75%; }
.crop-m-y-76 { --crop-m-y: 76%; }
.crop-m-y-77 { --crop-m-y: 77%; }
.crop-m-y-78 { --crop-m-y: 78%; }
.crop-m-y-79 { --crop-m-y: 79%; }
.crop-m-y-80 { --crop-m-y: 80%; }
.crop-m-y-81 { --crop-m-y: 81%; }
.crop-m-y-82 { --crop-m-y: 82%; }
.crop-m-y-83 { --crop-m-y: 83%; }
.crop-m-y-84 { --crop-m-y: 84%; }
.crop-m-y-85 { --crop-m-y: 85%; }
.crop-m-y-86 { --crop-m-y: 86%; }
.crop-m-y-87 { --crop-m-y: 87%; }
.crop-m-y-88 { --crop-m-y: 88%; }
.crop-m-y-89 { --crop-m-y: 89%; }
.crop-m-y-90 { --crop-m-y: 90%; }
.crop-m-y-91 { --crop-m-y: 91%; }
.crop-m-y-92 { --crop-m-y: 92%; }
.crop-m-y-93 { --crop-m-y: 93%; }
.crop-m-y-94 { --crop-m-y: 94%; }
.crop-m-y-95 { --crop-m-y: 95%; }
.crop-m-y-96 { --crop-m-y: 96%; }
.crop-m-y-97 { --crop-m-y: 97%; }
.crop-m-y-98 { --crop-m-y: 98%; }
.crop-m-y-99 { --crop-m-y: 99%; }
.crop-m-y-100 { --crop-m-y: 100%; }
.crop-m-cover { --crop-m-fit: cover; }
.crop-m-contain { --crop-m-fit: contain; }
@media (max-width: 1050px) {
  .image-placement.image-placement {
    object-fit: var(--crop-t-fit, var(--crop-d-fit, contain));
    object-position: var(--crop-t-x, var(--crop-d-x, 50%)) var(--crop-t-y, var(--crop-d-y, 50%));
  }
}
@media (max-width: 760px) {
  .image-placement.image-placement {
    object-fit: var(--crop-m-fit, var(--crop-d-fit, contain));
    object-position: var(--crop-m-x, var(--crop-d-x, 50%)) var(--crop-m-y, var(--crop-d-y, 50%));
  }
}

/* Editable collection columns affect content grids, never the chronology of
   album/news lists. Smaller screens reduce columns to keep names readable. */
.collection-columns-1 { --collection-columns: 1; }
.collection-columns-2 { --collection-columns: 2; }
.collection-columns-3 { --collection-columns: 3; }
.collection-columns-4 { --collection-columns: 4; }
.collection-layout .people-grid,
.collection-layout .partner-grid,
.collection-layout .video-grid,
.collection-layout .guestbook-grid,
.collection-layout .prize-grid {
  grid-template-columns: repeat(var(--collection-columns, 2), minmax(0, 1fr));
}
/* Album photos remain thumbnails even when editors choose fewer columns.
   The existing photo viewer shows the complete original on demand. */
.collection-layout .gallery-images {
  grid-template-columns: repeat(var(--collection-columns, 3), minmax(0, 280px));
}
@media (max-width: 1250px) {
  .with-sidebar .collection-columns-3 .people-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 1050px) {
  .with-sidebar .collection-layout .people-grid { grid-template-columns: 1fr; }
  .collection-layout.collection-columns-3 .video-grid,
  .collection-layout.collection-columns-3 .guestbook-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .collection-layout .prize-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .collection-layout .people-grid,
  .collection-layout.collection-guestbook .guestbook-grid { grid-template-columns: 1fr; }
  .collection-layout.collection-columns-3 .partner-grid,
  .collection-layout .prize-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .collection-layout:not(.collection-columns-1) .gallery-images {
    grid-template-columns: repeat(2, minmax(0, 280px));
  }
}
@media (max-width: 560px) {
  .collection-layout.collection-partner .partner-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .collection-layout.collection-video .video-grid,
  .collection-layout .prize-grid { grid-template-columns: 1fr; }
}

.venue-map { margin-bottom: 24px; }

.venue-map .map-locations { max-height: none; overflow: visible; }
@media (min-width: 761px) and (max-width: 900px) {
  .with-sidebar .venue-map { grid-template-columns: minmax(0, 1fr); }
  .with-sidebar .venue-map .swiss-map { grid-column: 1; grid-row: auto; margin: 12px 0; }
  .with-sidebar .venue-map .map-locations { max-width: none; margin-top: 0; }
}

/* Inline cinema and playlist: the player retains its complete 16:9 frame.
   Only the document scrolls; editorial copy can grow without clipping video. */
.video-gallery { min-width: 0; }
.video-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(260px, 1fr);
  align-items: start;
  overflow: clip;
  border: 1px solid var(--line);
  border-radius: 26px;
  background: #23191a;
  box-shadow: 0 12px 38px #2912100c;
  margin-bottom: 22px;
}
.video-screen {
  display: grid;
  place-items: center;
  align-self: center;
  min-width: 0;
  background: #161112;
}
.video-stage {
  position: relative;
  isolation: isolate;
  width: min(100%, calc((100svh - var(--video-header-offset, var(--header)) - 40px) * 16 / 9));
  max-width: 100%;
  aspect-ratio: 16 / 9;
  min-width: 0;
  min-height: 0;
  background: #161112;
  overflow: clip;
}
.video-poster, .video-frame-container, [data-video-consent] { position: absolute; inset: 0; }
.video-poster img { display: block; width: 100%; height: 100%; object-fit: contain; }
[data-video-consent] {
  z-index: 2;
  display: grid;
  place-items: center;
  background: #160c1024;
}
[data-video-start] {
  display: grid;
  place-items: center;
  width: 76px;
  height: 76px;
  padding: 0;
  border: 1px solid #fffaf1aa;
  border-radius: 50%;
  background: var(--cream);
  color: var(--wine);
  box-shadow: 0 8px 32px #160c1055;
  transition: transform .2s, background .2s;
}
[data-video-start] svg { width: 32px; height: 32px; fill: currentColor; stroke-width: 1; }
[data-video-start]:not(:disabled):is(:hover, :focus-visible) { background: white; }
[data-video-start]:focus-visible { outline-color: white; outline-offset: 5px; }
.video-frame-container { z-index: 1; }
.video-frame-container:empty { display: none; }
.video-frame-container iframe { display: block; width: 100%; height: 100%; border: 0; background: #161112; }
.video-info {
  min-width: 0;
  align-self: stretch;
  padding: clamp(22px, 2.5vw, 38px);
  background: var(--wine);
  color: var(--cream);
  overflow-wrap: anywhere;
}
.video-meta { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 23px; }
.video-meta .eyebrow { margin: 0; font-size: 10px; color: #ecd7c2; }
[data-video-count] { flex: 0 0 auto; font-size: 12px; font-variant-numeric: tabular-nums; color: #ecd7c2; }
.video-info h3 { font-size: clamp(23px, 2.1vw, 32px); line-height: 1.14; letter-spacing: -.5px; margin: 0 0 17px; }
.video-info [data-video-summary] { font-size: 15px; line-height: 1.65; color: #f0dfd3; margin: 0 0 16px; }
.video-player-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; margin: 6px 0 18px; }
.video-external, [data-video-stop] { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0; color: var(--cream); background: transparent; font-size: 13px; }
.video-external svg, [data-video-stop] svg { width: 16px; height: 16px; }
.video-external:hover, [data-video-stop]:hover { text-decoration: underline; text-underline-offset: 4px; }
.video-info .video-privacy { border-top: 1px solid #fffaf133; padding-top: 17px; font-size: 11px; line-height: 1.65; color: #f0dfd3; }
.video-privacy a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.video-info [data-video-status] { margin-top: 12px; font-size: 13px; }
.video-failure {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 36px 12px 12px;
  background: #21191aeb;
  color: var(--cream);
  text-align: center;
}
.video-failure p { margin: 0; max-width: 36ch; font-size: 14px; line-height: 1.4; }
.video-recovery-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.video-recovery-actions > :is(button, a) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 8px 14px;
  border: 1px solid #fffaf199;
  border-radius: 24px;
  color: var(--cream);
  background: transparent;
  font-size: 13px;
  line-height: 1.2;
}
.video-recovery-actions [data-video-retry] { color: var(--wine); background: var(--cream); }
.video-recovery-actions svg { width: 15px; height: 15px; }
.video-failure-dismiss {
  position: absolute;
  right: 0;
  top: 0;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 10px;
  color: var(--cream);
  background: transparent;
}
.video-failure :is(button, a):focus-visible { outline-color: var(--cream); outline-offset: -4px; }
.video-failure-dismiss:hover, .video-recovery-actions a:hover { background: #fffaf11a; }
.video-is-loading .video-stage::after {
  content: ''; position: absolute; z-index: 3; pointer-events: none;
  left: calc(50% - 19px); top: calc(50% - 19px);
  width: 38px; height: 38px; border: 3px solid #fffaf140;
  border-top-color: var(--cream); border-radius: 50%; animation: video-loading .8s linear infinite;
}
@keyframes video-loading { to { transform: rotate(360deg); } }
.video-gallery .video-grid { gap: 16px; }
.video-choice {
  display: grid;
  grid-template-columns: minmax(0, 40%) minmax(0, 1fr);
  align-items: center;
  gap: 0;
  min-width: 0;
  padding: 8px;
  text-align: left;
  color: var(--ink);
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: 18px;
  transition: background .2s, border-color .2s;
}
.video-choice:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) { border-color: #ac8776; background: #f0e7d9; }
.video-choice[aria-pressed="true"] { background: var(--wine); color: var(--cream); border-color: var(--wine); }
.video-choice .video-image { min-width: 0; width: 100%; overflow: clip; border-radius: 11px; background: #21191a; }
.video-choice .video-image::after { display: none; }
.video-choice .play-icon { width: 36px; height: 36px; box-shadow: 0 3px 15px #0003; }
.video-choice .play-icon svg { width: 16px; height: 16px; fill: currentColor; }
.video-choice-copy { min-width: 0; padding: 10px 12px 10px 17px; }
.video-choice-meta { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; margin-bottom: 10px; font-size: 10px; color: var(--muted); font-variant-numeric: tabular-nums; }
.video-choice[aria-pressed="true"] .video-choice-meta { color: #ecd7c2; }
.video-choice strong { display: block; font-size: 17px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.video-links { display: flex; flex-wrap: wrap; gap: 16px; margin-block: 16px; }
@media (max-width: 1050px) {
  .video-feature { grid-template-columns: minmax(0, 1.6fr) minmax(250px, 1fr); }
  .video-info { padding: 24px; }
  .video-choice-copy { padding: 8px 8px 8px 12px; }
  .video-choice strong { font-size: 15px; }
}
@media (max-width: 760px) {
  .video-feature { grid-template-columns: minmax(0, 1fr); border-radius: 20px; }
  .video-screen { align-self: start; }
  .video-info { padding: 23px; }
  .video-meta { margin-bottom: 15px; }
  .video-info h3 { font-size: 24px; }
  .video-player-actions { margin-bottom: 12px; }
  .video-info .video-privacy { padding-top: 13px; }
  [data-video-start] { width: 60px; height: 60px; }
  [data-video-start] svg { width: 26px; height: 26px; }
}
@media (max-width: 520px) {
  .video-choice { grid-template-columns: minmax(0, 38%) minmax(0, 1fr); border-radius: 15px; }
  .video-choice-copy { padding-left: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-video-start]:hover { transform: none; }
  .video-is-loading .video-stage::after { animation: none; }
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Shared controls keep a clear active state and comfortable touch targets. */
.menu-toggle,
.calendar-controls .round-button,
.carousel-controls .round-button {
  width: 44px;
  height: 44px;
  min-width: 44px;
}
.menu-toggle {
  padding: 12px;
  flex-shrink: 0;
}
.calendar-heading {
  flex-wrap: wrap;
  row-gap: 14px;
}
.calendar-footer .text-button,
.event-list-heading > .text-button,
.prizes-list .event-filters > .text-button {
  min-height: 44px;
  padding: 9px 12px;
  border-radius: 12px;
  line-height: 1.4;
}
.calendar-footer .text-button:hover,
.event-list-heading > .text-button:hover,
.prizes-list .event-filters > .text-button:not(:disabled):is(:hover, :focus-visible) {
  background: var(--sand);
}
.filter-chip {
  min-height: 44px;
  padding: 9px 12px;
  font-size: 12px;
  text-align: left;
}
.filter-chip svg {
  width: 14px;
  height: 14px;
}
.hero h1,
.prize-card h3,
.event-description h3 {
  overflow-wrap: anywhere;
  hyphens: auto;
}
.event-description,
.event-meta span {
  overflow-wrap: anywhere;
}
.text-link[href^='mailto:']:hover svg,
.text-link[href^='tel:']:hover svg {
  transform: none;
}
@media (max-width: 760px) {
  .hero h1 {
    hyphens: manual;
  }
  .site-header {
    gap: 16px;
  }
  .header-actions {
    gap: 10px;
  }
}
@media (max-width: 380px) {
  .site-header {
    gap: 12px;
  }
  .header-actions {
    gap: 8px;
  }
}
/* The complete location list expands in normal flow: no partly hidden controls. */
.map-location-options { grid-column: 1 / -1; min-width: 0; margin-top: 20px; }
.map-location-options > summary {
  min-height: 44px; padding: 12px 16px; border: 1px solid #cbbda6;
  border-radius: 14px; color: var(--wine); font-weight: 600; cursor: pointer;
  overflow-wrap: anywhere;
}
.map-location-options .map-locations {
  max-height: none; max-width: none; overflow: visible; margin-top: 16px; padding-right: 0;
}
@media (min-width: 761px) and (max-width: 1050px) {
  .agenda-map .swiss-map { grid-row: 1; }
}

/* A shared, restrained motion language. Geometry and editorial image crops stay
   unchanged; fine-pointer movement is optional and focus feedback is immediate. */
:is(.button, .round-button, .filter-chip, .calendar-day.has-events, .menu-toggle,
    .donation-cta, .support-qr-save, .video-choice, [data-video-start],
    .rich-text a.content-button) {
  transition: background-color var(--motion-quick) ease,
    border-color var(--motion-quick) ease, color var(--motion-quick) ease,
    box-shadow var(--motion-response) var(--motion-ease),
    transform var(--motion-response) var(--motion-ease);
}
:is(.primary-nav a, .mobile-menu a, .page-sidebar nav > a, .footer-nav a,
    .footer-bottom a, .text-link, .text-button,
    .document-row h3 a, .news-card h3 a, .language-trigger, .languages a) {
  transition: color var(--motion-quick) ease, background-color var(--motion-quick) ease,
    border-color var(--motion-quick) ease, text-decoration-color var(--motion-quick) ease;
}
:is(.content-card, .news-card, .partner-card, .venue-card, details.person-card,
    .gallery-entry, .prize-card, .guestbook-entry, .gallery-images button) {
  transition: border-color var(--motion-response) ease,
    box-shadow var(--motion-response) var(--motion-ease),
    transform var(--motion-response) var(--motion-ease);
}
:is(.faq-list, .news-entry, .person-card, .gallery-entry, .guestbook-entry,
    .prize-card, .event-details, .map-location-options) summary {
  transition: color var(--motion-quick) ease, background-color var(--motion-quick) ease;
}
:is(.faq-list, .news-entry, .person-card, .gallery-entry, .guestbook-entry,
    .prize-card, .event-details, .map-location-options) summary:focus-visible {
  color: var(--wine);
}
:is(.content-card, .news-card, .partner-card, .venue-card, details.person-card,
    .gallery-entry, .prize-card):has(:focus-visible) {
  border-color: #b49a85;
  box-shadow: 0 4px 14px #49251c0a;
}
.page-sidebar nav > a svg {
  transition: opacity var(--motion-quick) ease;
}
:is(.text-link, .button, .round-button, .footer-link) svg {
  transition: transform var(--motion-response) var(--motion-ease),
    translate var(--motion-response) var(--motion-ease);
}
:is(.footer-nav a, .footer-bottom a, .document-row h3 a, .news-card h3 a):focus-visible {
  text-decoration: underline;
  text-underline-offset: 5px;
}
select {
  transition: border-color var(--motion-quick) ease, box-shadow var(--motion-quick) ease;
}
select:focus-visible {
  border-color: var(--wine);
  box-shadow: 0 0 0 3px #650f190c;
}

@media (prefers-reduced-motion: no-preference) {
  .language-picker[open] > .languages,
  .mobile-menu:not([hidden]) {
    animation: menu-arrive var(--motion-response) var(--motion-ease);
  }
  details:not(.language-picker)[open] > :not(summary) {
    animation: detail-arrive var(--motion-enter) var(--motion-ease);
  }
  :is(.content-dialog, .lightbox)[open] {
    animation: dialog-arrive var(--motion-enter) var(--motion-ease);
  }
  :is(.content-dialog, .lightbox)[open]::backdrop {
    animation: backdrop-arrive var(--motion-response) ease-out;
  }
  :is(.button, .rich-text a.content-button, .round-button, .filter-chip,
      .calendar-day.has-events, .menu-toggle, .donation-cta, .support-qr-save,
      .video-choice, [data-video-start]):not(:disabled):not([aria-disabled='true']):active {
    transform: translateY(1px) scale(0.985);
    transition-duration: 80ms;
  }
  /* Translate independently of transform so previous/up arrows retain rotation. */
  :is(a.text-link, button.text-link, .button, .round-button, .footer-link) svg {
    --arrow-step: 3px;
    --arrow-rise: 0px;
  }
  :is(a.text-link, button.text-link, .button, .round-button, .footer-link) svg.flip {
    --arrow-step: -3px;
  }
  .round-button.back-top svg { --arrow-step: 0px; --arrow-rise: -3px; }
  :is(a.text-link, button.text-link, .button, .round-button, .footer-link)
    svg:has(> use[href='#i-download']) { --arrow-step: 0px; --arrow-rise: 2px; }
  :is(a.text-link, button.text-link, .button, .round-button, .footer-link)
    svg:has(> use[href='#i-external']) { --arrow-step: 2px; --arrow-rise: -2px; }
  :is(a.text-link, button.text-link, .button, .round-button, .footer-link):not(:disabled):not([aria-disabled='true']):not([href^='mailto:']):not([href^='tel:']):focus-visible
    svg:has(> use:is([href='#i-arrow'], [href='#i-download'], [href='#i-external'])) {
    translate: var(--arrow-step) var(--arrow-rise);
  }
  .donation-feature-cta:not(:disabled):focus-visible > svg {
    animation: donation-heartbeat 1s ease-in-out 1;
  }
}
@media (hover: hover) and (pointer: fine) {
  :is(.content-card, .news-card, .partner-card, .venue-card):has(a[href], button:not(:disabled)):hover,
  :is(details.person-card, .gallery-entry, .prize-card):has(> summary:hover) {
    border-color: #b49a85;
    box-shadow: 0 4px 14px #49251c0a;
  }
  :is(.faq-list, .news-entry, .person-card, .gallery-entry, .guestbook-entry,
      .prize-card, .event-details, .map-location-options) summary:hover {
    color: var(--wine);
  }
  .content-card:has(a[href], button:not(:disabled)):hover .card-image img,
  .news-card:hover .news-card-image img,
  .gallery-images button:not(:disabled):hover img {
    filter: brightness(1.035);
  }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  :is(.button, .rich-text a.content-button, .donation-cta):not(:disabled):not([aria-disabled='true']):hover:not(:active) {
    transform: translateY(-2px);
    box-shadow: 0 5px 12px #2d080e12;
  }
  .content-card:has(a[href], button:not(:disabled)):hover,
  .gallery-images button:not(:disabled):hover,
  .video-choice:not(:disabled):hover:not(:active) {
    transform: translateY(-2px);
  }
  [data-video-start]:not(:disabled):hover:not(:active) {
    transform: scale(1.035);
  }
  :is(a.text-link, button.text-link, .button, .round-button, .footer-link):not(:disabled):not([aria-disabled='true']):not([href^='mailto:']):not([href^='tel:']):hover
    svg:has(> use:is([href='#i-arrow'], [href='#i-download'], [href='#i-external'])) {
    translate: var(--arrow-step) var(--arrow-rise);
  }
  .donation-feature-cta:not(:disabled):hover > svg {
    animation: donation-heartbeat 1s ease-in-out 1;
  }
}
@keyframes menu-arrive {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes detail-arrive {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes dialog-arrive {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes backdrop-arrive {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Agenda: a single month canvas on larger screens and a chronological card
   list on phones. Other calendars and the prizes archive keep their layouts. */
.agenda-calendar {
  --agenda-accent: var(--wine);
  --agenda-soft: #f1e2df;
  min-width: 0;
}
.agenda-calendar [data-category='competition'] {
  --agenda-accent: #8b272d;
  --agenda-soft: #f2e0dc;
}
.agenda-calendar [data-category='concert'] {
  --agenda-accent: #526440;
  --agenda-soft: #e7ecdf;
}
.agenda-calendar [data-category='masterclass'] {
  --agenda-accent: #704566;
  --agenda-soft: #eee2eb;
}
.agenda-calendar [data-category='workshop'] {
  --agenda-accent: #345e7b;
  --agenda-soft: #e1eaf0;
}
.agenda-calendar [data-category='other'] {
  --agenda-accent: #5a514c;
  --agenda-soft: #e9e4de;
}
.agenda-calendar .agenda-board {
  min-width: 0;
  padding: clamp(20px, 2.1vw, 32px);
  border: 1px solid var(--line);
  border-radius: 25px;
  background: var(--cream);
}
.agenda-calendar .agenda-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px 24px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--line);
}
.agenda-calendar .agenda-header > div:first-child {
  flex: 1 1 220px;
  min-width: 0;
}
.agenda-calendar .agenda-header .eyebrow {
  font-size: 10px;
  letter-spacing: 1px;
  margin-bottom: 5px;
}
.agenda-calendar [data-calendar-title] {
  margin: 0;
  font-size: clamp(28px, 2.7vw, 37px);
  line-height: 1.1;
  font-weight: 500;
  letter-spacing: -1.1px;
}
.agenda-calendar :is(.agenda-view-switch, .agenda-period-controls) {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
}
.agenda-calendar :is(.agenda-view-switch, .agenda-period-controls) > button {
  min-height: 38px;
  padding: 8px 15px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
}
.agenda-calendar :is(.agenda-view-switch, .agenda-period-controls) > button[aria-pressed='true'] {
  background: var(--wine);
  color: var(--cream);
}
.agenda-calendar .calendar-controls {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.agenda-calendar .calendar-controls > button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: auto;
  min-width: 44px;
  min-height: 44px;
  height: auto;
  padding: 10px 15px;
  border: 1px solid #cdbfaa;
  border-radius: 999px;
  background: transparent;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.3;
  text-decoration: none;
}
.agenda-calendar .calendar-controls > [data-calendar-today] {
  background: var(--wine);
  border-color: var(--wine);
  color: var(--cream);
}
.agenda-calendar .calendar-controls svg {
  width: 15px;
  height: 15px;
}
:is(.agenda-calendar, .prizes-list) .agenda-categories {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 19px 0 8px;
}
:is(.agenda-calendar, .prizes-list) .agenda-categories > button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 9px 14px;
  border: 1px solid #d8cfc1;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
}
:is(.agenda-calendar, .prizes-list) .agenda-categories > button::before {
  content: '';
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: var(--agenda-accent);
}
:is(.agenda-calendar, .prizes-list) .agenda-categories > button[aria-pressed='true'] {
  border-color: var(--wine);
  background: var(--wine);
  color: var(--cream);
}
:is(.agenda-calendar, .prizes-list) .agenda-categories > button[aria-pressed='true']::before {
  background: var(--cream);
}
.agenda-calendar .agenda-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 4px 12px;
  margin: 0 0 16px;
}
.agenda-calendar .agenda-filter-bar > details {
  min-width: 0;
}
.agenda-calendar .agenda-filter-bar > details[open] {
  flex-basis: 100%;
}
.agenda-calendar .agenda-filter-bar > details > summary {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  padding: 7px 1px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  list-style: none;
  cursor: pointer;
}
.agenda-calendar .agenda-filter-bar > details > summary::-webkit-details-marker {
  display: none;
}
.agenda-calendar .agenda-filter-bar > details > summary::after {
  content: '';
  width: 6px;
  height: 6px;
  margin: -3px 3px 0;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: rotate(45deg);
}
.agenda-calendar .agenda-filter-bar > details[open] > summary {
  color: var(--wine);
}
.agenda-calendar .agenda-filter-bar > details[open] > summary::after {
  margin-top: 3px;
  transform: rotate(225deg);
}
.agenda-calendar .event-filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
  gap: 14px;
  padding: 16px;
  margin: 3px 0 12px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: var(--paper);
}
.agenda-calendar .event-filters label {
  min-width: 0;
  max-width: none;
  font-size: 12px;
}
.agenda-calendar .event-filters select {
  width: 100%;
  min-height: 44px;
  background-color: var(--cream);
}
.agenda-calendar .agenda-map-disclosure .map-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
  align-items: center;
  gap: 12px 24px;
  padding: 22px;
  margin: 3px 0 12px;
  border-radius: 17px;
}
.agenda-calendar .agenda-map-disclosure .swiss-map {
  grid-column: 2;
  grid-row: 1;
  min-height: 180px;
  max-height: 260px;
  margin: 0;
}
.agenda-calendar .agenda-map-disclosure .map-heading h3 {
  font-size: 25px;
}
.agenda-calendar .agenda-map-disclosure .map-location-options {
  margin-top: 0;
}
.agenda-calendar .agenda-map-disclosure .map-locations {
  max-height: none;
  overflow: visible;
  max-width: none;
}
.agenda-calendar .calendar-card {
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.agenda-calendar .calendar-months {
  display: block;
  margin: 0;
}
.agenda-calendar .calendar-month {
  min-width: 0;
}
.agenda-calendar .calendar-month > h4 {
  display: none;
}
.agenda-calendar .month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-template-rows: 32px repeat(var(--calendar-weeks, 6), minmax(0, 1fr));
  gap: 0;
  height: 480px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  text-align: left;
  background: var(--cream);
}
.agenda-calendar .weekday {
  display: grid;
  place-items: center;
  padding: 0 3px;
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  background: var(--paper);
  color: var(--muted);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.agenda-calendar .weekday:nth-child(7) {
  border-right: 0;
}
.agenda-calendar :is(.calendar-day, .calendar-blank) {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 2px;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  max-height: none;
  aspect-ratio: auto;
  padding: 4px;
  border: 0;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  text-align: left;
  font-size: 11px;
  font-weight: 400;
}
.agenda-calendar :is(.calendar-day, .calendar-blank):nth-child(7n) {
  border-right: 0;
}
.agenda-calendar .calendar-blank {
  background: #f4f0e84d;
}
.agenda-calendar .calendar-day.has-events::after {
  content: none;
}
.agenda-calendar .calendar-date-number {
  display: block;
  align-self: flex-start;
  min-height: 14px;
  padding: 0 4px;
  font-size: 11px;
  line-height: 14px;
  font-weight: 500;
}
.agenda-calendar .calendar-day.is-today {
  outline: none;
}
.agenda-calendar .calendar-day.is-today .calendar-date-number {
  border-radius: 4px;
  background: var(--wine);
  color: var(--cream);
}
.agenda-calendar .month-grid .calendar-day.has-events:is(:hover, :focus-visible, :active),
.agenda-calendar .month-grid .calendar-day.is-selected {
  background: #eee4d6;
  color: var(--ink);
  transform: none;
}
.agenda-calendar .month-grid .calendar-day.is-selected {
  box-shadow: inset 0 0 0 2px var(--wine);
}
.agenda-calendar .calendar-day:focus-visible {
  outline: 2px solid #bd691e;
  outline-offset: -3px;
}
.agenda-calendar .calendar-event-label {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 17px;
  flex-shrink: 0;
  padding: 2px 5px;
  border-radius: 5px;
  background: var(--agenda-accent);
  color: var(--cream);
  font-size: 10px;
  font-weight: 600;
  line-height: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.agenda-calendar .calendar-event-label > span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.agenda-calendar .calendar-event-more {
  min-width: 0;
  padding-inline: 4px;
  color: var(--wine);
  font-size: 10px;
  font-weight: 600;
  line-height: 10px;
}
.agenda-calendar .calendar-footer {
  flex-wrap: wrap;
  gap: 8px 18px;
  margin: 12px 0 0;
  padding: 0;
  border: 0;
}
.agenda-calendar .calendar-footer:has(> :only-child[hidden]) {
  display: none;
}
.agenda-calendar .calendar-footer .text-button {
  padding-inline: 0;
  text-align: left;
}
.agenda-calendar .event-list-heading {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px 20px;
  margin: 26px 0 18px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}
.agenda-calendar .event-list-heading .eyebrow {
  margin-bottom: 6px;
  font-size: 10px;
  letter-spacing: 1px;
}
.agenda-calendar [data-event-period-title] {
  margin: 0;
  font-size: 27px;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -0.7px;
}
.agenda-calendar .event-list-heading .results-count {
  margin: 7px 0 0;
  padding: 0;
  font-size: 12px;
  flex-basis: auto;
}
.agenda-calendar .event-list-heading > .text-button {
  max-width: none;
  padding: 8px 0;
  font-size: 12px;
  text-align: left;
}
.agenda-calendar .agenda-period-controls {
  margin-bottom: 22px;
}
.agenda-calendar .event-list {
  min-width: 0;
}
.agenda-calendar .agenda-month-group + .agenda-month-group {
  margin-top: 26px;
}
.agenda-calendar .agenda-month-label {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 13px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1.4;
  text-transform: uppercase;
}
.agenda-calendar .agenda-month-label::after {
  content: '';
  height: 1px;
  flex: 1;
  background: var(--line);
}
.agenda-calendar .agenda-month-events {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 14px;
}
.agenda-calendar .event-row {
  position: relative;
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) 44px;
  align-items: start;
  gap: 12px 16px;
  min-width: 0;
  margin: 0;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--cream);
}
.agenda-calendar .event-date {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 56px;
  min-width: 56px;
  min-height: 65px;
  padding: 10px 5px;
  border-radius: 12px;
  background: var(--agenda-soft);
  color: var(--agenda-accent);
}
.agenda-calendar .event-date time {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 26px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.7px;
}
.agenda-calendar .event-date-day {
  font-size: inherit;
  font-weight: 600;
}
.agenda-calendar .event-date-month {
  margin-top: 6px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.15;
  text-transform: uppercase;
}
.agenda-calendar .event-description {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  width: auto;
}
.agenda-calendar .event-description .card-meta {
  gap: 4px 8px;
  margin-bottom: 5px;
}
.agenda-calendar .event-row:not(:has(.event-link)) .event-description {
  grid-column: 2 / -1;
}
.agenda-calendar .event-description .tag {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  color: var(--agenda-accent);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.agenda-calendar .event-description h3 {
  margin-bottom: 5px;
  font-size: 18px;
  line-height: 1.25;
  letter-spacing: -0.2px;
  overflow-wrap: anywhere;
}
.agenda-calendar .event-description > p {
  font-size: 14px;
  line-height: 1.55;
}
.agenda-calendar .event-description > p:empty {
  display: none;
}
.agenda-calendar .event-meta {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 4px 12px;
  margin-top: 7px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--muted);
}
.agenda-calendar .event-meta span {
  min-width: 0;
  align-items: flex-start;
  gap: 5px;
}
.agenda-calendar .event-meta svg {
  width: 13px;
  height: 13px;
  margin-top: 1px;
}
.agenda-calendar .event-details {
  grid-column: 1 / -1;
  grid-row: 2;
  margin-top: -6px;
  font-size: 14px;
  line-height: 1.6;
}
.agenda-calendar .event-details > summary {
  display: flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  max-width: calc(100% - 72px);
  margin-left: 72px;
  min-height: 32px;
  padding-block: 4px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 500;
  list-style: none;
}
.agenda-calendar .event-details > summary::-webkit-details-marker {
  display: none;
}
.agenda-calendar .event-details > summary::before {
  content: '';
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform var(--motion-quick) var(--motion-ease);
}
.agenda-calendar .event-details[open] > summary::before {
  transform: translateY(1px) rotate(225deg);
}
.agenda-calendar .event-details > .rich-text {
  margin-top: 10px;
  padding: 16px 0 0;
  border-top: 1px solid var(--line);
}
.agenda-calendar .event-details > .rich-text > :last-child {
  margin-bottom: 0;
}
/* A dedicated icon control: text-link motion must not displace its glyph. */
.agenda-calendar .event-link {
  position: static;
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  align-self: start;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  min-height: 44px;
  margin: 10.5px 0 0;
  padding: 0;
  border: 1px solid #e6ddd0;
  border-radius: 50%;
  background: #f4efe6;
  color: var(--wine);
  text-decoration: none;
  transition: background-color var(--motion-quick) ease,
    color var(--motion-quick) ease, border-color var(--motion-quick) ease;
}
.agenda-calendar .event-link svg {
  display: block;
  width: 18px;
  height: 18px;
}
.agenda-calendar .event-link:is(:hover, :focus-visible) {
  border-color: var(--wine);
  background: var(--wine);
  color: var(--cream);
}
.agenda-calendar .event-link:focus-visible {
  outline: 2px solid var(--wine);
  outline-offset: 3px;
}
.agenda-calendar .agenda-pagination {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}
.agenda-calendar .agenda-pagination button {
  min-height: 46px;
}
.agenda-calendar .agenda-pagination:has(> :only-child[hidden]) {
  display: none;
}
.agenda-calendar :is(.agenda-view-switch button, .agenda-period-controls button,
    .agenda-categories button, .calendar-controls button, .event-row) {
  transition: background-color var(--motion-quick) ease,
    border-color var(--motion-quick) ease, color var(--motion-quick) ease;
}
.agenda-calendar .event-row:focus-within {
  border-color: #ac8b77;
}
.agenda-calendar:not(.is-enhanced) :is(.agenda-view-switch, .calendar-controls,
    .agenda-categories, .agenda-filter-bar, .calendar-card, .agenda-period-controls,
    .agenda-pagination, [data-agenda-reset]) {
  display: none;
}
@media (min-width: 680px) {
  .agenda-calendar.is-enhanced[data-view='list'] :is(.calendar-card, .calendar-controls),
  .agenda-calendar.is-enhanced[data-view='month'] :is(.agenda-period-controls, .agenda-month-label) {
    display: none;
  }
}
@media (hover: hover) and (pointer: fine) {
  .agenda-calendar :is(.agenda-view-switch, .agenda-period-controls) > button:not([aria-pressed='true']):hover,
  :is(.agenda-calendar, .prizes-list) .agenda-categories > button:not([aria-pressed='true']):hover,
  .agenda-calendar .calendar-controls > button:not([data-calendar-today]):not(:disabled):hover {
    background: var(--sand);
    color: var(--wine);
    border-color: #bdaa90;
  }
  .agenda-calendar .event-row:has(a[href], details):hover {
    border-color: #baa48f;
  }
}
@media (max-width: 900px) and (min-width: 680px) {
  .agenda-calendar .agenda-month-events {
    grid-template-columns: minmax(0, 1fr);
  }
  .agenda-calendar .agenda-header {
    gap: 16px;
  }
  .agenda-calendar .calendar-controls {
    flex-basis: 100%;
    justify-content: flex-end;
  }
  .agenda-calendar .event-row {
    grid-template-columns: 56px minmax(0, 1fr) 44px;
    padding: 15px;
    column-gap: 12px;
  }
  .agenda-calendar .event-date {
    width: 56px;
    min-width: 56px;
    min-height: 60px;
  }
  .agenda-calendar .event-description h3 {
    font-size: 18px;
  }
  .agenda-calendar .event-details > summary {
    margin-left: 68px;
    max-width: calc(100% - 68px);
  }
  .agenda-calendar .event-link { margin-top: 8px; }
}
@media (max-width: 679px) {
  .agenda-calendar .agenda-board {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  .agenda-calendar .agenda-header {
    display: block;
    padding-bottom: 17px;
    margin-bottom: 16px;
  }
  .agenda-calendar [data-calendar-title] {
    font-size: 31px;
  }
  .agenda-calendar :is(.calendar-card, .calendar-controls, .agenda-view-switch) {
    display: none;
  }
  :is(.agenda-calendar, .prizes-list) .agenda-categories {
    gap: 7px;
    margin: 0 0 8px;
  }
  :is(.agenda-calendar, .prizes-list) .agenda-categories > button {
    padding-inline: 12px;
  }
  .agenda-calendar .agenda-filter-bar {
    margin-bottom: 0;
  }
  .agenda-calendar .agenda-map-disclosure .map-card {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    padding: 17px;
  }
  .agenda-calendar .agenda-map-disclosure .swiss-map {
    grid-column: 1;
    grid-row: auto;
    min-height: 160px;
    max-height: 230px;
  }
  .agenda-calendar .event-list-heading {
    gap: 8px 16px;
    margin: 18px 0 15px;
    padding-top: 18px;
  }
  .agenda-calendar [data-event-period-title] {
    font-size: 25px;
  }
  .agenda-calendar .agenda-period-controls {
    display: flex;
    width: fit-content;
    max-width: 100%;
    border-radius: 15px;
    margin-bottom: 22px;
  }
  .agenda-calendar .agenda-period-controls > button {
    min-height: 42px;
    padding-inline: 12px;
    border-radius: 11px;
    font-size: 11px;
  }
  .agenda-calendar .agenda-month-events {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }
  .agenda-calendar .event-row {
    grid-template-columns: 56px minmax(0, 1fr) 44px;
    gap: 10px 13px;
    padding: 17px 15px;
    border-radius: 17px;
  }
  .agenda-calendar .event-date {
    width: 56px;
    min-width: 56px;
    min-height: 63px;
  }
  .agenda-calendar .event-description h3 {
    font-size: 17px;
  }
  .agenda-calendar .event-details {
    margin-top: -4px;
  }
  .agenda-calendar .event-details > summary {
    margin-left: 69px;
    max-width: calc(100% - 69px);
  }
  .agenda-calendar .event-link { margin-top: 9.5px; }
  /* Let long mobile titles use the full text column. The two actions share
     a footer line, while expanded copy still spans the complete card. */
  .agenda-calendar .event-row:has(.event-details) {
    grid-template-columns: 56px minmax(0, 1fr);
  }
  .agenda-calendar .event-row:has(.event-details) .event-link {
    grid-column: 2;
    grid-row: 2;
    margin-top: -10px;
  }
  .agenda-calendar .event-row:has(.event-link) .event-details > summary {
    max-width: calc(100% - 125px);
  }

  .agenda-calendar .event-description > p {
    font-size: 14px;
  }
}
@media print {
  .agenda-calendar .agenda-board {
    padding: 0;
    border: 0;
  }
  .agenda-calendar :is(.agenda-view-switch, .calendar-controls, .agenda-categories,
      .agenda-filter-bar, .calendar-card, .agenda-period-controls, .agenda-pagination,
      [data-agenda-reset]) {
    display: none;
  }
  .agenda-calendar .agenda-month-events {
    grid-template-columns: 1fr;
  }
  .agenda-calendar .event-row {
    break-inside: avoid;
  }
}

.agenda-calendar.is-enhanced[data-view='list'] .event-list-heading > div:first-child {
  display: none;
}
.agenda-calendar.is-enhanced[data-view='list'] .event-list-heading {
  margin: 12px 0;
  padding: 0;
  border: 0;
}

/* Editorial columns contain independent blocks, preserving column reading order. */
.modular-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(24px, 3vw, 48px);
}
.modular-column { min-width: 0; }
.modular-block { min-width: 0; overflow-wrap: anywhere; }
.modular-block + .modular-block { margin-top: 28px; }
.modular-block h3 { margin: 0 0 14px; font-size: clamp(23px, 1.8vw, 30px); line-height: 1.15; }
.modular-block .rich-text > :first-child { margin-top: 0; }
.modular-block .rich-text > :last-child { margin-bottom: 0; }
.modular-block figure { margin: 0 0 20px; }
.modular-block .section-item-image { width: 100%; max-width: 100%; margin: 0; border-radius: 12px; }
.modular-block figcaption, .modular-meta { font-size: 13px; color: var(--muted); margin: 8px 0 0; }
.modular-block .text-link { margin-top: 14px; }
@media (min-width: 761px) {
  .modular-columns-2, .modular-columns-3, .modular-columns-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1101px) {
  .modular-columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .modular-columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* About reads as an editorial story, with a calm, bounded three-column grid. */
.page-about .page-content {
  max-width: calc(1320px + var(--gutter) * 2);
}
.page-about .section-columns {
  --story-gap: clamp(28px, 3.4vw, 48px);
  padding-top: clamp(44px, 4.5vw, 72px);
}
.page-about .section-columns + .page-section {
  margin-top: clamp(48px, 5vw, 80px);
  padding-top: clamp(40px, 4vw, 64px);
  border-top: 1px solid var(--line);
}
.page-about .section-columns .section-heading { margin-bottom: 36px; }
.page-about .section-columns .section-heading .eyebrow {
  font-size: 11px;
  letter-spacing: .14em;
  margin-bottom: 16px;
}
.page-about .section-columns .section-heading h2 {
  max-width: 27ch;
  font-size: clamp(30px, 3.2vw, 44px);
  line-height: 1.13;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.page-about .modular-grid { gap: var(--story-gap); }
.page-about .modular-column:not(:empty) {
  border-top: 1px solid var(--line);
}
.page-about .modular-column:not(:empty)::before {
  content: '';
  display: block;
  width: 42px;
  height: 3px;
  margin-top: -2px;
  margin-bottom: 24px;
  background: var(--wine);
}
.page-about .modular-block h3 {
  margin-bottom: 16px;
  color: var(--wine);
  font-size: clamp(22px, 1.7vw, 25px);
  line-height: 1.24;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.page-about .modular-block .rich-text {
  font-size: 18px;
  line-height: 1.68;
  max-width: 72ch;
}
.page-about .modular-block + .modular-block { margin-top: 22px; }
@media (min-width: 761px) and (max-width: 1100px) {
  .page-about .modular-columns-3 > .modular-column:last-child {
    grid-column: 1 / -1;
  }
}
@media (min-width: 1101px) {
  .page-about .section-columns-count-2:has(> .section-heading h2) {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 var(--story-gap);
    align-items: start;
  }
  .page-about .section-columns-count-2:has(> .section-heading h2) > .section-heading {
    grid-column: 1;
    grid-row: 1 / span 2;
    margin: 0;
  }
  .page-about .section-columns-count-2:has(> .section-heading h2) .section-heading h2 {
    font-size: clamp(28px, 2.5vw, 36px);
    text-wrap: pretty;
  }
  .page-about .section-columns-count-2:has(> .section-heading h2) > :is(.section-intro, .modular-grid) {
    grid-column: 2 / -1;
  }
  .page-about .modular-columns-2 > .modular-column { border-top: 0; }
  .page-about .modular-columns-2 > .modular-column::before { display: none; }
}
@media (max-width: 760px) {
  .page-about .section-columns .section-heading { margin-bottom: 28px; }
  .page-about .modular-grid { gap: 32px; }
  .page-about .modular-column:not(:empty)::before { margin-bottom: 20px; }
  .page-about .modular-block .rich-text { font-size: 17px; line-height: 1.65; }
}

/* Keep the foundation support action available in the sticky header on every page.
   The full navigation fits beside it in all four languages from 1181px, so
   laptops keep their page links; narrower screens use the menu. */
@media (max-width: 1180px) {
  .primary-nav { display: none; }
  .menu-toggle { display: block; }
}
@media (max-width: 760px) {
  .header-support { width: 44px; height: 44px; padding: 12px; }
  .header-support > span { display: none; }
  .header-support > svg { top: 0; }
  .header-actions { gap: 8px; }
}
@media (max-width: 480px) {
  .site-header { gap: 8px; }
  .header-actions { gap: 5px; }
  .language-trigger { min-width: 44px; padding-inline: 8px; }
  .language-trigger > svg { display: none; }
}
@media print { .header-support { display: none; } }

/* Shared footer: client brief identity, visible social profiles and partner strip. */
.footer-partners {
  margin: 60px var(--gutter) 0;
  padding: 30px 0;
  border-block: 1px solid var(--line);
}
.footer-partners + .closing-band {
  margin-top: 0;
  border-top: 0;
}
.footer-partners-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.footer-partners-heading h2 { font-size: clamp(21px, 2vw, 27px); letter-spacing: -.6px; }
.footer-partners .carousel-controls { flex-shrink: 0; }
.footer-partners .sponsor-track { grid-auto-columns: minmax(190px, calc((100% - 72px) / 5)); gap: 18px; padding: 3px; scroll-padding: 3px; }
.sponsor-tile { min-height: 98px; display: flex; align-items: center; justify-content: center; padding: 20px; text-align: center; font-size: 19px; font-weight: 700; line-height: 1.3; background: var(--cream); border-radius: 12px; border: 1px solid var(--line); scroll-snap-align: start; transition: border-color .18s ease, background .18s ease; }
.sponsor-tile img { width: 100%; max-height: 70px; height: 70px; object-fit: contain; }
.sponsor-tile:is(:hover, :focus-visible) { border-color: var(--wine); background: #fff; }
/* Readable permanent pages for stories and events, sharing the site's type,
   colours and navigation while giving the editorial content a clear measure. */
.detail-main { width: min(100%, 1120px); margin-inline: auto; padding: 38px var(--gutter) 70px; }
.detail-back { display: inline-flex; gap: 10px; margin-bottom: 34px; font-size: 14px; }
.detail-heading { max-width: 920px; }
.detail-heading .eyebrow { margin-bottom: 14px; }
.detail-heading h1 { font-size: clamp(32px, 4.2vw, 60px); line-height: 1.1; letter-spacing: -.035em; text-wrap: balance; overflow-wrap: anywhere; }
.detail-date { color: var(--muted); margin-top: 20px; font-size: 15px; }
.detail-summary { font-size: clamp(18px, 2vw, 22px); line-height: 1.6; max-width: 70ch; margin-top: 24px; }
.detail-facts { display: flex; flex-wrap: wrap; gap: 20px 40px; margin: 26px 0 0; }
.detail-facts div { flex: 1 1 230px; max-width: 480px; }
.detail-facts dt { font-size: 12px; font-weight: 700; color: var(--wine); margin-bottom: 6px; }
.detail-facts dd { margin: 0; line-height: 1.6; overflow-wrap: anywhere; }
.detail-image { margin: 32px 0; }
.detail-image img { display: block; width: 100%; height: auto; max-height: 560px; border-radius: 16px; }
.detail-image figcaption { color: var(--muted); font-size: 12px; line-height: 1.5; margin-top: 9px; }
.detail-body { max-width: 75ch; margin-top: 32px; }
.detail-action { margin-top: 28px; }
.archive-permalink { margin-top: 22px; }
.event-description h3 a:is(:hover, :focus-visible) { color: var(--wine); text-decoration: underline; text-underline-offset: .15em; }
@media (max-width: 760px) {
  .detail-main { padding-block: 26px 44px; }
  .detail-back { margin-bottom: 26px; }
  .detail-image img { max-height: 360px; }
}
.footer-partners-more { margin-top: 20px; font-size: 14px; }
.footer-social { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding-bottom: 34px; margin-bottom: 38px; border-bottom: 1px solid #ffffff2e; }
.footer-social h2 { font-size: clamp(24px, 2.3vw, 34px); letter-spacing: -.7px; line-height: 1.2; }
.footer-social p { color: #dfc4b9; margin-top: 7px; font-size: 16px; }
.social-links { display: flex; flex-wrap: wrap; gap: 12px; flex-shrink: 0; }
.social-link { display: inline-flex; align-items: center; gap: 14px; min-height: 64px; padding: 16px 22px; color: var(--cream); border: 1px solid #ffffff66; border-radius: 12px; font-size: 19px; font-weight: 700; transition: background .18s ease, border-color .18s ease; }
.social-link > span { white-space: nowrap; }
.social-link .social-icon { width: 27px; height: 27px; fill: currentColor; flex: 0 0 27px; }
.social-link > svg:last-child { width: 17px; height: 17px; margin-left: 8px; opacity: .7; }
.social-link:is(:hover, :focus-visible) { background: #ffffff18; border-color: var(--cream); }
.footer-top { display: grid; grid-template-columns: minmax(180px, 1.1fr) minmax(250px, 1.3fr) minmax(200px, 1fr) 44px; gap: clamp(24px, 3vw, 52px); }
.footer-top > .footer-identity { max-width: 310px; }
.footer-names { margin-top: 14px; font-size: 12px; color: #dfc4b9; }
.footer-names summary { cursor: pointer; line-height: 1.6; }
.footer-names ul { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 10px; }
.footer-names li { line-height: 1.5; }
.site-footer .footer-nav { margin: 0; padding: 5px 0 0; grid-template-columns: 1fr 1fr; gap: 22px; min-width: 0; font-size: 14px; }
.footer-nav-group { display: flex; flex-direction: column; align-items: flex-start; gap: 13px; min-width: 0; }
.footer-nav-group .eyebrow { color: #d3aa96; font-size: 10px; margin-bottom: 3px; }
.footer-contact { min-width: 0; }
.content-card[id] { scroll-margin-top: calc(var(--header) + 24px); }
@media (max-width: 1050px) {
  .footer-top { grid-template-columns: minmax(170px, 1fr) minmax(230px, 1.2fr) 44px; }
  .footer-top > .footer-identity { grid-column: 1; grid-row: 1 / 3; }
  .site-footer .footer-nav { grid-column: 2; grid-row: 1; }
  .footer-contact { grid-column: 2; grid-row: 2; max-width: 310px; }
  .back-top { grid-column: 3; grid-row: 1; }
  .footer-social { flex-wrap: wrap; }
}
@media (max-width: 640px) {
  .footer-partners { margin-top: 35px; padding-block: 24px; }
  .footer-partners-heading { gap: 12px; }
  .footer-partners .sponsor-track { grid-auto-columns: minmax(172px, 66%); gap: 12px; }
  .footer-partners .round-button { width: 38px; height: 38px; }
  .footer-social { gap: 20px; margin-bottom: 28px; padding-bottom: 28px; }
  .footer-social p { font-size: 15px; }
  .social-links { width: 100%; gap: 10px; }
  .social-link { flex: 1 1 140px; justify-content: flex-start; padding: 14px; gap: 11px; min-height: 60px; font-size: 17px; }
  .social-link > svg:last-child { margin-left: auto; }
  .footer-top { grid-template-columns: minmax(0, 1fr) 44px; gap: 30px 14px; }
  .footer-top > .footer-identity { grid-column: 1; grid-row: 1; max-width: none; }
  .site-footer .footer-nav { grid-column: 1 / -1; grid-row: 2; gap: 22px; font-size: 14px; }
  .footer-contact { grid-column: 1 / -1; grid-row: 3; max-width: none; }
  .footer-contact address { font-size: 14px; }
  .footer-contact .text-link { font-size: 15px; max-width: 330px; }
  .back-top { grid-column: 2; grid-row: 1; }
  .footer-tagline { margin-top: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .social-link, .sponsor-tile { transition: none; }
}

@media (max-width: 480px) { .social-link { flex-basis: 100%; } }

.footer-partners .carousel-toggle { min-height: 38px; padding: 8px 10px; font-size: 13px; border: 1px solid var(--line); border-radius: 20px; }
.footer-partners .carousel-toggle[hidden] { display: none; }
@media (max-width: 480px) { .footer-partners-heading { flex-wrap: wrap; } .footer-partners-heading h2 { flex-basis: 100%; } }

/* ==========================================================================
   Design system 4 · "Programmheft"
   A calmer, more editorial layer over the component styles above: one wine
   accent family, paper texture from the original sjmw.ch, fewer boxes and
   borders, full-bleed bands for rhythm, and consistent type metrics.
   ========================================================================== */
:root {
  --surface: #fffdf9;
  --ink-soft: #3b2f2b;
  --line-strong: #d3c6b2;
  --shadow-soft: 0 1px 2px #2b18100d, 0 10px 30px -14px #2b181026;
  --shadow-lift: 0 2px 4px #2b181012, 0 22px 44px -18px #2b181040;
  --radius: 20px;
  --radius-small: 14px;
  --header: 84px;
}
body {
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 { text-wrap: balance; }
h2 { font-weight: 300; letter-spacing: -0.025em; line-height: 1.06; }
h3 { letter-spacing: -0.018em; }
::selection { background: #6a0f1c; color: #fffcf6; }
button:focus-visible, a:focus-visible, input:focus-visible, summary:focus-visible,
select:focus-visible, [tabindex]:focus-visible { outline-color: var(--red); outline-width: 2px; outline-offset: 4px; }

/* Eyebrows carry the logo's red point. */
.eyebrow { letter-spacing: 0.16em; font-size: 11px; font-weight: 700; }
.eyebrow.red, .section-heading .eyebrow, .map-heading .eyebrow { color: var(--red); }
.section-heading .eyebrow::before, .home-feature-content > .eyebrow::before,
.closing-band .eyebrow::before, .hero .eyebrow::before {
  content: '';
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: currentColor;
}
.hero .eyebrow::before { background: #ff5a4e; }

/* Header: lighter, quieter, with the active page marked on the header rule. */
.site-header {
  background: #fbf8f2e6;
  border-bottom: 1px solid #2b18101a;
  backdrop-filter: saturate(1.4) blur(18px);
  -webkit-backdrop-filter: saturate(1.4) blur(18px);
}
.primary-nav { gap: clamp(14px, 1.45vw, 30px); font-size: 15px; }
.primary-nav a { color: var(--ink-soft); transition: color var(--motion-quick) ease; }
.primary-nav a:hover { color: var(--wine); }
.primary-nav a::after { height: 2px; bottom: -1px; border-radius: 2px 2px 0 0; background: var(--red); }
.primary-nav a[aria-current] { color: var(--wine); font-weight: 600; }
.header-support {
  min-height: 44px;
  padding: 10px 18px;
  background: var(--wine);
  border-color: var(--wine);
  box-shadow: 0 6px 16px -8px #6a0f1c80;
}
.header-support:hover { background: var(--wine-deep); border-color: var(--wine-deep); }
@media (max-width: 760px) {
  /* The compact control keeps its full icon area in every browser. */
  .header-support { padding: 0; }
}
.mobile-menu { background: var(--surface); }
.mobile-menu a[aria-current] { color: var(--wine); }

/* Buttons: wine is the primary action colour; red stays an accent. */
.button { gap: 16px; padding: 14px 24px; min-height: 50px; letter-spacing: -0.005em; transition: background-color var(--motion-response) ease, color var(--motion-response) ease, box-shadow var(--motion-response) ease, transform var(--motion-response) var(--motion-ease); }
.button-red { background: var(--wine); color: #fffcf6; box-shadow: 0 8px 20px -10px #6a0f1c99; }
.button-red:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) { background: var(--wine-deep); transform: translateY(-1px); }
.text-link { gap: 10px; color: var(--wine); }
.text-link:is(:hover, :focus-visible) { text-decoration: none; color: var(--red); }
.text-link:is(:hover, :focus-visible) svg { transform: translateX(3px); }
.round-button { border-color: var(--line-strong); color: var(--wine); background: #fffdf980; }
.round-button:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) { background: var(--wine); border-color: var(--wine); color: #fffcf6; }
.tag {
  border: 0;
  background: #6a0f1c12;
  color: var(--wine);
  padding: 4px 10px;
  font-size: 11px;
  letter-spacing: 0.02em;
}

/* Section rhythm */
.page-section { padding-top: clamp(64px, 6.5vw, 104px); }
.page-section:last-child { padding-bottom: clamp(48px, 5vw, 80px); }
.section-heading { margin-bottom: clamp(24px, 2.4vw, 36px); }
.section-heading .eyebrow { margin-bottom: 14px; }
.section-heading h2 { font-size: clamp(34px, 3.4vw, 56px); }
.with-sidebar .section-heading h2 { font-size: clamp(32px, 2.9vw, 48px); }
.section-intro { font-size: 18px; line-height: 1.65; color: var(--muted); max-width: 70ch; }
.page-introduction { color: var(--ink-soft); font-size: clamp(19px, 1.5vw, 22px); line-height: 1.6; max-width: 62ch; }
.rich-text { line-height: 1.7; }
.rich-text a { color: var(--wine); text-decoration-color: #6a0f1c55; text-underline-offset: 3px; }
.rich-text a:hover { color: var(--red); text-decoration-color: currentColor; }

/* One surface language for panels and cards: soft, borderless, lifted. */
.text-panel,
.document-list,
.content-card,
.news-card,
.person-card,
.venue-card {
  background: var(--surface);
  border: 1px solid #2b18100f;
  box-shadow: var(--shadow-soft);
}
.content-card:nth-child(even) { background: var(--surface); }
.text-panel { padding: clamp(28px, 3.2vw, 48px) clamp(26px, 3.6vw, 56px); color: var(--ink-soft); font-size: 17px; }
.text-panel > .rich-text, .text-panel > p, .text-panel > ul, .text-panel > ol, .text-panel > div { max-width: 78ch; }
.text-panel h3 { color: var(--wine); }

.content-grid { gap: clamp(16px, 1.6vw, 26px); }
.content-card { transition: box-shadow var(--motion-response) ease, transform var(--motion-response) var(--motion-ease); }
.content-card-body { padding: 26px 28px 28px; }
.content-card-body h3 { font-size: clamp(22px, 1.7vw, 27px); }

/* Discipline tiles: the photograph is the card; the title sits on it. */
.content-card.has-image { position: relative; isolation: isolate; border: 0; display: grid; min-height: 0; background: var(--wine-deep); color: #fffcf6; }
.content-card.has-image .card-image { position: absolute; inset: 0; aspect-ratio: auto; z-index: -2; }
.content-card.has-image .card-image img { transition: transform 700ms var(--motion-ease), filter var(--motion-response) ease; }
.content-card.has-image::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, #12060500 30%, #120605a8 62%, #120605eb 100%);
  transition: opacity var(--motion-response) ease;
}
.content-card.has-image .content-card-body { justify-content: flex-end; padding: 24px 26px 26px; background: transparent !important; }
.content-card.has-image .content-card-body h3 { color: #fffcf6; font-size: clamp(24px, 2vw, 30px); font-weight: 600; letter-spacing: -0.02em; margin-bottom: 10px; text-shadow: 0 1px 16px #08060659; }
.content-card.has-image .content-card-body .tag {
  position: absolute;
  top: 14px;
  right: 14px;
  margin: 0;
  padding: 3px 9px;
  background: #1a0d0b59;
  color: #fff;
  backdrop-filter: blur(6px);
  font-size: 10px;
  font-weight: 500;
}
.content-card.has-image .content-card-body > .text-link,
.content-card.has-image .content-card-body > .text-button { color: #fffcf6; margin-top: 0; }
.content-card.has-image .content-card-body > :is(.text-link, .text-button) svg {
  width: 30px; height: 30px; padding: 7px; border-radius: 50%; background: #fffcf6; color: var(--wine);
}
@media (hover: hover) and (pointer: fine) {
  .content-card.has-image:hover { box-shadow: var(--shadow-lift); }
}
/* Hover movement respects the visitor's reduced-motion preference. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .content-card.has-image:hover { transform: translateY(-3px); }
  .content-card.has-image:hover .card-image img { transform: scale(1.045); }
}
.content-card.has-image .rich-text { color: #f5e2dc; }
/* A card that leads to another page answers the pointer like one that opens
   a dialog: its action is underlined (homepage competition modules). */
.content-card-body > a.card-link:is(:hover, :focus-visible) { text-decoration: underline; text-underline-offset: 5px; }

/* News cards on the homepage */
.news-carousel .carousel-track { padding: 4px 4px 18px; margin: -4px -4px 0; }
.news-card { transition: box-shadow var(--motion-response) ease, transform var(--motion-response) var(--motion-ease); position: relative; }
.news-card-content { padding: 26px 28px 28px; }
.news-card .news-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-bottom: 18px; font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--red); }
.news-card-meta time { color: var(--muted); letter-spacing: 0.06em; }
.news-card-meta > * + *::before { content: '·'; margin-right: 12px; color: var(--line-strong); }
.news-card h3 { font-size: clamp(22px, 1.75vw, 27px); line-height: 1.18; }
.news-card h3 a::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
.news-card h3 a:hover { text-decoration: none; }
.news-card .text-link { position: relative; z-index: 1; }
.news-card p { font-size: 16px; }
@media (hover: hover) and (pointer: fine) {
  .news-card:hover { box-shadow: var(--shadow-lift); }
  .news-card:hover h3 { color: var(--wine); }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .news-card:hover { transform: translateY(-3px); }
}

/* Homepage bands: news sits on a full-bleed sand band; support becomes a wine band. */
.page-home .page-section.section-collection {
  position: relative;
  margin-top: clamp(64px, 6.5vw, 104px);
  padding-block: clamp(56px, 5.5vw, 88px);
  background: var(--sand);
  box-shadow: 0 0 0 100vmax var(--sand);
  clip-path: inset(0 -100vmax);
}
.page-home .page-section.section-collection + .page-section { padding-top: clamp(64px, 6.5vw, 104px); }
.page-home .home-feature { background: transparent; border-radius: 0; gap: clamp(32px, 5vw, 88px); align-items: center; overflow: visible; }
.page-home .home-feature > figure { border-radius: var(--radius); overflow: hidden; min-height: clamp(380px, 38vw, 580px); box-shadow: var(--shadow-soft); }
.page-home .home-feature-content { padding: 0; }
.page-home .home-feature-content > h2 { font-size: clamp(36px, 3.6vw, 56px); }
.page-home .home-feature-content > .rich-text { color: var(--ink-soft); font-size: 18px; line-height: 1.7; }
.page-home #support { padding-top: 0; padding-bottom: 0; margin-top: clamp(64px, 6.5vw, 104px); }
.page-home .home-feature-support {
  background: var(--wine);
  box-shadow: 0 0 0 100vmax var(--wine);
  clip-path: inset(0 -100vmax);
  padding-block: clamp(56px, 6vw, 96px);
  color: #fffcf6;
}
.page-home .home-feature-support .home-feature-content > h2 { color: #fffcf6; }
.page-home .home-feature-support .home-feature-content > .rich-text { color: #f1d8cf; }
.page-home .home-feature-support .eyebrow { color: #ff8a7e; }
.page-home .home-feature-support > figure { box-shadow: 0 30px 60px -30px #0009; }
.page-home .home-feature-support .donation-feature-cta { background: #fffcf6; color: var(--wine); border: 0; }
.page-home .home-feature-support .donation-feature-cta:hover { background: #fff; transform: translateY(-1px); }
.page-home #support + * , .page-home #support:last-child { padding-bottom: 0; }

/* Lists: documents, FAQ, news archive */
.document-list { padding: 6px clamp(20px, 2.4vw, 32px); }
.document-row { border-bottom-color: var(--line); }
.document-icon { background: #6a0f1c10 !important; color: var(--wine); border-radius: 12px !important; }
.faq-list { border-top: 1px solid var(--line-strong); }
.faq-list details { border-bottom: 1px solid var(--line-strong); }
.faq-list summary { transition: color var(--motion-quick) ease; }
.faq-list summary:hover { color: var(--wine); }
.faq-list summary svg, .news-entry summary > svg {
  border-radius: 50%;
  background: var(--surface);
  box-shadow: 0 0 0 7px var(--surface), 0 0 0 8px var(--line-strong);
  position: relative;
  left: -8px;
  color: var(--wine);
  transition: background var(--motion-quick) ease, color var(--motion-quick) ease, box-shadow var(--motion-quick) ease, transform var(--motion-response) var(--motion-ease);
}
.faq-list details[open] > summary svg, .news-entry[open] > summary > svg { background: var(--wine); box-shadow: 0 0 0 7px var(--wine), 0 0 0 8px var(--wine); color: #fffcf6; }
.news-list { border-top-color: var(--line-strong); }
.news-entry { border-bottom-color: var(--line-strong); }
.news-entry summary:hover .news-heading { color: var(--wine); }

/* People and places */
.person-monogram {
  font-family: inherit;
  font-weight: 700;
  font-size: 30px;
  letter-spacing: -0.02em;
  color: var(--wine);
  background: linear-gradient(145deg, #f1e6d6, #e5d6c0);
  border-radius: 50%;
  width: 84px;
  height: 84px;
}
.person-card > summary { transition: background var(--motion-quick) ease; }
.person-card > summary:hover { background: #6a0f1c06; }
.venue-icon { background: #6a0f1c10; border: 0; }
.map-card { background: var(--surface) !important; border: 1px solid #2b18100f !important; box-shadow: var(--shadow-soft); }
.swiss-shape { fill: #efe5d5 !important; stroke: #cdbba2 !important; }
.filter-chip { background: var(--surface); border-color: var(--line-strong); }
.filter-chip:is(:hover, :focus-visible), .filter-chip[aria-pressed='true'], .filter-chip.is-active { border-color: var(--wine); color: var(--wine); }
select { background-color: var(--surface); border-color: var(--line-strong) !important; }

/* Competition sidebar: an index with a moving wine marker. */
.page-sidebar nav > a:not(.button) { position: relative; padding-left: 14px; border-bottom-color: var(--line); color: var(--muted); transition: color var(--motion-quick) ease; }
.page-sidebar nav > a:not(.button)::before { content: ''; position: absolute; left: 0; top: 12px; bottom: 12px; width: 2px; border-radius: 2px; background: transparent; transition: background var(--motion-quick) ease; }
.page-sidebar nav > a[aria-current='location'] { color: var(--wine); }
.page-sidebar nav > a[aria-current='location']::before { background: var(--red); }
.page-sidebar nav > a:not(.button):hover { color: var(--ink); }
.page-sidebar .small-label { color: var(--red); letter-spacing: 0.16em; }

/* About: editorial columns with a slim red rule. */
.modular-block h3 { color: var(--wine); }

/* Partner strip and contact band */
.footer-partners { border-block-color: var(--line-strong); }
.sponsor-tile {
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--radius-small);
  color: var(--ink-soft);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.01em;
  box-shadow: none;
  position: relative;
}
.sponsor-tile::before { content: ''; position: absolute; left: 0; top: 22%; bottom: 22%; width: 1px; background: var(--line-strong); }
.sponsor-tile:is(:hover, :focus-visible) { background: var(--surface); border-color: var(--line); color: var(--wine); box-shadow: var(--shadow-soft); }
.sponsor-tile:is(:hover, :focus-visible)::before { opacity: 0; }
.closing-band h2 { font-size: clamp(30px, 2.6vw, 40px); letter-spacing: -0.028em; }

/* Footer: deep wine with a warm hairline grid. */
.site-footer { background: var(--wine-deep); }
.footer-social { border-bottom-color: #ffffff1f; }
.social-link { border-color: #ffffff38; border-radius: 999px; min-height: 60px; padding: 12px 24px; font-size: 17px; }
.social-link:is(:hover, :focus-visible) { background: #fffcf6; color: var(--wine); border-color: #fffcf6; }
.footer-nav a, .footer-contact a { transition: color var(--motion-quick) ease; }
.footer-nav a:hover { color: #ffb4aa; text-decoration: none; }
.footer-nav-group .eyebrow, .footer-contact .eyebrow { color: #ff8a7e; letter-spacing: 0.16em; }
.footer-bottom { border-top-color: #ffffff1f !important; color: #d9b8ad; }

/* Dialogs share the surfaces. */
.content-dialog, .support-dialog { background: var(--surface); }

.site-footer :is(h2, h3), .closing-band-dark :is(h2, h3) { color: inherit; }
.back-top { background: transparent; border-color: #ffffff40; color: #fffcf6; }
.back-top:not(:disabled):not([aria-disabled='true']):is(:hover, :focus-visible) { background: #fffcf6; color: var(--wine); border-color: #fffcf6; }

/* Directory of people on "Über uns": names on hairlines rather than boxes. */
.page-about .section-cards .content-grid { column-gap: clamp(24px, 3vw, 48px); row-gap: 0; }
.page-about .section-cards .content-card:not(.has-image) {
  background: transparent;
  border: 0;
  border-top: 1px solid var(--line-strong);
  border-radius: 0;
  box-shadow: none;
}
.page-about .section-cards .content-card:not(.has-image) .content-card-body { padding: 22px 0 30px; }
.page-about .section-cards .content-card:not(.has-image) h3 { font-size: 23px; margin-bottom: 8px; }
.page-about .section-cards .content-card:not(.has-image) .rich-text { margin-bottom: 0; font-size: 15px; }
.page-about .section-cards .page-section, .page-about .section-cards { padding-top: clamp(48px, 4.5vw, 72px); }
.page-about .section-cards .section-heading h2 { font-size: clamp(26px, 2.2vw, 34px); }
.page-about .section-cards .section-heading { margin-bottom: 16px; }
.collection-followups h3, .content-card h3, .news-card h3 { hyphens: manual; }
.prize-card h3, .event-description h3 { hyphens: manual; overflow-wrap: anywhere; }
.prize-card { background: var(--surface); border: 1px solid #2b18100f; box-shadow: var(--shadow-soft); }
.prize-period + .prize-period .prize-card { background: #fffdf9a6; box-shadow: none; border-color: var(--line); }
.prize-period + .prize-period .prize-card :is(h3, time) { color: var(--muted); }
.prize-period > h3 { font-size: clamp(22px, 1.8vw, 28px); }

/* Partners without a description read as a list of names on hairlines. */
.partner-card { background: var(--surface); border: 1px solid #2b18100f; box-shadow: var(--shadow-soft); }
.partner-card:not(:has(> p, > .rich-text, > .partner-logo)) {
  background: transparent;
  border: 0;
  border-top: 1px solid var(--line-strong);
  border-radius: 0;
  box-shadow: none;
  padding-inline: 0;
}
.partner-category > h3 { color: var(--red); font-size: 12px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; }
@media (max-width: 760px) {
  .content-card.has-image::before { padding-top: 75% !important; }
  .content-card.has-image .content-card-body h3 { font-size: 28px; }
  .page-home .home-feature { gap: 28px; }
  .page-home .home-feature > figure { min-height: 300px; }
}

/* Whole cards are one target: the card's own action stretches over it. */
.content-card, .news-card, .partner-card, .venue-card { position: relative; }
.content-card-body > :is(a.text-link, button.text-button)::after,
.news-card h3 a::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
}
.content-card-body > :is(a.text-link, button.text-button) { position: static; }
/* A news card's title is its link; "Read more" stays clickable above it. */
.news-card .news-card-content > .text-link { position: relative; z-index: 2; }
.content-card:has(.content-card-body > :is(a.text-link, button.text-button)), .news-card { cursor: pointer; }
.content-card:has(.content-card-body > :is(a.text-link, button.text-button)) .rich-text a { position: relative; z-index: 2; }

/* Programme-booklet structure: each section opens on a firm rule, like a
   printed programme; long text is set as type on the page, not in boxes,
   and uses the full width in two columns on large screens. */
.page-sections > .page-section:not(.section-collection):not(#support):not(#about) > .section-heading,
.page-sections > .page-section.section-collection:not(.page-home *) > .section-heading {
  border-top: 2px solid var(--ink);
  padding-top: 18px;
}
.page-home .page-section > .section-heading { border-top: 0 !important; padding-top: 0 !important; }
.section-heading .eyebrow { margin-bottom: 12px; }
.text-panel {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  font-size: 18px;
  line-height: 1.7;
  color: var(--ink);
}
.text-panel > .rich-text, .text-panel > p, .text-panel > ul, .text-panel > ol, .text-panel > div { max-width: none; }
@media (min-width: 1100px) {
  .text-panel.rich-text, .text-panel > .rich-text {
    columns: 2 32ch;
    column-gap: clamp(40px, 4vw, 72px);
  }
  .text-panel :is(p, li, figure, blockquote, table) { break-inside: avoid; }
  .text-panel :is(h2, h3, h4) { break-after: avoid; break-inside: avoid; }
  .text-panel > div + div { column-span: all; }
  /* A text of a single paragraph keeps one column at the width of a column.
     Safari ignores «break-after: avoid» and would set the paragraph in the
     second column, leaving its heading alone in the first (prizes, SRF2). */
  :is(.text-panel.rich-text, .text-panel > .rich-text):not(:has(> :is(p, ul, ol) ~ :is(p, ul, ol))):not(:has(> :is(ul, ol))) { columns: auto; }
  :is(.text-panel.rich-text, .text-panel > .rich-text):not(:has(> :is(p, ul, ol) ~ :is(p, ul, ol))):not(:has(> :is(ul, ol))) > p { max-width: calc((100% - clamp(40px, 4vw, 72px)) / 2); }
}
/* Round 3 · competition · point 34: Stundenpläne, Programme, Resultate and
   Referenzlisten 2027 say a sentence or two and then offer their documents.
   Their text keeps one column at the width of a column, so a sentence ending
   in a colon stands right above its link, and the reference lists follow in
   two columns where every entry fits on its line, read from top to bottom. */
@media (min-width: 1100px) {
  .page-competition :is(#timetables, #programmes, #results, #reference-lists) .text-panel.rich-text { columns: auto; }
  .page-competition :is(#timetables, #programmes, #results, #reference-lists) .text-panel.rich-text > p { max-width: calc((100% - clamp(40px, 4vw, 72px)) / 2); }
}
.page-competition #reference-lists .text-panel > ul { columns: 2 22em; column-gap: clamp(24px, 3vw, 48px); }
.page-competition #reference-lists .text-panel > ul > li { break-inside: avoid; text-wrap: pretty; }
.text-panel :is(h3, h4) { color: var(--wine); font-size: 22px; margin: 26px 0 10px; }
.text-panel > :first-child, .text-panel.rich-text > :first-child { margin-top: 0; }
/* «Weisser Kasten» in the CMS: a text section in a white box like the lists
   and cards. Off unless an editor switches it on. */
.text-panel.is-boxed {
  padding: clamp(22px, 2.2vw, 30px) clamp(20px, 2vw, 28px) !important;
  border: 1px solid #2b18100f !important;
  border-radius: var(--radius) !important;
  background: var(--surface) !important;
  box-shadow: var(--shadow-soft) !important;
}
.text-panel.is-boxed > :last-child { margin-bottom: 0; }
.page-about .section-columns + .page-section { border-top: 0 !important; margin-top: 0 !important; }

.content-card.has-image::before { content: ''; grid-area: 1 / 1; padding-top: 80%; }
.content-card.has-image > .content-card-body { grid-area: 1 / 1; }

/* One grid for the whole site: on very large screens every row shares the
   same 1560px measure, so header, heroes, content and footer align. */
:root { --inline: max(var(--gutter), calc((100% - 1560px) / 2)); }
.site-header { padding-inline: var(--inline); }
.page-content,
.page-about .page-content,
.page-privacy .page-content,
.page-legal .page-content { max-width: none; padding-inline: var(--inline); }
/* Legal notices read best as one column at a comfortable measure. */
.page-privacy .text-panel, .page-privacy .text-panel > .rich-text,
.page-legal .text-panel, .page-legal .text-panel > .rich-text { columns: auto; }
.footer-partners, .closing-band { margin-inline: var(--inline); }
.site-footer { padding-inline: var(--inline); }

/* Labels read as quiet text, not as a template device: normal case, normal
   spacing, no decorative dot. Applies to every eyebrow and small label. */
.eyebrow, .small-label, .page-sidebar .small-label, .footer-nav-group .eyebrow,
.footer-contact .eyebrow, .news-card .news-card-meta, .partner-category > h3,
.home-intro-band > span, .person-heading > small {
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
}
.eyebrow::before, .section-heading .eyebrow::before, .home-feature-content > .eyebrow::before,
.closing-band .eyebrow::before, .hero .eyebrow::before { content: none !important; display: none !important; }
.section-heading .eyebrow, .map-heading .eyebrow, .eyebrow.red { color: var(--wine) !important; }
.news-card .news-card-meta { color: var(--wine) !important; font-size: 14px !important; }
.person-heading > small { font-size: 13px !important; color: var(--muted) !important; }
.page-about .modular-column:not(:empty)::before { height: 0 !important; margin-top: 0 !important; background: none !important; }

/* ==========================================================================
   Heroes · "Szenen"
   Home: full-bleed scenes, one per discipline, cross-fading slowly. Wide
   screens drift gently; tall screens pan across the stage. Interior pages
   share the language with one still photograph. Each photograph carries its
   own shade, which site.js raises only as far as its text needs.
   ========================================================================== */
@property --shade {
  syntax: '<number>';
  inherits: true;
  initial-value: 0.8;
}
.hero.hero-scenes,
.hero.hero-interior {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #120605;
  color: var(--cream);
}
/* The quiet top edge that separates the header is part of each photograph's
   shade (below), so it dissolves with the photograph between pages. */
.hero.hero-scenes::before,
.hero.hero-interior::before { content: none; display: none; }
.hero.hero-scenes::after,
.hero.hero-interior::after { content: none; display: none; }

/* Photographs */
.hero-scenes-media,
.hero.hero-interior .hero-photo {
  position: absolute;
  inset: 0;
  z-index: 0;
  order: 0;
  width: auto;
  height: auto;
  margin: 0;
  min-height: 0;
  background: #120605;
}
.hero-scene {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  transition: opacity 1400ms ease;
}
.hero-scene[data-shaded] { transition: opacity 1400ms ease, --shade 700ms ease; }
.hero-scene.is-active { opacity: 1; }
/* Only the visible, outgoing and upcoming scenes load their photographs. */
.hero-scenes.is-ready .hero-scene:not(.is-active, .is-leaving, .is-next, .is-preload),
.hero-scenes:not(.is-ready) .hero-scene:not(:first-child) { display: none; }
@starting-style {
  .hero-scenes.is-ready .hero-scene.is-active { opacity: 0; }
}
/* The Studio holds the photograph still while an editor frames it. */
html[data-studio-crop] .hero-scene { transition: none; }
html[data-studio-crop] .hero-scene img { animation: none !important; transform: none !important; }
.hero.hero-interior .hero-photo[data-shaded] { transition: --shade 700ms ease; }
.hero-scene img,
.hero.hero-interior .hero-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
}
/* The shade darkens from the lower left, where the text sits. */
.hero-scene::after,
.hero.hero-interior .hero-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, #08030366 0%, #08030300 20%),
    linear-gradient(0deg,
      rgb(8 3 3 / calc(var(--shade, 0.8) * 0.9)) 0%,
      rgb(8 3 3 / calc(var(--shade, 0.8) * 0.55)) 32%,
      rgb(8 3 3 / 0) 68%),
    linear-gradient(90deg,
      rgb(8 3 3 / calc(var(--shade, 0.8) * 0.5)) 0%,
      rgb(8 3 3 / 0) 60%);
}

/* Motion: site.js gives each scene a drift, or on tall screens a pan. */
@media (prefers-reduced-motion: no-preference) {
  .hero-scene.can-drift:is(.is-active, .is-leaving) img {
    animation: scene-drift 9s ease-out both;
  }
  .hero-scene.can-pan:is(.is-active, .is-leaving) img {
    animation: scene-pan 9s ease-in-out both;
  }
  .hero-scenes.is-paused .hero-scene img,
  .hero-scenes.is-paused .hero-chapter::after { animation-play-state: paused; }
}
@keyframes scene-drift { from { transform: scale(1.06); } to { transform: none; } }
@keyframes scene-pan {
  from { object-position: var(--pan-from) var(--pan-y); }
  to { object-position: var(--pan-to) var(--pan-y); }
}

/* Home layout: copy bottom-left, scene chapters bottom-right. */
.hero.hero-scenes {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-content: end;
  align-items: end;
  column-gap: 56px;
  row-gap: 28px;
  min-height: max(600px, calc(100svh - var(--header)));
  padding: clamp(120px, 18vh, 200px) var(--inline) clamp(40px, 6vh, 72px);
}
.hero.hero-scenes .hero-content {
  position: relative;
  z-index: 2;
  grid-column: 1;
  width: auto;
  max-width: none;
  padding: 0;
}
.hero.hero-scenes h1,
.hero.hero-interior h1,
.hero.hero-legal h1 {
  margin: 0;
  font-weight: 300;
  letter-spacing: -0.03em;
  color: var(--cream);
  text-wrap: balance;
  /* Words move to the next line whole; only a word longer than a line breaks. */
  overflow-wrap: break-word;
  hyphens: manual;
}
.hero.hero-scenes h1 {
  max-width: 15ch;
  font-size: clamp(44px, 5vw, 96px);
  line-height: 1.02;
}
.hero.hero-scenes h1 em,
.hero.hero-interior h1 em { font-style: normal; font-family: inherit; font-weight: 300; color: #f6d6ce; letter-spacing: inherit; font-size: 1em; }
.hero.hero-scenes .hero-description {
  max-width: 42ch;
  margin: 22px 0 0;
  font-size: clamp(17px, 1.3vw, 20px);
  font-weight: 300;
  line-height: 1.5;
  color: var(--cream);
}
.hero.hero-scenes .button { margin-top: 30px; }
.hero.hero-scenes .button-cream,
.hero.hero-interior .button-cream { box-shadow: none; }
.hero.hero-scenes :is(h1, .hero-description),
.hero.hero-interior :is(h1, .eyebrow),
.hero-chapter { text-shadow: 0 1px 18px #0806064d; }

/* Chapters: one line per scene; the active line fills while it plays.
   Choosing a chapter shows that scene and stops the automatic changes. */
/* The lower right holds the credit and, with several scenes, their chapters. */
.hero-aside {
  position: relative;
  z-index: 2;
  grid-column: 2;
  display: grid;
  justify-items: end;
  gap: 10px;
  min-width: 0;
}
.hero-scene-credits { display: grid; justify-items: end; max-width: 100%; }
.hero-scene-credits > .photo-credit { grid-area: 1 / 1; }
.hero-chapters {
  display: flex;
  gap: 28px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.hero-chapter {
  position: relative;
  min-height: 44px;
  padding: 12px 0 14px;
  border: 0;
  background: none;
  color: #fffcf6cc;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  transition: color var(--motion-quick) ease;
}
.hero-chapter::before,
.hero-chapter::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  border-radius: 2px;
}
.hero-chapter::before { background: #fffcf64d; }
.hero-chapter::after { background: var(--cream); transform: scaleX(0); transform-origin: left; }
.hero-chapter:is(:hover, :focus-visible),
.hero-chapter[aria-current='true'] { color: var(--cream); }
.hero-chapter[aria-current='true']::after { transform: scaleX(1); }
.hero-scenes.is-rotating .hero-chapter[aria-current='true']::after {
  animation: scene-progress var(--scene-duration, 7s) linear both;
}
@keyframes scene-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.hero-chapter:focus-visible { outline: 2px solid var(--cream); outline-offset: 4px; }

/* Credits: plain small type in the darkened lower right corner. */
.hero.hero-scenes .photo-credit,
.hero.hero-interior .photo-credit {
  position: static;
  z-index: 2;
  max-width: 100%;
  margin: 0;
  padding: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  backdrop-filter: none;
  color: #fffcf6cc;
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: 0.01em;
  text-align: right;
  text-shadow: 0 1px 10px #000c;
}
.hero-scene-credit { opacity: 0; transition: opacity 900ms ease; }
.hero-scene-credit.is-active { opacity: 1; }

/* Interior pages: the same language, one still photograph, a calmer height. */
.hero.hero-interior {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  /* Very wide screens grow taller with their width, so portrait photographs
     still show a whole head there. */
  min-height: clamp(380px, 54vh, max(640px, 22vw));
  padding: 0;
}
.hero.hero-interior .hero-content {
  position: relative;
  z-index: 2;
  display: block;
  width: auto;
  max-width: none;
  padding: clamp(96px, 14vh, 160px) var(--inline) clamp(36px, 5.5vh, 60px);
}
.hero.hero-interior h1 {
  max-width: 18ch;
  font-size: clamp(40px, 4.4vw, 84px);
  line-height: 1.02;
}
.hero.hero-interior .eyebrow {
  margin: 0 0 18px;
  color: var(--cream);
  font-size: 17px !important;
  font-weight: 400 !important;
}
.hero.hero-interior .hero-title-term { display: inline-block; max-width: 100%; }
.hero.hero-interior .photo-credit {
  position: absolute;
  /* On very wide screens the text column stands far in from the edge; the
     credit stays nearer the corner there, clear of the photographed faces. */
  right: min(var(--inline), 500px);
  bottom: clamp(36px, 5.5vh, 60px);
  max-width: min(30%, 320px);
}

/* Legal notices keep a plain wine band without a photograph. */
.hero.hero-legal h1 { font-size: clamp(40px, 4.4vw, 76px); line-height: 1.04; }
.hero.hero-legal .hero-content { max-width: none; padding: clamp(56px, 8vh, 104px) var(--inline) clamp(40px, 6vh, 72px); }
.hero.hero-legal .eyebrow { margin: 0 0 16px; color: #fffcf6d9; font-weight: 500 !important; }
.hero.hero-legal .hero-description { margin-top: 18px; max-width: 58ch; color: #fffcf6e0; font-weight: 300; }

.page-introduction {
  max-width: 62ch;
  margin: 48px 0 0;
  font-size: clamp(19px, 1.5vw, 22px);
  line-height: 1.6;
  color: var(--ink-soft);
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.page-introduction + .page-section { padding-top: 40px; }

@media (max-width: 1050px) {
  .hero.hero-scenes { grid-template-columns: minmax(0, 1fr); }
  .hero-aside { grid-column: 1; justify-items: stretch; }
  .hero-scene-credits { justify-items: end; }
}
@media (max-width: 760px) {
  .hero.hero-scenes {
    min-height: min(max(560px, calc(100svh - var(--header))), 760px);
    padding-top: 140px;
    padding-bottom: 24px;
    row-gap: 18px;
  }
  /* Words move to the next line whole; only a word longer than a line breaks. */
  .hero.hero-scenes h1 { font-size: clamp(36px, 10.4vw, 48px); overflow-wrap: break-word; }
  .hero.hero-interior h1 { font-size: clamp(34px, 9vw, 44px); overflow-wrap: break-word; }
  /* A single long word such as "Datenschutzerklärung" is hyphenated properly. */
  .hero.hero-legal h1 { font-size: clamp(30px, 8.4vw, 44px); hyphens: auto; overflow-wrap: break-word; }
  .hero.hero-scenes .hero-description { margin-top: 16px; font-size: 17px; }
  .hero.hero-scenes .button { margin-top: 22px; }
  .hero-chapters { justify-content: space-between; gap: 10px; }
  .hero-chapter { font-size: 12px; }
  .hero.hero-interior { min-height: clamp(340px, 62vh, 480px); }
  .hero.hero-interior .hero-content { padding-top: 110px; padding-bottom: 44px; }
  .hero.hero-scenes .photo-credit, .hero.hero-interior .photo-credit { font-size: 10px; }
  /* On phones the credit spans the foot of the banner. The title block keeps
     an invisible copy of it as its last line, so even a very long credit
     never covers the title. */
  .hero.hero-interior .photo-credit { left: var(--inline); bottom: 14px; max-width: none; }
  .hero.hero-interior .hero-content[data-credit] { padding-bottom: 14px; }
  .hero.hero-interior .hero-content[data-credit]::after { content: attr(data-credit); display: block; visibility: hidden; margin-top: 14px; font-size: 10px; line-height: 1.4; letter-spacing: 0.01em; text-align: right; }
  .page-introduction { font-size: 17px; margin-top: 30px; }
  .page-introduction + .page-section { padding-top: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-scene, .hero-scene-credit { transition: none; }
}
@media print {
  .hero-scene:not(.is-active), .hero-scene-controls { display: none; }
}

/* One typographic voice: light display headings, semibold titles for scanning. */
.home-feature-content > h2, .closing-band h2, .footer-social h2, .footer-partners-heading h2,
.content-dialog h2, .support-intro h2, .detail-heading h1, .rich-text h2 {
  font-weight: 300;
  letter-spacing: -0.025em;
}
.page-home .home-feature-content > h2 { font-size: clamp(40px, 4vw, 64px); line-height: 1.02; }
.closing-band h2 { font-size: clamp(32px, 2.8vw, 44px); }
.footer-social h2 { font-size: clamp(26px, 2.4vw, 36px); }
.detail-heading h1 { font-size: clamp(36px, 4.4vw, 68px); line-height: 1.04; }

/* The donate action in the header greets homepage visitors with one gentle
   heartbeat; the support section's button repeats it on hover or focus. */
@keyframes donation-heartbeat {
  0%, 35%, 100% { transform: scale(1); }
  12% { transform: scale(1.14); }
  23% { transform: scale(1.04); }
}
@media (prefers-reduced-motion: no-preference) {
  .page-home .donation-cta > svg { transform-origin: center; animation: donation-heartbeat 2s ease-in-out 600ms 1 both; }
}

/* ==========================================================================
   Footer finale · partner credits, office and social profiles
   The partners open the footer in a slim band: their names roll past like
   the end credits of a concert and soften into a blur at both edges. A
   hairline then leads to the social profiles and the office.
   ========================================================================== */
.footer-partners {
  --credits-edge: clamp(44px, 9vw, 160px);
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  align-content: start;
  row-gap: clamp(14px, 1.3vw, 18px);
  /* One pixel over the page above: a full-width coloured section that ends
     on a fractional pixel would otherwise leave a light seam. */
  margin: -1px 0 0;
  padding: clamp(40px, 3.8vw, 54px) 0 0;
  border: 0;
  overflow: hidden;
  background: var(--wine-deep);
  color: var(--cream);
  text-align: center;
}
.footer-partners > h2 { max-width: 100%; padding-inline: var(--inline); color: #e6c9bf; font-size: clamp(17px, 1.3vw, 19px); font-weight: 400; line-height: 1.3; letter-spacing: 0; }

/* The credits: one ribbon across the full width. Copies made by site.js close
   the loop; they are hidden from assistive technology and keyboard focus. */
.footer-partners .sponsor-track {
  grid-row: 2;
  grid-column: 1;
  width: 100%;
  margin: 0;
  padding: 2px var(--credits-edge);
  grid-auto-columns: max-content;
  gap: 0;
  justify-content: safe center;
  scroll-snap-type: none;
  scroll-padding-inline: var(--credits-edge);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 var(--credits-edge), #000 calc(100% - var(--credits-edge)), transparent);
  mask-image: linear-gradient(90deg, transparent, #000 var(--credits-edge), #000 calc(100% - var(--credits-edge)), transparent);
}
/* A soft blur deepens toward both edges, over the same row. */
.footer-partners::before,
.footer-partners::after {
  content: '';
  grid-row: 2;
  grid-column: 1;
  align-self: stretch;
  width: var(--credits-edge);
  z-index: 1;
  pointer-events: none;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.footer-partners::before { justify-self: start; -webkit-mask-image: linear-gradient(90deg, #000, transparent); mask-image: linear-gradient(90deg, #000, transparent); }
.footer-partners::after { justify-self: end; -webkit-mask-image: linear-gradient(270deg, #000, transparent); mask-image: linear-gradient(270deg, #000, transparent); }
.sponsor-tile {
  position: relative;
  display: block;
  min-height: 0;
  padding: 2px clamp(18px, 1.9vw, 30px);
  border: 0;
  border-left: 1px solid #fffcf63d;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: var(--cream);
  font-size: clamp(19px, 1.45vw, 22px);
  font-weight: 300;
  line-height: 1.3;
  letter-spacing: -0.01em;
  white-space: nowrap;
  text-align: center;
  scroll-snap-align: none;
  transition: color var(--motion-quick) ease;
}
.footer-partners .sponsor-track:focus-visible { outline: 2px solid #fffcf6b3; outline-offset: -2px; border-radius: 12px; }
.sponsor-tile::before { content: none; }
.sponsor-clone::after { content: attr(data-name); }
/* A still row (reduced motion, no scripts) starts without a separator. */
.footer-partners .sponsor-track:not(:has(.sponsor-clone)) .sponsor-tile:first-child { border-left-color: transparent; }
.sponsor-tile img { width: auto; max-width: none; height: 30px; max-height: 30px; filter: brightness(0) invert(1); opacity: 0.92; }
.sponsor-tile:is(:hover, :focus-visible) { color: #ffc4bb; background: none; box-shadow: none; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }

/* "All partners" under the names, closed by the hairline. Keyboard users meet
   a pause button at the start of this row; it shows only while it has focus.
   Pointing at or touching the names holds them still for everyone else. */
.footer-partners-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  grid-auto-rows: minmax(32px, auto);
  align-items: center;
  justify-self: stretch;
  margin: 2px var(--inline) 0;
  padding-bottom: clamp(28px, 2.8vw, 40px);
  border-bottom: 1px solid #ffffff21;
}
.footer-partners-more { grid-column: 2; margin: 0; color: var(--cream); font-size: 15px; }
.footer-partners-more:is(:hover, :focus-visible) { color: #ffc4bb; }
.footer-partners .carousel-toggle {
  grid-column: 1;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: auto;
  min-width: 0;
  height: 32px;
  min-height: 32px;
  padding: 0 14px 0 12px;
  border: 1px solid var(--cream);
  border-radius: 16px;
  background: var(--cream);
  color: var(--wine);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  outline: 2px solid var(--cream);
  outline-offset: 3px;
}
.footer-partners .carousel-toggle:not(:focus) { position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; outline: none; }
.footer-partners .carousel-toggle[hidden] { display: none; }
.footer-partners .carousel-toggle::before { content: ''; flex: none; width: 9px; height: 11px; background: linear-gradient(90deg, currentColor 0 3px, transparent 3px 6px, currentColor 6px); }
.footer-partners .carousel-toggle[aria-pressed='true']::before { width: 10px; background: currentColor; clip-path: polygon(0 0, 100% 50%, 0 100%); }

/* Footer opening: social profiles and the office side by side. */
.site-footer { padding-top: clamp(56px, 6vw, 96px); }
.footer-lead {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: end;
  gap: 48px clamp(40px, 6vw, 112px);
  padding-bottom: clamp(56px, 6vw, 88px);
  margin-bottom: clamp(44px, 5vw, 64px);
  border-bottom: 1px solid #ffffff1f;
}
.footer-social { display: block; margin: 0; padding: 0; border: 0; }
.footer-social h2 { font-size: clamp(34px, 3.4vw, 54px); line-height: 1.04; }
.footer-social > p { margin-top: 14px; color: #e6c9bf; font-size: 19px; }
.social-links { display: grid; gap: 0; width: 100%; margin-top: 40px; border-top: 1px solid #ffffff2b; }
.social-link {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  grid-template-areas: 'icon name go' 'icon handle go';
  align-items: center;
  align-content: center;
  gap: 0 18px;
  min-height: 80px;
  padding: 14px 6px 14px 0;
  border: 0;
  border-bottom: 1px solid #ffffff2b;
  border-radius: 0;
  background: none;
  color: var(--cream);
  font-size: 22px;
  font-weight: 600;
}
.social-link:not(:has(.social-handle)) { grid-template-areas: 'icon name go'; }
.social-link .social-icon { grid-area: icon; box-sizing: content-box; width: 26px; height: 26px; padding: 13px; border: 1px solid #ffffff4d; border-radius: 50%; fill: currentColor; stroke: none; }
.social-link > .control-label { grid-area: name; line-height: 1.2; white-space: nowrap; }
.social-link .social-handle { grid-area: handle; margin-top: 3px; color: #dcbcb1; font-size: 15px; font-weight: 400; line-height: 1.35; overflow-wrap: anywhere; }
.social-link > svg:last-child { grid-area: go; width: 20px; height: 20px; margin: 0; opacity: 0.7; }
.social-link:is(:hover, :focus-visible) { background: none; color: var(--cream); border-color: #ffffff2b; }
.social-link:is(:hover, :focus-visible) .social-icon { background: var(--cream); color: var(--wine); border-color: var(--cream); }
.social-link:is(:hover, :focus-visible) > svg:last-child { opacity: 1; }
.footer-office { justify-self: end; min-width: 0; max-width: 100%; text-align: right; }
.footer-office h2 { margin: 0 0 16px; color: #e6c9bf; font-size: 19px; font-weight: 300; letter-spacing: 0; line-height: 1.3; }
.footer-office-mail { display: inline-block; max-width: 100%; color: var(--cream); font-size: clamp(34px, 3.6vw, 58px); font-weight: 300; line-height: 1.08; letter-spacing: -0.03em; overflow-wrap: anywhere; text-decoration: underline 1px transparent; text-underline-offset: 10px; transition: text-decoration-color var(--motion-quick) ease; }
.footer-office-mail:is(:hover, :focus-visible) { text-decoration-color: currentColor; }
.footer-office-phone { display: block; width: fit-content; margin: 16px 0 0 auto; color: #e6c9bf; font-size: 22px; font-weight: 300; }
.footer-office-phone:is(:hover, :focus-visible) { color: var(--cream); }

@media (prefers-reduced-motion: no-preference) {
  .social-link > svg:last-child { transition: translate var(--motion-response) var(--motion-ease), opacity var(--motion-quick) ease; }
  .social-link:is(:hover, :focus-visible) svg:has(> use[href='#i-external']) { translate: 2px -2px; }
  .social-link .social-icon { transition: background-color var(--motion-quick) ease, color var(--motion-quick) ease, border-color var(--motion-quick) ease; }
}
@media (max-width: 900px) {
  .footer-lead { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .footer-office { justify-self: start; text-align: left; }
  .footer-office-phone { margin-left: 0; }
}
@media (max-width: 760px) {
  .footer-partners { --credits-edge: 36px; padding-top: 36px; row-gap: 14px; }
  .footer-partners > h2 { font-size: 17px; }
  .sponsor-tile { padding-inline: 18px; font-size: 19px; }
  .footer-partners-bar { padding-bottom: 26px; }
  .footer-social h2 { font-size: clamp(30px, 8.6vw, 38px); }
  .footer-social > p { font-size: 17px; }
  .social-links { margin-top: 28px; }
  .social-link { min-height: 76px; font-size: 20px; }
  .footer-office-mail { font-size: clamp(30px, 8.4vw, 40px); }
}

/* ==========================================================================
   Keyboard focus without frames
   Keyboard users always see where they are, but the mark follows each
   control: rounded controls get a ring in their own shape, text links an
   underline, cards a ring around the whole card, and controls with a clear
   hover state show that state. Mouse and touch never show it.
   ========================================================================== */
:focus-visible { outline-offset: 3px; }
.hero :focus-visible, .site-footer :focus-visible, .lightbox :focus-visible { outline-color: var(--cream); }

/* Text links: a firm underline instead of a box. */
:is(.text-link, .text-button, .footer-nav a, .footer-bottom a, .footer-contact a, .page-sidebar nav > a,
    .rich-text a:not(.content-button), .news-card h3 a, .document-row h3 a, .event-description h3 a,
    .languages a, .footer-names summary):focus-visible {
  outline: none;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
}
/* The main navigation already marks its link with the header rule. */
.primary-nav a:focus-visible { outline: none; }

/* Expandable rows mark their title the same way. */
:is(.faq-list, .news-entry, .person-card, .gallery-entry, .guestbook-entry, .prize-card,
    .event-details, .map-location-options) summary:focus-visible {
  outline: none;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
}

/* Cards: a ring around the whole card, following its corners. */
:is(.content-card, .news-card, .partner-card, .venue-card, .gallery-entry, .prize-card, details.person-card):has(:focus-visible) {
  outline: 2px solid var(--wine);
  outline-offset: 3px;
}

/* Scrolling strips: a soft rounded ring. */
.carousel-track:focus-visible { outline: 2px solid #6a0f1c73; outline-offset: 6px; border-radius: 14px; }

/* Controls whose hover state is already unmistakable use it for focus too. */
:is(.sponsor-tile, .social-link, .footer-office-mail, .hero-chapter):focus-visible { outline: none; }
.hero-chapter:focus-visible::before { height: 4px; background: var(--cream); }
.brand:focus-visible { outline-offset: 6px; border-radius: 12px; }
.footer-brand:focus-visible { outline-offset: 4px; }

/* ==========================================================================
   Navigation motion
   The main links move calmly: the red rule glides in from the left and
   leaves toward the right, and the colour follows softly. Between pages the
   header stays in place and its mark moves the same way, while the old
   content fades out before the new content fades in.
   ========================================================================== */
.primary-nav a { transition: color 420ms cubic-bezier(0.22, 1, 0.36, 1); }
.primary-nav a::after { transform-origin: right center; transition: transform 560ms cubic-bezier(0.65, 0, 0.35, 1); }
.primary-nav a:is(:hover, :focus-visible)::after { transform-origin: left center; }
/* The current page is marked by colour and rule alone: a bolder weight would
   widen the word and shift its neighbours whenever the page changes. */
.primary-nav a[aria-current] { font-weight: inherit; }
@media (prefers-reduced-motion: reduce) {
  .primary-nav a::after { transform: none; opacity: 0; transition: opacity 300ms ease; }
  .primary-nav a:is(:hover, :focus-visible, [aria-current])::after { opacity: 1; }
}

/* Page changes are made by site/navigation.js, which starts each dissolve;
   plain page loads (for example without JavaScript) stay instant. */
@media (prefers-reduced-motion: no-preference) {
  .site-header { view-transition-name: site-header; }
  /* The old page fades out before the new one fades in, so the words of the
     two pages, or of two languages, never show through each other. */
  ::view-transition-old(root) { animation: 200ms cubic-bezier(0.4, 0, 1, 1) both page-leave; }
  ::view-transition-new(root) { animation: 460ms cubic-bezier(0.22, 1, 0.36, 1) 200ms both page-arrive; }
  /* The new header takes the old one's place at once. Kept underneath, the
     old one would show through the new one's translucent background with
     its own page still marked. The mark then moves inside the header
     (Header at about 140 % and site/navigation.js). */
  ::view-transition-group(site-header) { animation: none; }
  ::view-transition-old(site-header) { animation: none; opacity: 0; }
  ::view-transition-new(site-header) { animation: none; mix-blend-mode: normal; }
  /* The banner photographs dissolve straight into each other, so the change
     never passes through the empty page. Titles and credits sit above them
     and change without stretching, anchored where they rest. */
  .hero-photo, .hero-scenes-media { view-transition-name: page-hero; }
  .hero-content { view-transition-name: page-title; }
  .hero-aside, .hero.hero-interior > .photo-credit { view-transition-name: page-aside; }
  ::view-transition-group(page-hero) { overflow: clip; animation-duration: 640ms; animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1); }
  ::view-transition-old(page-hero), ::view-transition-new(page-hero) { height: 100%; object-fit: cover; }
  ::view-transition-old(page-hero) { animation: none; }
  ::view-transition-new(page-hero) { animation: 640ms cubic-bezier(0.45, 0, 0.55, 1) both page-arrive; mix-blend-mode: normal; }
  /* A banner with no counterpart on the other page fades with the page. */
  ::view-transition-old(page-hero):only-child { animation: 200ms cubic-bezier(0.4, 0, 1, 1) both page-leave; }
  ::view-transition-new(page-hero):only-child { animation: 460ms cubic-bezier(0.22, 1, 0.36, 1) 200ms both page-arrive; }
  ::view-transition-group(page-title), ::view-transition-group(page-aside) { animation-duration: 640ms; animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1); }
  ::view-transition-old(page-title), ::view-transition-new(page-title) { inset: auto auto 0 0; width: auto; height: auto; }
  ::view-transition-old(page-aside), ::view-transition-new(page-aside) { inset: auto 0 0 auto; width: auto; height: auto; }
  ::view-transition-old(page-title), ::view-transition-old(page-aside) { animation: 200ms cubic-bezier(0.4, 0, 1, 1) both page-leave; }
  ::view-transition-new(page-title), ::view-transition-new(page-aside) { animation: 460ms cubic-bezier(0.22, 1, 0.36, 1) 200ms both page-arrive; }
}
@keyframes page-leave { to { opacity: 0; } }
@keyframes page-arrive { from { opacity: 0; } }

/* ==========================================================================
   News · colour fields
   Stories sit in fields of different sizes in a muted evening palette (plum,
   dusky rose, taupe, sand). The newest leads, large and plain plum; the
   colours and sizes repeat in the same order for any number of stories.
   ========================================================================== */
.page-news .section-collection#news > .section-heading { display: none; }
.news-list.news-stories {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: minmax(250px, auto);
  grid-auto-flow: dense;
  gap: 14px;
  margin: 0;
  padding: 0;
  border: 0;
}
.news-story {
  --field: #efe6d8;
  --field-ink: var(--ink);
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 0;
  border-radius: 24px;
  background: var(--field);
  color: var(--field-ink);
  transition: translate 500ms cubic-bezier(0.22, 1, 0.36, 1);
}
.news-story-image { margin: 0; aspect-ratio: 16 / 10; overflow: hidden; }
.news-story-image img { display: block; width: 100%; height: 100%; }
.news-story-body { display: flex; flex: 1; flex-direction: column; gap: 12px; padding: 30px; }
.news-story-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0; font-size: 14px; font-weight: 600; opacity: 0.85; }
.news-story h3 { margin: 0; font-size: clamp(24px, 1.9vw, 30px); font-weight: 300; line-height: 1.1; letter-spacing: -0.02em; text-wrap: balance; hyphens: auto; -webkit-hyphens: auto; }
.news-story h3 a { color: inherit; text-decoration: none; }
.news-story h3 a::after { content: ''; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.news-story-teaser { margin: 0; font-size: 15px; line-height: 1.5; opacity: 0.8; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.news-story-more {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  align-self: flex-end;
  width: 46px;
  height: 46px;
  margin-top: auto;
  border: 1px solid currentColor;
  border-radius: 50%;
  transition: background-color var(--motion-quick) ease, color var(--motion-quick) ease, border-color var(--motion-quick) ease;
}
.news-story-more .control-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.news-story-more svg { width: 18px; height: 18px; }
.news-story:hover .news-story-more { background: var(--field-ink); border-color: var(--field-ink); color: var(--field); }
.news-story:has(a:focus-visible) { outline: 2px solid var(--wine); outline-offset: 3px; }
.news-story h3 a:focus-visible { outline: none; }

/* The palette, in order; light fields carry ink, dark fields cream. */
.news-story:not(.is-lead):nth-child(10n + 2) { --field: #e8dccb; }
.news-story:nth-child(10n + 3) { --field: #8c4a55; --field-ink: var(--cream); }
.news-story:nth-child(10n + 4) { --field: #cdbba5; grid-column: span 2; }
.news-story:nth-child(10n + 5) { --field: #2c1520; --field-ink: var(--cream); }
.news-story:nth-child(10n + 6) { --field: #efe6d8; }
.news-story:nth-child(10n + 7) { --field: #6e3242; --field-ink: var(--cream); grid-column: span 2; }
.news-story:nth-child(10n + 8) { --field: #bfae98; }
.news-story:nth-child(10n + 9) { --field: #e3d6c3; }
.news-story:nth-child(10n + 10) { --field: #57283a; --field-ink: var(--cream); grid-column: span 2; }
.news-story:not(.is-lead):nth-child(10n + 1) { --field: #d8c8b2; grid-column: 1 / -1; min-height: 200px; }
.news-story :is(h3, .news-story-teaser) { color: inherit; }

/* The newest story leads, large and plain plum. */
.news-story.is-lead { --field: #3d1826; --field-ink: var(--cream); grid-column: span 2; grid-row: span 2; }
.news-story.is-lead .news-story-body { justify-content: flex-end; gap: 16px; padding: clamp(32px, 3.4vw, 48px); }
.news-story.is-lead h3 { max-width: 12ch; font-size: clamp(48px, 5vw, 84px); line-height: 0.98; letter-spacing: -0.04em; }
.news-story.is-lead .news-story-teaser { max-width: 40ch; font-size: 20px; -webkit-line-clamp: 4; }
.news-story.is-lead .news-story-more { position: absolute; top: clamp(28px, 2.8vw, 40px); right: clamp(28px, 2.8vw, 40px); width: 60px; height: 60px; margin: 0; }
.news-story.is-lead .news-story-more svg { width: 22px; height: 22px; }

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .news-story:hover { translate: 0 -4px; }
}
@media (max-width: 1050px) {
  .news-list.news-stories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .news-story.is-lead { grid-row: auto; min-height: 400px; }
}
@media (max-width: 760px) {
  .news-list.news-stories { grid-template-columns: minmax(0, 1fr); grid-auto-rows: auto; }
  .news-story, .news-story[class] { grid-column: auto; min-height: 200px; }
  .news-story.is-lead { min-height: 380px; }
  .news-story.is-lead h3 { font-size: clamp(40px, 11vw, 52px); }
}
/* Wide fields carry larger titles. */
@media (min-width: 761px) {
  .news-story:is(:nth-child(10n + 4), :nth-child(10n + 7), :nth-child(10n + 10)) h3 { font-size: clamp(32px, 2.8vw, 44px); }
}

/* ==========================================================================
   Förderer & Partner · the credits of a concert programme
   Partners are names on hairlines, and the size of a name marks its tier.
   The main partners form a ledger, one row each: the name on the left, the
   description in the column of the introduction above, the link at the end
   of the row. Long, short and missing descriptions all share one grid, so
   no row is left as an empty field. Founders and partners stand in the
   columns of the name lists; only the invitations to get involved remain
   colour fields. Only this page is affected.
   ========================================================================== */
/* The opening text reads as an introduction; its first paragraph is the lead. */
.page-partners #purpose .text-panel p { font-size: 18px; line-height: 1.7; }
.page-partners #purpose .text-panel p:first-child { margin-bottom: 1.2em; color: var(--ink); font-size: clamp(22px, 1.8vw, 27px); font-weight: 300; line-height: 1.45; letter-spacing: -0.01em; text-wrap: pretty; }

/* A category that only repeats its section stays for screen readers only.
   Partners without a section of their own keep their category as a label. */
.page-partners .section-collection:not(.additional-partners) .partner-category > h3 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.page-partners .additional-partners .partner-category > h3 { margin: 0 0 6px; color: var(--wine); }

/* Every partner: a name on a hairline, its description and its link. */
.page-partners .partner-grid { column-gap: 40px; row-gap: 0; }
.page-partners .partner-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  gap: 8px;
  min-height: 0;
  padding: 16px 0 18px;
  border: 0;
  border-bottom: 1px solid var(--line-strong);
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: var(--ink);
}
/* Rows are not cards: no shadow or ring around them. Their links show focus. */
.page-partners .partner-grid > .partner-card:is(:hover, :focus-within) { border-color: var(--line-strong); box-shadow: none; outline: 0; }
.page-partners .partner-card :is(h3, h4) { margin: 0; color: var(--ink); font-size: 19px; font-weight: 300; line-height: 1.35; letter-spacing: -0.005em; }
.page-partners .partner-card :is(p, .rich-text) { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.6; }
.page-partners .partner-card .rich-text > :last-child { margin-bottom: 0; }
.page-partners .partner-card .rich-text strong { color: var(--ink); font-weight: 600; }
.page-partners .partner-card .text-link { margin-top: auto; font-size: 13px; }
.page-partners .partner-logo { justify-content: flex-start; width: 100%; height: auto; margin: 0 0 6px; }
.page-partners .partner-logo img { width: auto; max-width: min(100%, 200px); height: 52px; max-height: none; }

/* Main partners: the ledger. The name and description columns are those of
   the introduction; the first lines of a row share one baseline. */
.page-partners #main-partners .partner-grid { grid-template-columns: minmax(0, 1fr); border-bottom: 1px solid var(--line-strong); }
.page-partners #main-partners .partner-card {
  --ledger-gap: clamp(48px, 6vw, 112px);
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: var(--ledger-gap);
  row-gap: 0;
  align-items: baseline;
  padding: clamp(28px, 2.4vw, 38px) 0 clamp(30px, 2.6vw, 40px);
  border-top: 1px solid var(--line-strong);
  border-bottom: 0;
}
.page-partners #main-partners .partner-card > * { grid-column: 2; margin: 0; }
.page-partners #main-partners .partner-card > :is(.partner-logo, h3, h4) { grid-column: 1; }
.page-partners #main-partners .partner-card :is(h3, h4) { font-size: clamp(30px, 2.5vw, 40px); line-height: 1.06; letter-spacing: -0.028em; }
.page-partners #main-partners .partner-card :is(p, .rich-text) { max-width: 64ch; color: var(--ink-soft); font-size: 17px; line-height: 1.65; }
.page-partners #main-partners .partner-card > :is(p, .rich-text) + :is(p, .rich-text) { margin-top: 14px; }
.page-partners #main-partners .partner-card .text-link { justify-self: start; font-size: 15px; }
.page-partners #main-partners .partner-card > .partner-logo { margin-bottom: 18px; }
.page-partners #main-partners .partner-logo img { height: 64px; }
/* Wide screens: the links stand in their own column at the end of the rows. */
@media (min-width: 1300px) {
  .page-partners #main-partners .partner-card {
    grid-template-columns: calc((100% - var(--ledger-gap)) * 5 / 12) var(--ledger-gap) minmax(0, 1fr) clamp(32px, 3vw, 48px) minmax(max-content, 10em);
    column-gap: 0;
  }
  .page-partners #main-partners .partner-card > * { grid-column: 3; }
  .page-partners #main-partners .partner-card > :is(.partner-logo, h3, h4) { grid-column: 1; }
  .page-partners #main-partners .partner-card > .text-link { grid-column: 5; grid-row: 1; justify-self: end; }
  .page-partners #main-partners .partner-card:has(> .partner-logo) > .text-link { grid-row: 2; }
}
@media (max-width: 1299px) {
  .page-partners #main-partners .partner-card > :is(p, .rich-text) + .text-link { margin-top: 18px; }
}
/* Tablets and phones: name, description and link stack within the row. */
@media (max-width: 1050px) {
  .page-partners #main-partners .partner-card { grid-template-columns: minmax(0, 1fr); }
  .page-partners #main-partners .partner-card > *,
  .page-partners #main-partners .partner-card > :is(.partner-logo, h3, h4) { grid-column: 1; }
  .page-partners #main-partners .partner-card > :is(p, .rich-text) { margin-top: 12px; }
  .page-partners #main-partners .partner-card > :is(h3, h4) + .text-link { margin-top: 14px; }
}

/* Founders and partners: names in the columns of the name lists. */
.page-partners :is(#founders, #advertisers) .partner-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }

/* Name lists: hairline columns instead of bullets. */
.page-partners .section-text .text-panel ul { columns: 3 220px; column-gap: 40px; margin: 0; padding: 0; list-style: none; }
.page-partners .section-text .text-panel li { break-inside: avoid; margin: 0; padding: 14px 0; border-bottom: 1px solid var(--line-strong); font-size: 17px; line-height: 1.35; }
.page-partners .section-text .text-panel li::before, .page-partners .section-text .text-panel li::marker { content: none; }
.page-partners .section-text .text-panel h3 { margin: 28px 0 6px; color: var(--wine); font-size: 15px; font-weight: 600; }

/* Ways to get involved: fields as well. */
.page-partners #involvement .content-card { min-height: 190px; border: 0; border-radius: 24px; box-shadow: none; }
.page-partners #involvement .content-card-body { height: 100%; padding: 30px; }
.page-partners #involvement .content-card h3 { font-size: clamp(26px, 2.2vw, 34px); font-weight: 300; letter-spacing: -0.02em; }
.page-partners #involvement .content-card .text-link { margin-top: auto; color: inherit; }
.page-partners #involvement .content-card:nth-child(1) { background: #3d1826; color: var(--cream); }
.page-partners #involvement .content-card:nth-child(2) { background: #8c4a55; color: var(--cream); }
.page-partners #involvement .content-card:nth-child(3) { background: #cdbba5; color: var(--ink); }
.page-partners #involvement .content-card :is(h3, .text-link) { color: inherit; }

/* On phones founders and partners read like the name lists: one compact
   column without hairlines. */
@media (max-width: 760px) {
  .page-partners :is(#founders, #advertisers) .partner-grid { grid-template-columns: minmax(0, 1fr); row-gap: 16px; }
  .page-partners :is(#founders, #advertisers) .partner-card { gap: 4px; padding: 0; border-bottom: 0; }
  .page-partners :is(#founders, #advertisers) .partner-card :is(h3, h4) { font-size: 18px; line-height: 1.4; }
}

/* Sections open on space and a large light heading, without a black rule. */
.page-sections > .page-section > .section-heading,
.page-sections > .page-section.section-collection > .section-heading { border-top: 0 !important; padding-top: 0 !important; }
.page-sections > .page-section + .page-section { padding-top: clamp(72px, 8vw, 128px); }

/* Round 3 · sections · points 33 and 34: «Aufklappbar». A collapsible
   section reads like a row of the FAQ: its title in the section heading's
   size with the FAQ's round «+» on the right, between hairlines. Collapsible
   sections in a row form one group without section gaps inside it; the usual
   section spacing stands before and after the group. 'always' collapses on
   every screen, 'mobile' only on phones, where the side menu becomes the
   section bar; on wider screens a 'mobile' section is an ordinary section.
   Without JavaScript and in print the content stays open. */
.section-toggle {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-align: inherit;
  text-decoration: none;
  cursor: default;
}
.section-toggle-icon {
  display: none;
  flex: none;
  width: 20px;
  height: 20px;
  margin-right: 8px;
  border-radius: 50%;
  background: var(--surface);
  box-shadow: 0 0 0 7px var(--surface), 0 0 0 8px var(--line-strong);
  color: var(--wine);
  transition: background var(--motion-quick) ease, color var(--motion-quick) ease, box-shadow var(--motion-quick) ease, transform var(--motion-response) var(--motion-ease);
}
.section-toggle[aria-expanded='true'] .section-toggle-icon {
  background: var(--wine);
  box-shadow: 0 0 0 7px var(--wine), 0 0 0 8px var(--wine);
  color: #fffcf6;
  transform: rotate(45deg);
}
.section-collapse.is-animating { overflow: clip; }
/* Closed, the content stays searchable: find-in-page opens the section where
   the browser supports hidden="until-found" (site.js sets it only there). */
.section-collapse[hidden='until-found'] { display: block !important; content-visibility: hidden; }
@media (min-width: 761px) {
  .page-section[data-collapsible='always'] { border-bottom: 1px solid var(--line-strong); }
  .page-section[data-collapsible='always']:last-child { padding-bottom: 0; margin-bottom: clamp(48px, 5vw, 80px); }
  /* Inside a group a link lands with the hairline above the title in view. */
  .page-sections > .page-section[data-collapsible='always'] + .page-section[data-collapsible='always'] { padding-top: 0; scroll-margin-top: 0; }
  .page-section[data-collapsible='always'] > :is(.section-heading, .topic-heading) { margin-bottom: 0; }
  .page-section[data-collapsible='always'] > .section-heading > div { flex: 1 1 auto; min-width: 0; }
  .page-section[data-collapsible='always'] h2:has(> .section-toggle) { max-width: none; }
  .page-section[data-collapsible='always'] .section-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 26px 0;
    cursor: pointer;
  }
  .page-section[data-collapsible='always']:not(.page-section[data-collapsible='always'] + *) .section-toggle { border-top: 1px solid var(--line-strong); }
  .page-section[data-collapsible='always'] .section-toggle-icon { display: block; }
  .page-section[data-collapsible='always'] > .section-collapse > .section-collapse-inner { padding: 6px 0 clamp(36px, 3.4vw, 52px); }
}
@media (max-width: 760px) {
  .page-section[data-collapsible] { border-bottom: 1px solid var(--line-strong); }
  .page-section[data-collapsible]:last-child { padding-bottom: 0; margin-bottom: clamp(48px, 5vw, 80px); }
  .page-sections > .page-section[data-collapsible] + .page-section[data-collapsible] { padding-top: 0; scroll-margin-top: 0; }
  .page-section[data-collapsible] > :is(.section-heading, .topic-heading) { margin-bottom: 0; }
  .page-section[data-collapsible] > .section-heading > div { flex: 1 1 auto; min-width: 0; }
  .page-section[data-collapsible] h2:has(> .section-toggle) { max-width: none; }
  .page-section[data-collapsible] .section-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 20px 0;
    cursor: pointer;
  }
  .page-section[data-collapsible]:not(.page-section[data-collapsible] + *) .section-toggle { border-top: 1px solid var(--line-strong); }
  .page-section[data-collapsible] .section-toggle-icon { display: block; }
  .page-section[data-collapsible] > .section-collapse > .section-collapse-inner { padding: 4px 0 36px; }
}
/* Until site.js has set up the button, a section that opens closed stays
   closed, so the page does not move when the script arrives; a section the
   address points to shows open. Without JavaScript it all stays open. */
@media (scripting: enabled) and (min-width: 761px) {
  .page-section[data-collapsible='always']:not([data-collapse-ready], :target, :has(:target)) > .section-collapse { display: none; }
}
@media (scripting: enabled) and (max-width: 760px) {
  .page-section[data-collapsible]:not([data-collapse-ready], :target, :has(:target)) > .section-collapse { display: none; }
}
@media (scripting: none) {
  .section-toggle-icon { display: none !important; }
  .section-toggle { cursor: default !important; }
}
@media (hover: hover) {
  .page-section[data-collapse-ready] .section-toggle:hover { color: var(--wine); }
}
.section-toggle:focus-visible { outline: none; }
.section-toggle:focus-visible .section-toggle-label {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
}
@media print {
  .section-collapse { display: block !important; content-visibility: visible !important; height: auto !important; overflow: visible !important; }
  .section-toggle-icon { display: none !important; }
}
/* Name lists as a grid: every row shares one height, so the hairlines of a
   row always line up, whatever the length of a name. */
.page-partners .section-text .text-panel ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); column-gap: 40px; columns: auto; }
.page-partners .section-text .text-panel li { display: flex; align-items: flex-start; }
.page-partners .section-text .text-panel { columns: auto; }
.page-partners .section-text .text-panel > :last-child { margin-bottom: 0; }
/* Texts span the whole width like the other modules (client, point 53), with
   or without their white box. On wide screens a text reads in two columns: a
   paragraph flows on into the second column, so a short text fills the box
   instead of leaving half of it empty, and a closing link line runs beneath
   both. The opening statement runs its lead across the box, in the size of
   the one-paragraph texts below, and its further paragraphs side by side
   beneath, so the two sizes never stand side by side. These stand in a grid
   rather than in flowing columns: browsers keep or drop the space between
   paragraphs at the top of a column differently, and both must start level.
   Tablets and phones read one column. */
@media (min-width: 1100px) {
  .page-partners .section-text .text-panel:not(:has(> :is(ul, ol))) { columns: 2; column-gap: clamp(40px, 4vw, 64px); }
  .page-partners .section-text .text-panel > p { break-inside: auto; orphans: 3; widows: 3; }
  .page-partners .section-text .text-panel > .link-line { column-span: all; }
  .page-partners #purpose .text-panel:has(> p + p) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 15px clamp(40px, 4vw, 64px); align-items: start; columns: auto; }
  .page-partners #purpose .text-panel:has(> p + p) > * { margin: 0; }
  .page-partners #purpose .text-panel:has(> p + p) > :is(p:first-child, .link-line) { grid-column: 1 / -1; }
  .page-partners #purpose .text-panel:has(> p + p) > p:first-child { max-width: 40em; margin-bottom: calc(1.3em - 15px); font-size: clamp(22px, 1.6vw, 24px); }
  /* A text of a single paragraph, perhaps with a link line, stays in one
     column, so no sentence breaks into a second column. */
  .page-partners .section-text .text-panel:not(:has(> :is(ul, ol))):not(:has(> p:not(.link-line) ~ p:not(.link-line))) { columns: auto; }
}
/* A text of a single paragraph reads as one statement in the size of the
   opening lead on every screen (Ruth Burkhalter, Sonderpreisstifter). */
.page-partners .section-text .text-panel:not(:has(> :is(ul, ol))):not(:has(> p:not(.link-line) ~ p:not(.link-line))) > p:not(.link-line) {
  max-width: 40em;
  color: var(--ink);
  font-size: clamp(22px, 1.6vw, 24px);
  font-weight: 300;
  line-height: 1.45;
  letter-spacing: -0.01em;
  text-wrap: pretty;
}
@media (max-width: 760px) {
  .page-partners .section-text .text-panel h3 { margin: 24px 0 10px; }
  .page-partners .section-text .text-panel:not(:has(> :is(ul, ol))):not(:has(> p:not(.link-line) ~ p:not(.link-line))) > p:not(.link-line) { font-size: 19px; line-height: 1.55; }
}

/* A modal that opens on a photograph: nothing light sits behind the photo, so
   its rounded corners show no pale edge; the text area carries the colour. */
.content-dialog:has(> .dialog-media:first-child) { background: transparent; }
.content-dialog:has(> .dialog-media:first-child) > .dialog-media { background: transparent; }
.content-dialog:has(> .dialog-media:first-child) > :not(.dialog-media) { flex: 1 1 auto; background: var(--surface); }
/* The scroll area keeps its inset scrollbar; two offset shadows paint the
   inset margins in the same colour, without reaching up into the photo. */
.content-dialog:has(> .dialog-media:first-child) > .dialog-scroll { box-shadow: 10px 0 0 0 var(--surface), 10px 16px 0 0 var(--surface), 0 16px 0 0 var(--surface); }

/* ==========================================================================
   Agenda · calendar and event list
   The calendar lies flat on the page in the evening palette: a large light
   month, quiet pill controls, a hairline grid with light day numbers, and
   multi-day events as one continuous bar across the week. The list below
   reads like a programme: a coloured date field, a light title and the
   details, on hairlines rather than in boxes. Categories: Wettbewerb plum,
   Konzert dusky rose, Meisterkurs taupe.
   ========================================================================== */
.agenda-calendar { --agenda-accent: #3d1826; --agenda-ink: var(--cream); --agenda-soft: #ece2d3; }
.agenda-calendar [data-category='competition'] { --agenda-accent: #3d1826; --agenda-ink: var(--cream); --agenda-soft: #e9dcd8; }
.agenda-calendar [data-category='concert'] { --agenda-accent: #8c4a55; --agenda-ink: var(--cream); --agenda-soft: #efdfdd; }
.agenda-calendar [data-category='masterclass'] { --agenda-accent: #bfae98; --agenda-ink: var(--ink); --agenda-soft: #ece2d3; }
.agenda-calendar [data-category='workshop'] { --agenda-accent: #57283a; --agenda-ink: var(--cream); --agenda-soft: #eadcdc; }
.agenda-calendar [data-category='other'] { --agenda-accent: #d8c8b2; --agenda-ink: var(--ink); --agenda-soft: #efe6d8; }

.agenda-calendar .agenda-board { padding: 0; border: 0; border-radius: 0; background: none; }

/* Header: a large light month, the view switch and month steps. */
.agenda-calendar .agenda-header { align-items: flex-end; gap: 20px 28px; padding-bottom: 28px; border-bottom: 0; }
.agenda-calendar .agenda-header .eyebrow { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.agenda-calendar [data-calendar-title] { font-size: clamp(40px, 4.2vw, 68px); font-weight: 300; line-height: 1; letter-spacing: -0.035em; }
.agenda-calendar :is(.agenda-view-switch, .agenda-period-controls) { gap: 2px; padding: 4px; border: 0; background: #ece2d3; }
.agenda-calendar :is(.agenda-view-switch, .agenda-period-controls) > button { min-height: 40px; padding: 8px 18px; color: var(--ink-soft); font-size: 14px; font-weight: 500; }
.agenda-calendar :is(.agenda-view-switch, .agenda-period-controls) > button[aria-pressed='true'] { background: var(--surface); color: var(--ink); box-shadow: 0 1px 2px #2b181014, 0 4px 12px -6px #2b181026; }
.agenda-calendar .calendar-controls { gap: 6px; }
.agenda-calendar .calendar-controls > button { min-height: 44px; padding: 10px 16px; border: 1px solid var(--line-strong); background: transparent; color: var(--ink); font-size: 14px; }
.agenda-calendar .calendar-controls > [data-calendar-today] { border-color: var(--line-strong); background: transparent; color: var(--ink); }
.agenda-calendar .calendar-controls > [data-month-prev],
.agenda-calendar .calendar-controls > [data-month-next] { padding-inline: 14px; }

/* Categories: quiet pills with a colour dot; the chosen one fills plum. */
:is(.agenda-calendar, .prizes-list) .agenda-categories { gap: 8px; margin: 0 0 6px; }
:is(.agenda-calendar, .prizes-list) .agenda-categories > button { gap: 10px; padding: 9px 16px; border-color: var(--line-strong); color: var(--ink-soft); font-size: 14px; }
:is(.agenda-calendar, .prizes-list) .agenda-categories > button::before { width: 10px; height: 10px; flex-basis: 10px; }
:is(.agenda-calendar, .prizes-list) .agenda-categories > button[aria-pressed='true'] { border-color: #3d1826; background: #3d1826; color: var(--cream); }
:is(.agenda-calendar, .prizes-list) .agenda-categories > button[aria-pressed='true']::before { background: var(--cream); }
.agenda-calendar .agenda-filter-bar > details > summary { font-size: 14px; }

/* The month grid: hairlines, generous cells, light numbers. */
.agenda-calendar .calendar-card { margin-top: 18px; }
.agenda-calendar .month-grid {
  grid-template-rows: 40px repeat(var(--calendar-weeks, 6), minmax(0, 1fr));
  height: clamp(520px, 44vw, 700px);
  border: 0;
  border-top: 1px solid var(--line-strong);
  border-radius: 0;
  background: none;
}
.agenda-calendar .weekday { place-items: center start; padding: 0 12px; border: 0; background: none; color: var(--muted); font-size: 13px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.agenda-calendar :is(.calendar-day, .calendar-blank) { gap: 3px; padding: 10px 0 8px; border-right: 0; border-bottom: 0; border-top: 1px solid var(--line); color: var(--ink); font-size: 13px; }
.agenda-calendar .calendar-blank { background: none; }
.agenda-calendar .calendar-date-number { min-height: 30px; padding: 0 12px; font-size: 20px; font-weight: 300; line-height: 30px; letter-spacing: -0.01em; }
.agenda-calendar .calendar-day.is-today .calendar-date-number { display: inline-grid; place-items: center; width: 34px; min-width: 34px; height: 30px; margin-left: 5px; padding: 0; border-radius: 999px; background: #3d1826; color: var(--cream); }
.agenda-calendar .month-grid .calendar-day.has-events:is(:hover, :focus-visible, :active) { background: #efe6d8; }
.agenda-calendar .month-grid .calendar-day.is-selected { background: #ece2d3; box-shadow: inset 0 3px 0 #3d1826; }
.agenda-calendar .calendar-day:focus-visible { outline: 2px solid var(--wine); outline-offset: -2px; }
.agenda-calendar .calendar-event-label {
  min-height: 24px;
  margin: 0 6px;
  padding: 4px 8px;
  border-radius: 6px;
  background: var(--agenda-accent);
  color: var(--agenda-ink);
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* A multi-day event runs on as one bar and is named where it starts. */
.agenda-calendar .calendar-event-label.from-prev { margin-left: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; color: transparent; }
.agenda-calendar .calendar-event-label.to-next { margin-right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.agenda-calendar .calendar-event-more { padding: 0 12px; color: var(--muted); font-size: 12px; }

/* The list heading and month groups. */
/* Title, count and «Filter zurücksetzen» share one baseline; aligned at the
   bottom, the reset link's 44px touch area lifted its text above the count. */
.agenda-calendar .event-list-heading { align-items: baseline; margin: clamp(48px, 5vw, 80px) 0 24px; padding-top: 0; border-top: 0; }
.agenda-calendar .event-list-heading .eyebrow { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.agenda-calendar [data-event-period-title] { font-size: clamp(30px, 2.8vw, 44px); font-weight: 300; letter-spacing: -0.025em; }
.agenda-calendar .event-list-heading .results-count { color: var(--muted); font-size: 14px; }
.agenda-calendar .agenda-month-group + .agenda-month-group { margin-top: 48px; }
.agenda-calendar .agenda-month-label { margin: 0 0 4px; color: var(--ink); font-size: clamp(22px, 1.8vw, 28px); font-weight: 300; letter-spacing: -0.015em; text-transform: none; }
.agenda-calendar .agenda-month-label::after { content: none; }

/* Events: a programme listing on hairlines. */
.agenda-calendar .agenda-month-events { grid-template-columns: minmax(0, 1fr); gap: 0; border-top: 1px solid var(--line-strong); }
.agenda-calendar .event-row {
  grid-template-columns: 88px minmax(0, 1fr) 48px;
  gap: 8px 28px;
  padding: 28px 0;
  border: 0;
  border-bottom: 1px solid var(--line-strong);
  border-radius: 0;
  background: none;
}
.agenda-calendar .event-row:focus-within { border-color: var(--line-strong); }
.agenda-calendar .event-date { width: 88px; min-width: 88px; min-height: 88px; padding: 10px 6px; border-radius: 20px; background: var(--agenda-accent); color: var(--agenda-ink); }
.agenda-calendar .event-date time { font-size: 38px; font-weight: 300; letter-spacing: -0.03em; }
.agenda-calendar .event-date-day { font-weight: 300; }
.agenda-calendar .event-date-month { margin-top: 6px; font-size: 13px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.agenda-calendar .event-description .card-meta { margin-bottom: 8px; }
.agenda-calendar .event-description .tag { color: var(--muted); font-size: 14px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.agenda-calendar .event-description .tag::before { content: ''; display: inline-block; width: 9px; height: 9px; margin-right: 8px; border-radius: 50%; background: var(--agenda-accent); vertical-align: 0.05em; }
.agenda-calendar .event-description h3 { margin-bottom: 8px; font-size: clamp(24px, 2vw, 30px); font-weight: 300; line-height: 1.15; letter-spacing: -0.02em; overflow-wrap: break-word; }
.agenda-calendar .event-description h3 a { color: var(--ink); text-decoration: none; }
.agenda-calendar .event-description h3 a:is(:hover, :focus-visible) { color: var(--wine); }
.agenda-calendar .event-meta { gap: 6px 20px; margin-top: 4px; color: var(--muted); font-size: 15px; }
.agenda-calendar .event-meta svg { width: 15px; height: 15px; margin-top: 3px; }
.agenda-calendar .event-details { margin-top: 0; }
.agenda-calendar .event-details > summary { margin-left: 116px; max-width: calc(100% - 116px); color: var(--wine); font-size: 14px; font-weight: 500; }
.agenda-calendar .event-details > .rich-text { margin-left: 116px; max-width: 72ch; font-size: 15px; border-top-color: var(--line); }
.agenda-calendar .event-link { width: 48px; height: 48px; margin-top: 20px; border-color: var(--line-strong); background: transparent; }
.agenda-calendar .event-link:is(:hover, :focus-visible) { border-color: #3d1826; background: #3d1826; }
.agenda-calendar .agenda-pagination { margin-top: 40px; }

@media (hover: hover) and (pointer: fine) {
  .agenda-calendar :is(.agenda-view-switch, .agenda-period-controls) > button:not([aria-pressed='true']):hover { background: #e3d6c3; border-color: transparent; color: var(--ink); }
  :is(.agenda-calendar, .prizes-list) .agenda-categories > button:not([aria-pressed='true']):hover,
  .agenda-calendar .calendar-controls > button:not(:disabled):hover { background: #ece2d3; border-color: var(--line-strong); color: var(--ink); }
  .agenda-calendar .event-row:has(a[href], details):hover { border-color: var(--line-strong); }
}

/* Tablets: a slightly shorter grid, bars without names beyond the start. */
@media (max-width: 1050px) {
  .agenda-calendar .month-grid { height: clamp(460px, 62vw, 600px); }
  .agenda-calendar .calendar-date-number { padding: 0 8px; font-size: 17px; }
  .agenda-calendar .calendar-event-label { margin: 0 4px; padding: 3px 6px; font-size: 11px; }
  .agenda-calendar .weekday { padding: 0 8px; }
}
@media (max-width: 900px) and (min-width: 680px) {
  .agenda-calendar .event-row { grid-template-columns: 72px minmax(0, 1fr) 48px; gap: 8px 20px; padding: 24px 0; }
  .agenda-calendar .event-date { width: 72px; min-width: 72px; min-height: 76px; }
  .agenda-calendar .event-date time { font-size: 32px; }
  .agenda-calendar .event-details > summary, .agenda-calendar .event-details > .rich-text { margin-left: 92px; max-width: calc(100% - 92px); }
}
/* Phones: the list only, compact date fields, actions on one line. */
@media (max-width: 679px) {
  .agenda-calendar .agenda-header { padding-bottom: 20px; margin-bottom: 8px; }
  .agenda-calendar [data-calendar-title] { font-size: clamp(34px, 10vw, 44px); }
  :is(.agenda-calendar, .prizes-list) .agenda-categories > button { padding-inline: 14px; }
  .agenda-calendar .event-list-heading { margin: 28px 0 18px; }
  .agenda-calendar .agenda-period-controls { border-radius: 999px; }
  .agenda-calendar .agenda-period-controls > button { border-radius: 999px; font-size: 13px; }
  .agenda-calendar .agenda-month-group + .agenda-month-group { margin-top: 36px; }
  .agenda-calendar .event-row,
  .agenda-calendar .event-row:has(.event-details) { grid-template-columns: 64px minmax(0, 1fr); gap: 6px 16px; padding: 22px 0; border-radius: 0; }
  .agenda-calendar .event-date { width: 64px; min-width: 64px; min-height: 68px; border-radius: 16px; }
  .agenda-calendar .event-date time { font-size: 28px; }
  .agenda-calendar .event-date-month { font-size: 12px; }
  .agenda-calendar .event-description h3 { font-size: 22px; }
  .agenda-calendar .event-meta { font-size: 14px; }
  .agenda-calendar .event-details > summary { margin-left: 80px; max-width: calc(100% - 80px - 60px); }
  .agenda-calendar .event-details > .rich-text { margin-left: 0; }
  .agenda-calendar .event-row:has(.event-link) .event-details > summary { max-width: calc(100% - 80px - 60px); }
  .agenda-calendar .event-row .event-link,
  .agenda-calendar .event-row:has(.event-details) .event-link { grid-column: 2; grid-row: 2; justify-self: end; width: 44px; height: 44px; margin-top: -4px; }
}
/* Date fields use the palette everywhere events are listed (Agenda, Preise). */
.event-row { --agenda-accent: #3d1826; --agenda-ink: var(--cream); }
.event-row[data-category='concert'] { --agenda-accent: #8c4a55; --agenda-ink: var(--cream); }
.event-row[data-category='masterclass'] { --agenda-accent: #bfae98; --agenda-ink: var(--ink); }
.event-row[data-category='workshop'] { --agenda-accent: #57283a; --agenda-ink: var(--cream); }
.event-row[data-category='other'] { --agenda-accent: #d8c8b2; --agenda-ink: var(--ink); }
.event-row[data-category] .event-date { background: var(--agenda-accent); color: var(--agenda-ink); }
/* The name of a multi-day event runs on along its own bar. */
.agenda-calendar .calendar-day:has(.calendar-event-label.to-next) { overflow: visible; }
.agenda-calendar .calendar-event-label.to-next:not(.from-prev) { position: relative; z-index: 1; overflow: visible; text-overflow: clip; }
/* The calendar's own title names the view; the section heading above it
   stays for screen readers only, so two large headings never stack. */
.page-section:has(> .agenda-calendar) > .section-heading h2,
.page-section:has(.agenda-calendar) > .section-heading h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.agenda-calendar .event-details > .rich-text { margin-left: 0; max-width: none; }

/* ==========================================================================
   Agenda · calendar as colour fields (chosen option C3)
   Every day is a soft sand field; a day with events becomes a colour field in
   its category (Wettbewerb plum, Konzert dusky rose, Meisterkurs taupe) with
   a large day number and the event's name. Full width, medium height.
   ========================================================================== */
.agenda-calendar [data-calendar-title] { font-size: clamp(34px, 3vw, 48px); }
.agenda-calendar .calendar-card { max-width: none; margin-top: 24px; }
.agenda-calendar .month-grid {
  grid-template-rows: 36px repeat(var(--calendar-weeks, 6), minmax(0, 1fr));
  gap: 4px;
  height: clamp(460px, 36vw, 560px);
  border: 0;
}
.agenda-calendar .weekday { place-items: center; padding: 0; color: var(--muted); font-size: 13px; }
.agenda-calendar :is(.calendar-day, .calendar-blank) {
  --day-field: #efe6d8;
  --day-ink: var(--ink);
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 2px;
  height: 100%;
  aspect-ratio: auto;
  padding: 8px 10px;
  overflow: hidden;
  border: 0;
  border-radius: 14px;
  background: var(--day-field);
  color: var(--day-ink);
}
.agenda-calendar .calendar-blank { background: transparent; }
.agenda-calendar .calendar-day.has-events:has(.calendar-event-label[data-category='competition']) { --day-field: #3d1826; --day-ink: var(--cream); }
.agenda-calendar .calendar-day.has-events:has(.calendar-event-label[data-category='concert']) { --day-field: #8c4a55; --day-ink: var(--cream); }
.agenda-calendar .calendar-day.has-events:has(.calendar-event-label[data-category='masterclass']) { --day-field: #bfae98; --day-ink: var(--ink); }
.agenda-calendar .calendar-day.has-events:has(.calendar-event-label[data-category='workshop']) { --day-field: #57283a; --day-ink: var(--cream); }
.agenda-calendar .calendar-day.has-events:has(.calendar-event-label[data-category='other']) { --day-field: #d8c8b2; --day-ink: var(--ink); }
.agenda-calendar .calendar-date-number { align-self: flex-start; min-height: 0; padding: 0; color: inherit; font-size: 15px; font-weight: 400; line-height: 1.4; }
.agenda-calendar .calendar-day.has-events .calendar-date-number,
.agenda-calendar .calendar-day:not(.is-today) .calendar-date-number::before { font-size: 22px; font-weight: 300; line-height: 1.2; }
/* The numbers of one week share a baseline: each number's line holds an
   empty strut as large as an event day's number (sized together with it
   below), so a small number stands on the same line as a large one. */
.agenda-calendar .calendar-day:not(.is-today) .calendar-date-number::before { content: ''; }
.agenda-calendar .calendar-day.is-today .calendar-date-number { display: inline-grid; place-items: center; width: auto; min-width: 30px; height: 30px; margin: -3px 0 0 -4px; padding: 0 6px; border-radius: 999px; background: var(--day-ink); color: var(--day-field); }
/* Today's pill keeps its number on the same baseline as the plain numbers
   beside it, which stand on the event days' baseline. */
.agenda-calendar .calendar-day.is-today:not(.has-events) .calendar-date-number { margin-top: -0.5px; }
.agenda-calendar .calendar-day.has-events.is-today .calendar-date-number { margin-top: -1.8px; }
/* Event names as plain text on the field, two lines at most. */
.agenda-calendar .calendar-event-label,
.agenda-calendar .calendar-event-label.from-prev,
.agenda-calendar .calendar-event-label.to-next,
.agenda-calendar .calendar-event-label.to-next:not(.from-prev) {
  position: static;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  align-self: stretch;
  width: auto;
  height: auto;
  min-height: 0;
  margin: 2px 0 0;
  padding: 0;
  overflow: hidden;
  border-radius: 0;
  background: none;
  color: inherit;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.3;
  white-space: normal;
  text-overflow: clip;
}
.agenda-calendar .calendar-day:has(.calendar-event-label + .calendar-event-label) .calendar-event-label { -webkit-line-clamp: 1; }
.agenda-calendar .calendar-event-more { margin-top: auto; padding: 0; color: inherit; opacity: 0.8; font-size: 11px; }
.agenda-calendar .month-grid .calendar-day.has-events { cursor: pointer; transition: filter var(--motion-quick) ease, box-shadow var(--motion-quick) ease; }
.agenda-calendar .month-grid .calendar-day.has-events:is(:hover, :focus-visible, :active) { background: var(--day-field); filter: brightness(1.08); }
.agenda-calendar .month-grid .calendar-day.is-selected { background: var(--day-field); box-shadow: inset 0 0 0 3px var(--day-ink); }
.agenda-calendar .calendar-day:focus-visible { outline: 2px solid var(--wine); outline-offset: 2px; }

/* Tablets: the same fields, smaller type. */
@media (max-width: 1050px) {
  .agenda-calendar .month-grid { height: clamp(420px, 58vw, 520px); gap: 3px; }
  .agenda-calendar :is(.calendar-day, .calendar-blank) { padding: 6px 7px; border-radius: 10px; }
  .agenda-calendar .calendar-day.has-events .calendar-date-number,
  .agenda-calendar .calendar-day:not(.is-today) .calendar-date-number::before { font-size: 18px; }
  .agenda-calendar .calendar-event-label, .agenda-calendar .calendar-event-label.to-next:not(.from-prev) { font-size: 11px; }
}
/* The whole calendar, controls included, fits the visible screen: the
   controls sit tighter and the grid takes the remaining height. */
.agenda-calendar .agenda-header { padding-bottom: 14px; }
:is(.agenda-calendar, .prizes-list) .agenda-categories { margin-bottom: 2px; }
.agenda-calendar .calendar-card { margin-top: 12px; }
.agenda-calendar .month-grid { height: clamp(320px, calc(100svh - var(--header) - 190px), 560px); grid-template-rows: 30px repeat(var(--calendar-weeks, 6), minmax(0, 1fr)); }
@media (max-width: 1050px) {
  .agenda-calendar .month-grid { height: clamp(320px, calc(100svh - var(--header) - 190px), 520px); }
}
@media (max-width: 899px) {
  .agenda-calendar .month-grid { height: clamp(320px, calc(100svh - var(--header) - 250px), 520px); }
}
.agenda-calendar .calendar-date-number { flex: none; }
@media (max-height: 820px) {
  .agenda-calendar .calendar-event-label, .agenda-calendar .calendar-event-label.to-next:not(.from-prev) { -webkit-line-clamp: 1; }
}
/* Breathing room: the calendar leaves a margin above and below it on screen. */
.agenda-calendar .month-grid { gap: 6px; height: clamp(320px, calc(100svh - var(--header) - 270px), 540px); }
@media (max-width: 1050px) { .agenda-calendar .month-grid { gap: 5px; height: clamp(320px, calc(100svh - var(--header) - 270px), 500px); } }
@media (max-width: 899px) { .agenda-calendar .month-grid { height: clamp(320px, calc(100svh - var(--header) - 330px), 500px); } }
/* Clicking a day scrolls to its events, clear of the fixed header. */
.agenda-calendar .event-list-heading { scroll-margin-top: calc(var(--header) + 28px); }
.responsive-picture {
  display: contents;
}

/* ==========================================================================
   Refinements · design audit, October 2026
   Corrections from a page-by-page review at phone, tablet, laptop and wide
   sizes. Each block names what it corrects; the layers above remain the
   structural base.
   ========================================================================== */

/* A separator in a title ("Classica · Composition · FreeSpace") stays at the
   end of its line, with the word before it; render.js marks it. */
.title-separator { white-space: nowrap; }

/* Buttons placed in the editor follow the site's primary action colour:
   wine, like every other button. Red stays an accent. */
.rich-text a.content-button { background: var(--wine); box-shadow: 0 8px 20px -10px #6a0f1c99; }
.rich-text a.content-button:is(:hover, :focus-visible) { background: var(--wine-deep); }

/* Subheadings inside a card or an opened programme belong to that card: wine
   and smaller than the card's own title, never grey and larger than it. */
.content-card:not(.has-image) .content-card-body > .rich-text :is(h3, h4),
.prize-content .rich-text :is(h3, h4) {
  margin: 18px 0 6px;
  color: var(--wine);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
}
.content-card:not(.has-image) .content-card-body > .rich-text > :is(h3, h4):first-child,
.prize-content .rich-text > :is(h3, h4):first-child { margin-top: 2px; }

/* An introduction with its own subheadings (Unterlagen on the competition
   page) uses the subheadings of the text panels: wine, not washed-out grey. */
.section-intro :is(h3, h4) { margin: 30px 0 8px; color: var(--wine); font-size: 22px; line-height: 1.25; letter-spacing: -0.01em; }
.section-intro > :is(h3, h4):first-child { margin-top: 0; }

/* Programmes name their kind the way the Agenda does: a dot in the category's
   colour (Konzert dusky rose, Meisterkurs taupe) before the word. Disciplines
   keep their quiet pills. */
.prize-card { --agenda-accent: #3d1826; }
.prize-card[data-category='concert'] { --agenda-accent: #8c4a55; }
.prize-card[data-category='masterclass'] { --agenda-accent: #bfae98; }
.prize-card[data-category='workshop'] { --agenda-accent: #57283a; }
.prize-card[data-category='other'] { --agenda-accent: #d8c8b2; }
.prize-card[data-category]:not([data-category='']) .card-meta .tag:first-child {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding-inline: 0 4px;
  border-color: transparent;
  background: none;
  color: var(--ink-soft);
}
.prize-card[data-category]:not([data-category='']) .card-meta .tag:first-child::before {
  content: '';
  width: 8px;
  height: 8px;
  flex: none;
  border-radius: 50%;
  background: var(--agenda-accent);
}

/* The list of all places opens like the Agenda's other options: a quiet label
   with a chevron instead of a framed native disclosure. */
.map-location-options > summary {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  padding: 7px 1px;
  border: 0;
  border-radius: 0;
  color: var(--muted);
  font-size: 14px;
  font-weight: 600;
  list-style: none;
}
.map-location-options > summary::-webkit-details-marker { display: none; }
.map-location-options > summary::after { content: ''; width: 6px; height: 6px; margin: -3px 3px 0; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg); }
.map-location-options[open] > summary { color: var(--wine); }
.map-location-options[open] > summary::after { margin-top: 3px; transform: rotate(225deg); }
.map-location-options .map-locations { margin-top: 8px; }

/* A full-width story field carries a title of its width, like the other
   wide fields, instead of a small title in a large empty field. */
@media (min-width: 761px) {
  .news-story:not(.is-lead):nth-child(10n + 1) h3 { max-width: 30ch; font-size: clamp(32px, 2.8vw, 44px); }
}

/* The closing line of the footer (copyright, privacy, imprint) is legible. */
.footer-bottom { font-size: 13px; }
.footer-link svg { width: 13px; height: 13px; }

/* Venue and jury filters: the grid below already shows the result, so the
   bare count at the far end of the row ("9", "8") stays for screen readers
   only, where it announces each change. */
.filter-row > [data-filter-count] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* Venues in one row share one height, with their links along the bottom.
   Jury cards open in place, so they keep their own heights. */
.people-grid:has(> .venue-card) { align-items: stretch; }
.venue-card > div { display: flex; flex-direction: column; min-width: 0; }
.venue-card .venue-actions { margin-top: auto; padding-top: 19px; }

/* Phones: the competition page's section strip reads at a legible size, and
   a soft fade at its right edge shows that it scrolls sideways. */
@media (max-width: 760px) {
  .page-sidebar nav > a:not(.button) { font-size: 14px; }
  .page-sidebar nav {
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 32px), transparent);
    mask-image: linear-gradient(90deg, #000 calc(100% - 32px), transparent);
  }
}
/* Round 3 · sections · section bar on phones: it stays right under the
   header while the page scrolls, on the page colour with a hairline below,
   so the content passes under it cleanly; links to a section land below it.
   site.js keeps the marked entry in view. */
@media (max-width: 760px) {
  :root { --page-bar: 55px; }
  html:has(.page-sidebar) { scroll-padding-top: calc(var(--header) + var(--page-bar) + var(--anchor-gap)); }
  .page-sidebar {
    position: sticky;
    top: var(--page-bar-top, var(--header));
    z-index: 40;
    background: var(--paper);
    border-bottom: 1px solid var(--line);
  }
  .page-sidebar nav { border-bottom: 0; background: none; }
  .page-sidebar nav[data-scrolled] {
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 20px, #000 calc(100% - 32px), transparent);
    mask-image: linear-gradient(90deg, transparent, #000 20px, #000 calc(100% - 32px), transparent);
  }
  .page-sidebar nav > a:not(.button) { height: calc(var(--page-bar) - 1px); padding-block: 0; }
}

/* Two-column text keeps each group of a heading together where the browser
   allows it: a closing line (the dates under Entrada and Finale) never opens
   the next column away from the paragraph it completes. */
@media (min-width: 1100px) {
  .text-panel:has(:is(h2, h3)) :is(p, ul, ol) + :is(p, ul, ol) { break-before: avoid; }
}

/* Photo albums: the heading stands beside the albums, so the albums use the
   width of the page instead of leaving its right half empty. Phones and
   tablets keep the stacked list. */
@media (min-width: 1051px) {
  .page-section:has(> .collection-gallery) {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    column-gap: clamp(48px, 6vw, 112px);
    align-items: start;
  }
  .page-section:has(> .collection-gallery) > :is(.section-heading, .section-intro) { grid-column: 1; }
  .page-section:has(> .collection-gallery) > .collection-gallery { grid-column: 2; grid-row: 1 / span 2; }
  .page-section:has(> .collection-gallery) .gallery-list { max-width: none; }
}

/* "Über uns" directory: from Stiftungsrat to Kontakt, every group reads like
   the credits of a programme booklet. Downloads lie on hairlines like the
   names above them instead of in a box, and the contact text stays one
   column, so its last link no longer stands alone beside the address.
   On wide screens each group is one row: its name in a first column, its
   entries beside it, both starting on the same hairline; a single entry
   (Ehrenpräsident, Ehrentafel) becomes one compact row. The entries keep the
   number of columns chosen in the editor. Groups of photo cards keep the
   heading above them. */
.page-about .page-sections > .page-section.section-links .document-list {
  padding: 0;
  border: 0;
  border-top: 1px solid var(--line-strong);
  border-radius: 0;
  background: none;
  box-shadow: none;
}
.page-about .page-sections > .page-section.section-text > .text-panel,
.page-about .page-sections > .page-section.section-text > .text-panel > .rich-text { columns: auto; }
.page-about .page-sections > .page-section.section-text > .text-panel > * { max-width: 64ch; }
@media (min-width: 1280px) {
  .page-about .page-sections > .page-section:is(.section-cards:not(:has(.content-card.has-image)), .section-links, .section-text) {
    --story-gap: clamp(28px, 3.4vw, 48px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
    column-gap: var(--story-gap);
    align-items: start;
  }
  .page-about .page-sections > .page-section:is(.section-cards:not(:has(.content-card.has-image)), .section-links, .section-text) > .section-heading {
    grid-column: 1;
    margin: 0;
    padding-top: 18px !important;
    border-top: 1px solid var(--line-strong) !important;
  }
  .page-about .page-sections > .page-section:is(.section-cards:not(:has(.content-card.has-image)), .section-links, .section-text) > .section-heading h2 { font-size: clamp(26px, 2.2vw, 34px); line-height: 1.1; }
  .page-about .page-sections > .page-section:is(.section-cards:not(:has(.content-card.has-image)), .section-links, .section-text) > :not(.section-heading) { grid-column: 2; }
  .page-about .page-sections > .page-section.section-cards:not(:has(.content-card.has-image)) .content-grid { column-gap: var(--story-gap); }
  .page-about .page-sections > .page-section:is(.section-cards, .section-links, .section-text) + .page-section:is(.section-cards:not(:has(.content-card.has-image)), .section-links, .section-text) { padding-top: clamp(48px, 4.4vw, 72px); }
  .page-about .page-sections > .page-section.section-text > .text-panel {
    padding-top: 20px !important;
    border-top: 1px solid var(--line-strong) !important;
  }
}

/* Privacy and imprint read like a printed notice: each section is one row on
   a hairline, its title in the margin and the text beside it at a reading
   measure. Phones keep the stacked sections with the same calmer titles. */
:is(.page-legal, .page-privacy) .section-heading h2 { font-size: clamp(26px, 2.2vw, 34px); line-height: 1.15; letter-spacing: -0.02em; }
@media (min-width: 1101px) {
  :is(.page-legal, .page-privacy) .page-sections > .page-section.page-section {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    column-gap: clamp(48px, 6vw, 112px);
    align-items: start;
    margin-top: clamp(44px, 4.4vw, 72px);
    padding-top: 24px;
    border-top: 1px solid var(--line-strong);
  }
  :is(.page-legal, .page-privacy) .page-sections > .page-section:first-child { margin-top: clamp(56px, 6vw, 96px); }
  :is(.page-legal, .page-privacy) .page-sections > .page-section > .section-heading { grid-column: 1; margin: 0; }
  :is(.page-legal, .page-privacy) .page-sections > .page-section > :not(.section-heading) { grid-column: 2; max-width: 68ch; }
}

/* Story and event pages sit on the site's grid. Wide screens set the title
   beside its facts and text, both on one hairline, so a short story fills the
   page like a programme leaflet instead of a narrow column in its middle. */
.detail-main { width: auto; max-width: none; margin: 0; padding: clamp(28px, 3.4vw, 48px) var(--inline) clamp(80px, 9vw, 140px); }
.detail-content > :first-child { margin-top: 0; }
.detail-content > .detail-facts + .detail-summary { margin-top: 22px; }
.detail-body :is(h2, h3, h4) { margin: 30px 0 10px; color: var(--wine); font-size: 22px; font-weight: 600; line-height: 1.25; letter-spacing: -0.01em; }
.detail-body > :is(h2, h3, h4):first-child { margin-top: 0; }
@media (min-width: 1051px) {
  .detail-main > article {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    column-gap: clamp(48px, 6vw, 112px);
    align-items: start;
  }
  .detail-back { grid-column: 1 / -1; justify-self: start; margin-bottom: clamp(28px, 3vw, 44px); }
  .detail-heading { grid-column: 1; max-width: none; }
  .detail-content { grid-column: 2; min-width: 0; }
  .detail-heading, .detail-content { padding-top: 24px; border-top: 1px solid var(--line-strong); }
  /* The title column fits its longest words whole ("Jugendmusikwettbewerb"):
     titles wrap between words and are never hyphenated. */
  .detail-heading h1 { font-size: clamp(34px, 3.3vw, 54px); line-height: 1.06; text-wrap: wrap; text-wrap: pretty; hyphens: manual; -webkit-hyphens: manual; }
  .detail-content .detail-body { max-width: 68ch; }
}
@media (max-width: 1050px) {
  .detail-content { margin-top: 26px; }
}
@media (max-width: 760px) {
  .detail-main { padding-block: 26px 56px; }
}

/* Phones: headings wrap word by word at a size that suits the screen. A long
   compound with a gender colon breaks after the colon ("Kooperationspartner:"
   / "innen"), never between two random letters. Balanced wrapping is left to
   wider screens: on a phone it narrows the line until it splits such a word,
   and automatic hyphenation would split ordinary words that could simply
   move to the next line. */
@media (max-width: 760px) {
  .section-heading h2, .detail-heading h1 {
    text-wrap: wrap;
    text-wrap: pretty;
    hyphens: manual;
    -webkit-hyphens: manual;
  }
  .section-heading h2 { font-size: clamp(28px, 8.6vw, 34px); }
  /* Story and event titles are free text. Their size lets the longest words
     ("Jugendmusikwettbewerb") fit a line whole from 320px; only a word longer
     still is broken, as a last resort. */
  .detail-heading h1 { font-size: clamp(26px, 8.2vw, 36px); line-height: 1.08; }
  .page-partners #purpose .text-panel p:first-child { font-size: 19px; line-height: 1.55; }
}

/* A dialog's photo carries its credit like the card it opens from: a small
   pill at the lower right of the photograph. */
.dialog-media > .dialog-credit {
  position: absolute;
  right: 14px;
  bottom: 12px;
  max-width: calc(100% - 28px);
  margin: 0;
  padding: 3px 9px;
  border-radius: 999px;
  background: #1a0d0b59;
  color: #fff;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.5;
  overflow-wrap: anywhere;
}


/* Archive of the previous website ------------------------------------------- */

/* Jury: portrait cards in the editor's chosen number of columns (1-3, see
   the collection rules above). A profile opens in a dialog (site.js); without
   JavaScript the card expands across the row. */
.people-grid.is-jury {
  gap: 14px;
  align-items: stretch;
}
.people-grid.is-jury > .person-card > .person-summary {
  flex-wrap: nowrap;
  align-items: center;
  gap: 16px;
  height: 100%;
  padding: 14px 18px 14px 14px;
}
.people-grid.is-jury .person-portrait,
.people-grid.is-jury .person-monogram {
  width: 84px;
  height: 84px;
  min-width: 0;
  min-height: 0;
  flex: none;
  border-radius: 12px;
}
.people-grid.is-jury .person-monogram { font-size: 26px; }
.people-grid.is-jury .person-heading { gap: 3px; }
.people-grid.is-jury .person-heading strong { font-size: 16px; line-height: 1.25; }
.people-grid.is-jury .person-heading > .person-role { font-size: 13px; line-height: 1.4; color: var(--muted); }
.person-dialog-content {
  display: grid;
  grid-template-columns: minmax(0, 190px) minmax(0, 1fr);
  gap: 30px;
  align-items: start;
}
.person-dialog-portrait:empty { display: none; }
.person-dialog-portrait :is(img, span) {
  display: grid;
  place-items: center;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  border-radius: 14px;
  object-fit: cover;
}
.person-dialog-portrait .person-monogram { font-size: 44px; }
.person-dialog-text h2 { margin: 0; }
.person-dialog-role { margin: 6px 0 18px; color: var(--muted); }
@media (max-width: 640px) {
  .person-dialog-content { grid-template-columns: 1fr; gap: 18px; }
  .person-dialog-portrait { max-width: 150px; }
}

/* Advertisers: their complete adverts from the programme booklet, which open
   full size in the photo viewer. Three per row on wide screens, two on
   tablets, one on phones, where each advert is wide enough to read. In rows
   every frame has the proportions of a booklet page, so frames and captions
   line up and an advert in landscape format sits centred in its frame; on
   phones each frame takes its advert's own proportions. Names as in the
   other modules. (No «ad» in these names: content blockers hide such
   elements on every website, see partnerPrints in server/render.js.) */
.partner-prints {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(28px, 2.6vw, 40px) clamp(18px, 2vw, 28px);
}
.partner-print {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
  margin: 0;
}
.partner-print-frame {
  display: block;
  width: 100%;
  aspect-ratio: 707 / 1000;
  padding: 0;
  overflow: hidden;
  border: 1px solid #2b18100f;
  border-radius: var(--radius-small);
  background: #fff;
  box-shadow: var(--shadow-soft);
  cursor: zoom-in;
}
.partner-print-frame .image-placement.image-placement {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.partner-print-frame:focus-visible { outline: 2px solid var(--wine); outline-offset: 3px; }
.partner-print figcaption { display: grid; justify-items: start; gap: 6px; }
.partner-print-name { color: var(--ink); font-size: 17px; font-weight: 600; line-height: 1.35; letter-spacing: -0.005em; }
.partner-print figcaption .text-link { font-size: 14px; font-weight: 600; }
@media (hover: hover) and (pointer: fine) {
  .partner-print-frame:hover { box-shadow: var(--shadow-lift); }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .partner-print-frame { transition: box-shadow var(--motion-response) ease, transform var(--motion-response) var(--motion-ease); }
  .partner-print-frame:hover { transform: translateY(-3px); }
}
@media (max-width: 1050px) {
  .partner-prints { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .partner-print-name { font-size: 16px; }
}
@media (max-width: 599px) {
  .partner-prints { grid-template-columns: minmax(0, 1fr); }
  .partner-print-frame { aspect-ratio: auto; }
  .partner-print-frame .image-placement.image-placement { height: auto; }
}


/* Phones: compact rows keep all profiles quick to scan; the whole row opens
   the profile. */
@media (max-width: 560px) {
  .people-grid.is-jury { gap: 8px; }
  .people-grid.is-jury > .person-card { position: relative; }
  .people-grid.is-jury > .person-card > .person-summary { gap: 12px; padding: 8px 46px 8px 8px; }
  .people-grid.is-jury .person-portrait,
  .people-grid.is-jury .person-monogram { width: 56px; height: 56px; border-radius: 9px; }
  .people-grid.is-jury .person-monogram { font-size: 19px; }
  .people-grid.is-jury .person-heading { gap: 1px; }
  .people-grid.is-jury .person-heading strong { font-size: 15px; }
}

/* ==========================================================================
   Round 1 · client review, October 2026
   The project lead's notes ("Anmerkungen Homepage Round 1"), applied as the
   last layer so they settle the earlier refinements: a larger header, the
   homepage's dates and stories, information panels in the language of the
   document rows, the topics and people of "Über uns", venues by phase, the
   calendar in strong colours, special prizes, story pages, partners, media
   and a footer in three columns.
   ========================================================================== */

/* Event types: one strong colour each (red, blue, yellow, green, sand),
   shared by the calendar fields, its filter buttons and every type label. */
:root {
  --type-competition: #a8172d;
  --type-concert: #2b5d91;
  --type-masterclass: #e3a52c;
  --type-scholarship: #3b7c5c;
  --type-other: #cbbda4;
  --check-mask: url('/static/art/mask-check-v1.png');
  --download-mask: url('/static/art/mask-download-v1.png');
  --external-mask: url('/static/art/mask-external-v1.png');
  --arrow-mask: url('/static/art/mask-arrow-v1.png');
}
:is([data-category='competition'], [data-color='competition']) { --type: var(--type-competition); --type-ink: #fffcf6; }
:is([data-category='concert'], [data-color='concert']) { --type: var(--type-concert); --type-ink: #fffcf6; }
:is([data-category='masterclass'], [data-color='masterclass']) { --type: var(--type-masterclass); --type-ink: #2b1b06; }
:is([data-category='scholarship'], [data-color='scholarship']) { --type: var(--type-scholarship); --type-ink: #fffcf6; }
:is([data-category='other'], [data-color='other']) { --type: var(--type-other); --type-ink: #221816; }
.event-type {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--type, var(--wine));
  color: var(--type-ink, #fffcf6);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
/* Disciplines beside the type: a quiet outlined pill. */
:is(.upcoming-card, .prize-card) .card-meta .tag {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: none;
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
}
/* One line of facts with a symbol each: time, town, building. */
.event-meta > span,
.prize-places > span { display: flex; align-items: flex-start; gap: 9px; min-width: 0; }
.event-meta svg,
.prize-places svg { flex: none; width: 16px; height: 16px; margin-top: 0.12em; color: var(--wine); }

/* --------------------------------------------------------------------------
   Header at about 140 %: a taller bar, a larger name, bold page names whose
   red rule sits directly under the word, and larger controls.
   -------------------------------------------------------------------------- */
.primary-nav a { color: var(--ink); font-weight: 600; }
.primary-nav a:hover { color: var(--wine); }
.primary-nav a[aria-current] { color: var(--wine); font-weight: 600; }
.primary-nav a::after { content: none; }
.primary-nav a > .control-label::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.42em;
  height: 3px;
  border-radius: 2px;
  background: var(--red);
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 560ms cubic-bezier(0.65, 0, 0.35, 1);
}
.primary-nav a:is(:hover, :focus-visible) > .control-label::after { transform: scaleX(1); transform-origin: left center; }
.primary-nav a[aria-current] > .control-label::after { transform: scaleX(1); }
/* Between pages, the page being left keeps its mark for a moment and the new
   page starts without one. Released by site/navigation.js, the old rule
   leaves toward the right as its colour fades, and the new one glides in
   from the left. A link already drawn by the pointer or keyboard keeps its
   rule. */
.primary-nav a[data-nav-leaving] { color: var(--wine); }
.primary-nav a[data-nav-arriving] { color: var(--ink); }
.primary-nav a[data-nav-leaving] > .control-label::after { transform: scaleX(1); }
.primary-nav a[data-nav-arriving] > .control-label::after { transform: scaleX(0); }
.primary-nav a[aria-current] > .control-label::after { transform-origin: left center; }
@media (prefers-reduced-motion: reduce) {
  .primary-nav a > .control-label::after { transform: none; opacity: 0; transition: opacity 300ms ease; }
  .primary-nav a:is(:hover, :focus-visible, [aria-current]) > .control-label::after { opacity: 1; }
}
@media (min-width: 1181px) {
  :root { --header: 104px; }
  .site-header { gap: clamp(18px, 1.6vw, 36px); }
  /* About 120 % of the former size on a 1440px laptop, 140 % from 1680px. */
  .primary-nav { gap: clamp(13px, calc(2.6vw - 23px), 30px); font-size: clamp(15px, 1.25vw, 21px); }
  /* French names and "Faire un don" are longer: a slightly smaller size keeps
     every control inside the margins. */
  .primary-nav:lang(fr) { font-size: clamp(15px, 1.18vw, 20px); }
  .header-actions { gap: clamp(10px, 1.1vw, 20px); }
  /* Whole pixel sizes (where round() exists) and one line height for both
     pills: with a fractional size, Chromium set «Spenden» up to 1.2px above
     the pill's centre, and «DE» sat 1.2px low at 15px with line height 1. */
  .header-support { gap: 10px; min-height: 52px; padding: 12px 22px; font-size: clamp(15px, 1.12vw, 18px); font-size: round(clamp(15px, 1.12vw, 18px), 1px); line-height: 1.25; }
  .header-support svg { width: 20px; height: 20px; }
  .language-trigger { gap: 9px; min-width: 96px; min-height: 52px; padding: 0 12px; font-size: clamp(15px, 1.12vw, 18px); font-size: round(clamp(15px, 1.12vw, 18px), 1px); line-height: 1.25; }
  .language-trigger > svg { width: 20px; height: 20px; }
  .language-trigger > .language-chevron { width: 13px; height: 13px; }
  .languages a { font-size: 15px; }
}
@media (min-width: 1440px) { :root { --header: 110px; } .brand-logo { width: 160px; height: 60px; } }
@media (min-width: 1600px) {
  :root { --header: 118px; }
  .brand-logo { width: 176px; height: 66px; }
  .header-support, .language-trigger { min-height: 56px; }
}
@media (max-width: 760px) { .brand-logo { width: 107px; height: 40px; } }

/* --------------------------------------------------------------------------
   Homepage: the banner, a little taller than on the other pages, the next
   dates and the latest stories as four cards each. The cards of a row share
   their lines (subgrid): labels, dates, titles, places and links stand
   level, and every card has the height of the row.
   -------------------------------------------------------------------------- */
.hero.hero-front h1 { max-width: 16ch; font-size: clamp(38px, 3.9vw, 72px); line-height: 1.03; }
.hero.hero-front .hero-description { max-width: 46ch; margin: 14px 0 0; color: #fffcf6e6; font-size: clamp(17px, 1.3vw, 21px); line-height: 1.45; }
.hero.hero-front .hero-content > .button { margin-top: 24px; }
/* Round 3 · brand · answer 11: the full name in the page's language opens the
   heading in semibold, about three fifths of the title's size and close above
   it: near the client's mock-up, where the name is almost as large as the
   title, while the title stays the largest line. The banner is about 18 % taller than the other pages'
   banners at every width (each of their height values × 1.18) to give the
   name room, but no taller than the screen on a phone held sideways. */
.hero.hero-front { min-height: clamp(min(448px, 100svh), 64vh, max(755px, 26vw)); }
.hero.hero-front .hero-name { display: block; margin: 0 0 clamp(8px, 0.75vw, 14px); font-size: clamp(20px, 2.4vw, 42px); font-weight: 600; line-height: 1.12; letter-spacing: -0.01em; text-wrap: balance; hyphens: manual; -webkit-hyphens: manual; }
@media (max-width: 760px) {
  .hero.hero-front { min-height: clamp(min(400px, 100svh), 73vh, 566px); }
  .hero.hero-front .hero-name { font-size: 21px; }
}
.page-home #news.page-section.section-collection { margin-top: 0; padding-bottom: 0; background: none; box-shadow: none; clip-path: none; }
.section-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: clamp(28px, 2.8vw, 40px); }
.upcoming-grid,
.news-latest {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(16px, 1.6vw, 24px);
  align-items: stretch;
}
.upcoming-card,
.news-latest .news-card {
  position: relative;
  display: grid;
  justify-items: start;
  min-width: 0;
  border: 1px solid #2b18100f;
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
  cursor: pointer;
  transition: box-shadow var(--motion-response) ease, transform var(--motion-response) var(--motion-ease);
}
.upcoming-card { grid-template-rows: auto auto auto 1fr auto; padding: 24px 24px 22px; }
.news-latest .news-card { grid-template-rows: minmax(0, 1fr); }
.news-latest .news-card-content { display: grid; grid-template-rows: auto auto 1fr auto; justify-items: start; width: 100%; padding: 24px 24px 22px; }
.upcoming-card > .card-meta { grid-row: 1; display: flex; flex-wrap: wrap; gap: 6px; min-height: 24px; margin: 0 0 18px; }
.upcoming-card > .upcoming-date { grid-row: 2; margin: 0 0 8px; color: var(--wine); font-size: 15px; font-weight: 600; line-height: 1.35; }
.upcoming-card > h3 { grid-row: 3; }
.upcoming-card > .event-meta { grid-row: 4; align-self: start; display: grid; gap: 7px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.4; }
.upcoming-card > .upcoming-more { grid-row: 5; }
.news-latest .news-card .news-card-meta {
  grid-row: 1;
  display: grid;
  grid-template-rows: minmax(24px, auto) auto;
  justify-items: start;
  row-gap: 18px;
  margin: 0 0 8px;
  color: var(--wine);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
  text-transform: none;
}
.news-latest .news-card-meta > time { grid-row: 2; color: inherit; letter-spacing: 0; }
.news-latest .news-card-meta > span {
  grid-row: 1;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
}
.news-latest .news-card-meta > * + *::before { content: none; }
.news-latest .news-card h3 { grid-row: 2; }
.news-latest .news-card-content > p:not(.news-card-meta) { grid-row: 3; align-self: start; }
.news-latest .news-card-more { grid-row: 4; }
.upcoming-card h3,
.news-latest .news-card h3 { margin: 0 0 14px; font-size: clamp(20px, 1.45vw, 24px); font-weight: 600; line-height: 1.2; letter-spacing: -0.015em; text-wrap: balance; overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; }
.upcoming-card h3 a,
.news-latest .news-card h3 a { color: var(--ink); text-decoration: none; }
.upcoming-card h3 a::after { content: ''; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.news-latest .news-card-content > p:not(.news-card-meta) { display: -webkit-box; margin: 0; overflow: hidden; color: var(--muted); font-size: 15px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.upcoming-more,
.news-latest .news-card-more { display: inline-flex; align-items: center; gap: 10px; padding-top: 22px; color: var(--wine); font-size: 15px; font-weight: 600; }
.upcoming-more svg,
.news-latest .news-card-more svg { box-sizing: content-box; width: 15px; height: 15px; padding: 7px; border-radius: 50%; background: var(--wine); color: #fffcf6; transition: transform var(--motion-response) var(--motion-ease); }
@supports (grid-template-rows: subgrid) {
  .upcoming-card { grid-row: span 5; grid-template-rows: subgrid; row-gap: 0; }
  .news-latest .news-card { grid-row: span 4; grid-template-rows: subgrid; row-gap: 0; }
  .news-latest .news-card-content { grid-row: 1 / -1; grid-template-rows: subgrid; row-gap: 0; }
}
@media (hover: hover) and (pointer: fine) {
  :is(.upcoming-card, .news-latest .news-card):hover { box-shadow: var(--shadow-lift); }
  :is(.upcoming-card, .news-latest .news-card):hover h3 a { color: var(--wine); }
  :is(.upcoming-card, .news-latest .news-card):hover :is(.upcoming-more, .news-card-more) svg { transform: translateX(3px); }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  :is(.upcoming-card, .news-latest .news-card):hover { transform: translateY(-3px); }
}
.upcoming-card:has(a:focus-visible) { outline: 2px solid var(--wine); outline-offset: 3px; }
@media (max-width: 1100px) {
  .upcoming-grid, .news-latest { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .upcoming-grid, .news-latest { grid-template-columns: minmax(0, 1fr); }
}


/* --------------------------------------------------------------------------
   Information panels ("Kästen"): one calm white surface with hairlines, a
   symbol, a title, its date or text, a note and a round action, like the
   document rows the client chose as reference. Columns and groups divide it.
   -------------------------------------------------------------------------- */
.link-panel {
  --panel-pad-x: clamp(20px, 2vw, 30px);
  --panel-pad-y: clamp(20px, 1.8vw, 26px);
  overflow: hidden;
  border: 1px solid #2b18100f;
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}
.panel-columns-1 { --panel-columns: 1; }
.panel-columns-2 { --panel-columns: 2; }
.panel-columns-3 { --panel-columns: 3; }
.panel-columns-4 { --panel-columns: 4; }
.panel-grid,
.panel-groups { display: grid; grid-template-columns: repeat(var(--panel-columns, 1), minmax(0, 1fr)); }
.panel-item {
  position: relative;
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: start;
  column-gap: 16px;
  min-width: 0;
  padding: var(--panel-pad-y) var(--panel-pad-x);
  box-shadow: 1px 0 0 var(--line), 0 1px 0 var(--line);
  transition: background-color var(--motion-quick) ease;
}
.panel-item:not(:has(> .panel-action)) { grid-template-columns: 46px minmax(0, 1fr); }
/* Round 3 · competition · point 24: a short last row («Anmeldung & Fristen»
   with its two fee cells) leaves its empty columns open, as in the client's
   example of such a grid: the hairline above runs across the panel, the one
   beside the last cell goes. In the last column that line lies on the
   panel's edge and is clipped anyway, so every panel can drop it. */
.panel-grid > .panel-item:last-child { box-shadow: 0 1px 0 var(--line); }
.panel-icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 12px; background: #6a0f1c10; color: var(--wine); }
.panel-icon svg { width: 22px; height: 22px; }
.panel-text { display: flex; flex-direction: column; min-width: 0; padding-top: 1px; }
.panel-title { margin: 0; color: var(--ink); font-size: 17px; font-weight: 600; line-height: 1.3; letter-spacing: -0.005em; overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; }
.panel-link { color: inherit; text-decoration: none; }
.panel-item.has-link { cursor: pointer; }
.panel-item.has-link .panel-link::after { content: ''; position: absolute; inset: 0; z-index: 1; }
.panel-body { order: 1; margin-top: 6px; color: var(--ink-soft); font-size: 16px; line-height: 1.55; }
.panel-body > * { margin: 0; }
.panel-body > * + * { margin-top: 6px; }
.panel-meta { order: 2; margin: 6px 0 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.panel-action.round-button { align-self: start; width: 42px; height: 42px; min-width: 42px; margin-top: 2px; }
.link-panel.is-rows .panel-action.round-button,
.panel-rows .panel-action.round-button { align-self: center; margin-top: 0; }
.panel-action svg { width: 17px; height: 17px; }
.link-panel.is-rows .panel-item { align-items: center; }
@media (hover: hover) and (pointer: fine) {
  .panel-item.has-link:hover { background: #6a0f1c06; }
  .panel-item.has-link:hover .panel-title { color: var(--wine); }
  .panel-item.has-link:hover .panel-action { border-color: var(--wine); background: var(--wine); color: #fffcf6; }
}
.panel-item.has-link:has(.panel-link:focus-visible) { outline: 2px solid var(--wine); outline-offset: -4px; border-radius: 16px; }
.panel-link:focus-visible { outline: none; }
/* Groups (Downloads): a column per group under its heading, compact rows. */
.panel-group { min-width: 0; padding: clamp(22px, 2vw, 30px) clamp(18px, 1.7vw, 26px) clamp(10px, 1vw, 16px); box-shadow: 1px 0 0 var(--line), 0 1px 0 var(--line); }
.panel-group-title { margin: 0 0 4px; padding-bottom: 12px; border-bottom: 2px solid var(--ink); color: var(--ink); font-size: clamp(20px, 1.6vw, 24px); font-weight: 300; line-height: 1.15; letter-spacing: -0.015em; }
.panel-rows .panel-item { grid-template-columns: 38px minmax(0, 1fr) auto; column-gap: 12px; align-items: center; padding: 14px 4px; box-shadow: 0 -1px 0 var(--line); }
.panel-rows .panel-item:not(:has(> .panel-action)) { grid-template-columns: 38px minmax(0, 1fr); }
.panel-rows .panel-item:first-child { box-shadow: none; }
.panel-rows .panel-icon { width: 38px; height: 38px; border-radius: 10px; }
.panel-rows .panel-icon svg { width: 18px; height: 18px; }
.panel-rows .panel-title { font-size: 16px; }
.panel-rows .panel-meta { margin-top: 2px; font-size: 13px; }
.panel-rows .panel-action.round-button { width: 36px; height: 36px; min-width: 36px; }
.panel-rows .panel-action svg { width: 15px; height: 15px; }
@media (hover: hover) and (pointer: fine) {
  .panel-rows .panel-item.has-link:hover { background: none; }
}
/* From 1101px the groups stand side by side (four columns, as the client
   asked) and share their rows (render.js names the row count): headings and
   entries of neighbouring columns stand level, also where one title needs a
   second line. In these narrow columns a title wraps line by line instead of
   being balanced, so a title whose words fit keeps them whole
   («Preisträgerkonzert / 2026»). Only long compounds are hyphenated, with at
   least five letters before the hyphen and six after it: they break at their
   joint («Preisträger-/konzert»), never one syllable before the end
   («Preisträgerkon-/zert»). */
@media (min-width: 1101px) {
  .panel-groups .panel-rows .panel-title { text-wrap: wrap; hyphenate-limit-chars: 10 5 6; -webkit-hyphenate-limit-before: 5; -webkit-hyphenate-limit-after: 6; }
}
@supports (grid-template-rows: subgrid) {
  @media (min-width: 1101px) {
    .panel-groups[class*='group-rows-'] > .panel-group { display: grid; grid-template-rows: subgrid; }
    .panel-groups[class*='group-rows-'] .panel-rows { display: contents; }
    .panel-groups[class*='group-rows-'] .panel-group-title { grid-row: 1; }
    .panel-groups[class*='group-rows-'] .panel-rows > .panel-item:first-child { grid-row-start: 2; }
    .panel-groups.group-rows-1 > .panel-group { grid-row: span 2; }
    .panel-groups.group-rows-2 > .panel-group { grid-row: span 3; }
    .panel-groups.group-rows-3 > .panel-group { grid-row: span 4; }
    .panel-groups.group-rows-4 > .panel-group { grid-row: span 5; }
    .panel-groups.group-rows-5 > .panel-group { grid-row: span 6; }
    .panel-groups.group-rows-6 > .panel-group { grid-row: span 7; }
    .panel-groups.group-rows-7 > .panel-group { grid-row: span 8; }
    .panel-groups.group-rows-8 > .panel-group { grid-row: span 9; }
  }
}
/* The section's text closes the panel as a note, with its download button. */
.panel-note { padding: clamp(18px, 1.8vw, 24px) var(--panel-pad-x); border-top: 1px solid var(--line); background: #f8f3eb; color: var(--muted); font-size: 15px; line-height: 1.6; }
.panel-note > * { max-width: 110ch; margin: 0; }
.panel-note > * + * { margin-top: 12px; }
/* A note or a meta line does not end on a lone word («lieu.», «2028»). The
   short meta of a download keeps its plain wrap: «SRF 2 Kultur · / Audio»
   rather than «SRF 2 / Kultur · Audio». */
.panel-note > p, .panel-meta { text-wrap: pretty; }
.panel-groups .panel-meta { text-wrap: wrap; }
.panel-note:has(a.content-button) { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 40px; }
.panel-note:has(a.content-button) > * { margin: 0; }
.panel-note:has(a.content-button) > :not(:has(a.content-button)) { flex: 1 1 420px; }
.panel-note > :has(> a.content-button:only-child) { flex: none; }
.rich-text.panel-note a.content-button { display: inline-flex; align-items: center; gap: 10px; min-height: 46px; margin: 0; padding: 11px 20px; font-size: 15px; }
.rich-text.panel-note a.content-button::before { content: ''; flex: none; width: 17px; height: 17px; background: currentColor; -webkit-mask: var(--download-mask) center / contain no-repeat; mask: var(--download-mask) center / contain no-repeat; }
/* Dates in "Anmeldung & Fristen" and the fees stand out. */
#registration .panel-body { color: var(--wine); font-size: 18px; font-weight: 600; line-height: 1.4; }
/* «Anmeldung & Fristen» (client review, Round 2): the cells share one size.
   Three stand side by side only where every title fits on one line, else
   two, also beside the page menu on a portrait tablet; on phones they stack
   at their own height. Symbols, titles and dates therefore start at the same
   height in every cell. */
.page-competition #registration .link-panel { container: registration-panel / inline-size; }
@container registration-panel (width >= 480px) {
  .page-competition #registration .panel-grid:not(.panel-columns-1) { --panel-columns: 2; grid-auto-rows: 1fr; }
}
@container registration-panel (width >= 990px) {
  .page-competition #registration .panel-grid:is(.panel-columns-3, .panel-columns-4) { --panel-columns: 3; }
}
@container registration-panel (width < 480px) {
  .page-competition #registration .panel-grid { --panel-columns: 1; }
}
/* Every date stands as far below its title, with or without a note. */
.page-competition #registration .panel-title ~ .panel-body { margin-top: 4px; }
/* Lists with a bold label per row (age categories): the labels form a first
   column as wide as the widest one, the text a second column beside it. */
.panel-body ul.panel-list { display: grid; grid-template-columns: max-content minmax(0, 1fr); column-gap: 14px; margin: 0; padding: 0; list-style: none; }
.panel-body .panel-list > li { display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; margin: 0; }
.panel-list > li > strong { color: var(--ink); font-weight: 600; }
/* Side by side, the lists share their rows: each category stands on one line
   across the columns, also where a longer text wraps (French durations). */
@media (min-width: 1101px) {
  .link-panel:not(.is-rows) .panel-grid.has-lists > .panel-item { grid-template-rows: subgrid; grid-template-areas: none; align-items: start; row-gap: 0; }
  .link-panel:not(.is-rows) .panel-grid.has-lists > .panel-item > .panel-icon { grid-area: auto; grid-row: 1; grid-column: 1; }
  .link-panel:not(.is-rows) .panel-grid.has-lists > .panel-item > .panel-action { grid-area: auto; grid-row: 1; grid-column: -2; }
  .link-panel:not(.is-rows) .panel-grid.has-lists > .panel-item > .panel-text { display: contents; }
  .link-panel:not(.is-rows) .panel-grid.has-lists .panel-title { grid-row: 2; grid-column: 1 / -1; margin: 18px 0 4px; }
  .link-panel:not(.is-rows) .panel-grid.has-lists .panel-body { display: grid; grid-row: 3 / -2; grid-column: 1 / -1; grid-template-rows: subgrid; margin: 0; }
  .link-panel:not(.is-rows) .panel-grid.has-lists .panel-body > .panel-list { grid-row: 1 / -1; grid-template-rows: subgrid; }
  .link-panel:not(.is-rows) .panel-grid.has-lists .panel-meta { grid-row: -2; grid-column: 1 / -1; }
  .panel-grid.list-rows-1 > .panel-item { grid-row: span 4; }
  .panel-grid.list-rows-2 > .panel-item { grid-row: span 5; }
  .panel-grid.list-rows-3 > .panel-item { grid-row: span 6; }
  .panel-grid.list-rows-4 > .panel-item { grid-row: span 7; }
  .panel-grid.list-rows-5 > .panel-item { grid-row: span 8; }
  .panel-grid.list-rows-6 > .panel-item { grid-row: span 9; }
  .panel-grid.list-rows-7 > .panel-item { grid-row: span 10; }
  .panel-grid.list-rows-8 > .panel-item { grid-row: span 11; }
}
@media (max-width: 1100px) {
  .panel-columns-3, .panel-columns-4 { --panel-columns: 2; }
}
@media (max-width: 640px) {
  .panel-columns-2, .panel-columns-3, .panel-columns-4 { --panel-columns: 1; }
  .panel-item { grid-template-columns: 40px minmax(0, 1fr) auto; column-gap: 14px; }
  .panel-item:not(:has(> .panel-action)) { grid-template-columns: 40px minmax(0, 1fr); }
  .panel-icon { width: 40px; height: 40px; border-radius: 11px; }
  .panel-icon svg { width: 19px; height: 19px; }
}

/* --------------------------------------------------------------------------
   Über uns: three topics side by side (client sketch). Each is a framed text
   with a counter; beneath it the topic names stand one per line, the open one
   marked in red on a fine rule; a click on a name opens its text. Since
   Round 3 (answer 12) the names alone lead through the topics; only topics
   without names keep arrows. Headings, frames and names share their rows
   across the three columns.
   -------------------------------------------------------------------------- */
.topics-row {
  --topics: 3;
  display: grid;
  grid-template-columns: repeat(var(--topics), minmax(0, 1fr));
  grid-template-rows: auto 1fr auto;
  column-gap: clamp(24px, 2.6vw, 44px);
  align-items: start;
}
.topics-count-1 { --topics: 1; }
.topics-count-2 { --topics: 2; }
.topics-count-4 { --topics: 4; }
.topics-row > .section-topics {
  display: grid;
  grid-row: span 3;
  grid-template-rows: subgrid;
  min-width: 0;
  margin: 0;
}
.section-topics .topic-carousel { display: contents; }
.topic-heading { grid-row: 1; align-self: end; margin: 0 0 22px; font-size: clamp(24px, 2vw, 32px); font-weight: 300; line-height: 1.12; letter-spacing: -0.02em; text-wrap: balance; }
.topic-frame {
  position: relative;
  grid-row: 2;
  align-self: stretch;
  display: grid;
  padding: clamp(24px, 2.2vw, 32px) clamp(22px, 2vw, 30px) 56px;
  border: 1px solid #2b18100f;
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}
.topic-slides { display: grid; min-width: 0; }
.topic-slide { min-width: 0; }
.topic-slide + .topic-slide { margin-top: 28px; }
.topic-carousel.is-enhanced .topic-slide { grid-area: 1 / 1; margin: 0; transition: opacity 320ms ease, visibility 0s linear 0s; }
.topic-carousel.is-enhanced .topic-slide:not(.is-active) { opacity: 0; visibility: hidden; transition: opacity 320ms ease, visibility 0s linear 320ms; }
.topic-image { margin: 0 0 18px; overflow: hidden; border-radius: 14px; }
.topic-image img { display: block; width: 100%; height: auto; }
.topic-slide-title { margin: 0 0 12px; color: var(--wine); font-size: 19px; font-weight: 600; line-height: 1.25; letter-spacing: -0.01em; }
.topic-slide .rich-text { color: var(--ink-soft); font-size: 16px; line-height: 1.65; }
.topic-slide .rich-text > * { margin: 0; }
.topic-slide .rich-text > * + * { margin-top: 12px; }
.topic-counter { position: absolute; right: clamp(22px, 2vw, 30px); bottom: 20px; color: var(--muted); font-size: 14px; font-variant-numeric: tabular-nums; letter-spacing: 0.06em; }
.topic-tabs { grid-row: 3; display: flex; flex-direction: column; align-items: stretch; margin-top: 24px; }
.topic-tab {
  display: block;
  width: 100%;
  min-height: 32px;
  padding: 6px 0 6px 18px;
  border: 0;
  border-left: 2px solid var(--line-strong);
  border-radius: 0;
  background: none;
  color: var(--muted);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.35;
  text-align: left;
  text-wrap: pretty;
  cursor: pointer;
  transition: color var(--motion-quick) ease, border-color var(--motion-quick) ease;
}
.topic-tab:hover { color: var(--ink); }
.topic-tab[aria-selected='true'] { border-left-color: var(--red); color: var(--wine); font-weight: 600; }
.topic-tab:focus-visible { outline: 2px solid var(--wine); outline-offset: 2px; border-radius: 4px; }
/* Only topics without names keep the arrows, in the names' place. */
.topic-arrows { grid-row: 3; display: flex; justify-content: flex-start; gap: 12px; margin-top: 24px; }
.topic-arrow.round-button { width: 46px; height: 46px; min-width: 46px; }
.topic-carousel:not(.is-enhanced) :is(.topic-tabs, .topic-arrows, .topic-counter) { display: none; }
.topic-carousel:not(.is-enhanced) .topic-frame { padding-bottom: clamp(24px, 2.2vw, 32px); }
@media (max-width: 1100px) {
  .topics-row { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; row-gap: clamp(48px, 7vw, 72px); }
  .topics-row > .section-topics { display: block; grid-row: auto; }
}

/* People of the foundation: the jury's card in four columns, the title
   above. Ehrenpräsident and Ehrentafel share one row, aligned to the same
   columns. */
.people-columns-2 { --people: 2; }
.people-columns-3 { --people: 3; }
.people-columns-4 { --people: 4; }
.section-people .people-grid.people-profiles { grid-template-columns: repeat(var(--people, 4), minmax(0, 1fr)); gap: 14px; }
.people-profiles > .person-card > .person-summary { min-height: 112px; }
.people-profiles .person-heading { min-width: 0; }
.people-profiles .person-heading strong { display: block; }
.people-profiles .person-role { margin-top: 2px; }
.people-profiles .person-role > * { margin: 0; }
.people-profiles .person-role a { color: var(--wine); text-decoration-color: #6a0f1c55; text-underline-offset: 3px; }
.people-profiles .person-monogram { font-family: inherit; font-weight: 700; letter-spacing: -0.02em; }
.people-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 14px; }
.people-row > .page-section.page-section { padding-bottom: 0; }
.people-row > .section-people { min-width: 0; }
.people-row .section-people .people-grid.people-profiles { --people: 2; }
@media (max-width: 1250px) {
  .people-columns-4 { --people: 3; }
  .people-row { grid-template-columns: minmax(0, 1fr); }
  .people-row .section-people .people-grid.people-profiles { --people: 3; }
}
@media (max-width: 1050px) {
  .people-columns-3, .people-columns-4 { --people: 2; }
  .people-row .section-people .people-grid.people-profiles { --people: 2; }
}
@media (max-width: 640px) {
  .section-people .people-grid.people-profiles,
  .people-row .section-people .people-grid.people-profiles { --people: 1; }
}
@media (max-width: 560px) {
  .people-profiles.people-grid.is-jury > .person-card > .person-summary { min-height: 0; padding-right: 14px; }
}
/* Downloads: the panel spans the page in four columns, with the heading above. */
@media (min-width: 1280px) {
  .page-about .page-sections > .page-section.section-links.section-links:has(> .link-panel) { display: block; }
  .page-about .page-sections > .page-section.section-links.section-links:has(> .link-panel) > .section-heading { margin: 0 0 clamp(24px, 2.4vw, 36px); padding-top: 0 !important; border-top: 0 !important; }
  .page-about .page-sections > .page-section.section-links.section-links:has(> .link-panel) > .section-heading h2 { font-size: clamp(34px, 3.4vw, 56px); line-height: 1.05; }
}

/* --------------------------------------------------------------------------
   Wettbewerb: venues as on the previous website (town, dates, institution,
   address), grouped by phase under a large map with a star for the final.
   -------------------------------------------------------------------------- */
.venue-map.map-card { display: block; margin: 0 0 clamp(36px, 3.6vw, 56px); padding: clamp(20px, 2.6vw, 40px); }
.venue-map .swiss-map,
.agenda-map .swiss-map { display: block; width: 100%; max-width: 1040px; height: auto; min-height: 0; max-height: none; margin: 0 auto; }
.swiss-map .map-point text { font-size: 11.5px; font-weight: 600; stroke: #fffdf9; stroke-width: 3.5px; paint-order: stroke; }
.swiss-map .map-point .map-pulse { fill: transparent; stroke: none; transition: fill var(--motion-quick) ease; }
.swiss-map .map-point:is(:hover, :focus-visible) .map-pulse { fill: #b8010124; }
.map-star { fill: var(--red); stroke: #fffdf9; stroke-width: 1.4; stroke-linejoin: round; }
.map-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 28px; margin: 18px 0 0; color: var(--ink-soft); font-size: 14px; }
.map-legend-item { display: inline-flex; align-items: center; gap: 8px; }
.map-legend-item svg { width: 18px; height: 18px; fill: var(--wine); }
.map-legend-item + .map-legend-item svg { fill: var(--red); }
.venue-phase + .venue-phase { margin-top: clamp(40px, 4vw, 64px); }
.venue-phase-title { margin: 0 0 20px; padding-bottom: 12px; border-bottom: 2px solid var(--ink); font-size: clamp(24px, 2vw, 32px); font-weight: 300; line-height: 1.1; letter-spacing: -0.02em; }
.venue-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.venue-grid > .venue-card { display: flex; flex-direction: column; gap: 0; min-width: 0; padding: 26px 26px 22px; border-radius: var(--radius); scroll-margin-top: calc(var(--header) + 24px); }
.venue-place { margin: 0; color: var(--ink); font-size: clamp(24px, 1.9vw, 30px); font-weight: 600; line-height: 1.1; letter-spacing: -0.02em; }
.venue-dates { margin: 6px 0 0; color: var(--wine); font-size: clamp(19px, 1.45vw, 22px); font-weight: 300; line-height: 1.3; }
.venue-name { margin: 18px 0 0; color: var(--ink); font-size: 16px; font-weight: 600; line-height: 1.35; text-wrap: balance; }
.venue-address { margin: 4px 0 0; color: var(--wine); font-size: 15px; line-height: 1.5; }
.venue-note { margin: 12px 0 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.venue-card > .rich-text { margin-top: 12px; color: var(--ink-soft); font-size: 15px; }
.venue-grid .venue-actions { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: auto; padding-top: 20px; }
.venue-actions .text-link { font-size: 14px; font-weight: 600; }
.venue-actions .text-link svg { width: 15px; height: 15px; }
@media (max-width: 1250px) { .venue-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .venue-grid { grid-template-columns: minmax(0, 1fr); }
  .venue-map.map-card { padding: 14px; }
  .swiss-map .map-point text { font-size: 15px; stroke-width: 4px; }
}
/* Jury: the introduction across the full line, three columns, "CV". */
#jury .section-intro,
#jury .section-intro > * { max-width: none; }
.page-competition .collection-jury .people-grid.is-jury { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1250px) { .page-competition .collection-jury .people-grid.is-jury { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .page-competition .collection-jury .people-grid.is-jury { grid-template-columns: minmax(0, 1fr); } }
/* A side-menu entry that leads straight to another page shows its arrow. */
.page-sidebar nav > a.sidebar-jump svg { opacity: 1; }
/* The page menu keeps its words whole. A long gender compound breaks only
   at the soft hyphen render.js puts before its last component
   («Kooperations-» / «partner:innen»); a word wider than the menu would
   still wrap rather than overflow. */
.page-sidebar nav > a:not(.button) { -webkit-hyphens: manual; hyphens: manual; overflow-wrap: break-word; word-break: normal; }

/* --------------------------------------------------------------------------
   Kalender: two months side by side, larger bold weekday names, controls on
   one height, filter buttons filled in their colour, filters always shown,
   a larger map that marks the chosen town.
   -------------------------------------------------------------------------- */
.agenda-calendar :is([data-category='competition'], [data-color='competition']) { --agenda-accent: var(--type-competition); --agenda-ink: #fffcf6; }
.agenda-calendar :is([data-category='concert'], [data-color='concert']) { --agenda-accent: var(--type-concert); --agenda-ink: #fffcf6; }
.agenda-calendar :is([data-category='masterclass'], [data-color='masterclass']) { --agenda-accent: var(--type-masterclass); --agenda-ink: #2b1b06; }
.agenda-calendar :is([data-category='scholarship'], [data-color='scholarship']) { --agenda-accent: var(--type-scholarship); --agenda-ink: #fffcf6; }
.agenda-calendar :is([data-category='other'], [data-color='other']) { --agenda-accent: var(--type-other); --agenda-ink: var(--ink); }
.agenda-calendar .calendar-day.has-events:has(.calendar-event-label[data-category='competition']) { --day-field: var(--type-competition); --day-ink: #fffcf6; }
.agenda-calendar .calendar-day.has-events:has(.calendar-event-label[data-category='concert']) { --day-field: var(--type-concert); --day-ink: #fffcf6; }
.agenda-calendar .calendar-day.has-events:has(.calendar-event-label[data-category='masterclass']) { --day-field: var(--type-masterclass); --day-ink: #2b1b06; }
.agenda-calendar .calendar-day.has-events:has(.calendar-event-label[data-category='scholarship']) { --day-field: var(--type-scholarship); --day-ink: #fffcf6; }
.agenda-calendar .calendar-day.has-events:has(.calendar-event-label[data-category='other']) { --day-field: var(--type-other); --day-ink: var(--ink); }
/* Header controls: one height, one centre line. */
.agenda-calendar .agenda-header { align-items: flex-end; }
.agenda-calendar .agenda-view-switch { box-sizing: border-box; height: 48px; padding: 4px; align-items: stretch; }
.agenda-calendar .agenda-view-switch > button { height: 40px; min-height: 40px; padding-block: 0; }
.agenda-calendar .calendar-controls > button { box-sizing: border-box; height: 48px; min-height: 48px; padding-block: 0; }
/* Type buttons: filled in their colour; the chosen one carries a check and a
   ring, the others step back while one type is chosen. */
:is(.agenda-calendar, .prizes-list) .agenda-categories { gap: 8px; margin: 4px 0 18px; }
:is(.agenda-calendar, .prizes-list) .agenda-categories > button {
  gap: 8px;
  min-height: 42px;
  padding: 8px 16px;
  border: 2px solid transparent;
  background: var(--type, var(--ink));
  color: var(--type-ink, #fffcf6);
  font-size: 14px;
  font-weight: 600;
  transition: opacity var(--motion-quick) ease, box-shadow var(--motion-quick) ease, filter var(--motion-quick) ease;
}
:is(.agenda-calendar, .prizes-list) .agenda-categories > button::before { content: none; }
:is(.agenda-calendar, .prizes-list) .agenda-categories > button[aria-pressed='true']::before {
  content: '';
  display: block;
  flex: 0 0 14px;
  width: 14px;
  height: 14px;
  border-radius: 0;
  background: currentColor;
  -webkit-mask: var(--check-mask) center / contain no-repeat;
  mask: var(--check-mask) center / contain no-repeat;
}
:is(.agenda-calendar, .prizes-list) .agenda-categories > button[aria-pressed='true'] { border-color: transparent; background: var(--type, var(--ink)); color: var(--type-ink, #fffcf6); box-shadow: 0 0 0 2px var(--paper), 0 0 0 4px var(--type, var(--ink)); }
:is(.agenda-calendar, .prizes-list) .agenda-categories > button[data-category-choice=''] { border-color: var(--ink); background: transparent; color: var(--ink); }
:is(.agenda-calendar, .prizes-list) .agenda-categories > button[data-category-choice=''][aria-pressed='true'] { background: var(--ink); color: #fffcf6; box-shadow: none; }
:is(.agenda-calendar, .prizes-list) .agenda-categories:has(> button:not([data-category-choice=''])[aria-pressed='true']) > button:not([aria-pressed='true']) { opacity: 0.42; }
@media (hover: hover) and (pointer: fine) {
  :is(.agenda-calendar, .prizes-list) .agenda-categories > button:not([aria-pressed='true']):hover { border-color: transparent; background: var(--type, var(--ink)); color: var(--type-ink, #fffcf6); opacity: 1; filter: brightness(1.07); }
  :is(.agenda-calendar, .prizes-list) .agenda-categories > button[data-category-choice='']:not([aria-pressed='true']):hover { border-color: var(--ink); background: #ece2d3; color: var(--ink); filter: none; }
}
/* Filters: always visible in one row (Ort, Jahr); "Art" is the buttons above. */
.agenda-calendar .agenda-filter-bar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px 24px; margin: 0 0 22px; }
.agenda-calendar .agenda-filter-options { flex: 1 1 auto; min-width: 0; }
.agenda-calendar .event-filters { display: flex; flex-wrap: wrap; gap: 12px 16px; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; }
.agenda-calendar .event-filters label { display: grid; gap: 6px; width: min(260px, 100%); max-width: none; color: var(--ink-soft); font-size: 13px; font-weight: 600; }
:is(.agenda-calendar, .prizes-list) .event-filters .agenda-category-select { display: none; }
.agenda-calendar .event-filters select { min-height: 46px; border-color: var(--line-strong); border-radius: 12px; background-color: var(--surface); color: var(--ink); font-size: 15px; }
.agenda-calendar .agenda-filter-bar > .agenda-map-disclosure { flex: 0 0 auto; }
.agenda-calendar .agenda-filter-bar > .agenda-map-disclosure[open] { flex-basis: 100%; }
.agenda-calendar .agenda-filter-bar > .agenda-map-disclosure > summary { min-height: 46px; color: var(--wine); font-size: 15px; font-weight: 600; }
.agenda-calendar .agenda-map-disclosure .map-card { display: block; margin: 8px 0 0; padding: clamp(18px, 2.6vw, 40px); }
/* The map: no aura by default; the chosen town in red, larger, the others
   stepping back. */
.swiss-map .map-point.is-selected .map-pulse { fill: #c0101c2e; stroke: var(--red); stroke-width: 1.2; }
.swiss-map .map-point.is-selected > circle:not(.map-pulse) { fill: var(--red); }
.swiss-map .map-point.is-selected text { fill: var(--red); font-size: 13.5px; font-weight: 700; }
.swiss-map:has(.map-point.is-selected) .map-point:not(.is-selected) { opacity: 0.45; }
/* Two months side by side, each with its name; the list below names them too. */
.agenda-calendar.is-enhanced[data-view='month'] .agenda-month-label { display: block; }
.agenda-calendar .calendar-months[data-count='2'] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px clamp(28px, 3vw, 52px); }
.agenda-calendar .calendar-month > .calendar-month-title { display: block; margin: 0 0 12px; color: var(--ink); font-size: clamp(22px, 1.8vw, 28px); font-weight: 300; line-height: 1.1; letter-spacing: -0.015em; }
.agenda-calendar .calendar-months[data-count='2'] .month-grid { gap: 5px; }
.agenda-calendar .weekday { color: var(--ink); font-size: 15px; font-weight: 700; letter-spacing: 0; }
.agenda-calendar .calendar-months[data-count='2'] :is(.calendar-day, .calendar-blank) { padding: 7px 8px; border-radius: 12px; }
.agenda-calendar .calendar-months[data-count='2'] .calendar-event-label { font-size: 11.5px; }
@media (max-width: 1000px) {
  .agenda-calendar .calendar-months[data-count='2'] { grid-template-columns: minmax(0, 1fr); }
}
/* Event rows: the type in its colour, the arrow beside the title, and time,
   town and building on one line with generous spacing. */
.agenda-calendar .event-row,
.agenda-calendar .event-row:has(.event-details) { grid-template-columns: 88px minmax(0, 1fr); }
.agenda-calendar .event-row .event-description { grid-column: 2; }
.agenda-calendar .event-description .card-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.event-title a { text-decoration: none; }
.event-title-arrow {
  display: inline-grid;
  place-items: center;
  width: 1.05em;
  height: 1.05em;
  margin-left: 0.35em;
  border-radius: 50%;
  background: var(--wine);
  color: #fffcf6;
  vertical-align: -0.1em;
  transition: transform var(--motion-response) var(--motion-ease), background-color var(--motion-quick) ease;
}
.event-title-arrow svg { width: 0.55em; height: 0.55em; }
.event-title a:is(:hover, :focus-visible) .event-title-arrow { background: var(--red); transform: translateX(3px); }
.agenda-calendar .event-meta { display: flex; flex-wrap: wrap; gap: 8px clamp(22px, 2.4vw, 40px); margin-top: 8px; color: var(--muted); font-size: 15px; }
.agenda-calendar .event-meta svg { width: 16px; height: 16px; margin-top: 0.15em; }
.agenda-calendar .event-details > summary { width: fit-content; max-width: 100%; margin: 12px 0 0; }
@media (max-width: 900px) and (min-width: 680px) {
  .agenda-calendar .event-row, .agenda-calendar .event-row:has(.event-details) { grid-template-columns: 72px minmax(0, 1fr); }
}
@media (max-width: 679px) {
  .agenda-calendar .event-row, .agenda-calendar .event-row:has(.event-details) { grid-template-columns: 64px minmax(0, 1fr); }
  .agenda-calendar .event-details > summary { margin-left: 0; max-width: 100%; }
  .agenda-calendar .event-filters label { width: calc(50% - 8px); }
}

/* --------------------------------------------------------------------------
   Sonderpreise: cards of one height per row; type labels in colour; the
   short description under the title; town, then building, each with its
   symbol; "Details ansehen" on one line at the foot of every card.
   -------------------------------------------------------------------------- */
.prizes-list .prize-grid { align-items: stretch; }
.prize-card { display: flex; flex-direction: column; min-width: 0; }
.prize-card > summary,
.prize-card .prize-card-main { display: flex; flex: 1 1 auto; flex-direction: column; align-items: flex-start; min-height: 0; padding: 24px 24px 22px; }
.prize-card[open] > summary { flex: 0 0 auto; }
.prize-card .card-meta { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 18px; }
.prize-card time, .prize-card .prize-date { margin-bottom: 8px; color: var(--wine); font-size: 14px; font-weight: 600; line-height: 1.35; }
.prize-card h3 { margin: 0; font-size: clamp(20px, 1.45vw, 24px); font-weight: 600; line-height: 1.2; letter-spacing: -0.015em; text-wrap: balance; }
.prize-summary { display: block; margin: 10px 0 0; color: var(--ink-soft); font-size: 15px; line-height: 1.55; }
.prize-places { display: grid; gap: 7px; width: 100%; margin: 16px 0 0; color: var(--muted); font-size: 14px; line-height: 1.4; }
.prize-places > :is(.prize-location, .prize-building) { margin: 0; color: inherit; font-size: inherit; line-height: inherit; }
.prize-places:empty { display: none; }
.prize-card summary > .text-link { display: flex; align-items: center; justify-content: space-between; width: 100%; margin-top: auto; padding-top: 22px; font-size: 14px; font-weight: 600; }
.prize-card summary > .text-link svg { width: 18px; height: 18px; }
.prize-card .prize-card-link { padding: 0 24px 22px; }
.prize-card .prize-card-link .text-link { font-size: 14px; font-weight: 600; }
.prize-card .prize-card-main { padding-bottom: 6px; }
.prize-card.is-static:not(:has(.prize-card-link)) .prize-card-main { padding-bottom: 22px; }
.prize-period + .prize-period .prize-card .prize-summary { color: var(--muted); }

/* --------------------------------------------------------------------------
   News articles, Round 2: one left-aligned column under the full-width title:
   date, lead, text, then the picture with its caption. Lines stay near 70
   characters; the picture is never enlarged beyond its own size.
   -------------------------------------------------------------------------- */
.page-news .detail-article .detail-heading h1 { max-width: none; text-wrap: pretty; }
.page-news .detail-columns.is-single { display: block; margin-top: 22px; padding-top: 0; border-top: 0; }
.page-news .detail-columns.is-single .detail-aside { position: static; }
.page-news .detail-columns.is-single .detail-date { margin-top: 0; }
.page-news .detail-columns.is-single .detail-summary { margin-top: 22px; }
.page-news .detail-columns.is-single .detail-story { margin-top: 28px; }
.page-news .detail-columns.is-single .detail-aside:empty + .detail-story { margin-top: 0; }
.page-news .detail-columns.is-single .detail-story .detail-body { max-width: 66ch; margin-top: 0; columns: auto; }
.page-news .detail-columns.is-single .detail-image { margin: 36px 0 0; width: fit-content; max-width: 100%; }
.page-news .detail-columns.is-single .detail-body:empty + .detail-image { margin-top: 0; }
.page-news .detail-columns.is-single .detail-image img { width: auto; max-width: 100%; height: auto; max-height: 640px; }
@media (min-width: 1051px) {
  .page-news .detail-main > article.detail-article { display: block; }
  .page-news .detail-heading { padding-top: 24px; }
  .page-news .detail-heading h1 { font-size: clamp(34px, 3.6vw, 56px); }
  .page-news .detail-content { padding-top: 0; border-top: 0; }
}
@media (max-width: 760px) {
  .page-news .detail-columns.is-single .detail-image img { max-height: 420px; }
}

/* News articles: pictures in the story may use the full content width, never
   more than their own size, and open in the lightbox. Text keeps its measure. */
.page-news .detail-columns.is-single .detail-story .detail-body { max-width: none; }
.page-news .detail-columns.is-single .detail-story .detail-body > :not(figure) { max-width: 66ch; }
.page-news .detail-story figure { margin: 36px 0 0; width: fit-content; max-width: 100%; }
.page-news .detail-story .detail-body > figure:first-child { margin-top: 0; }
.page-news .detail-story .detail-body > :not(figure) + figure { margin-top: 36px; }
.page-news .detail-story figure img { display: block; width: auto; max-width: 100%; height: auto; max-height: none; border-radius: 16px; }
.detail-zoom { display: block; max-width: 100%; padding: 0; border: 0; border-radius: 16px; background: none; cursor: zoom-in; overflow: hidden; }
.lightbox .lightbox-prev { grid-column: 1; grid-row: 1; }
.lightbox figure { grid-column: 2; grid-row: 1; }
.lightbox .lightbox-next { grid-column: 3; grid-row: 1; }
.lightbox.is-single figure { grid-column: 1 / -1; }
.lightbox [hidden] { display: none; }



/* --------------------------------------------------------------------------
   Sonderpreise, Round 2: in every row the cards share three tracks (content,
   facts, footer). The facts with their symbols therefore start on one line,
   just above "Details ansehen", while chips, date, title and description keep
   their natural flow at the top. Without subgrid support the cards keep the
   flex layout above. An expanded card (no JavaScript) is not part of the grid.
   -------------------------------------------------------------------------- */
.prize-head { display: block; width: 100%; }
@supports (grid-template-rows: subgrid) {
  .prize-card:is(.is-static, :not([open])) { grid-row: span 3; display: grid; grid-template-rows: subgrid; row-gap: 0; }
  .prize-card:not([open]) > summary { grid-row: 1 / -1; display: grid; grid-template-rows: subgrid; row-gap: 0; align-items: start; align-content: start; justify-items: stretch; }
  .prize-card.is-static > .prize-card-main { grid-row: 1 / span 2; display: grid; grid-template-rows: subgrid; row-gap: 0; align-items: start; justify-items: stretch; padding-bottom: 0; }
  .prize-card.is-static > .prize-card-link { grid-row: 3; align-self: end; padding-top: 22px; }
  .prize-card :is(summary, .prize-card-main) > .prize-head { grid-row: 1; }
  .prize-card :is(summary, .prize-card-main) > .prize-places { grid-row: 2; align-self: start; }
  .prize-card:not([open]) > summary > .text-link { grid-row: 3; margin-top: 0; align-self: end; }
  .prize-card.is-static:not(:has(.prize-card-link)) > .prize-card-main { padding-bottom: 22px; }
}


/* --------------------------------------------------------------------------
   Story and event pages: the title on top across the page; beneath it the
   facts and lead beside the picture and the text, which runs in two columns
   when it is long.
   -------------------------------------------------------------------------- */
.detail-article .detail-heading h1 { max-width: 24ch; }
.detail-columns { margin-top: clamp(26px, 3vw, 44px); padding-top: clamp(24px, 2.4vw, 36px); border-top: 1px solid var(--line-strong); }
.detail-aside > :first-child { margin-top: 0; }
.detail-aside .detail-summary { font-size: clamp(18px, 1.5vw, 21px); line-height: 1.55; }
.detail-story .detail-image { margin-top: 0; }
@media (min-width: 1051px) {
  .detail-main > article.detail-article { display: block; }
  .detail-columns { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: clamp(40px, 5vw, 96px); align-items: start; }
  .detail-columns.has-no-aside { grid-template-columns: minmax(0, 1fr); }
  .detail-aside { position: sticky; top: calc(var(--header) + 32px); }
  .detail-story { min-width: 0; }
  .detail-story .detail-body { max-width: none; margin-top: 0; }
  .detail-story .detail-image + .detail-body { margin-top: 32px; }
  .detail-story .detail-body:has(> :nth-child(3)) { columns: 2 300px; column-gap: clamp(32px, 3.4vw, 56px); }
  .detail-story .detail-body > * { break-inside: avoid-column; }
  .detail-story .detail-body > :is(h2, h3, h4) { break-after: avoid-column; }
  .detail-story .detail-body > :first-child { margin-top: 0; }
}

/* --------------------------------------------------------------------------
   Förderer & Partner: every list in one white panel with hairlines, the
   organisers with their websites like the founders, and the coats of arms
   of every canton and of Liechtenstein.
   Round 3 · partners · point 54: the further partners and the cooperation
   partners are partner groups too and share the founders' grid (same markup,
   the ids of their sections stand in the selectors).
   -------------------------------------------------------------------------- */
.page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  overflow: hidden;
  border: 1px solid #2b18100f;
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}
.page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid > .partner-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 12px;
  min-height: 116px;
  padding: 22px clamp(20px, 2vw, 28px);
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: 1px 0 0 var(--line), 0 1px 0 var(--line);
  transition: background-color var(--motion-quick) ease;
}
.page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-card :is(h3, h4) { color: var(--ink); font-size: 17px; font-weight: 600; line-height: 1.35; letter-spacing: -0.005em; }
.page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-card .text-link { margin-top: 0; font-size: 14px; font-weight: 600; }
.page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-card .text-link::after { content: ''; position: absolute; inset: 0; }
.page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-card:has(.text-link) { cursor: pointer; }
/* Round 3 · partners · point 54: a grid whose cells are names only (the further partners) has no link row to make room for, so its cells are as high as their text needs. */
.page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid:not(:has(.text-link)) > .partner-card { min-height: 0; padding-block: 24px; }
.page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid > .partner-card:has(:focus-visible) { outline: 2px solid var(--wine); outline-offset: -4px; border-radius: 16px; }
@media (hover: hover) and (pointer: fine) {
  .page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid > .partner-card:has(.text-link):hover { background: #6a0f1c06; }
  .page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid > .partner-card:has(.text-link):hover .text-link { color: var(--red); }
}
.page-partners #organisers .partner-category > h3 { position: static; width: auto; height: auto; margin: 0 0 12px; overflow: visible; clip-path: none; color: var(--wine); font-size: 13px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; white-space: normal; }
.page-partners #organisers .partner-category + .partner-category { margin-top: 30px; }
/* Name lists, in a white box or not: every name in the weight and size of the
   founders and organisers (client, point 54), linked or not. In a box the
   list runs from edge to edge and its first hairlines hide under the border;
   without one, a closing hairline ends the list. */
.page-partners .section-text .text-panel ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(24px, 2.6vw, 40px); margin: 0; columns: auto; }
.page-partners .section-text .text-panel li { padding: 18px 0; border-bottom: 0; border-top: 1px solid var(--line); color: var(--ink); font-size: 17px; font-weight: 600; line-height: 1.35; letter-spacing: -0.005em; }
.page-partners .section-text .text-panel:not(.is-boxed) ul { border-bottom: 1px solid var(--line); }
.page-partners .section-text .text-panel.is-boxed:has(> ul:first-child) { overflow: hidden; padding-top: 0 !important; }
.page-partners .section-text .text-panel.is-boxed > ul:first-child { margin-top: -1px; }
.page-partners .section-text .text-panel.is-boxed:has(> ul:last-child) { padding-bottom: 0 !important; }
.page-partners .section-text .text-panel li a { display: inline; color: var(--ink); font-weight: 600; text-decoration: none; }
/* The symbol follows the last word, also when a long name wraps. It hangs on
   that word (.link-end, server/render.js), which does not break, so it never
   starts a line of its own. */
.page-partners .section-text .text-panel li a .link-end { white-space: nowrap; }
.page-partners .section-text .text-panel li a[href^='http']:not(:has(.link-end))::after,
.page-partners .section-text .text-panel li a[href^='http'] .link-end::after { content: ''; display: inline-block; width: 15px; height: 15px; margin-left: 9px; vertical-align: -2px; background: var(--wine); -webkit-mask: var(--external-mask) center / contain no-repeat; mask: var(--external-mask) center / contain no-repeat; }
.page-partners .section-text .text-panel li a:is(:hover, :focus-visible) { color: var(--wine); }
/* A link line beneath a text reads like the other links of the page: an
   arrow for a page of this website, the external symbol for another website. */
.page-partners .section-text .text-panel .link-line a:not(.content-button) { display: inline-flex; align-items: center; gap: 9px; color: var(--wine); font-size: 15px; font-weight: 600; line-height: 1.4; text-decoration: none; }
.page-partners .section-text .text-panel .link-line a:not(.content-button)::after { content: ''; flex: none; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--arrow-mask) center / contain no-repeat; mask: var(--arrow-mask) center / contain no-repeat; }
.page-partners .section-text .text-panel .link-line a:not(.content-button)[href^='http']::after { width: 15px; height: 15px; -webkit-mask-image: var(--external-mask); mask-image: var(--external-mask); }
.page-partners .section-text .text-panel .link-line a:not(.content-button):hover { color: var(--red); }
@media (prefers-reduced-motion: no-preference) {
  .page-partners .section-text .text-panel .link-line a:not(.content-button)::after { transition: transform var(--motion-response) var(--motion-ease); }
  .page-partners .section-text .text-panel .link-line a:not(.content-button):not([href^='http']):is(:hover, :focus-visible)::after { transform: translateX(3px); }
}
@media (max-width: 1050px) {
  .page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid,
  .page-partners .section-text .text-panel ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid,
  .page-partners .section-text .text-panel ul { grid-template-columns: minmax(0, 1fr); }
  .page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid > .partner-card { min-height: 0; padding-block: 18px; }
  .page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-card :is(h3, h4),
  .page-partners .section-text .text-panel li { font-size: 16px; }
}
/* Emblem panel: the logos of the cantons (Dina Mayer, 26 October 2026), or
   any partner's logos and coats of arms, in the cells of one white panel like
   the lists of founders and organisers. A cell is always 1.9 times as wide as
   tall, with 2, 3, 4 or 5 cells in a row by the width of the card, so every
   row has the same height, also a row of wide logos alone. A logo is about
   as large on a laptop as on a large screen (cells of 200 to 250 pixels), so
   that the small print of the cantons' logos stays legible, as Solothurn's
   logo rules ask.
   - A logo covers about the same area whatever its proportions: wider ones
     are lower, taller ones narrower, all within margins that keep them off
     the lines. The server names its proportions in a class (ar-…, below).
     A logo more than five times as wide as tall takes two cells and a little
     more area (its lettering is small), one more than eight times three
     (two in rows of two or five cells).
   - A coat of arms keeps its name beside it and an entry without a picture
     shows its name as text, each across two cells (a text three in rows of
     five); both grow with the cells.
   With the cantons (two very long logos, three long ones, Neuchâtel's text
   and Liechtenstein's arms) every row is full: 34 cells in rows of two, 36 in
   rows of three or four, 35 in rows of five. */
.partner-card.has-emblems { container: emblems / inline-size; }
.partner-emblems {
  --emblem-columns: 2;
  --emblem-ratio: 1.9;
  display: grid;
  grid-template-columns: repeat(var(--emblem-columns), minmax(0, 1fr));
  grid-auto-rows: minmax(84px, auto);
  grid-auto-rows: calc((100cqw - 2px) / var(--emblem-columns) / var(--emblem-ratio));
  grid-auto-flow: row dense;
  width: 100%;
  margin: 26px 0 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #2b18100f;
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
  list-style: none;
}
.partner-emblems .emblem {
  --span: 1;
  --logo-units: 0.3;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-width: 0;
  margin: 0;
  padding: 0 8%;
  box-shadow: 1px 0 0 var(--line), 0 1px 0 var(--line);
  grid-column: span var(--span);
}
.partner-emblems .emblem::before,
.partner-emblems .emblem::marker { content: none; }
.partner-emblems .emblem.is-logo { padding: 0; }
.partner-emblems .emblem:is(.is-wide, .is-text, .is-arms) { --span: 2; }
.partner-emblems .emblem.is-wide { --logo-units: 0.45; }
.partner-emblems .emblem > a { display: flex; align-items: center; justify-content: center; gap: inherit; width: 100%; height: 100%; color: inherit; text-decoration: none; }
@media (hover: hover) and (pointer: fine) {
  .partner-emblems .emblem:has(> a:hover) { background: #6a0f1c06; }
  .partner-emblems .emblem > a:hover .emblem-name { color: var(--wine); }
}
.partner-emblems .emblem > a:focus-visible { outline: 2px solid var(--wine); outline-offset: -4px; border-radius: 12px; }
/* Area: with a = the logo's area in single cells ÷ the cells it spans, r its
   proportions and c the proportions of its cells, the logo is √(a · r ÷ c) of
   the cells' width, at most 84 % of it and at most 66 % of their height.
   Browsers without sqrt() show every logo 60 % wide. */
.emblem-logo.emblem-logo {
  display: block;
  width: 60%;
  width: calc(100% * min(0.84, sqrt(var(--logo-units) / var(--span) * var(--r, 2) / (var(--span) * var(--emblem-ratio))), 0.66 * var(--r, 2) / (var(--span) * var(--emblem-ratio))));
  height: auto;
}
.ar-25 { --r: 0.25; } .ar-28 { --r: 0.275; } .ar-30 { --r: 0.3; } .ar-33 { --r: 0.33; } .ar-37 { --r: 0.37; } .ar-40 { --r: 0.4; }
.ar-44 { --r: 0.44; } .ar-49 { --r: 0.49; } .ar-54 { --r: 0.54; } .ar-59 { --r: 0.59; } .ar-65 { --r: 0.65; } .ar-71 { --r: 0.71; }
.ar-78 { --r: 0.78; } .ar-86 { --r: 0.86; } .ar-95 { --r: 0.95; } .ar-105 { --r: 1.05; } .ar-115 { --r: 1.15; } .ar-127 { --r: 1.27; }
.ar-140 { --r: 1.4; } .ar-154 { --r: 1.54; } .ar-169 { --r: 1.69; } .ar-186 { --r: 1.86; } .ar-204 { --r: 2.04; } .ar-225 { --r: 2.25; }
.ar-247 { --r: 2.47; } .ar-272 { --r: 2.72; } .ar-299 { --r: 2.99; } .ar-329 { --r: 3.29; } .ar-362 { --r: 3.62; } .ar-398 { --r: 3.98; }
.ar-438 { --r: 4.38; } .ar-482 { --r: 4.82; } .ar-530 { --r: 5.3; } .ar-583 { --r: 5.83; } .ar-641 { --r: 6.41; } .ar-705 { --r: 7.05; }
.ar-776 { --r: 7.76; } .ar-853 { --r: 8.53; } .ar-939 { --r: 9.39; } .ar-1030 { --r: 10.3; } .ar-1140 { --r: 11.4; } .ar-1250 { --r: 12.5; }
/* The arms are half as high as their cell and the names grow a little with
   the cells (46px and 13px without container units). */
.emblem-mark { display: block; flex: none; }
.emblem-mark img { display: block; width: auto; height: 46px; height: calc((100cqw - 2px) / var(--emblem-columns) / var(--emblem-ratio) * 0.5); filter: drop-shadow(0 1px 1px #2b18101f); }
/* Names and support lines break between words only, never inside a name
   («Liechten-stein»); a single word too long for its cell still wraps. */
.emblem-name { min-width: 0; color: var(--ink-soft); font-size: 13px; line-height: 1.35; overflow-wrap: break-word; hyphens: manual; -webkit-hyphens: manual; }
.partner-emblems .emblem-name { font-size: clamp(13px, (100cqw - 2px) / var(--emblem-columns) / var(--emblem-ratio) * 0.13, 15px); }
.partner-emblems .emblem.is-arms .emblem-name { max-width: 9.5em; text-align: left; }
.partner-emblems .emblem.is-text .emblem-name { max-width: 19em; text-align: center; text-wrap: balance; }
@container emblems (min-width: 500px) { .partner-emblems { --emblem-columns: 3; } .partner-emblems .emblem.is-wider { --span: 3; } }
@container emblems (min-width: 700px) { .partner-emblems { --emblem-columns: 4; } }
@container emblems (min-width: 960px) { .partner-emblems { --emblem-columns: 5; } .partner-emblems .emblem.is-wider { --span: 2; } .partner-emblems .emblem.is-text { --span: 3; } }
/* Round 3 · partners · question 4: a name without a logo that is short (Liechtenstein) takes two cells in every row length, as its coat of arms did, so the rows of the panel stay full. */
.partner-emblems .emblem.is-text.is-short { --span: 2; }
/* On the partners page the panel spans the whole card, beneath the partner's
   name (see the design review below). */

/* --------------------------------------------------------------------------
   Partners band: a light grey band with dark names; logos keep their colours.
   -------------------------------------------------------------------------- */
.footer-partners { background: #ebe8e3; color: var(--ink); }
.footer-partners > h2 { color: var(--muted); }
.sponsor-tile { border-left-color: #2218162e; color: var(--ink); }
.sponsor-tile:is(:hover, :focus-visible) { color: var(--wine); }
.sponsor-tile.has-logo { display: inline-flex; align-items: center; gap: 14px; }
.sponsor-tile .sponsor-logo { display: inline-flex; align-items: center; }
.sponsor-tile img,
.sponsor-tile .sponsor-logo img { width: auto; max-width: 180px; height: 34px; max-height: 34px; object-fit: contain; filter: none; opacity: 1; }
.footer-partners-more { color: var(--wine); }
.footer-partners-more:is(:hover, :focus-visible) { color: var(--red); }
.footer-partners-bar { border-bottom: 0; }
.footer-partners .sponsor-track:focus-visible { outline-color: #6a0f1c99; }
.footer-partners .carousel-toggle { border-color: var(--wine); background: var(--wine); color: #fffcf6; outline-color: var(--wine); }

/* --------------------------------------------------------------------------
   Footer in three columns: the name in all five languages, the social
   profiles with the newsletter set apart, and the office.
   -------------------------------------------------------------------------- */
.site-footer { padding-top: clamp(56px, 5.6vw, 88px); }
.footer-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr) 46px;
  gap: 44px clamp(32px, 4vw, 72px);
  align-items: start;
  padding-bottom: clamp(44px, 4.4vw, 64px);
}
.footer-columns > .footer-column { min-width: 0; margin: 0; padding: 0; }
.site-footer .footer-heading { margin: 0 0 22px; color: #ff8a7e; font-size: 12px; font-weight: 700; line-height: 1.3; letter-spacing: 0.16em; text-transform: uppercase; }
/* Round 3 · brand · point 6: the light variant of the logo («Helle Variante
   auf dunklem Hintergrund») stands directly on the dark red, the white circle
   without its outline and the wordmark in white (docs/brand/README.md). The
   top of the circle, the capitals of the column headings and the top of the
   back-to-top button share one line (Round 1, point 6), and the circle's left
   edge stands on the line of the five names: the image box keeps a margin of
   2.44 % of its height around the logo, so the box moves out by that much.
   Keyboard focus draws a capsule around the logo. */
.footer-columns { --footer-top-line: 2px; }
.footer-brand { --logo-inset: calc(60px * 0.0244); display: inline-block; margin: calc(var(--footer-top-line) - var(--logo-inset)) 0 0 calc(-1 * var(--logo-inset)); border-radius: 999px; line-height: 0; text-decoration: none; }
.footer-logo { display: block; width: 160px; height: 60px; }
.footer-names { display: grid; gap: 8px; margin: 26px 0 0; padding: 0; color: #e6c9bf; font-size: 15px; line-height: 1.4; list-style: none; }
.footer-names li { margin: 0; padding: 0; }
.footer-names li::marker { content: none; }
.social-list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.social-list > li { min-width: 0; margin: 0; }
.social-list > li::marker { content: none; }
.social-list.is-long { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; }
.social-list-newsletter { margin-top: 18px; padding-top: 18px; border-top: 1px solid #ffffff24; }
.footer-social .social-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-height: 44px;
  max-width: 100%;
  padding: 2px 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: #fffcf6;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.25;
}
.footer-social .social-link > .control-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.footer-social .social-link .social-icon {
  box-sizing: content-box;
  flex: none;
  width: 17px;
  height: 17px;
  padding: 9px;
  border: 1px solid #ffffff45;
  border-radius: 50%;
  fill: currentColor;
  overflow: visible;
  transition: background-color var(--motion-quick) ease, color var(--motion-quick) ease, border-color var(--motion-quick) ease;
}
.footer-social .social-link .social-icon-line { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.footer-social .social-link:is(:hover, :focus-visible) { background: none; color: #fffcf6; }
.footer-social .social-link:is(:hover, :focus-visible) .social-icon { border-color: #fffcf6; background: #fffcf6; color: var(--wine); }
.footer-contact address { color: #e6c9bf; font-size: 15px; font-style: normal; line-height: 1.6; }
.footer-contact-links { display: grid; justify-items: start; gap: 6px; margin-top: 16px; }
.footer-contact-link { display: inline-flex; align-items: center; gap: 10px; color: #fffcf6; font-size: 16px; font-weight: 600; text-decoration: none; }
.footer-contact-link svg { width: 16px; height: 16px; opacity: 0.8; }
.footer-contact-link:is(:hover, :focus-visible) { color: #ffc4bb; }
.footer-columns > .back-top { justify-self: end; margin-top: var(--footer-top-line); }
@media (max-width: 1050px) {
  .footer-columns { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 46px; }
  .footer-columns > .footer-identity { grid-column: 1 / 3; grid-row: 1; }
  .footer-columns > .footer-social { grid-column: 1; grid-row: 2; }
  .footer-columns > .footer-contact { grid-column: 2; grid-row: 2; }
  .footer-columns > .back-top { grid-column: 3; grid-row: 1; }
}
@media (max-width: 640px) {
  .footer-columns { grid-template-columns: minmax(0, 1fr) 46px; gap: 36px 14px; }
  /* The names use the full width: the back-to-top button only sits beside
     the logo, so «Concours Suisse de Musique pour la Jeunesse» keeps to one
     line on a phone. */
  .footer-columns > .footer-identity { grid-column: 1 / -1; grid-row: 1; }
  .footer-columns > :is(.footer-social, .footer-contact) { grid-column: 1 / -1; grid-row: auto; }
  .footer-columns > .back-top { grid-column: 2; grid-row: 1; align-self: start; }
  .social-list.is-long { grid-template-columns: minmax(0, 1fr); }
  .footer-brand { --logo-inset: calc(52px * 0.0244); }
  .footer-logo { width: 139px; height: 52px; }
}
/* Round 3 · brand · point 6: every text in the footer is heavier («Alle Texte
   im Footer bitte fett hervorheben»), in a quiet hierarchy: the five names,
   the address and the bottom row in semibold, the links in bold like the
   column headings. Names and address share one line height. */
.site-footer :is(.footer-names li, .footer-contact address, .footer-bottom, .footer-bottom a) { font-weight: 600; }
.site-footer .footer-names li { line-height: 1.6; }
/* Semibold runs wider: below 390px the names step down to 14px, so that each
   still keeps to one line from 360px up, as in the light face before. */
@media (max-width: 389px) { .site-footer .footer-names li { font-size: 14px; } }
.site-footer :is(.footer-social .social-link, .footer-contact-link) { font-weight: 700; }

/* --------------------------------------------------------------------------
   Media: the photo galleries in one row under the title; greetings three per
   row, each opening in a dialog like the disciplines on the competition page.
   -------------------------------------------------------------------------- */
@media (min-width: 1051px) {
  .page-section:has(> .collection-gallery) { display: block; }
}
.gallery-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 1.6vw, 24px); align-items: stretch; max-width: none; }
.gallery-row > .gallery-entry:not([open]) > summary { height: 100%; }
.gallery-row > .gallery-entry:not([open]) .gallery-copy { flex: 1 1 auto; }
.gallery-row > .gallery-entry { min-width: 0; margin: 0; overflow: hidden; border: 1px solid #2b18100f; border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-soft); }
.gallery-row > .gallery-entry > summary { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0; list-style: none; cursor: pointer; }
.gallery-row > .gallery-entry > summary::-webkit-details-marker { display: none; }
.gallery-row .gallery-cover { display: block; width: 100%; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 0; }
.gallery-row .gallery-cover img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 700ms var(--motion-ease); }
.gallery-row .gallery-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 18px 22px 22px; }
.gallery-row .gallery-copy strong { font-size: clamp(19px, 1.4vw, 22px); font-weight: 600; line-height: 1.2; letter-spacing: -0.01em; }
.gallery-row .gallery-copy .text-link { margin-top: auto; padding-top: 10px; font-size: 14px; }
.gallery-row > .gallery-entry[open] { grid-column: 1 / -1; }
.gallery-row > .gallery-entry[open] > summary { flex-direction: row; align-items: center; }
.gallery-row > .gallery-entry[open] .gallery-cover { flex: 0 0 min(280px, 32%); width: min(280px, 32%); }
.gallery-row > .gallery-entry[open] .gallery-copy { padding: 18px clamp(20px, 2.4vw, 32px); }
.gallery-row > .gallery-entry[open] .text-link svg { transform: rotate(45deg); }
.gallery-row > .gallery-entry > .gallery-images { padding: 0 clamp(20px, 2.4vw, 32px) clamp(20px, 2.4vw, 32px); }
.gallery-row > .gallery-entry > .gallery-body { padding: 0 clamp(20px, 2.4vw, 32px) clamp(20px, 2.4vw, 32px); }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .gallery-row > .gallery-entry:not([open]) > summary:hover .gallery-cover img { transform: scale(1.04); }
}
@media (max-width: 1100px) { .gallery-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .gallery-row { grid-template-columns: minmax(0, 1fr); }
  .gallery-row > .gallery-entry[open] > summary { flex-direction: column; align-items: stretch; }
  .gallery-row > .gallery-entry[open] .gallery-cover { flex-basis: auto; width: 100%; }
}
/* An open album shows its photos only: the cover, which is also the first
   photo, steps aside, and the title stands as far from the card's edges as
   the photos below it. The photos fill the width: two per row on small
   tablets, three beside the page menu of a tablet, and from 1051px three as
   set on the Media page («Spalten auf grossen Bildschirmen»), at most 400px
   wide, which the 800px copies keep sharp. An editor's choice of one or two
   photos per row keeps 280px thumbnails. Phones keep the cover above the
   title. */
@media (min-width: 641px) {
  .gallery-row > .gallery-entry[open] .gallery-cover { display: none; }
  .gallery-row > .gallery-entry[open] .gallery-copy { padding: clamp(20px, 2.4vw, 32px); }
}
@media (min-width: 641px) and (max-width: 760px) {
  .collection-layout:not(.collection-columns-1) .gallery-row > .gallery-entry > .gallery-images { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
}
@media (min-width: 1051px) {
  .gallery-row > .gallery-entry > .gallery-images { grid-template-columns: repeat(3, minmax(0, 400px)); }
  .collection-columns-1 .gallery-row > .gallery-entry > .gallery-images { grid-template-columns: minmax(0, 280px); }
  .collection-columns-2 .gallery-row > .gallery-entry > .gallery-images { grid-template-columns: repeat(2, minmax(0, 280px)); }
}
@media (min-width: 641px) and (max-width: 760px), (min-width: 1051px) {
  .gallery-row > .gallery-entry > .gallery-images button { max-width: none; }
}
.collection-layout .guestbook-grid[data-greetings] { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.guestbook-grid[data-greetings] > .guestbook-entry { min-width: 0; height: 100%; }
.guestbook-grid[data-greetings] > .guestbook-entry > summary { height: 100%; align-items: flex-start; }
.guestbook-grid[data-greetings] > .guestbook-entry > summary > svg { flex: none; margin-top: 8px; }
@media (max-width: 1100px) { .collection-layout .guestbook-grid[data-greetings] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .collection-layout .guestbook-grid[data-greetings] { grid-template-columns: minmax(0, 1fr); } }
.greeting-dialog-content { max-width: 68ch; }
.greeting-dialog-content .quote-mark { display: block; height: 0.55em; margin: 0 0 14px; color: var(--red); font-family: Georgia, 'Times New Roman', serif; font-size: 72px; line-height: 1; }
.greeting-dialog-content h2 { margin: 0; font-size: clamp(28px, 2.6vw, 40px); line-height: 1.1; letter-spacing: -0.02em; }
.greeting-dialog-meta { margin: 10px 0 24px; color: var(--muted); font-size: 15px; line-height: 1.5; }
.greeting-dialog-meta:empty { display: none; }
.greeting-dialog-content .rich-text { color: var(--ink-soft); font-size: 18px; line-height: 1.7; }

/* --------------------------------------------------------------------------
   Design review, pass 1: panels with links become tiles (symbol and action
   on the first line, the text beneath across the whole cell), so no text is
   squeezed into a narrow column; single entries keep the width of one
   column; the coats of arms use the full width of their row.
   -------------------------------------------------------------------------- */
.link-panel:not(.is-rows) .panel-grid > .panel-item {
  grid-template-columns: 46px minmax(0, 1fr) auto;
  grid-template-areas: 'icon . action' 'text text text';
  align-items: center;
  align-content: start;
  row-gap: 18px;
}
.link-panel:not(.is-rows) .panel-grid > .panel-item > .panel-icon { grid-area: icon; }
.link-panel:not(.is-rows) .panel-grid > .panel-item > .panel-text { grid-area: text; align-self: start; padding-top: 0; }
.link-panel:not(.is-rows) .panel-grid > .panel-item > .panel-action { grid-area: action; align-self: center; margin-top: 0; }
.link-panel:not(.is-rows) .panel-grid > .panel-item:not(:has(> .panel-action)) { grid-template-columns: 46px minmax(0, 1fr); grid-template-areas: 'icon .' 'text text'; }
.panel-text > .panel-title + .panel-body { margin-top: 4px; }

.page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid { --partner-columns: 3; grid-template-columns: repeat(var(--partner-columns), minmax(0, 1fr)); }
.page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid:has(> .partner-card:only-child) { grid-template-columns: minmax(0, 1fr); width: calc(100% / var(--partner-columns)); }
@media (max-width: 1050px) { .page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid { --partner-columns: 2; } }
@media (max-width: 640px) { .page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid { --partner-columns: 1; } }

.page-partners #main-partners .partner-card.has-emblems > .partner-emblems { grid-column: 1 / -1; margin-top: clamp(22px, 2.2vw, 32px); }

/* Filters on the special-prizes page: the same fields as in the calendar;
   the count and the reset share the line of the fields. */
.prizes-list .event-filters { align-items: flex-end; gap: 12px 16px; }
.prizes-list .event-filters label { display: grid; gap: 6px; width: min(260px, 100%); min-width: 0; color: var(--ink-soft); font-size: 13px; font-weight: 600; }
.prizes-list .event-filters select { min-height: 46px; border-color: var(--line-strong); border-radius: 12px; background-color: var(--surface); color: var(--ink); font-size: 15px; }
.prizes-list .event-filters > .results-count { display: flex; align-items: center; min-height: 46px; margin-left: auto; padding: 0; font-size: 14px; }
.prizes-list .event-filters > .text-button { display: inline-flex; align-items: center; min-height: 46px; margin: 0; font-size: 14px; }
@media (max-width: 640px) {
  .prizes-list .event-filters { flex-wrap: wrap; }
  .prizes-list .event-filters label { width: calc(50% - 8px); }
  .prizes-list .event-filters > .results-count { margin-left: 0; }
}

/* The newsletter button under the News title, spaced like the homepage's. */
.hero.hero-interior .hero-content > .hero-newsletter { margin-top: 24px; }

/* Design review, pass 2 (tablets).
   Calendar: two months stand side by side only where a day can still show
   its event's name; narrower screens show the same two months one above the
   other. Event names break between syllables, never mid-letter. */
.agenda-calendar .calendar-event-label { overflow-wrap: normal; word-break: normal; hyphens: auto; -webkit-hyphens: auto; }
@media (max-width: 1180px) {
  .agenda-calendar .calendar-months[data-count='2'] { grid-template-columns: minmax(0, 1fr); }
}
/* Panels: three entries never leave a hole in a grid of two; on tablets
   they become three full rows (symbol, text and action on one line). */
@media (min-width: 641px) and (max-width: 1100px) {
  .link-panel:not(.is-rows) .panel-grid.panel-columns-3:has(> .panel-item:nth-child(3):last-child) { --panel-columns: 1; }
  .link-panel:not(.is-rows) .panel-grid.panel-columns-3:has(> .panel-item:nth-child(3):last-child) > .panel-item {
    grid-template-columns: 46px minmax(0, 1fr) auto;
    grid-template-areas: 'icon text action';
    align-items: center;
    row-gap: 0;
  }
  .link-panel:not(.is-rows) .panel-grid.panel-columns-3:has(> .panel-item:nth-child(3):last-child) > .panel-item:not(:has(> .panel-action)) { grid-template-columns: 46px minmax(0, 1fr); grid-template-areas: 'icon text'; align-items: start; }
}

/* Phones: the download button in a panel note keeps inside the panel. */
@media (max-width: 640px) {
  .rich-text.panel-note a.content-button { justify-content: center; width: 100%; max-width: 100%; white-space: normal; text-align: center; }
}

/* Small laptops (1181–1299px): the larger header keeps all page names in
   every language; spacing and the controls tighten a little instead. */
@media (min-width: 1181px) and (max-width: 1299px) {
  .site-header { gap: 18px; }
  .primary-nav { gap: 13px; }
  .header-actions { gap: 8px; }
  .header-support { padding-inline: 16px; }
  .language-trigger { min-width: 0; padding-inline: 10px; }
}

/* Special-prize dialog: the card's labels, date, title and places, then the
   programme and its website. */
.prize-dialog-content { max-width: 70ch; }
.prize-dialog-content > .card-meta { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 18px; }
.prize-dialog-content > .card-meta .tag { display: inline-flex; align-items: center; min-height: 24px; padding: 2px 10px; border: 1px solid var(--line-strong); border-radius: 999px; background: none; color: var(--ink-soft); font-size: 12px; font-weight: 600; line-height: 1.2; }
.prize-dialog-date { margin: 0 0 8px; color: var(--wine); font-size: 15px; font-weight: 600; }
.prize-dialog-content h2 { margin: 0; font-size: clamp(28px, 2.6vw, 40px); line-height: 1.1; letter-spacing: -0.02em; text-wrap: balance; }
.prize-dialog-summary { margin: 14px 0 0; color: var(--ink-soft); font-size: 18px; line-height: 1.55; }
.prize-dialog-content > .prize-places { margin-top: 18px; padding-bottom: 22px; border-bottom: 1px solid var(--line); font-size: 15px; }
.prize-dialog-content > .rich-text { margin-top: 22px; color: var(--ink-soft); font-size: 17px; line-height: 1.7; }
.prize-dialog-link { margin: 24px 0 0; }
.prize-dialog-link .text-link { font-size: 15px; font-weight: 600; }
/* Without JavaScript an opened card spans its row instead of stretching it. */
.prizes-list .prize-card[open] { grid-column: 1 / -1; }

/* The main partners keep their name-only ledger (client: keep as it is); the
   logo field is shown in the partners band. */
.page-partners #main-partners .partner-card > .partner-logo { display: none; }

/* Partners band with logos: a logo that carries the partner's name stands
   alone (the name stays for screen readers); partners without a logo keep
   their name. Logos share one optical box, so a wide wordmark and a square
   mark carry the same weight. */
.footer-partners .sponsor-tile.has-logo { display: inline-flex; align-items: center; justify-content: center; min-height: 64px; padding-block: 4px; }
.footer-partners .sponsor-tile:not(.has-logo) { display: inline-flex; align-items: center; min-height: 64px; }
.footer-partners .sponsor-tile.has-logo .sponsor-name { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.footer-partners .sponsor-tile.has-logo .sponsor-logo img { width: auto; height: auto; max-width: 168px; max-height: 48px; }
.footer-partners .sponsor-tile.has-logo .sponsor-logo img[class*='logo-h-'] { height: calc(var(--logo-h) * var(--logo-scale, 1)); max-width: calc(260px * var(--logo-scale, 1)); max-height: none; object-fit: contain; }
.logo-h-24 { --logo-h: 24px; }
.logo-h-26 { --logo-h: 26px; }
.logo-h-28 { --logo-h: 28px; }
.logo-h-30 { --logo-h: 30px; }
.logo-h-32 { --logo-h: 32px; }
.logo-h-34 { --logo-h: 34px; }
.logo-h-36 { --logo-h: 36px; }
.logo-h-38 { --logo-h: 38px; }
.logo-h-40 { --logo-h: 40px; }
.logo-h-42 { --logo-h: 42px; }
.logo-h-44 { --logo-h: 44px; }
.logo-h-46 { --logo-h: 46px; }
.logo-h-48 { --logo-h: 48px; }
.logo-h-50 { --logo-h: 50px; }
.logo-h-52 { --logo-h: 52px; }
.footer-partners .sponsor-clone.has-logo::after { content: none; }
.footer-partners .sponsor-tile.has-logo:is(:hover, :focus-visible) { text-decoration: none; }
.footer-partners .sponsor-tile.has-logo:is(:hover, :focus-visible) .sponsor-logo { opacity: 0.8; }
@media (max-width: 760px) {
  .footer-partners .sponsor-tile.has-logo .sponsor-logo img { max-width: 132px; max-height: 40px; }
  .footer-partners { --logo-scale: 0.8; }
  .footer-partners .sponsor-tile { min-height: 56px; }
}

/* Calendar map, enlarged: the whole card width (up to 1040px), smaller
   markers and names in proportion; crowded names appear on demand. Phones
   show the markers and the chosen town's name. */
.agenda-calendar .agenda-map-disclosure .agenda-map.map-card { display: block; padding: clamp(14px, 2vw, 32px); }
.agenda-calendar .agenda-map-disclosure .agenda-map .swiss-map { grid-column: auto; grid-row: auto; display: block; width: 100%; max-width: 1040px; height: auto; min-height: 0; max-height: none; margin: 0 auto; }
.agenda-map .swiss-map .map-point text { font-size: 10px; stroke-width: 3px; }
.agenda-map .swiss-map .map-point.is-selected text { font-size: 11.5px; }
.agenda-map .swiss-map .map-point.is-crowded text { opacity: 0; transition: opacity var(--motion-quick) ease; }
.agenda-map .swiss-map .map-point.is-crowded:is(:hover, :focus-visible, .is-selected) text { opacity: 1; }
@media (max-width: 640px) {
  .agenda-map .swiss-map .map-point text { opacity: 0; font-size: 17px; stroke-width: 4px; }
  .agenda-map .swiss-map .map-point:is(:hover, :focus-visible, .is-selected) text { opacity: 1; }
}


/* ==========================================================================
   Design review, pass 3 · independent audit and browser suites, Oct 2026
   ========================================================================== */
.nowrap { white-space: nowrap; }
/* A hyphenated person name: one unit on the line, wrapping inside only when
   it is wider than the whole line (render.js, personName). */
.name-whole { display: inline-block; max-width: 100%; }

/* Special-prize filters on phones: two fields side by side, the count and
   the reset on their own line. */
@media (max-width: 640px) {
  .prizes-list .event-filters { flex-wrap: wrap; gap: 12px 16px; }
  .prizes-list .event-filters label { flex: 1 1 calc(50% - 8px); width: auto; min-width: 0; }
  .prizes-list .event-filters select { width: 100%; }
  .prizes-list .event-filters > .results-count { flex: 1 1 auto; justify-content: flex-start; margin-left: 0; }
  /* With only the place field beside the type buttons, field and count share
     a line; the reset starts at the same left edge as the field. */
  .prizes-list .event-filters > .text-button { padding-inline: 0; }
}

/* A panel note with a download button: the button's paragraph may shrink,
   and on phones it takes the full width with a wrapping label. */
.panel-note > :has(> a.content-button:only-child) { flex: 0 1 auto; min-width: 0; }
@media (max-width: 640px) {
  .panel-note:has(a.content-button) > :has(> a.content-button:only-child) { flex: 1 1 100%; }
  /* The symbol leads the first line of the label: the line starts with a
     27px indent (17px symbol + 10px gap) and the symbol takes its place there,
     so a label on two lines stays one centred group with its symbol, and the
     two lines are balanced. Placed out of the line (absolute, at its inline
     static position), the symbol neither changes Chrome's balancing nor shows
     Safari's mask edge on inline boxes. */
  .rich-text.panel-note a.content-button { display: block; position: relative; width: 100%; padding-block: 13.25px; white-space: normal; line-height: 1.3; text-align: center; text-indent: 27px; text-wrap: balance; }
  .rich-text.panel-note a.content-button::before { display: inline; position: absolute; margin: 1.25px 0 0 -27px; }
}

/* Maps: only a point's own dot and name receive the pointer; the aura never
   covers a neighbour. */
.swiss-map .map-pulse { pointer-events: none; }
.swiss-map .map-hit { fill: transparent; stroke: none; }
/* The calendar map is a desktop tool: on phones the "Ort" field chooses the town. */
@media (max-width: 640px) {
  .agenda-calendar .agenda-filter-bar > .agenda-map-disclosure { display: none; }
}
/* Venue map on phones: larger markers and names placed for this size;
   names that would overlap stay hidden (the cards below list every place). */
.swiss-map .map-label-phone { display: none; }
@media (max-width: 640px) {
  .venue-map .swiss-map .map-label-wide { display: none; }
  .venue-map .swiss-map .map-label-phone { display: inline; font-size: 24px; stroke-width: 6px; }
  .venue-map .swiss-map .map-label-phone.is-crowded { display: none; }
  .venue-map .swiss-map :is(.map-dot, .map-star) { transform-box: fill-box; transform-origin: center; transform: scale(1.7); }
}

/* Special prizes on tablets: two cards per row. News and upcoming titles are
   hyphenated by syllable instead of broken mid-letter. Prize titles name
   people and places («Rachmaninoff», «Dietschweiler»): they break between
   words or after a hyphen; only a word wider than its card would break. */
.upcoming-card h3, .news-latest .news-card h3 { overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; }
.prize-card h3 { overflow-wrap: break-word; hyphens: manual; -webkit-hyphens: manual; }
@media (min-width: 561px) and (max-width: 960px) {
  .collection-layout .prize-grid, .prizes-list .prize-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Disciplines join the facts under the title, with a music symbol. */
.prize-places > .prize-disciplines { display: flex; align-items: flex-start; gap: 9px; margin: 0; }

/* Homepage: "Über uns" keeps its distance from the partners band. */
.page-home #about { padding-bottom: clamp(64px, 7vw, 120px); }

/* Calendar: both months have rows of one height, which grow only if a day
   needs more room; a multi-day event is named where it starts and at the
   start of each week, its other days show its colour. */
.agenda-calendar .calendar-months[data-count='2'] .month-grid {
  height: auto;
  grid-template-rows: 32px repeat(var(--calendar-weeks, 6), minmax(clamp(78px, 6.2vw, 100px), 1fr));
}
/* Side by side, the two months share their rows: titles, weekdays and weeks
   stand level, and when a name needs more room every week of both months
   grows by the same amount. The pair has as many week rows as the longer
   month (site.js sets --calendar-weeks on the months). */
@supports (grid-template-rows: subgrid) {
  @media (min-width: 1281px) {
    .agenda-calendar .calendar-months[data-count='2'] { grid-template-rows: auto 32px repeat(var(--calendar-weeks, 6), minmax(clamp(78px, 6.2vw, 100px), 1fr)); row-gap: 5px; }
    .agenda-calendar .calendar-months[data-count='2'] > .calendar-month { display: grid; grid-row: 1 / -1; grid-template-rows: subgrid; }
    .agenda-calendar .calendar-months[data-count='2'] > .calendar-month > .calendar-month-title { margin-bottom: 7px; }
    .agenda-calendar .calendar-months[data-count='2'] .month-grid { grid-row: 2 / -1; grid-template-rows: subgrid; }
  }
}
.agenda-calendar .calendar-day .calendar-event-label.from-prev { color: transparent; }
.agenda-calendar .calendar-day.has-events { overflow: hidden; }
.agenda-calendar .calendar-day:has(.calendar-event-label.to-next) { overflow: visible; }
/* Two months stand side by side where a day can show its event's name. */
@media (max-width: 1280px) {
  .agenda-calendar .calendar-months[data-count='2'] { grid-template-columns: minmax(0, 1fr); }
}

.topics-row > .page-section:last-child { padding-bottom: 0; }

/* Person cards: names level within a row. */
.people-grid.is-jury > .person-card > .person-summary { align-items: flex-start; }
.people-grid.is-jury .person-heading { padding-top: 6px; }

/* Hover: every clickable card lifts the same way; venue cards are not links
   themselves (their two links are), so they stay still. */
@media (hover: hover) and (pointer: fine) {
  .news-latest > .news-card.news-card:hover,
  .upcoming-grid > .upcoming-card.upcoming-card:hover,
  .prizes-list .prize-card.prize-card:has(> summary:hover),
  .gallery-row > .gallery-entry.gallery-entry:has(> summary:hover) { border-color: #2b18100f; box-shadow: var(--shadow-lift); }
  .venue-grid > .venue-card.venue-card:hover { border-color: #2b18100f; box-shadow: var(--shadow-soft); transform: none; }
  .guestbook-grid[data-greetings] > .guestbook-entry:has(> summary:hover) { background: #e6dccb; }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .prizes-list .prize-card.prize-card:has(> summary:hover),
  .gallery-row > .gallery-entry.gallery-entry:not([open]):has(> summary:hover) { transform: translateY(-3px); }
  .prizes-list .prize-card, .gallery-row > .gallery-entry { transition: box-shadow var(--motion-response) ease, transform var(--motion-response) var(--motion-ease); }
}

/* Keyboard focus: one clear ring per card, never an underline on every line. */
:is(.gallery-entry, .guestbook-entry, .prize-card) > summary:focus-visible { text-decoration: none; outline: none; }
.guestbook-entry:has(> summary:focus-visible) { outline: 2px solid var(--wine); outline-offset: 3px; }
.upcoming-card h3 a:focus-visible { outline: none; text-decoration: none; }
.venue-grid > .venue-card:has(:focus-visible) { outline: none; }
.page-partners .section-text .text-panel :is(li, .link-line) a:focus-visible { outline: none; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }

/* Competition menu: the registration button reads as one line; with
   enlarged text it wraps instead of running out of the menu. */
.page-sidebar .sidebar-registration.sidebar-registration { justify-content: center; gap: 10px; padding: 13px 14px; font-size: 14px; white-space: normal; text-wrap: balance; text-align: center; line-height: 1.25; }
/* The narrower tablet menu (175px) keeps the button on one line in every
   language with slightly tighter spacing. */
@media (min-width: 761px) and (max-width: 1050px) {
  .page-sidebar .sidebar-registration.sidebar-registration { gap: 8px; padding-inline: 11px; font-size: 13px; }
  .page-sidebar .sidebar-registration.sidebar-registration svg { width: 15px; height: 15px; }
}

/* Main partners beside the page menu: name and text in two columns, the
   link under the text. */
@media (min-width: 1051px) {
  .page-partners #main-partners .partner-card.partner-card { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); column-gap: clamp(32px, 4vw, 64px); }
  .page-partners #main-partners .partner-card.partner-card > * { grid-column: 2; }
  .page-partners #main-partners .partner-card.partner-card > :is(.partner-logo, h3, h4) { grid-column: 1; }
  .page-partners #main-partners .partner-card.partner-card > .text-link.text-link { grid-column: 2; grid-row: auto; justify-self: start; margin-top: 16px; }
  .page-partners #main-partners .partner-card.partner-card.has-emblems > .partner-emblems { grid-column: 1 / -1; }
}

/* Titles: balanced lines, no single word left over. */
.detail-article .detail-heading h1, .footer-names li, .hero.hero-interior h1 { text-wrap: balance; }
.hero.hero-interior h1 { max-width: 24ch; }
.hero h1 { hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word; }
@media (max-width: 380px) { .hero.hero-front h1 { font-size: 32px; } .hero.hero-front .hero-name { font-size: 18px; } }

/* Event pages without text or picture: facts and link in one column. */
@media (min-width: 1051px) {
  .detail-columns.has-no-story { grid-template-columns: minmax(0, 1fr); }
  .detail-columns.has-no-story > .detail-aside { position: static; max-width: 72ch; }
}
.detail-aside > .detail-action { margin-top: 24px; }

/* Video notes legible. */
.video-info .video-privacy { font-size: 13px; color: #f7e9e0; }
.video-choice-meta { font-size: 12px; }

/* Footer contact: symbols first, like the social profiles. */
.footer-contact-link svg { order: -1; }

/* Organisers and founders: a short last row fills the panel. */
@media (min-width: 1051px) {
  .page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid > .partner-card:last-child:nth-child(3n+1):not(:only-child) { grid-column: span 3; }
  .page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid > .partner-card:last-child:nth-child(3n+2):not(:only-child) { grid-column: span 2; }
}
@media (min-width: 641px) and (max-width: 1050px) {
  .page-partners :is(#founders, #organisers, #further-partners, #cooperation) .partner-grid > .partner-card:last-child:nth-child(2n+1):not(:only-child) { grid-column: span 2; }
}

/* FAQ answers at a reading measure. */
.faq-list .answer > * { max-width: 78ch; }

/* Special-prize dialog: programme headings in the card style. */
.prize-dialog-content .rich-text :is(h2, h3, h4) { margin: 24px 0 8px; color: var(--wine); font-size: 18px; font-weight: 600; line-height: 1.3; letter-spacing: 0; }
.prize-dialog-content .rich-text > :is(h2, h3, h4):first-child { margin-top: 0; }

/* Columns follow the editor's setting (three for venues, galleries and
   greetings in the content); photos keep the editor's framing. */
.collection-layout .venue-grid { grid-template-columns: repeat(var(--collection-columns, 3), minmax(0, 1fr)); }
.collection-layout .gallery-row { grid-template-columns: repeat(var(--collection-columns, 3), minmax(0, 1fr)); }
.collection-layout .guestbook-grid[data-greetings] { grid-template-columns: repeat(var(--collection-columns, 3), minmax(0, 1fr)); }
.page-competition .collection-jury .people-grid.is-jury { grid-template-columns: repeat(var(--collection-columns, 3), minmax(0, 1fr)); }
@media (max-width: 1250px) {
  .collection-layout:is(.collection-columns-3, .collection-columns-4) .venue-grid,
  .page-competition .collection-jury .people-grid.is-jury { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
  .collection-layout:is(.collection-columns-3, .collection-columns-4) :is(.gallery-row, .guestbook-grid[data-greetings]) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .page-competition .collection-jury .people-grid.is-jury { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .collection-layout :is(.venue-grid, .gallery-row, .guestbook-grid[data-greetings]),
  .collection-layout:is(.collection-columns-3, .collection-columns-4) :is(.gallery-row, .guestbook-grid[data-greetings]) { grid-template-columns: minmax(0, 1fr); }
}
.gallery-row .gallery-cover img.image-placement { object-fit: var(--crop-d-fit, cover); }
@media (max-width: 1050px) { .gallery-row .gallery-cover img.image-placement { object-fit: var(--crop-t-fit, var(--crop-d-fit, cover)); } }
@media (max-width: 760px) { .gallery-row .gallery-cover img.image-placement { object-fit: var(--crop-m-fit, var(--crop-d-fit, cover)); } }

/* Footer: the name in five languages as one compact block, without gaps
   (client: "immer sichtbar … keine Abstände"). */
.site-footer .footer-names { gap: 0; margin-top: 22px; line-height: 1.6; }
/* Phones: a name that needs two lines hangs its second line in by 1em.
   Below 375px, where names wrap, they also stand 6px apart, so «Concours
   Suisse de / Musique pour la Jeunesse» reads as one name. */
@media (max-width: 420px) {
  .site-footer .footer-names li { padding-left: 1em; text-indent: -1em; }
}
@media (max-width: 374px) {
  .site-footer .footer-names { gap: 6px; }
}

/* Dropdowns draw their own chevron: the native arrow sits against the border
   in Chrome and Safari whatever the padding. The chevron keeps the same inset
   from the right edge as the text keeps from the left. */
select:not([multiple]):not([size]) {
  -webkit-appearance: none;
  appearance: none;
  background-image: url('/static/art/select-chevron-v1.png');
  background-repeat: no-repeat;
  background-size: 14px 9px;
  background-position: right 16px center;
  padding-left: 16px;
  padding-right: 44px;
  text-overflow: ellipsis;
}
@media (forced-colors: active) {
  select:not([multiple]):not([size]) { -webkit-appearance: auto; appearance: auto; background-image: none; }
}

/* Calendar names are never cut short: in the two-month view a day shows each
   of its names in full, and the weeks grow with them at any window height. */
.agenda-calendar .calendar-months[data-count='2'] .calendar-event-label,
.agenda-calendar .calendar-months[data-count='2'] .calendar-event-label.to-next:not(.from-prev),
.agenda-calendar .calendar-months[data-count='2'] .calendar-day:has(.calendar-event-label + .calendar-event-label) .calendar-event-label { -webkit-line-clamp: none; }

/* Small pills: Tabac's ascent is tall for its capital height (0.77 / 0.71 em),
   so a centred line leaves the capitals 0.085em above the middle, a visible
   pixel at this size. The padding moves the text back to the optical centre.
   (The larger type buttons already centre within half a pixel.) */
.event-type { padding-top: calc(3px + 0.085em); padding-bottom: calc(3px - 0.085em); }
:is(.upcoming-card, .prize-card, .prize-dialog-content) .card-meta .tag { padding-top: calc(2px + 0.085em); padding-bottom: calc(2px - 0.085em); }

/* ==========================================================================
   Round 2 · client review, October 2026 · Kalender (points 40, 42 and 45)
   One month by default, with larger day numbers and event names; two months
   side by side on request where they fit, chosen beside «Monatsansicht |
   Terminliste»; «Karte anzeigen» as a button right after the «Jahr» field.
   ========================================================================== */

/* The choice between one and two months has the look of the view switch (it
   carries that class) and appears only in the month view, on screens where
   two months stand side by side. */
.agenda-calendar .agenda-months-switch { display: none; }
@media (min-width: 1281px) {
  .agenda-calendar.is-enhanced[data-view='month'] .agenda-months-switch { display: inline-flex; }
  /* The title has a line of its own, so its length («Dezember 2026 –
     Januar 2027») never moves a button. The switches share the line below
     at one height: view and number of months on the left. The month steps
     close the filter line (Round 3, point 40, below). */
  .agenda-calendar .agenda-header { column-gap: 12px; row-gap: 20px; }
  .agenda-calendar .agenda-header > div:first-child { flex: 1 0 100%; }
}

/* One month: the room goes to the days. The weeks keep a readable minimum,
   fill the height of tall screens and grow together when a long name needs
   room, so every week has the same height. The month is named by the title
   above, so the grid carries no second name. A day shows its events' names
   in full; the weeks grow together when they need more lines. */
.agenda-calendar .calendar-months[data-count='1'] .calendar-month-title { display: none; }
.agenda-calendar .calendar-months[data-count='1'] .month-grid {
  --day-min: clamp(104px, calc((100svh - var(--header) - 340px) / var(--calendar-weeks, 5)), 144px);
  height: auto;
  grid-template-rows: 36px repeat(var(--calendar-weeks, 5), minmax(var(--day-min), 1fr));
  gap: 6px;
}
.agenda-calendar .calendar-months[data-count='1'] :is(.calendar-day, .calendar-blank) { gap: 6px; padding: 12px 14px 14px; border-radius: 16px; }
.agenda-calendar .calendar-months[data-count='1'] .calendar-date-number { font-size: 20px; line-height: 1.2; }
.agenda-calendar .calendar-months[data-count='1'] .calendar-day.has-events .calendar-date-number,
.agenda-calendar .calendar-months[data-count='1'] .calendar-day:not(.is-today) .calendar-date-number::before { font-size: 32px; line-height: 1; letter-spacing: -0.02em; }
.agenda-calendar .calendar-months[data-count='1'] .calendar-day.is-today .calendar-date-number { min-width: 36px; height: 36px; margin: -6px 0 -6px -9px; padding: 0 9px; }
.agenda-calendar .calendar-months[data-count='1'] .calendar-day.has-events.is-today .calendar-date-number { min-width: 46px; height: 46px; margin: -7px 0 -7px -11px; padding: 0 11px; }
.agenda-calendar .calendar-months[data-count='1'] .calendar-day.is-today:not(.has-events) .calendar-date-number { margin-top: 1.5px; }
.agenda-calendar .calendar-months[data-count='1'] .calendar-event-label,
.agenda-calendar .calendar-months[data-count='1'] .calendar-event-label.to-next:not(.from-prev) { margin-top: 0; font-size: 16px; line-height: 1.3; -webkit-line-clamp: none; }
.agenda-calendar .calendar-months[data-count='1'] .calendar-day:has(.calendar-event-label + .calendar-event-label) .calendar-event-label { -webkit-line-clamp: none; }
.agenda-calendar .calendar-months[data-count='1'] .calendar-event-more { font-size: 14px; line-height: 1.2; }
@media (max-width: 1280px) {
  .agenda-calendar .calendar-months[data-count='1'] :is(.calendar-day, .calendar-blank) { padding: 10px 12px 12px; border-radius: 14px; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-day.has-events .calendar-date-number,
  .agenda-calendar .calendar-months[data-count='1'] .calendar-day:not(.is-today) .calendar-date-number::before { font-size: 28px; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-day.is-today:not(.has-events) .calendar-date-number { margin-top: -1.5px; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-day.has-events.is-today .calendar-date-number { margin-top: -9px; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-event-label,
  .agenda-calendar .calendar-months[data-count='1'] .calendar-event-label.to-next:not(.from-prev) { font-size: 15px; }
}
@media (max-width: 1050px) {
  .agenda-calendar .calendar-months[data-count='1'] .month-grid { --day-min: clamp(96px, calc((100svh - var(--header) - 360px) / var(--calendar-weeks, 5)), 128px); gap: 5px; }
  .agenda-calendar .calendar-months[data-count='1'] :is(.calendar-day, .calendar-blank) { gap: 5px; padding: 8px 9px 10px; border-radius: 12px; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-date-number { font-size: 18px; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-day.has-events .calendar-date-number,
  .agenda-calendar .calendar-months[data-count='1'] .calendar-day:not(.is-today) .calendar-date-number::before { font-size: 25px; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-day.is-today .calendar-date-number { min-width: 32px; height: 32px; margin: -5px 0 -5px -8px; padding: 0 8px; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-day.has-events.is-today .calendar-date-number { min-width: 40px; height: 40px; margin: -6px 0 -6px -9px; padding: 0 9px; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-day.is-today:not(.has-events) .calendar-date-number { margin-top: -1.2px; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-day.has-events.is-today .calendar-date-number { margin-top: -7.5px; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-event-label,
  .agenda-calendar .calendar-months[data-count='1'] .calendar-event-label.to-next:not(.from-prev) { font-size: 13.5px; line-height: 1.25; }
  .agenda-calendar .calendar-months[data-count='1'] .calendar-event-more { font-size: 12.5px; }
}

/* Names wrap between words. site.js marks the names that are hyphenated by
   syllable instead: a name with a word wider than its day, or one that fits
   its lines only with hyphens. */
.agenda-calendar .calendar-event-label { hyphens: manual; -webkit-hyphens: manual; overflow-wrap: normal; }
/* A break leaves at least three letters on either side («Composi-tion»,
   never «Compositi-on»). */
.agenda-calendar .calendar-event-label.needs-hyphens { hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word; hyphenate-limit-chars: 6 3 3; -webkit-hyphenate-limit-before: 3; -webkit-hyphenate-limit-after: 3; }
/* While site.js measures the names, they are plain unclamped blocks. */
.agenda-calendar .calendar-months.is-fitting .calendar-day .calendar-event-label { display: block; }

/* «Karte anzeigen»: an outlined button in the wine of the site's actions,
   as high as the fields beside it. Open, it fills and reads «Karte
   ausblenden»; both names share one place, so its width never changes. */
.agenda-calendar .event-filters > .agenda-map-toggle {
  display: inline-flex;
  align-self: flex-end;
  align-items: center;
  justify-content: center;
  gap: 10px;
  box-sizing: border-box;
  height: 46px;
  min-height: 46px;
  padding: 0 22px 0 18px;
  border: 1px solid var(--wine);
  border-radius: 999px;
  background: var(--surface);
  color: var(--wine);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--motion-quick) ease, border-color var(--motion-quick) ease, color var(--motion-quick) ease;
}
.agenda-calendar .agenda-map-toggle svg { flex: none; width: 18px; height: 18px; }
.agenda-calendar .agenda-map-toggle-label { display: inline-grid; }
.agenda-calendar .agenda-map-toggle-label > span { grid-area: 1 / 1; }
.agenda-calendar .agenda-map-toggle[aria-expanded='false'] [data-map-label='hide'],
.agenda-calendar .agenda-map-toggle[aria-expanded='true'] [data-map-label='show'] { visibility: hidden; }
.agenda-calendar .event-filters > .agenda-map-toggle[aria-expanded='true'] { background: var(--wine); color: #fffcf6; }
@media (hover: hover) and (pointer: fine) {
  .agenda-calendar .event-filters > .agenda-map-toggle:hover { background: #6a0f1c12; }
  .agenda-calendar .event-filters > .agenda-map-toggle[aria-expanded='true']:hover { border-color: var(--wine-deep); background: var(--wine-deep); }
}
/* The map opens below the filter line, across the width of the calendar. */
.agenda-calendar .agenda-map-disclosure[hidden] { display: none; }
.agenda-calendar .agenda-map-disclosure { margin: -4px 0 18px; }
.agenda-calendar .agenda-map-disclosure > .map-card { margin: 0; }
/* Fields and button share one line on tablets: the fields give up width
   first (they are measured from their smallest width, so the line does not
   break before they shrink). Phones keep the two fields side by side and, as
   before, choose the town with «Ort» instead of the map. */
@media (min-width: 641px) {
  .agenda-calendar .event-filters > label { flex: 1 1 176px; width: auto; max-width: 260px; }
  .agenda-calendar .event-filters > .agenda-map-toggle { flex: none; }
}
@media (max-width: 640px) {
  .agenda-calendar .event-filters > .agenda-map-toggle,
  .agenda-calendar .agenda-map-disclosure { display: none; }
}
@media print {
  .agenda-calendar :is(.agenda-months-switch, .agenda-map-disclosure) { display: none; }
}

/* ==========================================================================
   Round 3 · agenda · point 40
   «Pfeile auf die Höhe von „Karte anzeigen“ absenken» and «eine kleine
   Text-Box (weisser Kasten Design) mit einer Vorschau der nächsten
   Wettbewerbe»: the month steps close the filter line; the white box
   «Kommende Wettbewerbe» stands beside the month and the switches.
   ========================================================================== */

/* Month steps: at the end of the filter line, on the bottom line of the
   fields and as high as they and «Karte anzeigen». The fields give up width
   first; a line too narrow for all of them puts the steps on a line of their
   own, still on the right. */
.agenda-calendar .agenda-filter-bar > .calendar-controls { flex: none; flex-wrap: nowrap; margin-left: auto; }
.agenda-calendar .agenda-filter-bar > .calendar-controls > button { height: 46px; min-height: 46px; }
@media (min-width: 641px) {
  .agenda-calendar .agenda-filter-options { flex: 1 1 0; min-width: min-content; }
  .agenda-calendar .agenda-filter-options > .event-filters { flex-wrap: nowrap; }
  .agenda-calendar .agenda-filter-options > .event-filters > label { min-width: 150px; }
}

/* The box: the white card of the lists and «Weisser Kasten». Its title and
   «Alle Wettbewerbe» share a narrow column; the lines are a small table of
   dates (in the red of the dates on cards) and names. Each line is a link
   24px high, the least a pointer or a finger should have to hit (WCAG 2.2,
   2.5.8); the title and «Alle Wettbewerbe» keep that measure, so they stand
   on the lines of the first and the last entry. Where the box is taller than
   its lines, they stay together in its middle. */
.agenda-calendar .agenda-preview {
  display: grid;
  grid-template-columns: min-content minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: center;
  column-gap: 28px;
  box-sizing: border-box;
  min-width: 0;
  padding: 10px 24px;
  border: 1px solid #2b18100f;
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}
.agenda-calendar .agenda-preview[hidden] { display: none; }
.agenda-calendar .agenda-preview-title { grid-column: 1; grid-row: 1; align-self: start; margin: 0; color: var(--ink); font-size: 15px; font-weight: 600; line-height: 24px; letter-spacing: 0; }
.agenda-calendar .agenda-preview-all { grid-column: 1; grid-row: 2; align-self: end; gap: 8px; padding: 0; font-size: 14px; line-height: 24px; white-space: nowrap; }
.agenda-calendar .agenda-preview-all svg { width: 15px; height: 15px; }
/* Beside the lines, «Alle Wettbewerbe» stands on the baseline of the last
   one: lifted by the 0.1em its label sits low in every button and link. */
@media (min-width: 680px) {
  .agenda-calendar .agenda-preview-all { margin-bottom: var(--control-label-offset); }
}
.agenda-calendar .agenda-preview-list {
  display: grid;
  grid-column: 2;
  grid-row: 1 / 3;
  grid-template-columns: max-content minmax(0, 1fr);
  align-content: space-between;
  margin: 0;
  padding: 0;
  list-style: none;
}
.agenda-calendar .agenda-preview-list > li { display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; margin: 0; padding: 0; }
.agenda-calendar .agenda-preview-list > li[hidden] { display: none; }
.agenda-calendar .agenda-preview-line { display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; column-gap: 16px; align-items: baseline; color: var(--ink); font-size: 15px; line-height: 24px; text-decoration: none; }
.agenda-calendar .agenda-preview-date { color: var(--wine); font-size: 14px; font-weight: 600; white-space: nowrap; }
.agenda-calendar .agenda-preview-name { text-wrap: balance; }
.agenda-calendar .agenda-preview-count { color: var(--muted); }
.agenda-calendar .agenda-preview-line:is(:hover, :focus-visible) .agenda-preview-name { color: var(--wine); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
/* The lines sit close together: the focus ring keeps to its own line. */
.agenda-calendar .agenda-preview-line:focus-visible { outline-offset: 2px; border-radius: 6px; }

/* Wide screens: the month and the switches on the left, the box beside them
   on the right, its top level with the month and its foot with the
   switches. From 1281px, where the switches already stood below the month,
   the calendar below stays where it was. */
@media (min-width: 1024px) {
  .agenda-calendar .agenda-header:has(> .agenda-preview:not([hidden])) {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr) auto;
    column-gap: 12px;
    row-gap: 20px;
    align-items: end;
  }
  .agenda-calendar .agenda-header:has(> .agenda-preview:not([hidden])) > div:first-child { grid-column: 1 / -2; grid-row: 1; align-self: start; }
  .agenda-calendar .agenda-header:has(> .agenda-preview:not([hidden])) > .agenda-view-switch { grid-row: 2; }
  .agenda-calendar .agenda-header > .agenda-preview { grid-column: -2; grid-row: 1 / 3; align-self: stretch; }
  .agenda-calendar .agenda-preview { padding-block: 6px; }
}
/* «1 Monat | 2 Monate» gets a column of its own only where it shows, so
   the box keeps that room elsewhere. */
@media (min-width: 1281px) {
  .agenda-calendar.is-enhanced[data-view='month'] .agenda-header:has(> .agenda-preview:not([hidden])) { grid-template-columns: max-content max-content minmax(0, 1fr) auto; }
}
/* Up to 1280px the box keeps to a slightly narrower measure. */
@media (min-width: 1024px) and (max-width: 1280px) {
  .agenda-calendar .agenda-preview { column-gap: 22px; padding-inline: 20px; }
  .agenda-calendar .agenda-preview-line { column-gap: 14px; }
}
/* Tablets: the box on a line of its own below the month and the switch. */
@media (min-width: 680px) and (max-width: 1023px) {
  .agenda-calendar .agenda-header > .agenda-preview { flex: 1 1 100%; }
}
/* Phones: a compact box below the title, the lines under its title. */
@media (max-width: 679px) {
  .agenda-calendar .agenda-preview { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; row-gap: 10px; margin-top: 18px; padding: 14px 18px 16px; }
  .agenda-calendar :is(.agenda-preview-title, .agenda-preview-list, .agenda-preview-all) { grid-column: 1; grid-row: auto; }
  .agenda-calendar .agenda-preview-list { row-gap: 6px; }
  /* A name on two lines keeps them close; an entry on one line is still a
     target 24px high, its text in the middle. */
  .agenda-calendar .agenda-preview-line { min-height: 24px; align-content: center; line-height: 20px; }
}
/* Small phones: each date above its name, as on the cards. */
@media (max-width: 374px) {
  .agenda-calendar .agenda-preview-list { grid-template-columns: minmax(0, 1fr); row-gap: 10px; }
  .agenda-calendar .agenda-preview-line { grid-template-columns: minmax(0, 1fr); row-gap: 1px; }
}

/* ==========================================================================
   Round 2 · People (points 17 and 33, Stefan Escher's e-mail of 24 October)
   ========================================================================== */

/* «CV» alone, without «+», marks a profile with a CV. The word reads as a
   link by itself: wine coloured and underlined like the links in a role. */
.people-grid.is-jury .person-heading .text-link {
  align-self: flex-start;
  gap: 0;
  padding: 4px 0 3px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.02em;
  color: var(--wine);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: #6a0f1c55;
  text-underline-offset: 4px;
  transition: color var(--motion-quick) ease, text-decoration-color var(--motion-quick) ease;
}
.people-grid.is-jury .person-heading .text-link:hover { color: var(--red); text-decoration: underline; text-decoration-color: currentColor; }
/* Phones: «CV» stands under the name and role, as on larger screens. */
@media (max-width: 560px) {
  .people-grid.is-jury > .person-card > .person-summary { padding-right: 14px; }
}

/* "Über uns": everybody may have a CV, opened like a juror's. The «CV» link
   lies over the whole card, as a juror's card opens from anywhere; links in
   the role stay on top and keep working. */
.people-profiles > .person-card.has-cv { position: relative; }
.people-profiles .person-cv:not([open]) > summary::after { content: ''; position: absolute; inset: 0; }
.people-profiles > .person-card.has-cv .person-role a { position: relative; z-index: 1; }
.people-profiles > .person-card.has-cv > .person-summary { transition: background var(--motion-quick) ease; }
.people-profiles > .person-card.has-cv .person-heading { align-self: stretch; }
.people-profiles .person-cv { margin-top: auto; padding-top: 8px; }
/* At least 24 px to tap, though the word is shorter. */
.people-profiles .person-cv > summary { min-width: 24px; min-height: 24px; margin: 0; list-style: none; cursor: pointer; }
.people-profiles .person-cv > summary::-webkit-details-marker { display: none; }
.people-grid.is-jury .person-cv > summary.text-link:is(:hover, :focus-visible) { text-decoration-color: currentColor; }
@media (hover: hover) and (pointer: fine) {
  .people-profiles > .person-card.has-cv:has(.person-cv > summary:hover) { border-color: #b49a85; box-shadow: 0 4px 14px #49251c0a; }
  .people-profiles > .person-card.has-cv:has(.person-cv > summary:hover) > .person-summary { background: #6a0f1c06; }
  .people-profiles > .person-card.has-cv:has(.person-cv > summary:hover) .person-heading strong { color: var(--wine); }
}
.people-profiles > .person-card.has-cv:has(.person-cv > summary:focus-visible) { border-color: #b49a85; box-shadow: 0 4px 14px #49251c0a; outline: 2px solid var(--wine); outline-offset: 3px; }
.people-profiles > .person-card.has-cv:has(.person-cv > summary:focus-visible) .person-heading strong { color: var(--wine); }
/* Without JavaScript the CV opens in the card, across the row. */
.people-profiles > .person-card:has(.person-cv[open]) { grid-column: 1 / -1; }
.people-profiles .person-cv > .person-bio { padding: 10px 0 4px; font-size: 15px; }
.people-profiles .person-cv > .person-bio > :first-child { margin-top: 0; }
@media (max-width: 560px) {
  .people-profiles .person-cv { padding-top: 2px; }
}

/* The dialog shows the person's function with its line breaks and links,
   underlined as on the card. */
.person-dialog-role > p { margin: 0; }
.person-dialog-role a { color: var(--wine); text-decoration: underline; text-decoration-thickness: 1px; text-decoration-color: #6a0f1c55; text-underline-offset: 3px; }
.person-dialog-role a:hover { color: var(--red); text-decoration-color: currentColor; }

/* Round 3 · competition · point 33: jurors in the card of «Über uns»
   (render.js), name and instrument beside the portrait. A row holds as many
   cards as fit at that card's width on «Über uns» (about 275px and more):
   four beside the page menu on wide screens, then three, two and one, as the
   editor's column setting allows; one per row on phones and, as before, up
   to 640px. */
.collection-layout.collection-jury { container: jury-cards / inline-size; }
.collection-layout.collection-jury .people-grid.is-jury { grid-template-columns: minmax(0, 1fr); }
@container jury-cards (width >= 582px) {
  .collection-layout.collection-jury:not(.collection-columns-1) .people-grid.is-jury { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container jury-cards (width >= 855px) {
  .collection-layout.collection-jury:is(.collection-columns-3, .collection-columns-4) .people-grid.is-jury { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@container jury-cards (width >= 1145px) {
  .collection-layout.collection-jury.collection-columns-4 .people-grid.is-jury { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* Beside the page menu, three or four cards per row (and two on narrow
   tablets) are too narrow for portrait and name side by side: the portrait
   of people sections placed there (e.g. accompanists) stands above the name,
   so names and roles keep their lines and «CV» closes every card at the same
   height. Wider pairs (641–760 and 901–1050 px) keep the portrait beside the
   name. */
@media (min-width: 761px) and (max-width: 900px), (min-width: 1051px) {
  .with-sidebar .section-people:is(.people-columns-3, .people-columns-4) .people-grid.people-profiles > .person-card > .person-summary {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    min-height: 0;
    height: 100%;
    padding: 14px;
  }
  .with-sidebar .section-people:is(.people-columns-3, .people-columns-4) .people-grid.people-profiles .person-heading {
    flex: 1 1 auto;
    width: 100%;
    padding-top: 0;
  }
  .with-sidebar .section-people:is(.people-columns-3, .people-columns-4) .people-grid.people-profiles .person-heading strong { text-wrap: balance; }
  .with-sidebar .section-people:is(.people-columns-3, .people-columns-4) .people-grid.people-profiles .person-role { text-wrap: pretty; }
}
/* "Auf der Website ausblenden" (Round 2): only the CMS preview renders a
   hidden section. A dashed frame and the label «Ausgeblendet» set it apart
   without moving anything. The frame starts inside the section's top
   padding, so it never reaches into the section above. */
.page-section.is-hidden-section { position: relative; }
.page-section.is-hidden-section::before {
  content: '';
  position: absolute;
  inset: 12px -14px -14px;
  border: 2px dashed #291e1d55;
  border-radius: var(--radius);
  pointer-events: none;
}
.preview-hidden-marker {
  display: inline-block;
  padding: 5px 11px;
  border-radius: 999px;
  background: #291e1d;
  color: var(--cream);
  font-size: 11px;
  font-weight: 600;
  line-height: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.page-section.is-hidden-section > .preview-hidden-marker {
  position: absolute;
  top: 1px;
  left: 0;
  z-index: 1;
}
/* Side by side in a people row (Ehrenpräsident | Ehrentafel) the frame's
   inner edge stays inside its half of the 14px gap. */
.people-row > .page-section.is-hidden-section:first-child::before { right: -6px; }
.people-row > .page-section.is-hidden-section:last-child::before { left: -6px; }
@media (max-width: 1250px) {
  .people-row > .page-section.is-hidden-section:is(:first-child, :last-child)::before { left: -14px; right: -14px; }
}
.page-sidebar nav > a.is-hidden-section-link .sidebar-link-text { display: grid; justify-items: start; gap: 6px; min-width: 0; }
.page-sidebar nav > a.is-hidden-section-link .preview-hidden-marker { padding: 3px 8px; font-size: 10px; line-height: 12px; }

/* Round 3: the four collapsible sections in place of «Unterlagen» give the
   competition menu one entry more. On laptop screens up to 820px high its
   rows close up a little (37px instead of 43px), so the whole menu still
   fits below the header and stays in view while the page scrolls (site.js
   pins it only when it fits). The red marker keeps to the text. */
@media (min-width: 761px) and (max-height: 820px) {
  .page-sidebar nav > a:not(.button) { padding-block: 8px; }
  .page-sidebar nav > a:not(.button)::before { top: 9px; bottom: 9px; }
  .page-sidebar .sidebar-registration { margin-top: 18px; }
}