/**
 * Classic Template Styles
 * Premium Business-Design mit Navy & Gold
 *
 * Design Philosophy: Zeitlose Eleganz
 * Target: Business, Konferenzen, Galas
 */

@import "./_base.css";

/* Page Background — consumed by _base.css */
:root {
  --tpl-page-bg: #0a1628;
}

/* ============================================================
   CSS CUSTOM PROPERTIES
   ============================================================ */

:root {
  /* Typography */
  --classic-font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --classic-font-body: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --classic-font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* Font Sizes (Fluid Typography) */
  --classic-text-hero: clamp(2.5rem, 8vw, 5rem);
  --classic-text-section: clamp(1.75rem, 5vw, 3rem);
  --classic-text-title: clamp(1.25rem, 3vw, 1.75rem);
  --classic-text-body: 1.125rem;
  --classic-text-small: 0.875rem;

  /* Line Heights */
  --classic-line-height-display: 1.1;
  --classic-line-height-body: 1.618; /* Golden Ratio */

  /* Letter Spacing */
  --classic-letter-spacing-display: -0.02em;
  --classic-letter-spacing-caps: 0.1em;

  /* Colors: Midnight & Gold */
  --classic-bg-primary: #0a1628;
  --classic-bg-secondary: #111827;
  --classic-bg-surface: #1e293b;
  --classic-bg-elevated: #334155;

  --classic-accent-gold: #c9a962;
  --classic-accent-gold-light: #e2d5a8;
  --classic-accent-gold-dark: #9a7b3d;
  --classic-accent-ivory: #f8f7f4;

  --classic-text-primary: #f8fafc;
  --classic-text-secondary: #94a3b8;
  --classic-text-muted: #9aacbf;   /* WCAG AA: ~5.2:1 on #0a1628 (was #8b9cb3 = 4.5:1) */
  --classic-text-accent: var(--classic-accent-gold);

  --classic-border: rgba(201, 169, 98, 0.3);
  --classic-border-hover: rgba(201, 169, 98, 0.35);
  --classic-border-focus: rgba(201, 169, 98, 0.5);

  /* Shadows */
  --classic-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --classic-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -2px rgba(0, 0, 0, 0.2);
  --classic-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -4px rgba(0, 0, 0, 0.2);
  --classic-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.3), 0 8px 10px -6px rgba(0, 0, 0, 0.2);
  --classic-shadow-gold: 0 10px 30px rgba(201, 169, 98, 0.35), 0 0 20px rgba(201, 169, 98, 0.15);

  /* Transitions */
  --classic-transition-fast: 150ms ease;
  --classic-transition-normal: 300ms ease;
  --classic-transition-slow: 500ms ease;
  --classic-transition-smooth: 500ms cubic-bezier(0.4, 0, 0.2, 1);

  /* Border Radius */
  --classic-radius-sm: 0.125rem;
  --classic-radius-md: 0.125rem;
  --classic-radius-lg: 0.25rem;
  --classic-radius-xl: 0.25rem;
  --classic-radius-2xl: 0.25rem;
  --classic-radius-full: 0.125rem;

  /* Spacing Scale (8px base) */
  --classic-space-1: 0.25rem;
  --classic-space-2: 0.5rem;
  --classic-space-3: 0.75rem;
  --classic-space-4: 1rem;
  --classic-space-6: 1.5rem;
  --classic-space-8: 2rem;
  --classic-space-10: 2.5rem;
  --classic-space-12: 3rem;
  --classic-space-16: 4rem;
}


/* ============================================================
   BASE STYLES
   ============================================================ */

.classic-page {
  font-family: var(--classic-font-body);
  background: linear-gradient(180deg, var(--classic-bg-primary) 0%, var(--classic-bg-secondary) 100%);
  color: var(--classic-text-primary);
  line-height: var(--classic-line-height-body);
  min-height: 100vh;
  min-height: 100dvh;
}

/* Noise Texture — subtle depth on navy (same pattern as bold.css) */
.classic-page::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 0.025;
  z-index: 5;
  will-change: transform;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
}

.classic-page * {
  box-sizing: border-box;
}

/* Override citastyle.css global font-family (span, div, p etc.) */
.classic-page p,
.classic-page span,
.classic-page div,
.classic-page label,
.classic-page input,
.classic-page select,
.classic-page textarea,
.classic-page button,
.classic-page a,
.classic-page li,
.classic-page ul,
.classic-page ol,
.classic-page td,
.classic-page th,
.classic-page small,
.classic-page strong,
.classic-page em {
  font-family: var(--classic-font-body);
}

/* Selection styling for brand feel */
.classic-page ::selection {
  background: rgba(201, 169, 98, 0.3);
  color: var(--classic-text-primary);
}


/* ============================================================
   TYPOGRAPHY
   ============================================================ */

.classic-font-display {
  font-family: var(--classic-font-display);
  font-weight: 700;
  line-height: var(--classic-line-height-display);
  letter-spacing: var(--classic-letter-spacing-display);
}

.classic-text-hero {
  font-size: var(--classic-text-hero);
}

.classic-text-section {
  font-size: var(--classic-text-section);
}

.classic-text-title {
  font-size: var(--classic-text-title);
}

.classic-text-caps {
  text-transform: uppercase;
  letter-spacing: var(--classic-letter-spacing-caps);
  font-weight: 700;
}

/* Hero Title — Gold Gradient Text (matches Success Page) */
.classic-hero-title {
  font-size: clamp(2.25rem, 8vw, 4.5rem);
  color: var(--classic-accent-gold-light);
  background: linear-gradient(135deg, #e2d5a8, #c9a962);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Drop-shadow on wrapper — filter + background-clip: text on same element
   is unreliable cross-browser, so shadow goes on parent instead */
.classic-hero-title-wrapper {
  filter: drop-shadow(0 4px 20px rgba(0,0,0,0.5))
          drop-shadow(0 0 40px rgba(201,169,98,0.25));
}

.classic-text-gold {
  color: var(--classic-accent-gold);
}

.classic-text-ivory {
  color: var(--classic-accent-ivory);
}

.classic-text-muted {
  color: var(--classic-text-secondary);
}


/* ============================================================
   BUTTONS
   ============================================================ */

.classic-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.875rem 1.75rem;
  font-family: var(--classic-font-body);
  font-size: 0.9375rem;
  font-weight: 700;
  text-decoration: none;
  border-radius: var(--classic-radius-full);
  transition: transform, background, box-shadow, color, border-color;
  transition-duration: var(--classic-transition-normal);
  cursor: pointer;
  border: none;
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.classic-btn:focus-visible {
  box-shadow: 0 0 0 3px var(--classic-border-focus);
}

/* Gold Button (Primary) */
.classic-btn-gold {
  background: linear-gradient(135deg, var(--classic-accent-gold), var(--classic-accent-gold-light));
  color: var(--classic-bg-primary);
  box-shadow: var(--classic-shadow-md);
  transition: transform 300ms cubic-bezier(0.34, 1.56, 0.64, 1),
              box-shadow 300ms ease-out,
              background 200ms ease-out;
}

.classic-btn-gold:hover {
  transform: translateY(-3px);
  box-shadow: var(--classic-shadow-gold);
}

.classic-btn-gold:active {
  transform: translateY(0);
}

/* Outline Button (Secondary) */
.classic-btn-outline {
  background: transparent;
  color: var(--classic-accent-gold);
  border: 1.5px solid var(--classic-border-hover);
  transition: transform 300ms cubic-bezier(0.34, 1.56, 0.64, 1),
              box-shadow 300ms ease-out,
              background 200ms ease-out,
              border-color 200ms ease-out;
}

.classic-btn-outline:hover {
  background: rgba(201, 169, 98, 0.1);
  border-color: var(--classic-accent-gold);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(201, 169, 98, 0.15);
}

.classic-btn-outline:active {
  background: rgba(201, 169, 98, 0.1);
  border-color: var(--classic-accent-gold);
  transform: scale(0.97);
}

/* Small Button */
.classic-btn-sm {
  padding: 0.625rem 1.25rem;
  font-size: 0.8125rem;
}


/* ============================================================
   CARDS
   ============================================================ */

.classic-card {
  background: linear-gradient(165deg, var(--classic-bg-surface), var(--classic-bg-secondary));
  border: 1px solid var(--classic-border);
  border-top: 2px solid rgba(201, 169, 98, 0.4);
  border-radius: var(--classic-radius-xl);
  overflow: visible;
  transition: all var(--classic-transition-smooth);
  position: relative;
}

.classic-card:hover,
.classic-card:active {
  transform: translateY(-8px);
  border-color: var(--classic-border-hover);
  box-shadow: var(--classic-shadow-xl);
}


/* ============================================================
   SECTION HEADERS
   ============================================================ */

.classic-section-header {
  text-align: center;
  margin-bottom: 3rem;
}

.classic-section-label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--classic-accent-gold);
  font-size: var(--classic-text-small);
  text-transform: uppercase;
  letter-spacing: var(--classic-letter-spacing-caps);
  font-weight: 700;
  margin-bottom: 0.75rem;
}

