:root {
  --mwf-gold-light: #fcfdde;
  --mwf-gold: #B6B283;
  --mwf-gold-dark: #8c6d1f;
}	

body{background:#201c2a !important}

@keyframes bounce {
  0%   { transform: translateX(-50%) translateY(0); }
  10%  { transform: translateX(-50%) translateY(8px); }
  20%  { transform: translateX(-50%) translateY(-4px); }
  30%  { transform: translateX(-50%) translateY(2px); }
  40%  { transform: translateX(-50%) translateY(0); }
  100% { transform: translateX(-50%) translateY(0); }
}


  #biglietti{color: var(--mwf-gold); padding: 5vw; font-family: 'Baskervville', serif; }
  #biglietti h1 {font-size:3rem;text-align:center;}
  #biglietti h3 {font-size:2rem;text-align:center;}
  .tabs-nav { display: flex; gap: 2.2rem; margin: 2rem auto; flex-wrap: wrap; }
.tab-button { position: relative; flex: 1; padding: 3rem; background: var(--mwf-gold-light); border: none; cursor: pointer; font-size: 1.5rem; font-weight: bold; font-family: 'Baskervville', serif !important; }
.tab-button.active { background: #e0e0e0; }
.tab-button strong { font-size: 3rem; font-weight: 100; }
.tab-button strong::after { content: ""; display: block; margin-bottom: 5%; }
.tab-button span{font-size: 1.8rem;font-style: italic;}
.tab-button span::after { content: ""; display: block; margin-bottom: 1%; }
.tab-button::after { content: ""; position: absolute; bottom: -2rem; left: 50%; transform: translateX(-50%); width: 4rem; height: 4rem; background: url('/img/icon-mwf-fancyarrow.png') no-repeat center; background-size: contain;  animation: bounce 1.5s ease-out infinite;  animation-delay: 0s; }
  .tabs-content { position: relative; }
  .tab-pane { display: none; }
  .tab-pane.active { display: block; }
  .content-block { display: flex; gap: 1.5rem; margin-top: 15vh; }
  .date-block { flex: 0 0 12vw; text-align: center; font-size: 4rem; line-height: 2; }
  .date-block .day { display: block; font-weight: bold; }
  .date-block .month { display: block; text-transform: uppercase; font-size: 2.5rem; }
  .content-body { flex: 1; }
  .content-body h2 { text-align:left; }
  .info-row, .table-row { display: flex; align-items: flex-start; margin: 2.75rem 0; }
  .info-row span{ align-self: center; font-size: 1.5rem; }
  .info-icon { flex: 0 0 5vw; height: 5vh; margin-right: .75rem; }
  .ilocation { background: url('/img/icon-mwf-locations.png') no-repeat center; background-size: contain; }
  .iorario { background: url('/img/icon-mwf-clock.png') no-repeat center; background-size: contain; }
  .itasting { background: url('/img/icon-mwf-tasting.png') no-repeat center; background-size: contain; }
  .iticket { background: url('/img/icon-mwf-ticket.png') no-repeat center; background-size: contain; }
  .prices-table { width: 100%; border-collapse: collapse; margin-top: 1rem; color: var(--mwf-gold) }
  .prices-table th,
  .prices-table td { border: 1px solid var(--mwf-gold); padding: .5rem; font-size: 1.5rem; text-align: left; text-align:center; }
  .prices-table td a {color: var(--mwf-gold); }
  .prices-table .corner-cell { border-top: none; border-left: none; }
  .prices-table thead tr th { border-bottom: 3px double var(--mwf-gold-dark); }
  .abo-table { border-top: 3px double var(--mwf-gold-dark);}
  .ticket-link { display: block; color: var(--mwf-gold); margin-top: 5rem; margin-bottom:10vh; font-size: 1.2rem; font-weight: bold; text-decoration: none; text-align: right; }
  td:first-child { position: relative; text-align:left;}
  td:first-child .arrow-link { position: absolute; top: 50%; right: 1rem; transform: translateY(-50%); width: 1.5rem; height: 1.5rem; cursor:pointer; background: url('/img/icon-mwf-arrow.png') no-repeat center; background-size: contain; display: block; }
  @media (max-width: 768px) {
    .tabs-nav { flex-direction: column; }
	.tab-button {margin-bottom:5vh;}
    .content-block { flex-direction: column; }
	.content-body h2 { text-align: center; }
    .date-block { margin: 0 auto; }
    .info-row, .table-row { flex-direction: column; }
	.info-row span{ text-align: center; }
    .info-icon {flex: 0 0 10vw; margin-bottom: .5rem; height: 10vw; width: 10vw; }
    .prices-table th, .prices-table td { font-size: 0.875rem; }
	.iticket { margin: 0 auto; height: auto; width: 30vw; flex: 0 0 20vw !important; }
  .prices-table {
    width: 100%;
    table-layout: fixed;
  }
  .prices-table th {
    width: 25%;   /* four equal header cells */
  }
  /* hide all tds by default */
  .prices-table td {
    display: none;
  }
  /* always show the first (Tickets) column */
  .prices-table td:first-child {
    display: table-cell;
  }
  /* show the “active” date column based on table class */
  .prices-table.active-col-1 td:nth-child(2),
  .prices-table.active-col-2 td:nth-child(3),
  .prices-table.active-col-3 td:nth-child(4) {
    display: table-cell;
  }
  /* highlight the active header if you want */
  .prices-table th.active {
    background: rgba(255,255,255,0.25);
  }
  td {
    height: 80px;
}
  td:first-child .arrow-link {
    right: 5px;
    width: 1rem;
    height: 1rem;}
	
  }

.tawk-header-text {
    display: none;
}

.tawk-toolbar .tawk-button-hover {
    display: none;
}

iframe[title="chat widget"] {
  bottom: 100px !important;
  right: 40px !important;
  opacity: 0.8 !important;
  border-radius: 12px !important;
}


/* ==========================================================================
   2026 identity (admins, 2026-09-20)
   --------------------------------------------------------------------------
   The page now sits inside <main class="mwfe mwfe-tickets">, so the wave
   ground, the Cormorant serif and the whole palette arrive from the design
   system exactly as on /accredito-operatori/ and the homepage. Everything
   below only re-dresses the boxes this page already had — same markup, same
   tab JS — in that system's own materials: glass panels on a gold hairline,
   cream text, brass accents.

   Scoped to .mwfe-tickets on purpose: /custom-css/mwf.css is frozen and no
   other page may shift because of a ticket-page rule.
   ========================================================================== */

.mwfe-tickets {
	--ticket-line: var(--mwfe-line);
	--ticket-ink: var(--mwfe-cream);
}

.mwfe-tickets #biglietti {
	color: var(--mwfe-cream);
	font-family: var(--mwfe-sans);
	padding: clamp(1.4rem, 5vw, 4rem) clamp(1rem, 4vw, 3rem);
}

.mwfe-tickets #biglietti h1,
.mwfe-tickets #biglietti h2,
.mwfe-tickets #biglietti h3 {
	font-family: var(--mwfe-serif);
	color: var(--mwfe-gold-light);
	font-weight: 500;
}

