/* PTRA — vy rámy, patina a zlaté akcenty */

.home-page {
  --vy-frame-slice: 144;
  --vy-frame-border: 72px;
  --vy-frame-outset-x: 10px;
  --vy-frame-outset-y: 14px;
  --vy-nav-slice: 30;
  --vy-nav-border: 11px;
  --vy-btn-slice: 48;
  --vy-btn-border: 14px;
  --vy-gold: #ffd84a;
  --vy-gold-bright: #fff2b0;
  --vy-gold-glow: rgba(255, 228, 120, 0.62);
  --vy-patina-top: rgba(255, 236, 170, 0.09);
  --vy-patina-edge: rgba(180, 150, 90, 0.14);
}

/* Hlavný blok obsahu — bez horného ozdobného rámu (prázdny pruh nad O festivale) */
.home-page .page-main {
  position: relative;
  border: 1px solid rgba(255, 220, 120, 0.22) !important;
  border-image: none !important;
  border-image-source: none !important;
  background:
    radial-gradient(ellipse 90% 42% at 50% 0%, var(--vy-patina-top) 0%, transparent 58%),
    linear-gradient(
      180deg,
      rgba(12, 16, 24, 0.94) 0%,
      rgba(6, 8, 14, 0.97) 100%
    ) !important;
  box-shadow:
    inset 0 0 48px rgba(255, 210, 120, 0.06),
    inset 0 1px 0 rgba(255, 242, 176, 0.1),
    0 20px 50px rgba(0, 0, 0, 0.48) !important;
}

.home-page .page-main::before {
  display: none !important;
  content: none !important;
}

/* Sekcie — rám + patina (bez horného ozdobného pruhu nad #o-festivale) */
.home-page main section {
  position: relative !important;
  border: solid transparent !important;
  border-image-source: url("../images/vy-frame.webp") !important;
  border-image-slice: var(--vy-frame-slice) !important;
  border-image-width: var(--vy-frame-border) !important;
  border-image-repeat: stretch !important;
  border-image-outset: var(--vy-frame-outset-y) var(--vy-frame-outset-x) !important;
  image-rendering: -webkit-optimize-contrast;
  margin-top: 2.75rem !important;
  margin-bottom: 2.25rem !important;
  padding: 2rem 1.85rem 1.65rem !important;
  background:
    radial-gradient(ellipse 110% 70% at 50% -8%, var(--vy-patina-top) 0%, transparent 52%),
    linear-gradient(
      165deg,
      rgba(255, 238, 190, 0.05) 0%,
      transparent 38%,
      rgba(0, 0, 0, 0.14) 100%
    ),
    linear-gradient(
      180deg,
      rgba(18, 22, 32, 0.9) 0%,
      rgba(10, 13, 20, 0.94) 100%
    ) !important;
  box-shadow:
    inset 0 0 52px rgba(255, 200, 100, 0.07),
    inset 0 2px 0 var(--vy-patina-edge),
    inset 0 0 40px rgba(0, 0, 0, 0.32),
    0 8px 24px rgba(0, 0, 0, 0.28) !important;
}

.home-page #o-festivale {
  margin-top: 0.75rem !important;
}

.home-page #o-festivale::before {
  display: none !important;
  content: none !important;
}

.home-page main section::before,
.home-page main section::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
  font-size: 0 !important;
  color: transparent !important;
}

.home-page main section::before {
  top: auto !important;
  bottom: calc(100% + 6px) !important;
  width: min(248px, 94%) !important;
  height: clamp(36px, 8vw, 62px) !important;
  background: url("../images/vy-frame-top.webp") center bottom / contain no-repeat !important;
  opacity: 0.92;
  filter: contrast(1.06) brightness(1.05) saturate(1.08);
}

.home-page main section::after {
  top: calc(100% + 6px) !important;
  bottom: auto !important;
  width: min(168px, 76%) !important;
  height: clamp(28px, 6vw, 48px) !important;
  background: url("../images/vy-frame-bottom.webp") center top / contain no-repeat !important;
  opacity: 0.94;
  filter: contrast(1.05) brightness(1.04) saturate(1.06);
}

.home-page main section h2 {
  position: relative;
  z-index: 1;
  color: var(--vy-gold-bright) !important;
  padding-bottom: 0.85rem !important;
  text-shadow:
    0 1px 0 rgba(0, 0, 0, 0.85),
    0 0 22px var(--vy-gold-glow),
    0 0 8px rgba(255, 242, 176, 0.45) !important;
}

.home-page main section h2::after {
  height: 2px !important;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 220, 90, 0.45) 18%,
    rgba(255, 248, 210, 0.95) 50%,
    rgba(255, 220, 90, 0.45) 82%,
    transparent 100%
  ) !important;
  box-shadow: 0 0 16px var(--vy-gold-glow) !important;
}

/* Vnútorné karty / panely — ostrý CSS rám (bez border-image, fill rozmazával stred) */
.home-page .card:not(.choice-hub):not(.chess-teaser) {
  position: relative;
  border: 1px solid rgba(210, 175, 95, 0.52) !important;
  border-radius: 8px !important;
  border-image: none !important;
  background:
    radial-gradient(ellipse 100% 55% at 50% 0%, rgba(255, 228, 150, 0.08) 0%, transparent 58%),
    linear-gradient(
      165deg,
      rgba(22, 28, 40, 0.96) 0%,
      rgba(11, 14, 22, 0.98) 100%
    ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 235, 200, 0.16),
    inset 0 0 0 1px rgba(0, 0, 0, 0.28),
    0 10px 28px rgba(0, 0, 0, 0.32) !important;
}

