/* ============================================
   EVENTS PAGE — dark plum, poster frame, block cards
   ============================================ */

/* Page wrapper override — slightly darker than the rest of the site,
   with brighter coral accents for contrast. */
.events-body { background: #3a0a18; }
.events-poster {
  background: #46101f;
  color: var(--cream);
}
.events-poster::before { border-color: var(--coral); }
.events-poster { outline-color: var(--coral); }

/* Nav adapts to dark background */
.events-poster .mainnav {
  background: #46101f;
  border-bottom: var(--inner-stroke) solid color-mix(in oklab, var(--coral) 45%, transparent);
}
.events-poster .mainnav-links a,
.events-poster .right a:not(.reserve-pill) { color: var(--cream); }
.events-poster .mainnav-links a:hover,
.events-poster .right a:not(.reserve-pill):hover { color: var(--coral); border-bottom-color: var(--coral); }
.events-poster .right a.is-active { color: var(--coral); border-bottom: 1px solid var(--coral); }
.events-poster .reserve-pill { color: var(--coral); border-color: var(--coral); }
.events-poster .reserve-pill:hover { background: var(--coral); color: var(--cream); border-color: var(--coral); }
.events-poster .nav-burger span { background: var(--cream); }
.events-poster .mainnav-brand a { color: var(--cream) !important; }

.ev-page-wrap {
  max-width: 1080px;
  margin: 0 auto;
  padding: 32px 28px 56px;
}

/* Carosello spostato dentro ev-page-wrap: breakout full-bleed */
.ev-hero-inline {
  margin-top: 56px;
  margin-left: -28px;
  margin-right: -28px;
  width: calc(100% + 56px);
}
@media (max-width: 520px) {
  .ev-hero-inline {
    margin-left: -14px;
    margin-right: -14px;
    width: calc(100% + 28px);
  }
}

/* ===== HERO CAROUSEL — sliding track, full bleed within the poster frame ===== */
.ev-hero-figure {
  position: relative;
  margin: 0;
  margin-top: 20px;
  width: 100%;
  border-top: 1px solid color-mix(in oklab, var(--coral) 45%, transparent);
  border-bottom: 1px solid color-mix(in oklab, var(--coral) 45%, transparent);
  overflow: hidden;
  aspect-ratio: 16 / 9;
  max-height: 760px;
  min-height: 540px;
}
.ev-hero-track {
  position: absolute; inset: 0;
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform .9s cubic-bezier(.7,.05,.2,1);
  will-change: transform;
}
.ev-hero-slide {
  flex: 0 0 100%;
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  opacity: 1;
}
.ev-hero-dots {
  position: absolute;
  left: 50%; bottom: 18px;
  transform: translateX(-50%);
  display: flex; gap: 10px;
  z-index: 2;
}
.ev-hero-dots .dot {
  width: 26px; height: 2px;
  background: color-mix(in oklab, var(--cream) 55%, transparent);
  border: 0; padding: 0;
  cursor: pointer;
  transition: background .25s ease, transform .25s ease;
}
.ev-hero-dots .dot.is-active {
  background: var(--coral);
  transform: scaleY(2.5);
}

/* Hero arrows — prev / next */
.ev-hero-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px; height: 48px;
  border-radius: 50%;
  background: color-mix(in oklab, #000 55%, transparent);
  color: var(--cream);
  border: 1px solid color-mix(in oklab, var(--cream) 50%, transparent);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  z-index: 3;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.ev-hero-arrow:hover {
  background: var(--coral);
  border-color: var(--coral);
}
.ev-hero-arrow.prev { left: 18px; }
.ev-hero-arrow.next { right: 18px; }
@media (max-width: 520px) {
  .ev-hero-arrow { width: 38px; height: 38px; }
  .ev-hero-arrow.prev { left: 10px; }
  .ev-hero-arrow.next { right: 10px; }
}
.ev-hero-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 52px; height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.28);
  color: var(--cream);
  border: 1px solid color-mix(in oklab, var(--cream) 35%, transparent);
  border-radius: 999px;
  cursor: pointer;
  z-index: 3;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
  backdrop-filter: blur(4px);
}
.ev-hero-arrow:hover {
  background: var(--coral);
  border-color: var(--coral);
  transform: translateY(-50%) scale(1.06);
}
.ev-hero-arrow svg { width: 22px; height: 22px; display: block; }
.ev-hero-arrow--prev { left: 24px; }
.ev-hero-arrow--next { right: 24px; }