.classic-section-title {
  font-family: var(--classic-font-display);
  font-size: var(--classic-text-section);
  font-weight: 700;
  color: var(--classic-text-primary);
  line-height: var(--classic-line-height-display);
  letter-spacing: var(--classic-letter-spacing-display);
  margin: 0 0 0.5rem 0;
}

.classic-section-title::after {
  content: '';
  display: block;
  width: 60px;
  height: 2px;
  margin: 1.25rem auto 0;
  background: linear-gradient(90deg,
    transparent 0%,
    var(--classic-accent-gold) 50%,
    transparent 100%
  );
  border-radius: 1px;
  transition: box-shadow 300ms ease;
}

.classic-section-header:hover .classic-section-title::after {
  box-shadow: 0 0 12px rgba(201, 169, 98, 0.4),
              0 0 24px rgba(201, 169, 98, 0.15);
}

.classic-section-subtitle {
  color: var(--classic-text-secondary);
  font-size: 1.125rem;
  max-width: 600px;
  margin: 0 auto;
}


/* ============================================================
   DIVIDERS
   ============================================================ */

.classic-divider {
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    var(--classic-border-hover) 20%,
    var(--classic-border-hover) 80%,
    transparent 100%
  );
  margin: 4rem 0;
}

.classic-divider-gold {
  height: 2px;
  background: linear-gradient(90deg,
    transparent 0%,
    var(--classic-accent-gold-dark) 20%,
    var(--classic-accent-gold) 50%,
    var(--classic-accent-gold-dark) 80%,
    transparent 100%
  );
}


/* ============================================================
   BADGES & TAGS
   ============================================================ */

.classic-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.875rem;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: var(--classic-radius-full);
}

.classic-badge-gold {
  background: var(--classic-accent-gold);
  color: var(--classic-bg-primary);
}

.classic-badge-outline {
  background: rgba(201, 169, 98, 0.1);
  color: var(--classic-accent-gold);
  border: 1px solid var(--classic-border);
}


/* ============================================================
   SCROLL REVEAL ANIMATIONS
   ============================================================ */

.classic-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.classic-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered Children */
.classic-reveal-children > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.classic-reveal-children.is-visible > *:nth-child(1) { transition-delay: 0.1s; }
.classic-reveal-children.is-visible > *:nth-child(2) { transition-delay: 0.15s; }
.classic-reveal-children.is-visible > *:nth-child(3) { transition-delay: 0.2s; }
.classic-reveal-children.is-visible > *:nth-child(4) { transition-delay: 0.25s; }
.classic-reveal-children.is-visible > *:nth-child(5) { transition-delay: 0.3s; }
.classic-reveal-children.is-visible > *:nth-child(6) { transition-delay: 0.35s; }
.classic-reveal-children.is-visible > *:nth-child(7) { transition-delay: 0.4s; }
.classic-reveal-children.is-visible > *:nth-child(8) { transition-delay: 0.45s; }

.classic-reveal-children.is-visible > * {
  opacity: 1;
  transform: translateY(0);
}

/* ============================================================
   BASICS SECTION — Description, Keyfacts, Organizers
   (Moved from basics.html inline <style>)
   ============================================================ */
.classic-basics {
  padding: var(--classic-space-12) var(--classic-space-6);
  max-width: 1200px;
  margin: 0 auto;
}

@media (min-width: 768px) {
  .classic-basics {
    padding: var(--classic-space-16) var(--classic-space-8);
  }
}

.classic-badges-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
}

.classic-badge--success {
  color: var(--classic-accent-gold);
}

.classic-description {
  max-width: 48rem;
  margin: 0 auto;
  color: var(--classic-text-primary);
  line-height: 1.75;
  font-size: 1rem;
  margin-bottom: 2rem;
}

@media (min-width: 640px) {
  .classic-description {
    font-size: 1.0625rem;
  }
}

.classic-description p {
  margin-bottom: 1rem;
}

.classic-description h2,
.classic-description h3,
.classic-description h4 {
  color: var(--classic-text-primary);
  margin-top: 2em;
  margin-bottom: 0.75em;
  line-height: 1.3;
}

.classic-description h2 { font-size: 1.5rem; font-weight: 700; font-family: var(--classic-font-display); }
.classic-description h3 { font-size: 1.25rem; font-weight: 600; font-family: var(--classic-font-display); }
.classic-description h4 { font-size: 1.0625rem; font-weight: 600; font-family: var(--classic-font-display); }

.classic-description a {
  color: var(--classic-accent-gold);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.classic-description a:hover {
  opacity: 0.8;
}

.classic-description ul,
.classic-description ol {
  padding-left: 1.5em;
  margin-bottom: 1rem;
}

.classic-description li {
  margin-bottom: 0.25rem;
}

.classic-description blockquote {
  border-left: 3px solid var(--classic-accent-gold);
  padding: 1rem 1.25rem;
  margin: 1.5rem 0;
  font-style: italic;
  color: var(--classic-text-secondary);
}

.classic-description img {
  max-width: 100%;
  border-radius: var(--classic-radius-md);
  margin: 1.5rem 0;
}

.classic-keyfacts {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-top: var(--classic-space-6);
}

@media (min-width: 640px) {
  .classic-keyfacts {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .classic-keyfacts {
    grid-template-columns: repeat(3, 1fr);
  }
}

.classic-keyfact {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.25rem;
  background: var(--classic-bg-surface);
  border-radius: var(--classic-radius-md);
  border: 1px solid var(--classic-border);
  transition: border-color var(--classic-transition-fast);
}

.classic-keyfact:hover {
  border-color: var(--classic-border-hover);
}

.classic-keyfact-icon {
  flex-shrink: 0;
  color: var(--classic-accent-gold);
}

.classic-keyfact-content {
  flex: 1;
  min-width: 0;
}

.classic-keyfact-label {
  display: block;
  font-size: 0.75rem;
  color: var(--classic-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.25rem;
}

.classic-keyfact-value {
  display: block;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--classic-text-primary);
  word-break: break-word;
}

.classic-organizers {
  margin-top: 2rem;
}

.classic-organizers-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.classic-organizers-title {
  font-family: var(--classic-font-display);
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--classic-text-primary);
  margin: 0;
}

.classic-organizers-count {
  font-size: 0.75rem;
  color: var(--classic-text-muted);
  margin: 0;
}

.classic-organizers-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

@media (min-width: 640px) {
  .classic-organizers-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  }
}

