/* ===== Page: Wieczory ===== */

/* Hero */
.wieczory-hero {
  padding-block: var(--space-3xl) var(--space-4xl);
  background-color: var(--color-perlowa-biel);
}

.wieczory-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: var(--space-2xl);
  align-items: center;
}

.wieczory-hero__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  max-width: 720px;
  align-items: flex-start;
}

.wieczory-hero__label {
  margin-block-end: 0;
}

.wieczory-hero__content h1 {
  margin-block-end: 0;
}

.wieczory-hero__content .lead {
  margin-block-end: 0;
}

.wieczory-hero__content .small {
  margin-block-end: 0;
}

.wieczory-hero__content .btn {
  margin-block-start: var(--space-sm);
}

.wieczory-hero__roulette {
  display: flex;
  justify-content: center;
  align-items: center;
}

.wieczory-hero__roulette-circle {
  width: min(280px, 100%);
  aspect-ratio: 1;
  border-radius: var(--radius-circle);
  border: 1px solid var(--color-linia-perlowa);
  background:
    radial-gradient(circle at center, var(--color-perlowa-biel-ciepla) 0 34%, transparent 35%),
    conic-gradient(from 0deg, var(--color-szmaragdowa-zielen) 0 15deg, var(--color-kobaltowy-blekit) 15deg 30deg, var(--color-koralowa-czerwien) 30deg 45deg, var(--color-perlowa-biel-ciepla) 45deg 60deg, var(--color-szmaragdowa-zielen) 60deg 75deg, var(--color-kobaltowy-blekit) 75deg 90deg, var(--color-koralowa-czerwien) 90deg 105deg, var(--color-perlowa-biel-ciepla) 105deg 120deg, var(--color-szmaragdowa-zielen) 120deg 135deg, var(--color-kobaltowy-blekit) 135deg 150deg, var(--color-koralowa-czerwien) 150deg 165deg, var(--color-perlowa-biel-ciepla) 165deg 180deg, var(--color-szmaragdowa-zielen) 180deg 195deg, var(--color-kobaltowy-blekit) 195deg 210deg, var(--color-koralowa-czerwien) 210deg 225deg, var(--color-perlowa-biel-ciepla) 225deg 240deg, var(--color-szmaragdowa-zielen) 240deg 255deg, var(--color-kobaltowy-blekit) 255deg 270deg, var(--color-koralowa-czerwien) 270deg 285deg, var(--color-perlowa-biel-ciepla) 285deg 300deg, var(--color-szmaragdowa-zielen) 300deg 315deg, var(--color-kobaltowy-blekit) 315deg 330deg, var(--color-koralowa-czerwien) 330deg 345deg, var(--color-perlowa-biel-ciepla) 345deg 360deg);
  position: relative;
  box-shadow: var(--shadow-floating);
}

.wieczory-hero__roulette-dot {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 12px;
  background-color: var(--color-koralowa-czerwien);
  border-radius: var(--radius-circle);
  transform: translate(-50%, -50%);
}

/* Section headers */
.wieczory-section-header {
  margin-block-end: var(--space-2xl);
}

.wieczory-section-header .label {
  margin-block-end: var(--space-xs);
}

.wieczory-section-header h2 {
  margin-block-end: 0;
}

.wieczory-section-header--dark .label,
.wieczory-section-header--dark h2 {
  color: var(--color-tekst-na-ciemnym);
}

/* Koncepcja */
.wieczory-koncepcja {
  padding-block: var(--space-4xl);
  background-color: var(--color-perlowa-biel);
}

.wieczory-koncepcja__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-xl);
}

.wieczory-koncepcja__card {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  background-color: var(--color-perlowa-biel-ciepla);
  border: 1px solid var(--color-linia-perlowa);
  border-radius: var(--radius-card);
  padding: var(--space-xl);
  min-width: 0;
}