/* ===== IN VINO VERITAS — calendar section ===== */
.ev-invino {
  margin-top: 80px;
}
.ev-invino-head {
  position: relative;
  padding-top: 8px;
  margin-bottom: 56px;
}
.ev-invino-head .corner-pill {
  position: absolute;
  top: -8px; left: -8px;
  background: var(--coral);
  color: var(--cream);
}
.ev-invino-head .tag {
  font-family: var(--condensed);
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--coral);
  margin: 0 0 20px 36px;
  display: inline-block;
}
.ev-invino-head h2 {
  font-family: var(--display);
  font-weight: 500;
  font-style: italic;
  font-size: clamp(52px, 7vw, 112px);
  line-height: 0.94;
  letter-spacing: -0.025em;
  color: var(--coral);
  margin: 0 0 28px;
}
.ev-invino-head h2 .line2 {
  display: inline;
  color: var(--cream);
}
.ev-invino-sub {
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  color: color-mix(in oklab, var(--cream) 80%, transparent);
  max-width: 60ch;
}
.ev-invino-sub em { color: var(--coral-soft); font-style: italic; }

.ev-calendar-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.events-poster .ev-event-card {
  position: relative;
  background: color-mix(in oklab, var(--coral) 4%, transparent);
  border: 0;
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  color: var(--cream);
  transition: background .35s ease;
}
.events-poster .ev-event-card::before,
.events-poster .ev-event-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
}
.events-poster .ev-event-card::before {
  background:
    linear-gradient(to right,  var(--coral), var(--coral)) top left  / 0   1px no-repeat,
    linear-gradient(to bottom, var(--coral), var(--coral)) top left  / 1px 0   no-repeat;
  transition: background-size .35s ease;
}
.events-poster .ev-event-card::after {
  background:
    linear-gradient(to bottom, var(--coral), var(--coral)) top right   / 1px 0   no-repeat,
    linear-gradient(to right,  var(--coral), var(--coral)) bottom left / 0   1px no-repeat;
  transition: background-size .35s ease .35s;
}
.events-poster .ev-event-card:hover { background: color-mix(in oklab, var(--coral) 12%, transparent); }
.events-poster .ev-event-card:hover::before { background-size: 100% 1px, 1px 100%; }
.events-poster .ev-event-card:hover::after  { background-size: 1px 100%, 100% 1px; }
.events-poster .ev-event-card .corner-pill { background: var(--coral); color: var(--cream); z-index: 4; }

.ev-event-fig {
  margin: 0;
  overflow: hidden;
  aspect-ratio: 4 / 3;
}
.ev-event-fig img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform .6s ease;
}
.events-poster .ev-event-card:hover .ev-event-fig img { transform: scale(1.04); }

.ev-event-body {
  padding: 28px 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1;
}

.ev-event-meta {
  display: flex;
  align-items: center;
  gap: 16px;
}
.ev-date-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: var(--coral);
  color: var(--cream);
  padding: 6px 12px;
  min-width: 52px;
  line-height: 1;
}
.ev-date-day {
  font-family: var(--display);
  font-style: italic;
  font-size: 26px;
  font-weight: 500;
  letter-spacing: -0.02em;
}
.ev-date-month {
  font-family: var(--condensed);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-top: 2px;
}
.ev-event-meta .tag {
  font-family: var(--condensed);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--coral);
  margin: 0;
}

.ev-wine-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
}
.ev-wine-list li {
  font-family: var(--display);
  font-style: italic;
  font-size: 13px;
  color: color-mix(in oklab, var(--cream) 78%, transparent);
  padding: 3px 8px;
  border: 1px solid color-mix(in oklab, var(--coral) 30%, transparent);
}