.mwfe-tickets #biglietti h1 { font-size: clamp(2.2rem, 6vw, 3.6rem); letter-spacing: .01em; }
.mwfe-tickets #biglietti h3 { font-size: clamp(1.2rem, 3vw, 1.9rem); color: var(--mwfe-brass); }

/* --- the three day tabs: glass pills, brass when active ------------------ */
.mwfe-tickets .tabs-nav { gap: clamp(.9rem, 2vw, 2.2rem); }

.mwfe-tickets .tab-button {
	padding: clamp(1.4rem, 3vw, 2.6rem);
	background: var(--mwfe-glass);
	border: 1px solid var(--ticket-line);
	border-radius: 18px;
	color: var(--mwfe-cream);
	font-family: var(--mwfe-serif) !important;
	font-size: clamp(1rem, 1.6vw, 1.35rem);
	font-weight: 500;
	transition: border-color .3s, background .3s, transform .4s cubic-bezier(.2, .65, .3, 1);
}

.mwfe-tickets .tab-button:hover { border-color: var(--mwfe-brass); transform: translateY(-3px); }

.mwfe-tickets .tab-button.active {
	background: linear-gradient(180deg, rgba(103, 30, 38, .85), rgba(58, 20, 24, .9));
	border-color: var(--mwfe-brass);
	color: var(--mwfe-gold-light);
}

.mwfe-tickets .tab-button strong { color: var(--mwfe-gold-light); }
.mwfe-tickets .tab-button span { color: var(--mwfe-brass); }

/* --- the day panels ------------------------------------------------------ */
.mwfe-tickets .content-block {
	margin-top: clamp(3rem, 10vh, 9rem);
	padding: clamp(1.2rem, 3vw, 2.4rem);
	background: var(--mwfe-glass);
	border: 1px solid var(--ticket-line);
	border-radius: 22px;
}