.wieczory-koncepcja__card h3 {
  margin-block-end: 0;
}

.wieczory-koncepcja__card p {
  margin-block-end: 0;
}

.wieczory-koncepcja__card blockquote {
  margin-block-end: 0;
  font-size: var(--text-h4-size);
}

.wieczory-koncepcja__card .content-list {
  margin-block-end: 0;
}

.wieczory-suit {
  font-size: 14px;
  color: var(--color-koralowa-czerwien);
  line-height: 1;
}

.wieczory-suit--dark {
  color: var(--color-koralowa-czerwien);
}

/* Menu degustacyjne */
.wieczory-menu {
  padding-block: var(--space-4xl);
  background-color: var(--color-perlowa-biel-ciepla);
}

.wieczory-menu__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: var(--space-2xl);
  align-items: start;
}

.wieczory-menu__image-wrap {
  position: sticky;
  top: var(--space-lg);
  border-radius: var(--radius-card);
  overflow: hidden;
  border: 1px solid var(--color-linia-perlowa);
}

.wieczory-menu__image-wrap img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.wieczory-menu__content {
  min-width: 0;
}

.wieczory-menu__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.wieczory-menu-card {
  background-color: var(--color-perlowa-biel-ciepla);
  border: 1px solid var(--color-linia-perlowa);
  border-radius: var(--radius-card);
  padding: var(--space-lg);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}

.wieczory-menu-card:hover {
  border-color: var(--color-szmaragdowa-zielen);
  box-shadow: var(--shadow-floating);
  transform: translateY(-2px);
}

.wieczory-menu-card__header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-md);
  margin-block-end: var(--space-sm);
}

.wieczory-menu-card__header h3 {
  margin-block-end: 0;
}

.wieczory-menu-card__category {
  font-size: var(--text-label-size);
  font-weight: var(--text-label-weight);
  letter-spacing: var(--text-label-tracking);
  text-transform: uppercase;
  color: var(--color-orzech-rozjasniony);
  white-space: nowrap;
}

.wieczory-menu-card p {
  margin-block-end: 0;
}

.wieczory-menu-card--wine {
  border-color: var(--color-szmaragdowa-zielen);
}

/* Atmosfera */
.wieczory-atmosfera {
  padding-block: var(--space-4xl);
  background-color: var(--color-perlowa-biel);
}

.wieczory-atmosfera__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: var(--space-2xl);
  align-items: start;
}

.wieczory-atmosfera__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-xl);
  min-width: 0;
}

.wieczory-atmosfera__block {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.wieczory-atmosfera__block h3 {
  margin-block-end: 0;
}

.wieczory-atmosfera__block p {
  margin-block-end: 0;
}

.wieczory-link {
  align-self: flex-start;
  color: var(--color-kobaltowy-blekit);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.wieczory-atmosfera__image-wrap {
  border-radius: var(--radius-card);
  overflow: hidden;
  border: 1px solid var(--color-linia-perlowa);
  transition: filter var(--transition-fast);
}

.wieczory-atmosfera__image-wrap:hover {
  filter: brightness(1.03);
}

.wieczory-atmosfera__image-wrap img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* Gry */
.wieczory-gry {
  padding-block: var(--space-4xl);
  background-color: var(--color-szmaragdowa-zielen);
  color: var(--color-tekst-na-ciemnym);
}

.wieczory-gry__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-xl);
}

.wieczory-gry__card {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  background-color: rgba(255, 253, 248, 0.06);
  border: 1px solid rgba(255, 253, 248, 0.18);
  border-radius: var(--radius-card);
  padding: var(--space-xl);
  min-width: 0;
}

.wieczory-gry__card h3 {
  color: var(--color-tekst-na-ciemnym);
  margin-block-end: 0;
}

.wieczory-gry__card p {
  color: var(--color-tekst-na-ciemnym);
  margin-block-end: 0;
}