.ev-event-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid color-mix(in oklab, var(--coral) 20%, transparent);
}
.ev-price {
  font-family: var(--display);
  font-style: italic;
  font-size: 26px;
  font-weight: 500;
  color: var(--coral);
  letter-spacing: -0.01em;
}
.ev-price-note {
  font-size: 13px;
  font-weight: 400;
  color: color-mix(in oklab, var(--cream) 60%, transparent);
  font-style: normal;
}
.ev-prenota {
  display: inline-flex;
  align-items: center;
  font-family: var(--condensed);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--coral);
  border: 1px solid var(--coral);
  padding: 8px 14px;
  text-decoration: none;
  transition: background .2s ease, color .2s ease;
}
.ev-prenota:hover { background: var(--coral); color: var(--cream); }

@media (max-width: 860px) {
  .ev-calendar-grid { grid-template-columns: 1fr; }
  .ev-event-fig { aspect-ratio: 16 / 9; }
}
@media (max-width: 520px) {
  .ev-invino { margin-top: 40px; }
  .ev-invino-head h2 { font-size: clamp(40px, 11vw, 56px); }
  .ev-invino-head { margin-bottom: 32px; }
}

/* ===== INTRO — stacked, title first, body below ===== */
.ev-intro {
  margin-top: 80px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.ev-intro-head { position: relative; padding-top: 8px; }
.ev-intro-head .corner-pill {
  position: absolute;
  top: -8px;
  left: -8px;
  background: var(--coral);
  color: var(--cream);
}
.ev-intro-head .tag {
  font-family: var(--condensed);
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--coral);
  margin: 0 0 24px 36px;
  display: inline-block;
}
.ev-intro h1 {
  font-family: var(--display);
  font-weight: 500;
  font-style: italic;
  font-size: clamp(56px, 8vw, 124px);
  line-height: 0.94;
  letter-spacing: -0.025em;
  color: var(--coral);
  margin: 0;
  text-wrap: balance;
}
.ev-intro h1 em { font-style: italic; }
.ev-intro h1 .line2 { display: block; color: var(--cream); }
.ev-intro-body {
  margin: 0;
  font-size: 17px;
  line-height: 1.55;
  color: color-mix(in oklab, var(--cream) 82%, transparent);
  max-width: 64ch;
}
.ev-intro-body em { color: var(--coral-soft); font-style: italic; }