.classic-organizer-card {
  display: flex;
  gap: 1rem;
  padding: 1rem;
  background: var(--classic-bg-surface);
  border: 1px solid var(--classic-border);
  border-radius: 0.5rem;
  transition: border-color 0.2s;
}

.classic-organizer-card:hover {
  border-color: var(--classic-accent-gold);
}

.classic-organizer-avatar {
  flex-shrink: 0;
}

.classic-organizer-avatar img {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--classic-accent-gold);
}

.classic-organizer-avatar-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  background: var(--classic-bg-elevated);
  border: 2px solid var(--classic-accent-gold);
  color: var(--classic-accent-gold);
  font-weight: 700;
  font-size: 1.25rem;
  text-decoration: none;
}

.classic-organizer-info {
  flex: 1;
  min-width: 0;
}

.classic-organizer-name {
  display: block;
  font-weight: 600;
  color: var(--classic-text-primary);
  font-size: 0.9375rem;
  margin-bottom: 0.125rem;
}

.classic-organizer-contact {
  display: block;
  font-size: 0.75rem;
  color: var(--classic-accent-gold);
  margin-bottom: 0.25rem;
}

.classic-organizer-description {
  font-size: 0.75rem;
  color: var(--classic-text-muted);
  line-height: 1.5;
  margin: 0 0 0.5rem 0;
}

.classic-organizer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.classic-organizer-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.6875rem;
  color: var(--classic-text-secondary);
  text-decoration: none;
  transition: color 0.2s;
}

.classic-organizer-link:hover {
  color: var(--classic-accent-gold);
}

.classic-organizer-link svg {
  color: var(--classic-accent-gold);
}

/* ============================================================
   TICKET CARD STATES
   ============================================================ */

/* Focus-within for keyboard navigation */
.classic-ticket-card:focus-within {
  box-shadow:
    0 0 0 2px var(--classic-accent-gold),
    0 20px 25px -5px rgba(0, 0, 0, 0.3);
}

/* Disabled card no hover */
.classic-ticket-card:has(.opacity-50):hover {
  transform: none !important;
}

/* Featured Badge - Gold Gradient */
.classic-ticket-featured-badge {
  background: linear-gradient(135deg, #e2d5a8 0%, #c9a962 100%);
  color: #0a1628;
  z-index: 5;
}

/* Featured Ticket Glow Pulse — subtle gold aura */
.classic-ticket-card:has(.classic-ticket-featured-badge) {
  position: relative;
}

.classic-ticket-card:has(.classic-ticket-featured-badge)::before {
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: inherit;
  background: radial-gradient(ellipse at 50% 0%, rgba(201, 169, 98, 0.15), transparent 70%);
  opacity: 0.6;
  animation: classic-glow-pulse 3s ease-in-out infinite;
  will-change: opacity, transform;
  pointer-events: none;
  z-index: -1;
}

@keyframes classic-glow-pulse {
  0%, 100% { opacity: 0.4; transform: scale(1); }
  50% { opacity: 0.9; transform: scale(1.03); }
}

/* Preview mode styling */
.tickets-section--preview-disabled {
  pointer-events: none;
  user-select: none;
}


/* ============================================================
   FADE IN ANIMATIONS
   ============================================================ */

@keyframes classic-fade-in-up {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.classic-animate-fade-in-up {
  animation: classic-fade-in-up 0.6s ease forwards;
}


/* ============================================================
   LINKS
   ============================================================ */

.classic-link {
  color: var(--classic-accent-gold);
  text-decoration: none;
  position: relative;
  transition: color var(--classic-transition-fast);
}

.classic-link::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--classic-accent-gold);
  transition: width var(--classic-transition-normal);
}

.classic-link:hover::after {
  width: 100%;
}


/* ============================================================
   IMAGE EFFECTS
   ============================================================ */

.classic-image-zoom {
  overflow: hidden;
}

.classic-image-zoom img {
  transition: transform 0.7s ease;
}

.classic-image-zoom:hover img {
  transform: scale(1.1);
}


/* ============================================================
   STICKY TICKET BAR
   ============================================================ */

.classic-sticky-bar {
  position: fixed;
  top: var(--cita-banner-h, 0px);
  left: 0;
  right: 0;
  z-index: 101;
  transform: translateY(-100%);
  opacity: 0;
  transition: transform var(--classic-transition-normal), opacity var(--classic-transition-normal), top 0.3s ease;
  background: rgba(10, 22, 40, 0.95);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--classic-border);
}

.classic-sticky-bar.is-visible {
  transform: translateY(0);
  opacity: 1;
}

.classic-sticky-bar-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}


/* ============================================================
   ACCESSIBILITY
   ============================================================ */

/* Focus visible for keyboard navigation */
.classic-page :focus-visible {
  outline: 2px solid var(--classic-accent-gold);
  outline-offset: 2px;
}

/* Skip to content link */
.classic-skip-link {
  position: absolute;
  top: -100%;
  left: 50%;
  transform: translateX(-50%);
  padding: 1rem 2rem;
  background: var(--classic-accent-gold);
  color: var(--classic-bg-primary);
  font-weight: 700;
  border-radius: var(--classic-radius-md);
  z-index: 100;
  transition: top var(--classic-transition-fast);
}

.classic-skip-link:focus {
  top: 1rem;
}

/* Reduced motion preference — universal * rule in _base.css handles
   animation-duration/transition-duration. Only layout overrides here. */
@media (prefers-reduced-motion: reduce) {
  .classic-reveal,
  .classic-reveal-children > * {
    opacity: 1;
    transform: none;
  }

  /* Disable hover/active motion on cards and buttons */
  .classic-card:hover,
  .classic-card:active,
  .classic-speaker-card:hover,
  .classic-speaker-card:active,
  .classic-content-card:hover,
  .classic-content-card:active,
  .classic-btn-gold:hover,
  .classic-btn-gold:active,
  .classic-btn-outline:hover,
  .classic-btn-outline:active {
    transform: none;
  }

  /* Disable image zoom on hover */
  .classic-speaker-card:hover .classic-speaker-image,
  .classic-image-zoom:hover img {
    transform: none;
  }

  /* Disable staggered animation delays */
  .classic-reveal-children.is-visible > * {
    transition-delay: 0s !important;
  }

  /* Disable Tailwind pulse/bounce and glow animations */
  .classic-page .animate-pulse,
  .classic-page .animate-bounce,
  .classic-ticket-card:has(.classic-ticket-featured-badge)::before {
    animation: none;
  }
}


