/* Shared Summer Sessions layout, with the event's midnight-purple palette. */
.eurovision-page {
  --gold: #c5abd9;
  --warm-gold: #c5abd9;
  --muted: #c1bacb;
  --line: #ffffff24;
  --display-font: "futura-pt", "Montserrat", sans-serif;
  --poster-headline-font: "Anton", "futura-pt", "Montserrat", sans-serif;
  --poster-copy-font: "Avenir Next", "Avenir", "Montserrat", sans-serif;
  background: #0d0b14;
  color: #f8f4ef;
  overflow-x: clip;
}
html { max-width: 100%; overflow-x: hidden; scroll-padding-top: 120px; }
.eurovision-page .page-main { max-width: 100%; overflow-x: clip; }
.eurovision-page .site-header.is-scrolled { background: #191122f5; border-bottom-color: var(--line); box-shadow: none; }
.eurovision-page .site-nav { background: #ffffff03; box-shadow: none; }
.eurovision-page .site-nav .nav-cta { margin-left: 4px; }
.eurovision-page .site-nav a { padding-inline: 12px; }
.eurovision-page .site-footer { background: #100d18; border-top: 1px solid var(--line); }
.eurovision-page .footer-links a:hover { color: #dcc9ed; text-shadow: none; }
.wrap { width: min(1180px, calc(100% - 80px)); margin-inline: auto; }
.eurovision-page .eyebrow { color: var(--gold); font-size: 13px; font-weight: 600; letter-spacing: .16em; }
.presented-by { display: flex; flex-direction: column; align-items: center; gap: 8px; margin: 0 0 26px; color: var(--gold); }
.presented-by img { display: block; width: clamp(190px, 23vw, 280px); height: auto; }
.presented-by span { font-size: 12px; font-weight: 600; line-height: 1; letter-spacing: .28em; text-transform: uppercase; }
.event-hero { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); align-items: center; gap: 90px; padding-block: 64px 76px; }
.event-hero h1 { font-size: clamp(44px,5.8vw,78px); line-height: 1.06; letter-spacing: .025em; }
.event-hero h1 span { color: #cbb6df; }
.headline { margin: 28px 0 18px; font-family: var(--display-font); font-size: 22px; font-weight: 700; font-style: normal; line-height: 1.15; letter-spacing: -.02em; max-width: 390px; }
.intro { max-width: 500px; color: var(--muted); font-size: 16px; line-height: 1.8; }
.event-meta { border-block: 1px solid var(--line); margin-block: 30px; padding-block: 22px; display: grid; gap: 18px; font-family: "Montserrat", sans-serif; font-size: 16px; }
.event-meta p { margin: 0; }
.event-meta span { display: block; margin-bottom: 5px; color: var(--gold); text-transform: uppercase; letter-spacing: .12em; font-size: 12px; }
.event-meta .venue-jump { color: inherit; text-decoration: underline; text-decoration-color: #ffffff66; text-underline-offset: 5px; }
.event-meta .venue-jump:hover { color: #ffffff; text-decoration-color: currentColor; }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; }
.eurovision-page .button { background: #dacbe7; color: #1c1326; border: 1px solid #dacbe7; border-radius: 5px; font-size: 14px; font-weight: 600; min-height: 48px; }
.eurovision-page .button:hover { background: #e9dff1; transform: none; box-shadow: none; }
.text-link { font-size: 14px; text-decoration: underline; text-underline-offset: 5px; }
.text-link:hover { color: #dcc9ed; }
.small-note { color: var(--muted); font-size: 13px; margin: 16px 0 0; }
.event-navigation { border-block: 1px solid var(--line); background: #17121f; }
.event-navigation .wrap { display: flex; flex-wrap: wrap; gap: 12px 40px; padding-block: 20px; }
.event-navigation a { font-size: 14px; padding-block: 5px; }
.event-navigation a:hover { color: #dcc9ed; }
.eurovision-page .section { padding: 80px 0; }
.eurovision-page h2 { font-family: var(--display-font); font-size: clamp(32px,3.6vw,48px); font-weight: 700; font-style: normal; line-height: 1.05; letter-spacing: -.025em; margin-bottom: 20px; }
.eurovision-page h3 { font-family: var(--display-font); font-size: 21px; font-weight: 700; font-style: normal; line-height: 1.2; }
.eurovision-page .section-heading { text-align: left; max-width: none; margin: 0 0 36px; }
.eurovision-page .section-heading p:not(.eyebrow) { font-size: 16px; }
.features { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 30px; }
.features article { border-top: 1px solid var(--line); padding-top: 24px; }
.features h3 { margin-bottom: 14px; }
.features p, .seat-card p, .booking p, .faq p { color: var(--muted); font-size: 16px; line-height: 1.8; margin-bottom: 0; }
.seating-section { background: #17121f; border-block: 1px solid var(--line); }
.section-description { max-width: 780px; color: var(--muted); line-height: 1.8; margin-bottom: 20px; }
.seating-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; margin-top: 36px; }
.seat-card { padding: 30px; border: 1px solid var(--line); border-top: 2px solid #78618e; background: #110e18; border-radius: 5px; }
.seat-card.vip { border-top-color: #c7ad82; }
.card-top { margin-bottom: 26px; }
.tag { color: var(--gold); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; }
.vip .tag { color: #d4bc97; }
.seat-price { display: flex; align-items: baseline; gap: 8px; margin: 16px 0 0 !important; color: #f8f4ef !important; }
.seat-price strong { font-family: var(--display-font); font-size: 34px; font-weight: 700; line-height: 1; }
.seat-price span { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.eurovision-page .seat-card h3 { font-family: var(--display-font); font-size: 28px; margin-bottom: 18px; }
.includes-heading { margin-top: 26px !important; color: #f8f4ef !important; font-size: 12px !important; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.tier-includes { list-style: none; padding: 0; margin: 14px 0 0; }
.tier-includes li { position: relative; padding: 8px 0 8px 18px; border-top: 1px solid #ffffff12; color: #e4dbe9; font-size: 14px; line-height: 1.45; }
.tier-includes li::before { content: "•"; position: absolute; left: 0; color: var(--gold); }
.seat-card .seat-detail { font-size: 14px; margin-top: 18px; }
.seat-sizes { list-style: none; padding: 0; margin: 22px 0 0; border-top: 1px solid var(--line); }
.seat-sizes li { display: flex; justify-content: space-between; gap: 16px; padding-top: 12px; color: #e4dbe9; font-size: 14px; }
.seat-sizes li strong { color: #f8f4ef; font-weight: 600; }
.booking { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 80px; align-items: start; }
.booking-status { padding: 32px; border: 1px solid var(--line); border-radius: 5px; }
.booking-status h3 { margin-bottom: 14px; }
.sale-status { display: block; border-top: 1px solid var(--line); padding-top: 20px; margin-top: 24px; font-size: 14px; color: var(--gold); }
#ticket-tailor-booking { min-width: 0; }
#ticket-tailor-booking iframe { width: 100%; border: 0; }
.community-access-teaser { display: flex; align-items: center; justify-content: space-between; gap: 48px; margin-block: 0 80px; padding: 34px; border: 1px solid #e5d1ff25; border-radius: 14px; background: #25153766; }
.community-access-teaser h2 { margin: 4px 0 10px; font-size: clamp(28px, 3vw, 40px); }
.community-access-teaser p:not(.eyebrow) { max-width: 680px; margin: 0; color: var(--muted); line-height: 1.7; }
.community-access-teaser .button { flex: 0 0 auto; }
.info { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 70px; border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; padding: 20px 0; font-weight: 500; font-size: 16px; }
.faq summary::marker { color: var(--gold); }
.faq p { padding-bottom: 24px; }
.faq a { text-decoration: underline; text-underline-offset: 4px; }
a:focus-visible, summary:focus-visible, button:focus-visible { outline: 2px solid #d5bceb; outline-offset: 5px; }
.skip-link { position: absolute; top: -100px; left: 20px; z-index: 20; padding: 12px; background: #fff; color: #111; }
.skip-link:focus { top: 12px; }
@media (max-width: 1100px) {
  .event-hero { gap: 42px; }
  .eurovision-page .site-header { gap: 16px; padding-inline: 24px; }
  .eurovision-page .brand img { width: 210px; }
  .eurovision-page .site-nav { gap: 0; font-size: 13px; }
  .eurovision-page .site-nav a { padding-inline: 10px; }
  .seat-card { padding: 24px; }
}
@media (max-width: 820px) {
  .wrap { width: calc(100% - 40px); }
  .eurovision-page .site-nav { background: #191122; font-size: 15px; }
  .eurovision-page .site-nav .nav-cta { margin: 8px 0 0; }
  .event-hero { gap: 28px; padding-block: 40px 50px; }
  .event-hero h1 { font-size: 42px; }
  .headline { font-size: 19px; }
  .features { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .seating-options { grid-template-columns: 1fr; gap: 16px; }
  .card-top { margin-bottom: 16px; }
  .booking,.info { gap: 32px; }
}
@media (max-width: 600px) {
  .eurovision-page .page-main { padding-top: 82px; }
  .eurovision-page .site-header { padding-inline: 20px; align-items: center; }
  .event-hero { grid-template-columns: 1fr; gap: 36px; }
  .event-hero h1 { font-size: clamp(38px,10.5vw,60px); }
  .event-navigation .wrap { gap: 12px 24px; }
  .eurovision-page .section { padding-block: 52px; }
  .features { gap: 24px; }
  .eurovision-page .features h3 { font-size: 18px; }
  .booking,.info { grid-template-columns: 1fr; }
  .booking-status { padding: 24px; }
  .community-access-teaser { align-items: flex-start; flex-direction: column; gap: 24px; margin-bottom: 52px; padding: 26px; }
  .info .section-heading { margin-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Branded opening with event details alongside the main logo. */
.event-hero { grid-template-columns: 1fr; padding-block: 76px; }
.hero-copy { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .85fr); column-gap: 90px; align-items: start; }
.hero-copy > .eyebrow { grid-column: 1 / -1; }
.hero-copy > h1 { grid-column: 1; grid-row: 2 / 4; }
.hero-copy > .headline { grid-column: 2; grid-row: 2; margin: 0 0 18px; }
.hero-copy > .intro { grid-column: 2; grid-row: 3; margin: 0; }
.hero-copy > .event-meta { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; margin-top: 40px; }
.hero-copy > .actions, .hero-copy > .small-note { grid-column: 1 / -1; }
@media (max-width: 820px) {
  .hero-copy { column-gap: 36px; }
  .event-hero { padding-block: 48px; }
}
@media (max-width: 600px) {
  .hero-copy { display: block; }
  .hero-copy > .headline { margin-top: 26px; }
  .hero-copy > .event-meta { grid-template-columns: 1fr; margin-top: 28px; }
}

/* Supplied Eurovision artwork. */
.eurovision-page .site-header .event-brand img { width: 170px; height: 64px; object-fit: contain; }
.hero-copy { align-items: center; }
.hero-copy > .event-logo { position: relative; isolation: isolate; display: grid; place-items: center; margin: 0; line-height: 0; }
.event-logo::before { content: ""; position: absolute; z-index: 0; top: 50%; left: 50%; width: min(138%, 760px); height: 122%; background: url("./eq-pattern.png") center / contain no-repeat; opacity: .5; filter: blur(3px); transform: translate(-50%, -50%); pointer-events: none; }
.event-logo img { position: relative; z-index: 1; width: 100%; max-width: 560px; height: auto; }
.hero-copy > .headline { align-self: end; }
.hero-copy > .intro { align-self: start; }
@media (max-width: 600px) {
  .eurovision-page .site-header .event-brand img { width: 145px; height: 48px; }
  .event-logo::before { width: 136%; height: 118%; opacity: .5; }
  .event-logo img { max-width: 440px; margin-inline: auto; }
}

/* Independent event navigation. */
.eurovision-page { position: relative; isolation: isolate; }
.event-header { position: relative; z-index: 5; width: min(1320px, calc(100% - 48px)); margin: 18px auto 0; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 14px 22px; border: 1px solid #ffffff29; border-radius: 22px; background: linear-gradient(120deg, #ffffff16, #c58cff0d 48%, #6ea8ff0c); box-shadow: inset 0 1px 0 #ffffff24, 0 14px 42px #13072b2e; -webkit-backdrop-filter: blur(18px) saturate(135%); backdrop-filter: blur(18px) saturate(135%); }
.event-header .event-brand img { width: 176px; height: 76px; object-fit: contain; }
.event-header nav { display: flex; align-items: center; gap: 30px; }
.back-link { font-size: 14px; color: #e0d6e9; }
.eurovision-page .page-main { padding-top: 0; }
.event-hero { padding-block: 42px 58px; }
.hero-copy { column-gap: 64px; }
.event-logo img { mix-blend-mode: screen; }
.venue-section { border-top: 1px solid var(--line); }
.venue-grid { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 50px; align-items: center; }
.venue-details address { font-style: normal; color: #ddd1e7; line-height: 1.8; margin-bottom: 20px; }
.venue-details p,.travel-grid p { color: var(--muted); line-height: 1.8; font-size: 16px; }
.venue-links { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 26px; }
.venue-map { width: 100%; height: 350px; border: 1px solid var(--line); border-radius: 5px; background: #21192c; }
.travel-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; margin-top: 48px; }
.travel-grid article { border-top: 1px solid var(--line); padding-top: 26px; }
.travel-grid .eyebrow { color: var(--gold); font-size: 13px; }
.travel-links { list-style: none; padding: 0; margin: 24px 0 0; }
.travel-links li { margin-top: 12px; }
.travel-links a { font-size: 14px; text-decoration: underline; text-underline-offset: 4px; }
.event-times { margin: 24px 0; font-size: 14px; }
.event-times div { padding: 14px 0; border-bottom: 1px solid var(--line); }
.event-times dd { margin: 6px 0 0; color: var(--gold); }
.travel-grid .timing-note { font-size: 14px; }
.event-footer { display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid var(--line); padding-block: 30px; font-size: 14px; color: var(--muted); }
.event-footer p { margin: 0; }
.event-footer .event-disclaimer { max-width: 680px; margin-top: 8px; color: #aa9fb4; font-size: 12px; line-height: 1.55; }
.event-footer a { color: #e0d6e9; }
@media (max-width: 820px) { .venue-grid { gap: 28px; } .travel-grid { grid-template-columns: 1fr; gap: 28px; } }
@media (max-width: 600px) {
  .eurovision-page .page-main { padding-top: 0; }
  .event-header { width: calc(100% - 24px); gap: 12px; margin-top: 12px; padding: 14px 12px 16px; border-radius: 20px; }
  .event-header .event-brand img { width: 110px; height: 52px; }
  .event-header nav { gap: 12px; }
  .back-link { font-size: 12px; max-width: 70px; }
  .event-header .button { padding-inline: 14px; min-height: 42px; font-size: 13px; }
  .venue-grid { grid-template-columns: 1fr; }
  .venue-map { height: 300px; }
  .event-footer { flex-direction: column; gap: 12px; }
}

.venue-details .venue-alias { color: var(--gold); margin: -8px 0 22px; font-size: 14px; }
.venue-facilities { padding-left: 20px; margin: 24px 0; color: var(--muted); font-size: 15px; line-height: 1.8; }
.venue-facilities li { margin-bottom: 8px; }

/* Centred event identity. */
.hero-copy { display: flex; flex-direction: column; align-items: center; text-align: center; }
.hero-copy > .event-logo { width: min(580px, 100%); }
.event-logo img { max-width: none; width: 100%; margin-inline: auto; }
.hero-copy > .headline { align-self: auto; max-width: 900px; margin: 30px 0 16px; font-family: var(--poster-headline-font); font-size: clamp(38px, 5vw, 68px); font-weight: 400; line-height: .96; letter-spacing: .005em; text-transform: uppercase; }
.hero-copy > .headline span { display: block; }
.hero-copy > .headline span + span { margin-top: .09em; }
.hero-copy > .poster-strapline { max-width: 760px; margin: 0 0 18px; color: #f4eaf8; font-family: var(--poster-copy-font); font-size: clamp(12px, 1.35vw, 16px); font-weight: 500; letter-spacing: .12em; line-height: 1.5; text-transform: uppercase; }
.hero-copy > .intro { align-self: auto; max-width: 680px; margin: 0; font-family: var(--poster-copy-font); }
.hero-copy > .event-meta { width: 100%; grid-template-columns: 1fr 1fr; margin-top: 32px; }
.hero-copy > .actions { justify-content: center; }
@media (max-width: 600px) {
  .hero-copy > .event-meta { grid-template-columns: 1fr; }
  .hero-copy > .headline { margin-top: 24px; font-size: clamp(36px, 11vw, 54px); }
  .hero-copy > .poster-strapline { max-width: 340px; font-size: 11px; letter-spacing: .1em; }
}

/* Poster-style colour wash concentrated around the event identity. */
.event-hero { position: relative; }
.event-hero::before { content: none; }
.event-hero .hero-copy { position: relative; z-index: 1; }

/* Smooth poster-inspired magenta-to-blue backdrop. */
.eurovision-page {
  background:
    radial-gradient(ellipse at 18% 44%, #d200b140 0%, #7d087a24 34%, transparent 62%),
    radial-gradient(ellipse at 78% 34%, #254cff38 0%, #16299a20 40%, transparent 68%),
    linear-gradient(112deg, #480154 0%, #4b076d 33%, #271278 62%, #071b72 100%);
  background-attachment: fixed;
  --muted: #d0c4dc;
}
.eurovision-page .seating-section { background: transparent; border-block: 0; }
.eurovision-page .event-navigation {
  background: #c6a8ee08;
  border-color: #e5d1ff16;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.eurovision-page .seat-card,
.eurovision-page .booking-status {
  background: #25153766;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-color: #e5d1ff25;
  box-shadow: 0 10px 40px #10081d12;
}
.eurovision-page .seat-card { border-top-color: #a989c7; }
.eurovision-page .seat-card.vip { border-top-color: #c7ad82; }
.eurovision-page .event-footer { background: transparent; }
.eurovision-page .info,
.eurovision-page .venue-section,
.eurovision-page .event-header,
.eurovision-page .event-footer { border-color: #e5d1ff20; }

/* Seating colour fades. */
.eurovision-page .seat-card {
  transition: background-color 450ms ease, border-color 450ms ease, box-shadow 450ms ease;
}
@media (hover: hover) {
  .eurovision-page .seat-card.vip:hover {
    background-color: #173d30;
    border-color: #6fc89c;
    box-shadow: 0 12px 36px #10332333;
  }
  .eurovision-page .seat-card.cabaret:hover {
    background-color: #4a1b2a;
    border-color: #e47f8d;
    box-shadow: 0 12px 36px #4a102333;
  }
  .eurovision-page .seat-card:not(.vip):not(.cabaret):hover {
    background-color: #182f53;
    border-color: #7faff0;
    box-shadow: 0 12px 36px #10284a33;
  }
}
@media (prefers-reduced-motion: reduce) {
  .eurovision-page .seat-card { transition: none; }
}

/* Seating borders match their hover colours. */
.eurovision-page .seat-card.vip { border-top-color: #6fc89c; }
.eurovision-page .seat-card.cabaret { border-top-color: #e47f8d; }
.eurovision-page .seat-card:not(.vip):not(.cabaret) { border-top-color: #7faff0; }

/* Event section links remain available on smaller screens. */
.event-header .section-link { font-size: 14px; color: #e0d6e9; padding-block: 10px; }
.event-header .section-link:hover, .event-header .back-link:hover { color: #fff; text-decoration: underline; text-underline-offset: 5px; }
@media (max-width: 820px) {
  .event-header { flex-wrap: wrap; }
  .event-header nav { flex: 1; justify-content: flex-end; flex-wrap: wrap; gap: 8px 20px; }
}
@media (max-width: 600px) {
  .event-header { justify-content: center; }
  .event-header nav { flex-basis: 100%; justify-content: center; gap: 8px 16px; }
  .event-header .section-link { font-size: 13px; }
  .event-header .back-link { max-width: none; font-size: 13px; }
}

/* Booking navigation hover and keyboard feedback. */
.eurovision-page .event-header .button {
  transition: background-color 220ms ease, color 220ms ease, border-color 220ms ease;
}
.eurovision-page .event-header .button:hover,
.eurovision-page .event-header .button:focus-visible {
  background-color: #7137a8;
  border-color: #bf8de8;
  color: #ffffff;
}
@media (prefers-reduced-motion: reduce) {
  .eurovision-page .event-header .button { transition: none; }
}

/* Give the ticket calendar the full booking section width. */
.eurovision-page .booking { grid-template-columns: 1fr; gap: 32px; }
.booking > div:first-child { max-width: 760px; }
#ticket-tailor-booking { width: 100%; }
.tt-widget-fallback a { text-decoration: underline; text-underline-offset: 4px; }

/* Ticket Tailor post-checkout landing page. */
.confirmation-main { padding-block: 32px 72px; }
.confirmation-heading { max-width: 760px; margin: 0 auto 40px; text-align: center; }
.confirmation-logo { width: min(320px, 80%); height: auto; margin: 0 auto 24px; mix-blend-mode: screen; }
.confirmation-heading h1 { font-size: clamp(32px, 4vw, 52px); line-height: 1.15; letter-spacing: .015em; margin-bottom: 24px; }
.confirmation-heading > p:last-child { color: var(--muted); font-size: 17px; line-height: 1.8; }
.confirmation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.confirmation-grid h2 { font-size: 28px; }
.confirmation-grid p { color: var(--muted); font-size: 16px; line-height: 1.8; margin-bottom: 20px; }
.confirmation-note { margin: 28px auto; max-width: 700px; text-align: center; font-size: 13px; color: var(--muted); }
.confirmation-main > .actions { justify-content: center; }
@media (max-width: 600px) { .confirmation-grid { grid-template-columns: 1fr; } }

/* Ticket Tailor uses dark text with its transparent embed. */
#ticket-tailor-booking { background: #ffffff; color: #20202a; color-scheme: light; border-radius: 8px; padding: clamp(12px, 3vw, 32px); overflow: hidden; }
#ticket-tailor-booking .tt-widget-fallback p, #ticket-tailor-booking .tt-widget-fallback a { color: #37224c; }
.booking-direct { margin: 0; font-size: 14px; }
.booking-direct a { text-decoration: underline; text-underline-offset: 4px; }

.features .feature-note { font-size: 13px; margin-top: 16px; }
.experience-atmosphere { color: var(--muted); font-size: 16px; line-height: 1.8; margin: 32px 0 0; padding-top: 24px; border-top: 1px solid var(--line); }

/* Swipeable experience cards, with a visible scrollbar and next-card peek. */
.eurovision-page #experience .features {
  display: grid;
  grid-template-columns: none;
  grid-auto-flow: column;
  grid-auto-columns: min(340px, 82%);
  gap: 24px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  padding: 4px 2px 22px;
  scrollbar-width: thin;
  scrollbar-color: #ac85cf transparent;
}
.eurovision-page #experience .features::-webkit-scrollbar-track { background: transparent; }
#experience .features article {
  scroll-snap-align: start;
  padding: 26px;
  border: 1px solid #e5d1ff25;
  border-radius: 6px;
  background: #25153766;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
#experience .features:focus-visible { outline: 2px solid #d5bceb; outline-offset: 6px; }
@media (max-width: 600px) {
  .eurovision-page #experience .features { gap: 16px; grid-auto-columns: 85%; }
  #experience .features article { padding: 22px; }
}

/* Editorial experience cards: short copy and a clear visual hierarchy. */
#experience .features .experience-card {
  --card-accent: #e5a0d8;
  display: flex; flex-direction: column; min-height: 330px;
  padding: 30px; position: relative; overflow: hidden;
  border: 1px solid #e5d1ff25; border-top: 3px solid var(--card-accent);
  background: radial-gradient(ellipse at 100% 0%, #bd52981c, transparent 65%), #25153788;
}
#experience .features .lyrics-card { --card-accent: #c3adff; background: radial-gradient(ellipse at 100% 0%, #9066e82b, transparent 65%), #25153788; }
#experience .features .vote-card { --card-accent: #90c5ed; background: radial-gradient(ellipse at 100% 0%, #3683be29, transparent 65%), #25153788; }
#experience .features .react-card { --card-accent: #e7ba89; background: radial-gradient(ellipse at 100% 0%, #b7834f20, transparent 65%), #25153788; }
.experience-kicker { color: var(--card-accent); text-transform: uppercase; letter-spacing: .14em; font-size: 12px; font-weight: 600; margin-bottom: 28px; }
#experience .features h3 { font-family: var(--display-font); font-size: 34px; font-weight: 700; line-height: 1.05; letter-spacing: -.025em; margin-bottom: 22px; }
#experience .features p { font-size: 16px; line-height: 1.65; margin-bottom: 28px; }
.experience-detail { margin-top: auto; padding-top: 16px; border-top: 1px solid #ffffff18; color: var(--card-accent); font-size: 13px; line-height: 1.5; }
@media (max-width: 600px) {
  #experience .features .experience-card { padding: 26px; min-height: 320px; }
  #experience .features h3 { font-size: 32px; }
}

/* More depth and gentle movement, with no flashing or auto-scrolling content. */
.experience-controls:not([hidden]) { display:flex; align-items:center; justify-content:space-between; gap:20px; margin: -8px 0 24px; }
.experience-position { font-size:13px; letter-spacing:.16em; color:var(--gold); font-variant-numeric:tabular-nums; }
.experience-controls > div { display:flex; gap:10px; }
.experience-controls button { border:1px solid #cba8e64d; border-radius:30px; padding:11px 20px; background:#a679d218; color:#f8f4ef; font:inherit; font-size:13px; cursor:pointer; transition:background .25s, border-color .25s; }
.experience-controls button:hover:not(:disabled) { background:#75409c66; border-color:#cba8e6; }
.experience-controls button:disabled { opacity:.35; cursor:default; }
#experience .features .experience-card { border-radius:16px; background-color:#29183caa; box-shadow:inset 0 1px 0 #ffffff0d, 0 16px 36px #0a041b24; transition:background-color .35s, box-shadow .35s, border-color .35s; }
#experience .features .experience-card::after { content:""; position:absolute; width:170px; height:170px; right:-95px; top:25px; border-radius:50%; background:var(--card-accent); opacity:.07; filter: none; pointer-events:none; transition:opacity .4s; }
#experience .features .experience-card:hover { border-color:var(--card-accent); background-color:#332049; box-shadow:inset 0 1px 0 #ffffff12, 0 16px 36px #0a041b38; }
#experience .features .experience-card:hover::after { opacity:.2; }
.eurovision-page .seat-card { border-radius:14px; }
.event-header { background: linear-gradient(120deg, #ffffff16, #c58cff0d 48%, #6ea8ff0c); }
@media (prefers-reduced-motion: reduce) { #experience .features .experience-card, #experience .features .experience-card::after, .experience-controls button { transition:none; } }

/* Soft gradients provide atmosphere without live blur compositing. */
#experience .features .experience-card::after { background: radial-gradient(circle, var(--card-accent) 0%, transparent 70%); }
.eurovision-page .seat-card { transition: background-color 250ms ease, border-color 250ms ease; }