/* ===== STATS — animated border + illumination on hover ===== */
.ev-stats {
  margin-top: 96px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.events-poster .ev-stat {
  position: relative;
  background: color-mix(in oklab, var(--coral) 4%, transparent);
  border: 0;
  padding: 44px 32px 36px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  align-items: flex-start;
  justify-content: space-between;
  min-height: 240px;
  color: var(--cream);
  overflow: hidden;
  transition: background .35s ease;
}

/* Animated border: two pseudo-elements; A draws top+left, B draws right+bottom */
.events-poster .ev-stat::before,
.events-poster .ev-stat::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.events-poster .ev-stat::before {
  background:
    linear-gradient(to right,  var(--coral), var(--coral)) top left  / 0   1px no-repeat,
    linear-gradient(to bottom, var(--coral), var(--coral)) top left  / 1px 0   no-repeat;
  transition: background-size .35s ease;
}
.events-poster .ev-stat::after {
  background:
    linear-gradient(to bottom, var(--coral), var(--coral)) top right    / 1px 0   no-repeat,
    linear-gradient(to right,  var(--coral), var(--coral)) bottom left  / 0   1px no-repeat;
  transition: background-size .35s ease .35s;
}
.events-poster .ev-stat:hover {
  background: color-mix(in oklab, var(--coral) 14%, transparent);
}
.events-poster .ev-stat:hover::before { background-size: 100% 1px, 1px 100%; }
.events-poster .ev-stat:hover::after  { background-size: 1px 100%, 100% 1px; }

.events-poster .ev-stat .num,
.events-poster .ev-stat .lab { position: relative; z-index: 1; }
.events-poster .ev-stat .num {
  font-family: var(--display);
  font-weight: 500;
  font-style: italic;
  font-size: 72px;
  line-height: 1;
  letter-spacing: -0.01em;
  color: var(--coral);
}
.events-poster .ev-stat .num .plus { font-size: 0.7em; }
.events-poster .ev-stat .lab {
  font-family: var(--display);
  font-style: italic;
  font-size: 16px;
  line-height: 1.3;
  color: color-mix(in oklab, var(--cream) 88%, transparent);
}

/* ===== EVENT TYPE CARDS ===== */
.ev-types {
  margin-top: 80px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.events-poster .ev-type {
  position: relative;
  background: color-mix(in oklab, var(--coral) 4%, transparent);
  border: 0;
  padding: 0;
  text-decoration: none;
  color: var(--cream);
  overflow: hidden;
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 0;
  transition: background .35s ease;
}
.events-poster .ev-type::before,
.events-poster .ev-type::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
}
.events-poster .ev-type::before {
  background:
    linear-gradient(to right,  var(--coral), var(--coral)) top left  / 0   1px no-repeat,
    linear-gradient(to bottom, var(--coral), var(--coral)) top left  / 1px 0   no-repeat;
  transition: background-size .35s ease;
}
.events-poster .ev-type::after {
  background:
    linear-gradient(to bottom, var(--coral), var(--coral)) top right   / 1px 0   no-repeat,
    linear-gradient(to right,  var(--coral), var(--coral)) bottom left / 0   1px no-repeat;
  transition: background-size .35s ease .35s;
}
.events-poster .ev-type:hover { background: color-mix(in oklab, var(--coral) 12%, transparent); }
.events-poster .ev-type:hover::before { background-size: 100% 1px, 1px 100%; }
.events-poster .ev-type:hover::after  { background-size: 1px 100%, 100% 1px; }

.events-poster .ev-type .corner-pill { background: var(--coral); color: var(--cream); z-index: 4; }
.events-poster .ev-type-photo { overflow: hidden; min-height: 320px; }
.events-poster .ev-type-photo img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform .6s ease;
}
.events-poster .ev-type:hover .ev-type-photo img { transform: scale(1.04); }
.events-poster .ev-type-caption {
  padding: 48px 48px 44px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  justify-content: center;
}
.events-poster .ev-type-caption .tag {
  font-family: var(--condensed);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--coral);
  margin: 0;
}
.events-poster .ev-type-name {
  font-family: var(--display);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1;
  color: var(--cream);
  letter-spacing: -0.01em;
  margin: 4px 0 8px;
}
.events-poster .ev-type-caption p {
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
  color: color-mix(in oklab, var(--cream) 82%, transparent);
  max-width: 56ch;
}
.events-poster .ev-type .block-cta {
  margin-top: 16px;
  font-family: var(--condensed);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--coral);
  border: 0;
  border-bottom: 1px solid var(--coral);
  padding: 0 0 4px;
  align-self: flex-start;
  display: inline-block;
  background: transparent;
  transition: padding-right .25s ease;
}
.events-poster .ev-type:hover .block-cta { padding-right: 18px; }

/* ===== BOOKING FORM BLOCK ===== */
.events-poster .ev-form-block {
  background: transparent;
  border: 0;
  border-top: 1px solid color-mix(in oklab, var(--coral) 22%, transparent);
  padding: 72px 0 56px;
  margin-top: 80px;
  position: relative;
}
.ev-form-head {
  position: relative;
}
.ev-form-head .corner-pill {
  position: absolute;
  top: -8px;
  left: -8px;
  background: var(--coral);
  color: var(--cream);
}
.ev-form-grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 48px; align-items: start; }
.ev-form-head .tag {
  font-family: var(--condensed);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--coral);
  margin: 8px 0 14px 36px;
  display: inline-block;
}
.ev-form-head h2 {
  font-family: var(--display);
  font-weight: 500;
  font-style: italic;
  font-size: clamp(32px, 3.4vw, 48px);
  line-height: 1.02;
  letter-spacing: -0.02em;
  color: var(--coral);
  margin: 0 0 18px;
  text-wrap: balance;
}
.ev-form-sub {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: color-mix(in oklab, var(--cream) 75%, transparent);
  max-width: 36ch;
}