.mwfe-tickets .date-block { color: var(--mwfe-brass); font-family: var(--mwfe-serif); }
.mwfe-tickets .info-row span { color: var(--mwfe-cream-dim); }

/* --- the price tables ---------------------------------------------------- */
.mwfe-tickets .prices-table { color: var(--mwfe-cream); }

.mwfe-tickets .prices-table th,
.mwfe-tickets .prices-table td {
	border: 1px solid var(--ticket-line);
	font-size: clamp(.95rem, 1.4vw, 1.25rem);
	padding: .7rem .6rem;
}

.mwfe-tickets .prices-table thead tr th {
	border-bottom: 2px solid var(--mwfe-brass);
	font-family: var(--mwfe-sans);
	font-size: .74rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--mwfe-brass);
}

.mwfe-tickets .prices-table td a { color: var(--mwfe-gold-light); }
.mwfe-tickets .prices-table td small { color: var(--mwfe-cream-dim); }
.mwfe-tickets .abo-table { border-top: 2px solid var(--mwfe-brass); }
.mwfe-tickets .ticket-link { color: var(--mwfe-gold-light); font-family: var(--mwfe-sans); letter-spacing: .12em; text-transform: uppercase; }

/* --- accreditation note: the answer to "why have I received nothing?" ---- */
.mwfe-tickets .ticket-accredito-note {
	margin: 1rem 0 0;
	padding: .9rem 1.1rem;
	border-left: 2px solid var(--mwfe-brass);
	background: rgba(var(--mwfe-ink-rgb), .45);
	border-radius: 0 12px 12px 0;
	color: var(--mwfe-cream-dim);
	font-size: .92rem;
	line-height: 1.55;
}

.mwfe-tickets .ticket-accredito-note strong { color: var(--mwfe-gold-light); }

/* --- masterclass cross-sell, at the foot of the tickets ------------------ */
.mwfe-tickets .ticket-masterclass {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: clamp(1rem, 3vw, 2.4rem);
	margin: clamp(2rem, 6vh, 4rem) 0 clamp(1rem, 3vh, 2rem);
	padding: clamp(1.3rem, 3vw, 2.2rem);
	background: var(--mwfe-glass);
	border: 1px solid var(--ticket-line);
	border-radius: 22px;
}

.mwfe-tickets .ticket-masterclass h3 {
	margin: 0 0 .4em;
	font-family: var(--mwfe-serif);
	font-size: clamp(1.3rem, 2.4vw, 1.9rem);
	color: var(--mwfe-gold-light);
	text-align: left;
}

.mwfe-tickets .ticket-masterclass p {
	margin: 0;
	max-width: 62ch;
	color: var(--mwfe-cream-dim);
	font-size: .98rem;
	line-height: 1.6;
}

.mwfe-tickets .ticket-masterclass strong { color: var(--mwfe-cream); }

.mwfe-tickets .ticket-masterclass__cta {
	display: inline-flex;
	align-items: center;
	gap: .8em;
	flex: 0 0 auto;
	padding: .95em 1.9em;
	border: 1px solid var(--mwfe-brass);
	border-radius: 999px;
	font-family: var(--mwfe-sans);
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .22em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--mwfe-gold-light);
	transition: background .3s, color .3s;
}

.mwfe-tickets .ticket-masterclass__cta:hover {
	background: var(--mwfe-brass);
	color: var(--mwfe-bg-deep);
}

/* --- the physical-ticket box and the mail bubble ------------------------- */
.mwfe-tickets .physical-tickets-box {
	background: var(--mwfe-glass);
	border: 1px solid var(--ticket-line);
	border-radius: 22px;
	color: var(--mwfe-cream);
}

.mwfe-tickets .physical-tickets-title { font-family: var(--mwfe-serif); color: var(--mwfe-gold-light); }
.mwfe-tickets .physical-tickets-description,
.mwfe-tickets .physical-tickets-note,
.mwfe-tickets .location-text { color: var(--mwfe-cream-dim); }
.mwfe-tickets .physical-tickets-icon { color: var(--mwfe-brass); }

.mwfe-tickets .physical-tickets-button {
	background: var(--mwfe-brass);
	color: var(--mwfe-bg-deep);
	border-radius: 999px;
	font-family: var(--mwfe-sans);
	letter-spacing: .18em;
	text-transform: uppercase;
}

@media (max-width: 768px) {
	.mwfe-tickets .ticket-masterclass { justify-content: flex-start; }
	.mwfe-tickets .ticket-masterclass h3 { text-align: left; }
}