/* ============================================================
   RESPONSIVE ADJUSTMENTS
   ============================================================ */

@media (max-width: 768px) {
  :root {
    --classic-text-hero: clamp(2rem, 10vw, 3rem);
    --classic-text-section: clamp(1.5rem, 6vw, 2rem);
  }

  .classic-btn {
    padding: 0.75rem 1.5rem;
    font-size: 0.875rem;
  }

  .classic-section-header {
    margin-bottom: 2rem;
  }

  .classic-divider {
    margin: 2.5rem 0;
  }

  /* Section navigation: horizontal scroll */
  .classic-program-tabs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    flex-wrap: nowrap;
    justify-content: flex-start;
  }

  .classic-program-tabs::-webkit-scrollbar {
    display: none;
  }

  /* Cards: reduce hover lift */
  .classic-card:hover {
    transform: translateY(-4px);
  }

  .classic-speaker-card:hover {
    transform: translateY(-4px);
  }

  .classic-content-card:hover {
    transform: translateY(-4px);
  }

  /* Cards: compact padding */
  .classic-speaker-info {
    padding: 1rem;
  }

  .classic-content-body {
    padding: 1rem;
  }

  .classic-announcement-card {
    padding: 1rem;
  }

  /* Timeline: compact */
  .classic-timeline-card {
    padding: 1rem;
  }

  .classic-timeline-item {
    padding-bottom: 1.5rem;
    padding-left: 1rem;
  }

  /* Cup ranking items */
  .classic-cup-item {
    padding: 1rem;
    gap: 1rem;
  }

  .classic-cup-rank {
    font-size: 1.5rem;
  }

  .classic-cup-score {
    font-size: 1.25rem;
  }

  /* Location section */
  .classic-location-map {
    height: 200px;
  }

  .classic-location-info {
    padding: 1.25rem;
  }

  .classic-location-name {
    font-size: 1.25rem;
  }

  /* Sponsors: tighter gap */
  .classic-sponsors-grid {
    gap: 1rem;
  }

  .classic-sponsor-card {
    padding: 1rem 1.25rem;
  }

  /* Sticky bar */
  .classic-sticky-bar-content {
    padding: 0.75rem 1rem;
  }

  .classic-sticky-bar .classic-btn-sm {
    padding: 0.4rem 0.875rem;
    font-size: 0.75rem;
  }

  /* iOS Safari input zoom prevention — centralised in _base.css */
}

@media (max-width: 639px) {
  /* Program tabs: smaller */
  .classic-program-tab {
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
  }

  /* Cup grid: tighter */
  .classic-cup-item {
    grid-template-columns: 45px 1fr auto;
    gap: 0.75rem;
    padding: 0.75rem;
  }

  /* Content grid: single column */
  .classic-contents-grid {
    grid-template-columns: 1fr;
  }

  /* Speakers grid: single column */
  .classic-speakers-grid {
    grid-template-columns: 1fr;
  }

  /* Location: further compact */
  .classic-location-info {
    padding: 1rem;
  }

  .classic-location-name {
    font-size: 1.125rem;
  }

  /* Gold divider: proportional on small screens */
  .classic-section-title::after {
    width: 40px;
    margin-top: 1rem;
  }
}


/* ============================================================
   TICKETS SECTION OVERRIDES (Gold Theme)
   Überschreibt die Cyan/Emerald-Farben der Ticket-Sektion
   ============================================================ */

/* Scoped under .classic-page for specificity (0,3,0) over Tailwind (0,1,0). */
.classic-page .classic-tickets-wrapper {
  /* Ticket-Section Container Hintergrund anpassen */
}

/* Headline "Event Tickets" */
.classic-page .classic-tickets-wrapper .text-emerald-400 {
  color: var(--classic-accent-gold);
}

/* "Deine gebuchten Tickets" Headline */
.classic-page .classic-tickets-wrapper .text-cyan-200 {
  color: var(--classic-accent-gold-light);
}

.classic-page .classic-tickets-wrapper .text-cyan-400 {
  color: var(--classic-accent-gold);
}

.classic-page .classic-tickets-wrapper .text-cyan-300 {
  color: var(--classic-accent-gold-light);
}

.classic-page .classic-tickets-wrapper .text-cyan-100 {
  color: var(--classic-accent-ivory);
}

/* Emerald (Registriert-Status, Buttons) → Gold */
.classic-page .classic-tickets-wrapper .text-emerald-300 {
  color: var(--classic-accent-gold-light);
}

.classic-page .classic-tickets-wrapper .text-emerald-400 {
  color: var(--classic-accent-gold);
}

/* Border-Farben überschreiben */
.classic-page .classic-tickets-wrapper .border-cyan-700,
.classic-page .classic-tickets-wrapper .border-cyan-700\/40,
.classic-page .classic-tickets-wrapper .border-cyan-800,
.classic-page .classic-tickets-wrapper .border-cyan-800\/40 {
  border-color: var(--classic-border-hover);
}

.classic-page .classic-tickets-wrapper .border-cyan-400,
.classic-page .classic-tickets-wrapper .border-cyan-400\/70 {
  border-color: var(--classic-accent-gold);
}

.classic-page .classic-tickets-wrapper .border-emerald-700,
.classic-page .classic-tickets-wrapper .border-emerald-400 {
  border-color: var(--classic-accent-gold-dark);
}

/* Background-Farben überschreiben */
.classic-page .classic-tickets-wrapper .bg-cyan-900\/60,
.classic-page .classic-tickets-wrapper .bg-cyan-950\/40,
.classic-page .classic-tickets-wrapper .bg-cyan-950\/60 {
  background-color: rgba(201, 169, 98, 0.1);
}

.classic-page .classic-tickets-wrapper .bg-emerald-700,
.classic-page .classic-tickets-wrapper .bg-emerald-700\/90 {
  background: linear-gradient(135deg, var(--classic-accent-gold), var(--classic-accent-gold-light));
  color: var(--classic-bg-primary);
}

.classic-page .classic-tickets-wrapper .bg-emerald-800 {
  background-color: var(--classic-accent-gold-dark);
}

/* Hover-Zustände */
.classic-page .classic-tickets-wrapper .hover\:bg-cyan-950\/40:hover,
.classic-page .classic-tickets-wrapper .hover\:bg-cyan-950\/60:hover {
  background-color: rgba(201, 169, 98, 0.15);
}

.classic-page .classic-tickets-wrapper .hover\:bg-emerald-800:hover {
  background-color: var(--classic-accent-gold-dark);
}

.classic-page .classic-tickets-wrapper .hover\:text-cyan-100:hover,
.classic-page .classic-tickets-wrapper .hover\:text-cyan-200:hover,
.classic-page .classic-tickets-wrapper .hover\:text-cyan-400:hover {
  color: var(--classic-accent-gold-light);
}

/* Ring-Farben (für bereits gebuchte Tickets) */
.classic-page .classic-tickets-wrapper .ring-emerald-200\/60 {
  --tw-ring-color: rgba(201, 169, 98, 0.6);
}