.home-page .card:not(.choice-hub):not(.chess-teaser)::before {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  top: 5px !important;
  left: 5px !important;
  right: 5px !important;
  bottom: 5px !important;
  width: auto !important;
  height: auto !important;
  opacity: 1 !important;
  pointer-events: none !important;
  border: 1px solid rgba(255, 220, 130, 0.14) !important;
  border-radius: 5px !important;
}

.home-page .card:not(.choice-hub):not(.chess-teaser)::after {
  display: none !important;
}

.home-page .card.program-panel {
  border-color: rgba(255, 203, 0, 0.38) !important;
  border-image: none !important;
}

/* Podpora / zapojenie — bez vy rámu border-image (ľavý sivý pruh = artefakt outset) */
.home-page #vstupenky-rezervacie {
  border-image: none !important;
  border-image-source: none !important;
  border-image-outset: 0 !important;
  overflow: hidden;
}

.home-page #vstupenky-rezervacie .card.choice-hub,
.home-page #vstupenky-rezervacie .choice-card {
  border: 1px solid rgba(206, 166, 96, 0.34) !important;
  border-image: none !important;
  border-image-source: none !important;
  border-image-slice: initial !important;
  border-image-width: initial !important;
  border-image-outset: 0 !important;
  overflow: hidden;
}

/* Navigácia — menší rám okolo textu */
.home-page .site-header .nav {
  border: solid transparent !important;
  border-image-source: url("../images/vy-nav-frame.webp") !important;
  border-image-slice: var(--vy-nav-slice) !important;
  border-image-width: var(--vy-nav-border) !important;
  border-image-outset: 3px 2px 4px !important;
  image-rendering: -webkit-optimize-contrast;
  box-shadow:
    inset 0 1px 0 rgba(255, 230, 150, 0.28),
    inset 0 -2px 8px rgba(0, 0, 0, 0.45),
    0 8px 22px rgba(0, 0, 0, 0.38) !important;
}

.home-page .site-header .nav a {
  color: var(--vy-gold-bright) !important;
  text-shadow: 0 0 14px var(--vy-gold-glow), 0 1px 2px rgba(0, 0, 0, 0.8) !important;
}

.home-page .site-header .nav a:hover {
  color: #fff8dc !important;
  text-shadow: 0 0 18px rgba(255, 240, 160, 0.75) !important;
}

.home-page .btn-primary:not(.hero-cta):not(.chess-teaser__register):not(.stripe-btn) {
  border: solid transparent;
  border-image-source: url("../images/vy-frame.webp");
  border-image-slice: var(--vy-btn-slice);
  border-image-width: var(--vy-btn-border);
  border-image-outset: 4px 10px 6px;
  box-shadow: 0 0 16px rgba(217, 36, 28, 0.35);
}

/* Hero — Harmonogram bez vy rámu; Podpor má červený okraj ako Prispieť */
.home-page .hero .btn-primary.hero-cta:not(.hero-btn--podpor) {
  border: 1px solid rgba(212, 170, 94, 0.78) !important;
  border-image: none !important;
  border-image-source: none !important;
  border-image-slice: initial !important;
  border-image-width: initial !important;
  border-image-outset: initial !important;
}

@media (max-width: 860px) {
  .home-page {
    --vy-frame-slice: 96;
    --vy-frame-border: 48px;
    --vy-nav-slice: 24;
    --vy-nav-border: 9px;
    --vy-btn-slice: 36;
    --vy-btn-border: 12px;
    --vy-frame-outset-x: 6px;
    --vy-frame-outset-y: 10px;
  }

  .home-page main section {
    padding: 1.35rem 1.1rem 1.2rem !important;
    margin-top: 2rem !important;
  }

  .home-page #o-festivale {
    margin-top: 1rem !important;
  }


  .home-page .site-header .nav {
    border-image-width: var(--vy-nav-border) !important;
    border-image-outset: 3px 2px 4px !important;
  }
}

/* Šachový turnaj — bez vy rámu orámovania (sekcia + karta + hlavolamy) */
.home-page #sachovy-turnaj.chess-teaser-section {
  border: 1px solid rgba(255, 220, 120, 0.18) !important;
  border-image: none !important;
  border-image-source: none !important;
  border-image-slice: initial !important;
  border-image-width: initial !important;
  border-image-outset: initial !important;
  box-shadow:
    inset 0 0 24px rgba(0, 0, 0, 0.28),
    0 6px 18px rgba(0, 0, 0, 0.22) !important;
}

.home-page #sachovy-turnaj::before,
.home-page #sachovy-turnaj::after {
  display: none !important;
  content: none !important;
}

.home-page .chess-teaser.card,
.home-page .chess-teaser {
  border: none !important;
  border-image: none !important;
  border-image-source: none !important;
  border-image-slice: initial !important;
  border-image-width: initial !important;
  border-image-outset: initial !important;
  box-shadow: none !important;
}

/* FAQ — jednoduché riadky bez vy rámu stĺpikov */
.home-page .faq-item {
  border: 1px solid rgba(255, 220, 120, 0.14) !important;
  border-image: none !important;
  border-image-source: none !important;
  border-image-slice: initial !important;
  border-image-width: initial !important;
  border-image-outset: initial !important;
  border-radius: 6px !important;
  padding: 0.5rem 0.95rem !important;
  margin-bottom: 0.65rem !important;
  background: linear-gradient(
    180deg,
    rgba(22, 28, 40, 0.92) 0%,
    rgba(14, 18, 28, 0.96) 100%
  ) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.22) !important;
}

.home-page .faq-item:hover {
  border-color: rgba(255, 230, 150, 0.28) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28) !important;
  transform: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .home-page main section,
  .home-page .card {
    transition: none;
  }
}