/* Harmonogram */
.wieczory-harmonogram {
  padding-block: var(--space-4xl);
  background-color: var(--color-perlowa-biel);
}

.wieczory-harmonogram__inner {
  max-width: 720px;
  margin-inline: auto;
}

.wieczory-harmonogram__inner .lead {
  margin-block-end: var(--space-xl);
}

.wieczory-timeline {
  list-style: none;
  padding: 0;
  margin: 0 0 var(--space-md);
  position: relative;
}

.wieczory-timeline::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 0;
  bottom: 0;
  width: 1px;
  background-color: var(--color-linia-perlowa);
}

.wieczory-timeline__item {
  display: grid;
  grid-template-columns: 60px 16px 1fr;
  gap: var(--space-md);
  align-items: baseline;
  padding-block-end: var(--space-lg);
  position: relative;
}

.wieczory-timeline__item:last-child {
  padding-block-end: 0;
}

.wieczory-timeline__time {
  font-weight: 600;
  color: var(--color-ciemny-orzech);
  text-align: right;
}

.wieczory-timeline__dot {
  width: 15px;
  height: 15px;
  background-color: var(--color-koralowa-czerwien);
  border-radius: var(--radius-circle);
  display: block;
  position: relative;
  z-index: 1;
}

.wieczory-timeline__text {
  color: var(--color-ciemny-orzech);
}

/* Opinie */
.wieczory-opinie {
  padding-block: var(--space-4xl);
  background-color: var(--color-perlowa-biel-ciepla);
}

.wieczory-opinie__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-xl);
}

.wieczory-opinia {
  background-color: var(--color-perlowa-biel);
  border: 1px solid var(--color-linia-perlowa);
  border-radius: var(--radius-card);
  padding: var(--space-xl);
  margin: 0;
  border-inline-start: 2px solid var(--color-koralowa-czerwien);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}

.wieczory-opinia:hover {
  border-color: var(--color-szmaragdowa-zielen);
  box-shadow: var(--shadow-floating);
  transform: translateY(-2px);
}

.wieczory-opinia p {
  margin-block-end: var(--space-md);
}

.wieczory-opinia footer {
  margin-block-start: auto;
}

/* Informacje praktyczne */
.wieczory-info {
  padding-block: var(--space-4xl);
  background-color: var(--color-szmaragdowa-zielen);
  color: var(--color-tekst-na-ciemnym);
}

.wieczory-info__inner {
  max-width: var(--container-primary-max);
  margin-inline: auto;
  padding-inline: var(--container-primary-padding-inline);
}

.wieczory-info__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-xl);
}

.wieczory-info__block {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  min-width: 0;
}

.wieczory-info__block h3 {
  color: var(--color-tekst-na-ciemnym);
  margin-block-end: 0;
}

.wieczory-info__block p {
  color: var(--color-tekst-na-ciemnym);
  margin-block-end: 0;
}

.wieczory-info__list {
  color: var(--color-tekst-na-ciemnym);
  margin-block-end: 0;
}

.wieczory-info__list a {
  color: var(--color-tekst-na-ciemnym);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.wieczory-info__list a:hover {
  color: var(--color-koralowa-czerwien);
}

/* Rezerwacja */
.wieczory-rezerwacja {
  padding-block: var(--space-4xl);
  background-color: var(--color-perlowa-biel);
}

.wieczory-rezerwacja__inner {
  max-width: 720px;
  margin-inline: auto;
}

.wieczory-rezerwacja__lead {
  margin-block-end: var(--space-xl);
}

.wieczory-form {
  background-color: var(--color-szmaragdowa-zielen);
  border-radius: var(--radius-card);
  padding: var(--space-2xl);
  box-shadow: var(--shadow-floating);
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.wieczory-form__row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-lg);
}

.wieczory-form__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  min-width: 0;
}

.wieczory-form__field label {
  color: var(--color-tekst-na-ciemnym);
  font-size: var(--text-small-size);
  font-weight: 500;
}