/* Focus-Ring Overrides */
.classic-page .classic-tickets-wrapper .focus\:ring-cyan-500:focus,
.classic-page .classic-tickets-wrapper .focus\:ring-cyan-400:focus,
.classic-page .classic-tickets-wrapper .focus\:ring-cyan-600\/40:focus,
.classic-page .classic-tickets-wrapper .focus\:ring-cyan-300\/60:focus {
  --tw-ring-color: var(--classic-accent-gold);
}

.classic-page .classic-tickets-wrapper .focus\:ring-emerald-400:focus,
.classic-page .classic-tickets-wrapper .focus\:ring-emerald-400\/40:focus,
.classic-page .classic-tickets-wrapper .focus\:ring-emerald-400\/50:focus {
  --tw-ring-color: var(--classic-accent-gold);
}

.classic-page .classic-tickets-wrapper .focus\:border-cyan-400:focus {
  border-color: var(--classic-accent-gold);
}

/* Checkbox-Checked States */
.classic-page .classic-tickets-wrapper .checked\:border-cyan-500:checked,
.classic-page .classic-tickets-wrapper .peer:checked ~ .peer-checked\:border-cyan-500 {
  border-color: var(--classic-accent-gold);
}

.classic-page .classic-tickets-wrapper .checked\:bg-cyan-700:checked,
.classic-page .classic-tickets-wrapper .peer:checked ~ .peer-checked\:bg-cyan-700 {
  background-color: var(--classic-accent-gold);
}

.classic-page .classic-tickets-wrapper .checked\:border-emerald-500:checked,
.classic-page .classic-tickets-wrapper .peer:checked ~ .peer-checked\:border-emerald-500 {
  border-color: var(--classic-accent-gold);
}

.classic-page .classic-tickets-wrapper .checked\:bg-emerald-700:checked,
.classic-page .classic-tickets-wrapper .peer:checked ~ .peer-checked\:bg-emerald-700 {
  background-color: var(--classic-accent-gold);
}

/* Divider-Linien */
.classic-page .classic-tickets-wrapper .via-cyan-400\/20 {
  --tw-gradient-via: rgba(201, 169, 98, 0.2);
}

/* Glow-Hintergründe anpassen */
.classic-page .classic-tickets-wrapper .absolute.-left-24.-top-14,
.classic-page .classic-tickets-wrapper .absolute.right-\[-60px\].bottom-\[-50px\] {
  opacity: 0.08;
}

/* Shadow-Hover für Ticket-Cards */
.classic-page .classic-tickets-wrapper .hover\:shadow-cyan-400\/20:hover,
.classic-page .classic-tickets-wrapper .hover\:shadow-cyan-800\/20:hover {
  --tw-shadow-color: rgba(201, 169, 98, 0.2);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), 0 10px 25px -5px rgba(201, 169, 98, 0.15);
}

/* Links (underline) */
.classic-tickets-wrapper a.text-cyan-400,
.classic-tickets-wrapper a.hover\:text-cyan-400:hover {
  color: var(--classic-accent-gold);
}

.classic-tickets-wrapper a.hover\:text-cyan-200:hover {
  color: var(--classic-accent-gold-light);
}

/* Status-Badges behalten ihre Farben (Warteliste gelb, Storniert rot, etc.) */
/* Diese überschreiben wir NICHT - sie sollen ihre semantische Bedeutung behalten */

/* Submit-Button spezifisch */
.classic-tickets-wrapper button[type="submit"].border-emerald-700 {
  background: linear-gradient(135deg, var(--classic-accent-gold), var(--classic-accent-gold-light));
  border-color: var(--classic-accent-gold);
  color: var(--classic-bg-primary);
  font-weight: 700;
}

.classic-tickets-wrapper button[type="submit"].border-emerald-700:hover,
.classic-tickets-wrapper button[type="submit"].border-emerald-700:active {
  background: linear-gradient(135deg, var(--classic-accent-gold-dark), var(--classic-accent-gold));
  border-color: var(--classic-accent-gold-dark);
}

/* Plus-One Add Button */
.classic-tickets-wrapper [data-plus-one-add] {
  background: transparent;
  border-color: var(--classic-accent-gold);
  color: var(--classic-accent-gold);
}
.classic-tickets-wrapper [data-plus-one-add]:hover {
  background: rgba(201, 169, 98, 0.1);
}

/* Promo Apply Button */
.classic-tickets-wrapper [data-promo-apply] {
  background: transparent;
  border-color: var(--classic-accent-gold);
  color: var(--classic-accent-gold);
}
.classic-tickets-wrapper [data-promo-apply]:hover {
  background: rgba(201, 169, 98, 0.1);
}

/* Price Summary Total – Gold Accent */
.classic-tickets-wrapper [data-checkout-summary] .text-sm.font-semibold {
  color: var(--classic-accent-gold);
}

/* "Jetzt anmelden" Button */
.classic-page .classic-tickets-wrapper .toggle-consent-btn,
.classic-page .classic-tickets-wrapper .toggle-guest-form {
  border-color: var(--classic-border-hover);
  color: var(--classic-accent-gold);
}

.classic-page .classic-tickets-wrapper .toggle-consent-btn:hover,
.classic-page .classic-tickets-wrapper .toggle-guest-form:hover {
  background-color: rgba(201, 169, 98, 0.1);
  color: var(--classic-accent-gold-light);
}

/* Feature Badges – Gold Palette Override
   Replaces Tailwind violet/emerald/amber badge classes with gold theme */

/* Exclusive badge (violet → gold) */
.classic-page .classic-tickets .bg-violet-500\/15,
.classic-page .classic-tickets-wrapper .bg-violet-500\/15 {
  background: rgba(201, 169, 98, 0.15);
}
.classic-page .classic-tickets .text-violet-300,
.classic-page .classic-tickets-wrapper .text-violet-300 {
  color: #e2d5a8;
}

/* Group / Plus-one badges (emerald → gold) */
.classic-page .classic-tickets .bg-emerald-500\/15,
.classic-page .classic-tickets-wrapper .bg-emerald-500\/15 {
  background: rgba(201, 169, 98, 0.15);
}
.classic-page .classic-tickets .text-emerald-300,
.classic-page .classic-tickets-wrapper .text-emerald-300 {
  color: #e2d5a8;
}

/* Waitlist badge (amber → gold) */
.classic-page .classic-tickets .bg-amber-500\/15,
.classic-page .classic-tickets-wrapper .bg-amber-500\/15 {
  background: rgba(201, 169, 98, 0.15);
}
.classic-page .classic-tickets .text-amber-300,
.classic-page .classic-tickets-wrapper .text-amber-300 {
  color: #dbc07c;
}

/* Consent Box (Semantic Class) */
.classic-page .classic-tickets-wrapper .checkout-consent-box {
  background: rgba(10, 22, 40, 0.9);
  border: 1px solid var(--classic-border);
  border-radius: 0.125rem;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.06);
}

/* Opacity-variant backgrounds */
.classic-page .classic-tickets-wrapper .bg-slate-900\/90,
.classic-page .classic-tickets-wrapper .bg-slate-900\/70,
.classic-page .classic-tickets-wrapper .bg-slate-800\/50 {
  background: rgba(10, 22, 40, 0.9);
}