.ev-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ev-form .field { display: flex; flex-direction: column; gap: 6px; }
.ev-form .field.full { grid-column: span 2; }
.ev-form label {
  font-family: var(--condensed);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: color-mix(in oklab, var(--cream) 70%, transparent);
}
.ev-form label .req { color: var(--coral); font-style: normal; }
.ev-form input,
.ev-form textarea,
.ev-form select {
  background: color-mix(in oklab, var(--cream) 96%, transparent);
  color: var(--espresso);
  border: 0;
  padding: 12px 14px;
  font-family: var(--display);
  font-size: 15px;
  border-radius: 0;
  outline: none;
}
.ev-form input::placeholder,
.ev-form textarea::placeholder {
  color: color-mix(in oklab, var(--espresso) 50%, transparent);
  font-style: italic;
}
.ev-form input:focus,
.ev-form textarea:focus,
.ev-form select:focus {
  outline: 2px solid var(--coral);
  outline-offset: 2px;
}
.ev-form textarea { min-height: 110px; resize: vertical; }
.ev-form-actions {
  grid-column: span 2;
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
}
.ev-form-actions button {
  margin-top: 4px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--condensed);
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--coral);
  background: transparent;
  border: 1px solid var(--coral);
  padding: 10px 18px;
  cursor: pointer;
  transition: background .2s, color .2s;
}
.ev-form-actions button:hover { background: var(--coral); color: var(--cream); transform: none; }

/* ===== STELLAR LOCKUP ===== */
.ev-lockup {
  margin-top: 64px;
  padding: 56px 0 40px;
  text-align: center;
  border-top: 1px solid color-mix(in oklab, var(--coral) 25%, transparent);
}
.ev-lockup img {
  width: 100%;
  max-width: 480px;
  height: auto;
  display: inline-block;
}
.ev-lockup .sub {
  margin-top: 10px;
  font-family: var(--display);
  font-style: italic;
  font-size: 16px;
  color: color-mix(in oklab, var(--cream) 80%, transparent);
  letter-spacing: 0.04em;
}

/* ===== PAGE FOOTER ===== */
.ev-footer {
  margin-top: 0;
  padding: 28px 0 0;
  border-top: 1px solid color-mix(in oklab, var(--coral) 22%, transparent);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 32px;
  font-size: 13px;
  line-height: 1.7;
  color: color-mix(in oklab, var(--cream) 80%, transparent);
}
.ev-footer a { color: inherit; border-bottom: 1px solid transparent; }
.ev-footer a:hover { border-bottom-color: var(--coral); color: var(--coral-soft); }
.ev-footer-legal {
  margin-top: 28px;
  padding-top: 18px;
  border-top: 1px solid color-mix(in oklab, var(--coral) 18%, transparent);
  display: flex;
  gap: 32px;
  font-family: var(--condensed);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: color-mix(in oklab, var(--cream) 55%, transparent);
}
.ev-footer-legal a { color: inherit; border-bottom: 1px solid currentColor; }

/* ===== RESPONSIVE ===== */
@media (max-width: 980px) {
  .ev-intro { grid-template-columns: 1fr; gap: 24px; }
  .ev-stats { grid-template-columns: repeat(2, 1fr); }
  .events-poster .ev-type { grid-template-columns: 1fr; }
  .events-poster .ev-type-photo { min-height: 240px; }
  .ev-form-grid { grid-template-columns: 1fr; gap: 24px; }
  .ev-footer { grid-template-columns: 1fr; gap: 18px; }
}
@media (max-width: 520px) {
  .ev-page-wrap { padding: 16px 14px 28px; }
  .ev-hero-figure {
    aspect-ratio: 4 / 5;
    max-height: 640px;
    min-height: 420px;
  }
  /* Smaller, tighter intro so it doesn't dominate over the photo */
  .ev-intro { margin-top: 40px; gap: 20px; }
  .ev-intro h1 { font-size: clamp(40px, 11vw, 56px); line-height: 1; }
  .ev-intro-head .tag { font-size: 11px; margin-bottom: 16px; }
  .ev-intro-body { font-size: 14px; line-height: 1.65; padding-left: 20px; }
  .ev-stats { grid-template-columns: 1fr 1fr; gap: 12px; }
  .events-poster .ev-stat { padding: 28px 20px 22px; min-height: 180px; }
  .events-poster .ev-stat .num { font-size: 52px; }
  .events-poster .ev-form-block { padding: 40px 0 32px; }
  .ev-form { grid-template-columns: 1fr; }
  .ev-form .field.full { grid-column: span 1; }
  .ev-form-actions { grid-column: span 1; }
  .ev-footer-legal { flex-direction: column; gap: 8px; }
}