.wieczory-form__field input,
.wieczory-form__field select,
.wieczory-form__field textarea {
  background-color: var(--color-perlowa-biel-ciepla);
  border: 1px solid rgba(255, 253, 248, 0.4);
  border-radius: var(--radius-input);
  padding: var(--space-sm) var(--space-md);
  color: var(--color-ciemny-orzech);
  font-size: var(--text-body-size);
  line-height: 1.5;
  width: 100%;
}

.wieczory-form__field input:focus,
.wieczory-form__field select:focus,
.wieczory-form__field textarea:focus {
  outline: var(--focus-ring);
  outline-offset: var(--focus-ring-offset);
  border-color: var(--color-koralowa-czerwien);
}

.wieczory-form__error {
  color: var(--color-koralowa-czerwien);
  font-size: var(--text-small-size);
  min-height: 1.5em;
  margin: 0;
}

.wieczory-form__success {
  color: var(--color-tekst-na-ciemnym);
  font-size: var(--text-small-size);
  margin: 0;
  display: flex;
  align-items: center;
  gap: var(--space-xs);
}

.wieczory-form__success::before {
  content: "✓";
  color: var(--color-szmaragdowa-zielen);
  font-weight: 700;
}

.wieczory-form .btn {
  align-self: flex-start;
}

/* CTA końcowa */
.wieczory-cta {
  padding-block: var(--space-4xl);
  background-color: var(--color-perlowa-biel);
}

.wieczory-cta__inner {
  max-width: 720px;
  margin-inline: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  align-items: center;
}

.wieczory-cta__inner h2 {
  margin-block-end: 0;
}

.wieczory-cta__inner .lead {
  margin-block-end: 0;
}

.wieczory-cta__inner .small {
  margin-block-end: 0;
}

.wieczory-cta__inner .btn {
  margin-block-start: var(--space-sm);
}

/* ===== Responsive ===== */
@media (max-width: 1023px) {
  .wieczory-hero__inner {
    grid-template-columns: 1fr;
    gap: var(--space-xl);
  }

  .wieczory-hero__content {
    max-width: 100%;
  }

  .wieczory-hero__roulette {
    order: 2;
  }

  .wieczory-hero__roulette-circle {
    width: min(200px, 60%);
  }

  .wieczory-koncepcja__grid,
  .wieczory-gry__grid,
  .wieczory-opinie__grid {
    grid-template-columns: 1fr;
  }

  .wieczory-menu__inner,
  .wieczory-atmosfera__inner {
    grid-template-columns: 1fr;
  }

  .wieczory-menu__image-wrap {
    position: static;
  }

  .wieczory-info__grid {
    grid-template-columns: 1fr;
  }

  .wieczory-form__row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767px) {
  .wieczory-hero {
    padding-block: var(--space-2xl) var(--space-3xl);
  }

  .wieczory-hero__content h1 {
    font-size: var(--text-h1-size);
  }

  .wieczory-hero__roulette-circle {
    width: min(160px, 60%);
  }

  .wieczory-koncepcja,
  .wieczory-menu,
  .wieczory-atmosfera,
  .wieczory-gry,
  .wieczory-harmonogram,
  .wieczory-opinie,
  .wieczory-info,
  .wieczory-rezerwacja,
  .wieczory-cta {
    padding-block: var(--space-3xl);
  }

  .wieczory-timeline__item {
    grid-template-columns: 50px 14px 1fr;
    gap: var(--space-sm);
  }

  .wieczory-timeline::before {
    left: 6px;
  }

  .wieczory-timeline__dot {
    width: 13px;
    height: 13px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wieczory-menu-card,
  .wieczory-opinia,
  .wieczory-atmosfera__image-wrap {
    transition: none;
  }

  .wieczory-menu-card:hover,
  .wieczory-opinia:hover {
    transform: none;
  }
}