/* Label text */
.classic-page .classic-tickets-wrapper .text-slate-200 {
  color: var(--classic-text-primary, #f1f5f9);
}

/* Checkbox border */
.classic-page .classic-tickets-wrapper .border-slate-600 {
  border-color: var(--classic-border);
}


/* ============================================================
   SPEAKERS SECTION - Elegant Gold Grid
   ============================================================ */

.classic-speakers-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 2rem;
  justify-content: center;
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}

.classic-speaker-card {
  background: linear-gradient(165deg, var(--classic-bg-surface), var(--classic-bg-secondary));
  border: 1px solid var(--classic-border);
  border-top: 2px solid rgba(201, 169, 98, 0.4);
  border-radius: var(--classic-radius-xl);
  overflow: hidden;
  transition: all var(--classic-transition-smooth);
}

.classic-speaker-card:hover,
.classic-speaker-card:active {
  transform: translateY(-8px);
  border-color: var(--classic-border-hover);
  box-shadow: var(--classic-shadow-gold);
}

.classic-speaker-image-wrapper {
  position: relative;
  aspect-ratio: 1;
  overflow: hidden;
}

.classic-speaker-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s ease;
}

.classic-speaker-card:hover .classic-speaker-image {
  transform: scale(1.05);
}

.classic-speaker-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--classic-bg-elevated), var(--classic-bg-surface));
  color: var(--classic-accent-gold);
}

.classic-speaker-placeholder svg {
  width: 4rem;
  height: 4rem;
  opacity: 0.5;
}

.classic-speaker-keynote {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: linear-gradient(135deg, var(--classic-accent-gold), var(--classic-accent-gold-light));
  color: var(--classic-bg-primary);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.375rem 0.75rem;
  border-radius: var(--classic-radius-full);
}

.classic-speaker-info {
  padding: 1.5rem;
}

.classic-speaker-name {
  font-family: var(--classic-font-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--classic-text-primary);
  margin-bottom: 0.25rem;
}

.classic-speaker-role {
  font-size: 0.875rem;
  color: var(--classic-accent-gold);
  margin-bottom: 0.5rem;
}

.classic-speaker-company {
  font-size: 0.875rem;
  color: var(--classic-text-secondary);
}

.classic-speaker-bio {
  font-size: 0.875rem;
  color: var(--classic-text-secondary);
  line-height: 1.6;
  margin-top: 0.75rem;
}

.classic-speaker-social {
  display: flex;
  gap: 0.75rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--classic-border);
}

.classic-speaker-social a {
  color: var(--classic-text-muted);
  transition: color var(--classic-transition-fast);
  min-width: 2.75rem;
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.125rem;
}

.classic-speaker-social a:hover,
.classic-speaker-social a:active {
  color: var(--classic-accent-gold);
}

.classic-speaker-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

.classic-speaker-tag {
  font-size: 0.75rem;
  padding: 0.25rem 0.625rem;
  background: rgba(201, 169, 98, 0.1);
  border: 1px solid var(--classic-border);
  border-radius: var(--classic-radius-full);
  color: var(--classic-accent-gold);
}


/* ============================================================
   SPONSORS SECTION - Elegant Tier Grid
   ============================================================ */

.classic-sponsors-section {
  text-align: center;
}

.classic-sponsors-tier {
  margin-bottom: 3rem;
}

.classic-sponsors-tier-title {
  font-family: var(--classic-font-display);
  font-size: 1rem;
  font-weight: 700;
  color: var(--classic-accent-gold);
  text-transform: uppercase;
  letter-spacing: var(--classic-letter-spacing-caps);
  margin-bottom: 1.5rem;
  position: relative;
  display: inline-block;
}

.classic-sponsors-tier-title::after {
  content: '';
  position: absolute;
  bottom: -0.5rem;
  left: 50%;
  transform: translateX(-50%);
  width: 2rem;
  height: 2px;
  background: var(--classic-accent-gold);
}

.classic-sponsors-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 2rem;
}

.classic-sponsor-card {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem 2rem;
  background: linear-gradient(165deg, var(--classic-bg-surface), var(--classic-bg-secondary));
  border: 1px solid var(--classic-border);
  border-radius: var(--classic-radius-lg);
  transition: all var(--classic-transition-normal);
}

.classic-sponsor-card:hover,
.classic-sponsor-card:active {
  border-color: var(--classic-border-hover);
  box-shadow: var(--classic-shadow-md);
}

.classic-sponsor-logo {
  max-height: 3rem;
  max-width: 10rem;
  object-fit: contain;
  filter: grayscale(100%) brightness(1.5);
  opacity: 0.7;
  transition: all var(--classic-transition-normal);
}

.classic-sponsor-card:hover .classic-sponsor-logo {
  filter: grayscale(0%);
  opacity: 1;
}

/* Tier-specific sizing */
.classic-sponsors-tier--gold .classic-sponsor-logo {
  max-height: 4rem;
}

.classic-sponsors-tier--silver .classic-sponsor-logo {
  max-height: 3rem;
}

.classic-sponsors-tier--bronze .classic-sponsor-logo {
  max-height: 2.5rem;
}


/* ============================================================
   CONTENT SECTION - Elegant Article Cards
   ============================================================ */

.classic-contents-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 2rem;
}

.classic-content-card {
  background: linear-gradient(165deg, var(--classic-bg-surface), var(--classic-bg-secondary));
  border: 1px solid var(--classic-border);
  border-top: 2px solid rgba(201, 169, 98, 0.4);
  border-radius: var(--classic-radius-xl);
  overflow: hidden;
  transition: all var(--classic-transition-smooth);
}

.classic-content-card:hover,
.classic-content-card:active {
  transform: translateY(-8px);
  border-color: var(--classic-border-hover);
  box-shadow: var(--classic-shadow-xl);
}

.classic-content-image {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.classic-content-body {
  padding: 1.5rem;
}

.classic-content-type {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--classic-accent-gold);
  margin-bottom: 0.75rem;
}

.classic-content-title {
  font-family: var(--classic-font-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--classic-text-primary);
  line-height: 1.3;
  margin-bottom: 0.75rem;
}

.classic-content-description {
  font-size: 0.9375rem;
  color: var(--classic-text-secondary);
  line-height: 1.6;
}

.classic-content-meta {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--classic-border);
  font-size: 0.8125rem;
  color: var(--classic-text-muted);
}


/* ============================================================
   PROGRAM SECTION - Timeline with Gold Accents
   ============================================================ */

.classic-program-tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin-bottom: 2.5rem;
}

.classic-program-tab {
  font-family: var(--classic-font-body);
  font-size: 0.9375rem;
  font-weight: 700;
  padding: 0.75rem 1.5rem;
  color: var(--classic-text-secondary);
  background: transparent;
  border: 1px solid var(--classic-border);
  border-radius: var(--classic-radius-full);
  cursor: pointer;
  transition: all var(--classic-transition-normal);
}

.classic-program-tab:hover,
.classic-program-tab:active {
  color: var(--classic-accent-gold);
  border-color: var(--classic-border-hover);
}

.classic-program-tab.is-active {
  background: linear-gradient(135deg, var(--classic-accent-gold), var(--classic-accent-gold-light));
  color: var(--classic-bg-primary);
  border-color: transparent;
}

.classic-program-day {
  margin-bottom: 2.5rem;
}

