/* KULTURBRÜCKE — full-screen editorial experience for Culture & Art. */
.culture-experience {
  position: fixed;
  inset: 0;
  width: 100vw;
  max-width: none;
  height: 100vh;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: auto;
  border: 0;
  border-radius: 0;
  color: #f4faff;
  background: #06172d;
  overscroll-behavior: contain;
  scrollbar-color: rgb(113 214 255 / 55%) rgb(4 21 40 / 55%);
}
.culture-experience[open] { display: block; }
.culture-experience::backdrop { background: rgb(1 10 24 / 91%); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.culture-experience__scene, .culture-experience__shade { position: fixed; inset: 0; pointer-events: none; }
.culture-experience__scene {
  z-index: 0;
  background-image: url("../assets/culture/culture-heritage-scene.webp");
  background-size: cover;
  background-position: center;
  filter: saturate(.92);
  transform: scale(1.015);
  animation: culture-scene-arrive 800ms cubic-bezier(.2,.7,.2,1) both;
}
.culture-experience__shade {
  z-index: 0;
  background: linear-gradient(105deg, rgb(2 13 30 / 79%), rgb(3 20 42 / 58%) 44%, rgb(5 22 42 / 64%)), radial-gradient(ellipse at 75% 15%, rgb(83 197 255 / 20%), transparent 43%), linear-gradient(0deg, rgb(3 13 29 / 83%), transparent 34%);
}
.culture-experience__inner { position: relative; z-index: 1; display: grid; width: min(100%, 1560px); min-height: 100%; grid-template-rows: auto 1fr auto; gap: clamp(1rem, 2vh, 1.8rem); margin-inline: auto; padding: clamp(.85rem, 2.4vw, 2.2rem) clamp(.85rem, 4vw, 4.2rem) 1rem; }
.culture-experience__topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.culture-experience__brand { display: flex; min-width: 0; align-items: center; gap: .8rem; }
.culture-experience__mark { display: grid; width: 2.8rem; height: 2.8rem; flex: 0 0 auto; place-items: center; border: 1px solid rgb(157 230 255 / 48%); border-radius: .9rem; color: #e6faff; background: linear-gradient(145deg, rgb(78 195 246 / 31%), rgb(4 40 75 / 70%)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 20%), 0 0 25px rgb(52 184 255 / 18%); font-size: 1.2rem; }
.culture-experience__brand-name { margin: 0; color: white; font-size: .88rem; font-weight: 820; letter-spacing: .18em; }
.culture-experience__brand-tag { margin: .22rem 0 0; color: #b9deef; font-size: .62rem; font-weight: 650; letter-spacing: .14em; }
.culture-experience__close { display: grid; width: 3rem; height: 3rem; flex: 0 0 auto; place-items: center; border: 1px solid rgb(210 240 255 / 36%); border-radius: 50%; color: white; background: rgb(5 23 45 / 76%); box-shadow: inset 0 1px 0 rgb(255 255 255 / 12%); cursor: pointer; transition: transform 180ms ease, border-color 180ms ease, background 180ms ease; }
.culture-experience__close span { margin-top: -.1em; font-size: 2rem; font-weight: 300; line-height: 1; }
.culture-experience__close:hover { transform: rotate(90deg); border-color: #9ae9ff; background: rgb(26 106 157 / 77%); }
.culture-experience__content { display: grid; width: 100%; max-width: 1320px; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); align-items: center; gap: clamp(1.2rem, 3.6vw, 4.3rem); margin: auto; }
.culture-experience__intro { max-width: 33rem; padding-block: 1rem 2rem; }
.culture-experience__kicker { margin: 0 0 1.55rem; color: #a7e8ff; font-size: .66rem; font-weight: 800; letter-spacing: .2em; }
.culture-experience__intro h2 { max-width: 11ch; margin: 0; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(3rem, 6vw, 6.2rem); font-weight: 450; letter-spacing: -.055em; line-height: .98; text-wrap: balance; text-shadow: 0 8px 42px rgb(0 8 20 / 46%); }
.culture-experience__intro-copy { max-width: 29rem; margin: 1.3rem 0 0; color: #e1f1fa; font-size: clamp(.98rem, 1.45vw, 1.2rem); line-height: 1.7; text-wrap: pretty; }
.culture-experience__ornament { display: flex; width: min(13rem, 65%); align-items: center; gap: .45rem; margin-top: 1.8rem; }
.culture-experience__ornament span { height: 1px; flex: 1; background: linear-gradient(90deg, transparent, #8ee7ff); box-shadow: 0 0 12px rgb(86 215 255 / 65%); }
.culture-experience__ornament span:last-child { background: linear-gradient(90deg, #8ee7ff, transparent); }
.culture-experience__ornament i { width: .42rem; height: .42rem; border: 1px solid #d9f9ff; border-radius: 50%; background: #76dfff; box-shadow: 0 0 14px rgb(90 222 255 / 85%); }
.culture-experience__bridge-line { margin: .8rem 0 0; color: #cce8f5; font-size: .78rem; letter-spacing: .025em; }
.culture-experience__chapter-index { display: flex; align-items: center; gap: .6rem; margin-top: 2rem; }
.culture-experience__chapter-index span { display: grid; width: 2rem; height: 2rem; place-items: center; border: 1px solid rgb(146 225 255 / 33%); border-radius: 50%; color: #c9efff; background: rgb(15 73 110 / 40%); font-size: .66rem; font-weight: 750; }
.culture-experience__chapter-index span + span { margin-left: .1rem; }
.culture-experience__glass { min-width: 0; padding: clamp(1rem, 1.9vw, 1.65rem); border: 1px solid rgb(188 235 255 / 36%); border-radius: 1.6rem; background: linear-gradient(145deg, rgb(8 42 72 / 83%), rgb(4 19 40 / 86%)); box-shadow: 0 28px 86px rgb(0 6 20 / 40%), inset 0 1px 0 rgb(255 255 255 / 17%), inset 0 0 42px rgb(62 174 226 / 8%); -webkit-backdrop-filter: blur(25px) saturate(145%); backdrop-filter: blur(25px) saturate(145%); animation: culture-panel-arrive 540ms 70ms cubic-bezier(.2,.7,.2,1) both; }
.culture-experience__tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .35rem; padding: .32rem; border: 1px solid rgb(183 232 255 / 20%); border-radius: 999px; background: rgb(1 16 34 / 45%); }
.culture-experience__tab { min-width: 0; min-height: 2.8rem; padding: .55rem .65rem; border: 1px solid transparent; border-radius: 999px; color: #c3dfed; background: transparent; font: inherit; font-size: clamp(.67rem, .84vw, .78rem); font-weight: 720; line-height: 1.25; cursor: pointer; transition: color 170ms ease, background 170ms ease, border-color 170ms ease; }
.culture-experience__tab:hover { color: #fff; background: rgb(111 208 255 / 11%); }
.culture-experience__tab[aria-selected="true"] { border-color: rgb(136 224 255 / 49%); color: #fff; background: linear-gradient(135deg, rgb(52 153 208 / 43%), rgb(16 73 116 / 55%)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 13%), 0 0 18px rgb(47 179 238 / 13%); }
.culture-experience__tabpanel { padding: 1.15rem .1rem .45rem; }
.culture-experience__chapter-kicker { margin: 0 0 .45rem; color: #91ddfa; font-size: .61rem; font-weight: 820; letter-spacing: .18em; }
.culture-experience__chapter-heading h3 { margin: 0; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.55rem, 2.35vw, 2.2rem); font-weight: 500; letter-spacing: -.025em; line-height: 1.18; text-wrap: balance; }
.culture-experience__chapter-heading > p:last-child { max-width: 54rem; margin: .55rem 0 1.1rem; color: #d7eaf4; font-size: .91rem; line-height: 1.65; }
.culture-experience__country-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.culture-experience__country-card { min-width: 0; padding: 1rem; border: 1px solid rgb(184 232 255 / 23%); border-radius: 1.05rem; background: linear-gradient(145deg, rgb(14 53 84 / 66%), rgb(3 24 48 / 73%)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 8%); }
.culture-experience__country-card--tm { border-top: 2px solid rgb(66 214 183 / 73%); }
.culture-experience__country-card--de { border-top: 2px solid rgb(255 182 105 / 73%); }
.culture-experience__country-label { margin: 0 0 .45rem; color: #9de5ff; font-size: .6rem; font-weight: 830; letter-spacing: .17em; }
.culture-experience__country-card h4 { margin: 0 0 .55rem; color: #fff; font-size: 1rem; font-weight: 780; line-height: 1.35; }
.culture-experience__country-card > p:not(.culture-experience__country-label) { margin: 0; color: #d1e5f0; font-size: .81rem; line-height: 1.62; }
.culture-experience__country-card ul { display: grid; gap: .46rem; margin: .85rem 0 0; padding: 0; list-style: none; }
.culture-experience__country-card li { position: relative; padding-left: 1.05rem; color: #e4f3fb; font-size: .76rem; line-height: 1.45; }
.culture-experience__country-card li::before { position: absolute; top: .5em; left: .08rem; width: .38rem; height: .38rem; border-radius: 50%; content: ""; background: #7be4ff; box-shadow: 0 0 10px rgb(97 222 255 / 55%); }
.culture-experience__note { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .8rem; margin-top: .85rem; padding: .9rem 1rem; border: 1px solid rgb(117 213 255 / 30%); border-radius: 1rem; background: linear-gradient(115deg, rgb(27 111 158 / 28%), rgb(5 31 58 / 50%)); }
.culture-experience__note > span { color: #a5edff; font-size: 1.35rem; text-shadow: 0 0 12px rgb(93 218 255 / 75%); }
.culture-experience__note p:first-child { margin: 0 0 .28rem; color: #95e4ff; font-size: .59rem; font-weight: 850; letter-spacing: .14em; }
.culture-experience__note p:last-child { margin: 0; color: #e0f0f8; font-size: .8rem; line-height: 1.55; }
.culture-experience__sources { display: grid; grid-template-columns: minmax(9rem, .48fr) minmax(0, 1fr); gap: .8rem; align-items: start; margin-top: .95rem; padding-top: .8rem; border-top: 1px solid rgb(194 237 255 / 19%); }
.culture-experience__sources h4 { margin: .1rem 0 0; color: #a9eaff; font-size: .71rem; font-weight: 800; }
.culture-experience__sources ul { display: grid; gap: .42rem; margin: 0; padding: 0; list-style: none; }
.culture-experience__source-link { color: #e5f6ff; font-size: .73rem; line-height: 1.45; text-decoration-color: rgb(157 225 255 / 58%); text-underline-offset: .22em; }
.culture-experience__source-link:hover { color: #fff; text-decoration-thickness: 2px; }
.culture-experience__footer { display: flex; align-items: end; justify-content: space-between; gap: 1rem; width: 100%; max-width: 1320px; margin: 0 auto; color: #bfd9e7; font-size: .66rem; line-height: 1.45; }
.culture-experience__footer b { color: #7cddff; }
.culture-experience button:focus-visible, .culture-experience a:focus-visible { outline: 3px solid #e1f9ff; outline-offset: 3px; }
.culture-experience__open { border: 0; padding: 0; background: transparent; font: inherit; cursor: pointer; text-align: left; }
.culture-section__credit { margin-top: -.4rem; color: #a8d2e6; font-size: .75rem; letter-spacing: .025em; }
@keyframes culture-scene-arrive { from { opacity: .5; transform: scale(1.055); } to { opacity: 1; transform: scale(1.015); } }
@keyframes culture-panel-arrive { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 1000px) {
  .culture-experience__content { grid-template-columns: minmax(0, .58fr) minmax(0, 1.42fr); gap: 1.1rem; }
  .culture-experience__intro h2 { font-size: clamp(2.7rem, 6vw, 4.7rem); }
  .culture-experience__glass { padding: 1rem; }
  .culture-experience__country-grid { gap: .55rem; }
  .culture-experience__country-card { padding: .8rem; }
  .culture-experience__sources { grid-template-columns: 1fr; gap: .45rem; }
}
@media (max-width: 760px) {
  .culture-experience__inner { gap: 1rem; padding: .7rem .7rem .9rem; }
  .culture-experience__topbar { position: sticky; top: 0; z-index: 4; padding: .2rem .1rem .55rem; background: linear-gradient(180deg, rgb(3 17 36 / 82%), transparent); }
  .culture-experience__mark { width: 2.35rem; height: 2.35rem; }
  .culture-experience__brand-name { font-size: .75rem; letter-spacing: .13em; }
  .culture-experience__brand-tag { max-width: 15rem; font-size: .53rem; letter-spacing: .09em; }
  .culture-experience__close { width: 2.7rem; height: 2.7rem; }
  .culture-experience__content { grid-template-columns: 1fr; gap: .9rem; align-items: start; }
  .culture-experience__intro { padding: .45rem .15rem 0; }
  .culture-experience__kicker { margin-bottom: .8rem; font-size: .58rem; }
  .culture-experience__intro h2 { max-width: 100%; font-size: clamp(2.9rem, 14vw, 4.8rem); }
  .culture-experience__intro-copy { margin-top: .8rem; font-size: .96rem; line-height: 1.58; }
  .culture-experience__ornament { margin-top: 1rem; }
  .culture-experience__chapter-index { margin-top: .95rem; }
  .culture-experience__glass { padding: .8rem; border-radius: 1.2rem; }
  .culture-experience__tabs { grid-template-columns: 1fr; gap: .25rem; border-radius: .95rem; }
  .culture-experience__tab { min-height: 2.65rem; border-radius: .72rem; text-align: left; padding: .6rem .85rem; }
  .culture-experience__tabpanel { padding: .95rem .1rem .35rem; }
  .culture-experience__chapter-heading h3 { font-size: 1.55rem; }
  .culture-experience__chapter-heading > p:last-child { font-size: .87rem; }
  .culture-experience__country-grid { grid-template-columns: 1fr; }
  .culture-experience__country-card { padding: .9rem; }
  .culture-experience__sources { grid-template-columns: 1fr; gap: .5rem; }
  .culture-experience__source-link { font-size: .78rem; }
  .culture-experience__footer { align-items: start; flex-direction: column; gap: .35rem; }
}
@media (prefers-reduced-motion: reduce) {
  .culture-experience__scene, .culture-experience__glass { animation: none !important; }
  .culture-experience__close, .culture-experience__tab { transition: none !important; }
}
@media (forced-colors: active) {
  .culture-experience__glass, .culture-experience__country-card, .culture-experience__note, .culture-experience__tab, .culture-experience__close { border: 1px solid CanvasText; }
  .culture-experience__intro-copy, .culture-experience__country-card p, .culture-experience__country-card li, .culture-experience__note p:last-child { color: CanvasText; }
}