.classic-program-day-title {
  font-family: var(--classic-font-display);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--classic-text-primary);
  margin-bottom: 1.5rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid var(--classic-accent-gold);
  display: inline-block;
}

.classic-timeline {
  position: relative;
  padding-left: 2rem;
}

.classic-timeline::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: linear-gradient(180deg, var(--classic-accent-gold), var(--classic-border));
}

.classic-timeline-item {
  position: relative;
  padding-bottom: 2rem;
  padding-left: 1.5rem;
}

.classic-timeline-item::before {
  content: '';
  position: absolute;
  left: -2rem;
  top: 0.375rem;
  width: 12px;
  height: 12px;
  background: var(--classic-accent-gold);
  border: 3px solid var(--classic-bg-primary);
  border-radius: 50%;
}

.classic-timeline-time {
  font-family: var(--classic-font-body);
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--classic-accent-gold);
  margin-bottom: 0.5rem;
}

.classic-timeline-card {
  background: linear-gradient(165deg, var(--classic-bg-surface), var(--classic-bg-secondary));
  border: 1px solid var(--classic-border);
  border-top: 2px solid rgba(201, 169, 98, 0.4);
  border-radius: var(--classic-radius-lg);
  padding: 1.25rem;
  transition: all var(--classic-transition-normal);
}

.classic-timeline-card:hover,
.classic-timeline-card:active {
  border-color: var(--classic-border-hover);
  box-shadow: var(--classic-shadow-md);
}

.classic-timeline-title {
  font-family: var(--classic-font-display);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--classic-text-primary);
  margin-bottom: 0.375rem;
}

.classic-timeline-speaker {
  font-size: 0.875rem;
  color: var(--classic-text-secondary);
}

.classic-timeline-badge {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.25rem 0.5rem;
  background: rgba(201, 169, 98, 0.15);
  color: var(--classic-accent-gold);
  border-radius: var(--classic-radius-sm);
  margin-top: 0.5rem;
}


/* ============================================================
   ANNOUNCEMENTS SECTION - Elegant News Cards
   ============================================================ */

.classic-announcements-list {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.classic-announcement-card {
  background: linear-gradient(165deg, var(--classic-bg-surface), var(--classic-bg-secondary));
  border: 1px solid var(--classic-border);
  border-top: 2px solid rgba(201, 169, 98, 0.4);
  border-radius: var(--classic-radius-lg);
  padding: 1.5rem;
  transition: all var(--classic-transition-normal);
}

.classic-announcement-card:hover,
.classic-announcement-card:active {
  border-color: var(--classic-border-hover);
  box-shadow: var(--classic-shadow-md);
}

.classic-announcement-date {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--classic-accent-gold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.5rem;
}

.classic-announcement-title {
  font-family: var(--classic-font-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--classic-text-primary);
  margin-bottom: 0.5rem;
}

.classic-announcement-text {
  font-size: 0.9375rem;
  color: var(--classic-text-secondary);
  line-height: 1.6;
}

.classic-announcement-badge {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.25rem 0.625rem;
  background: var(--classic-accent-gold);
  color: var(--classic-bg-primary);
  border-radius: var(--classic-radius-full);
  margin-bottom: 0.75rem;
}


/* ============================================================
   CUP/LEADERBOARD SECTION - Elegant Rankings
   ============================================================ */

.classic-cup-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.classic-cup-item {
  display: grid;
  grid-template-columns: 60px 1fr auto;
  gap: 1.5rem;
  padding: 1.25rem 1.5rem;
  background: linear-gradient(165deg, var(--classic-bg-surface), var(--classic-bg-secondary));
  border: 1px solid var(--classic-border);
  border-top: 2px solid rgba(201, 169, 98, 0.4);
  border-radius: var(--classic-radius-lg);
  align-items: center;
  transition: all var(--classic-transition-normal);
}

.classic-cup-item:hover,
.classic-cup-item:active {
  border-color: var(--classic-border-hover);
  box-shadow: var(--classic-shadow-md);
}

/* Top 3 special styling */
.classic-cup-item:nth-child(1) {
  border-color: var(--classic-accent-gold);
  background: linear-gradient(165deg, rgba(201, 169, 98, 0.1), var(--classic-bg-secondary));
}

.classic-cup-item:nth-child(2) {
  border-color: #a0aec0;
}

.classic-cup-item:nth-child(3) {
  border-color: #cd7f32;
}

.classic-cup-rank {
  font-family: var(--classic-font-display);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--classic-accent-gold);
  text-align: center;
}

.classic-cup-item:nth-child(1) .classic-cup-rank {
  color: var(--classic-accent-gold);
}

.classic-cup-item:nth-child(2) .classic-cup-rank {
  color: #a0aec0;
}

.classic-cup-item:nth-child(3) .classic-cup-rank {
  color: #cd7f32;
}

.classic-cup-info {
  min-width: 0;
}

.classic-cup-name {
  font-family: var(--classic-font-display);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--classic-text-primary);
}

.classic-cup-team {
  font-size: 0.875rem;
  color: var(--classic-text-secondary);
}

.classic-cup-score {
  font-family: var(--classic-font-display);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--classic-accent-gold);
}


/* ============================================================
   LOCATION SECTION - Elegant Venue Display
   ============================================================ */

.classic-location-section {
  background: linear-gradient(165deg, var(--classic-bg-surface), var(--classic-bg-secondary));
  border: 1px solid var(--classic-border);
  border-top: 2px solid rgba(201, 169, 98, 0.4);
  border-radius: var(--classic-radius-xl);
  overflow: hidden;
}

.classic-location-map {
  width: 100%;
  height: 300px;
  background: var(--classic-bg-elevated);
}

.classic-location-map iframe {
  width: 100%;
  height: 100%;
  border: none;
  filter: grayscale(30%) contrast(1.1);
}

.classic-location-info {
  padding: 2rem;
}

.classic-location-name {
  font-family: var(--classic-font-display);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--classic-text-primary);
  margin-bottom: 0.5rem;
}

.classic-location-address {
  font-size: 1rem;
  color: var(--classic-text-secondary);
  line-height: 1.6;
  margin-bottom: 1.5rem;
}

.classic-location-details {
  display: grid;
  gap: 1rem;
}

.classic-location-detail {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.classic-location-detail-icon {
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(201, 169, 98, 0.1);
  border: 1px solid var(--classic-border);
  border-radius: var(--classic-radius-md);
  color: var(--classic-accent-gold);
}

.classic-location-detail-text {
  flex: 1;
}

.classic-location-detail-label {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--classic-accent-gold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.25rem;
}

.classic-location-detail-value {
  font-size: 0.9375rem;
  color: var(--classic-text-primary);
}

.classic-location-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--classic-border);
}

/* ============================================================
   HIGH CONTRAST MODE
   ============================================================ */
@media (prefers-contrast: high) {
  .classic-card,
  .classic-section-header {
    border-width: 2px;
  }

  .classic-btn,
  .classic-link {
    text-decoration: underline;
  }

  .classic-btn-gold,
  .classic-btn-outline {
    border-width: 2px;
  }

  .classic-hero-title {
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-text-fill-color: var(--classic-text-primary);
    color: var(--classic-text-primary);
  }

  .classic-hero-title-wrapper {
    filter: none;
  }
}

/* ============================================================
   ANNOUNCEMENT POPUP — Classic Template Overrides
   ============================================================ */
.classic-page {
  --announcement-popup-bg: #1e293b;
  --announcement-popup-border: rgba(201, 169, 98, 0.3);
  --announcement-popup-accent-color: #c9a962;
  --announcement-popup-text: #f8fafc;
}

/* =============================================================================
   POSTPONEMENT BANNER — Classic Theme Mapping (Editorial Gold/Navy, BGB §312d)
   Playfair display, Lato body, gold-shadow accent on urgent.
   ============================================================================= */
.classic-page .postponement-info-banner {
  --pb-radius-container: var(--classic-radius-lg, 0.25rem);
  --pb-radius-cta: var(--classic-radius-md, 0.125rem);
  --pb-font-display: var(--classic-font-display, 'Playfair Display', Georgia, serif);
  --pb-font-body: var(--classic-font-body, 'Lato', sans-serif);
  --pb-font-cta: var(--classic-font-body, 'Lato', sans-serif);
  --pb-title-weight: 700;
  --pb-title-size: 1.0625rem;
  --pb-cta-weight: 600;
  --pb-cta-tracking: 0.05em;
  --pb-cta-transform: uppercase;
  --pb-cta-fg-on-accent: #0a1628;
}
.classic-page .postponement--urgent {
  --pb-urgent-bg: rgba(201, 169, 98, 0.12);
  --pb-urgent-border: rgba(201, 169, 98, 0.38);
  --pb-urgent-accent: var(--classic-accent-gold, #c9a962);
  --pb-urgent-fg: var(--classic-accent-ivory, #f8f7f4);
  --pb-shadow: var(--classic-shadow-gold, 0 8px 24px rgba(201, 169, 98, 0.18));
}
.classic-page .postponement--info {
  --pb-info-bg: rgba(226, 213, 168, 0.08);
  --pb-info-border: rgba(226, 213, 168, 0.3);
  --pb-info-accent: var(--classic-accent-gold-light, #e2d5a8);
  --pb-info-fg: var(--classic-accent-ivory, #f8f7f4);
  --pb-shadow: var(--classic-shadow-md, 0 4px 6px -1px rgba(0, 0, 0, 0.3));
}
.classic-page .postponement--neutral {
  --pb-neutral-fg: rgba(248, 247, 244, 0.75);
  --pb-shadow: var(--classic-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.3));
}

/* =============================================================================
   TICKETS UNAVAILABLE BANNER — Classic Theme Mapping (Editorial Gold/Navy)
   Playfair display, soft radius (0.25rem), gold-shadow on cancelled & soldout.
   ============================================================================= */
.classic-page .tickets-unavailable-banner {
  --tu-radius: var(--classic-radius-lg, 0.25rem);
  --tu-radius-icon: 50%;
  --tu-radius-pill: 9999px;
  --tu-padding-y: 2.5rem;
  --tu-padding-x: 2rem;
  --tu-font-display: var(--classic-font-display, 'Playfair Display', Georgia, serif);
  --tu-font-body: var(--classic-font-body, 'Lato', sans-serif);
  --tu-title-weight: 700;
  --tu-title-size: 1.375rem;
  --tu-title-size-sm: 1.75rem;
  --tu-border-width: 1px;
  --tu-backdrop-blur: 8px;
  --tu-shadow: var(--classic-shadow-md, 0 4px 6px -1px rgba(0, 0, 0, 0.3));
}
.classic-page .tickets-unavailable--cancelled::after { animation: none; opacity: 0.4; }

.classic-page .tickets-unavailable--cancelled {
  --tickets-cancelled-bg: rgba(185, 28, 28, 0.12);
  --tickets-cancelled-border: rgba(185, 28, 28, 0.45);
  --tickets-cancelled-icon: #dc2626;
  --tickets-cancelled-title: #fca5a5;
  --tickets-cancelled-gradient: linear-gradient(135deg, rgba(185, 28, 28, 0.14) 0%, rgba(10, 22, 40, 0) 100%);
}
.classic-page .tickets-unavailable--archived {
  --tickets-archived-bg: rgba(201, 169, 98, 0.06);
  --tickets-archived-border: rgba(201, 169, 98, 0.25);
  --tickets-archived-icon: var(--classic-accent-gold-light, #e2d5a8);
  --tickets-archived-title: var(--classic-accent-ivory, #f8f7f4);
  --tickets-archived-gradient: linear-gradient(135deg, rgba(201, 169, 98, 0.08) 0%, rgba(10, 22, 40, 0) 100%);
}
.classic-page .tickets-unavailable--expired {
  --tickets-expired-bg: rgba(201, 169, 98, 0.12);
  --tickets-expired-border: var(--classic-accent-gold, #c9a962);
  --tickets-expired-icon: var(--classic-accent-gold, #c9a962);
  --tickets-expired-title: var(--classic-accent-gold-light, #e2d5a8);
  --tickets-expired-gradient: linear-gradient(135deg, rgba(201, 169, 98, 0.14) 0%, rgba(154, 123, 61, 0.06) 100%);
}
/* Soldout uses gold as scarcity signal in classic — editorial elegance */
.classic-page .tickets-unavailable--soldout {
  --tickets-soldout-bg: rgba(201, 169, 98, 0.14);
  --tickets-soldout-border: var(--classic-accent-gold, #c9a962);
  --tickets-soldout-icon: var(--classic-accent-gold, #c9a962);
  --tickets-soldout-title: var(--classic-accent-gold-light, #e2d5a8);
  --tickets-soldout-gradient: linear-gradient(135deg, rgba(201, 169, 98, 0.16) 0%, rgba(154, 123, 61, 0.08) 100%);
}
.classic-page .tickets-unavailable--soldout {
  box-shadow: var(--classic-shadow-gold, 0 10px 30px rgba(201, 169, 98, 0.35), 0 0 20px rgba(201, 169, 98, 0.15));
}
.classic-page .tickets-unavailable--notstarted {
  --tickets-notstarted-bg: rgba(226, 213, 168, 0.1);
  --tickets-notstarted-border: rgba(226, 213, 168, 0.3);
  --tickets-notstarted-icon: var(--classic-accent-gold-light, #e2d5a8);
  --tickets-notstarted-title: var(--classic-accent-ivory, #f8f7f4);
  --tickets-notstarted-gradient: linear-gradient(135deg, rgba(226, 213, 168, 0.12) 0%, rgba(154, 123, 61, 0.04) 100%);
}
.classic-page .tickets-unavailable--draft {
  --tickets-draft-bg: rgba(201, 169, 98, 0.06);
  --tickets-draft-border: var(--classic-accent-gold-dark, #9a7b3d);
  --tickets-draft-icon: var(--classic-accent-gold-light, #e2d5a8);
  --tickets-draft-title: var(--classic-accent-ivory, #f8f7f4);
  --tickets-draft-gradient: linear-gradient(135deg, rgba(154, 123, 61, 0.08) 0%, rgba(10, 22, 40, 0) 100%);
}
.classic-page .tickets-unavailable-preview-notice {
  background: rgba(201, 169, 98, 0.1);
  border-color: var(--classic-accent-gold, #c9a962);
  color: var(--classic-accent-gold-light, #e2d5a8);
  font-family: var(--classic-font-body, 'Lato', sans-serif);
  letter-spacing: 0.04em;
}