/* =============================================
       SEZIONI — Eventi, Chi Siamo, Contatti
       ============================================= */
    /* Pagine nascoste di default */
    .page-section {
      display: none;
      padding: 60px 24px;
      padding-top: 40px;   /* header ora sticky nel flusso: niente offset header-h */
      min-height: 100svh;
      background: var(--bg);
    }
    .page-section.active {
      display: block;
    }
    #chi-siamo {
      padding: 60px 24px;
      padding-top: 40px;
    }
    #menu-page {
      padding: 0;
    }
    #menu-page .cat-tabs {
      top: var(--header-h);
    }

    .page-section-inner {
      max-width: 540px;
      margin: 0 auto;
    }

    .page-section-title {
      font-family: var(--font-body);
      font-size: 11px;
      font-weight: 300;
      letter-spacing: 4px;
      text-transform: uppercase;
      color: rgba(237,232,224,0.4);
      margin-bottom: 32px;
    }

    /* === EVENTI === */
    .eventi-banner {
      position: relative;
      border: 1px solid rgba(255,255,255,0.06);
      padding: 48px 28px;
      text-align: center;
      overflow: hidden;
      min-height: calc(100svh - var(--header-h) - 120px);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }

    .eventi-banner::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, rgba(201,168,76,0.03) 0%, transparent 60%);
    }

    .eventi-heading {
      font-family: var(--font-body);
      font-size: 28px;
      font-weight: 300;
      letter-spacing: 8px;
      text-transform: uppercase;
      color: var(--text);
      margin-bottom: 16px;
      position: relative;
    }

    .eventi-sub {
      font-family: var(--font-body);
      font-size: 14px;
      font-weight: 300;
      color: rgba(237,232,224,0.45);
      line-height: 1.8;
      position: relative;
    }

    .eventi-brands-list {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 24px;
      margin-top: 40px;
      position: relative;
    }

    .eventi-brand-link {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      transition: opacity 0.25s;
    }
    .eventi-brand-link:active { opacity: 0.7; }

    .eventi-brand-logo {
      height: 56px;
      width: auto;
      filter: brightness(0) invert(1);
      opacity: 0.85;
    }

    .eventi-brand-logo-arena {
      height: 72px;
      margin: -8px 0;
    }

    .eventi-brand-name {
      display: flex;
      align-items: center;
      gap: 6px;
      font-family: var(--font-body);
      font-size: 12px;
      font-weight: 300;
      color: rgba(237,232,224,0.5);
    }

    .eventi-brand-name svg {
      width: 14px;
      height: 14px;
      stroke: rgba(237,232,224,0.4);
    }

    /* === CHI SIAMO — Before/After Slider === */
    .ba-slider {
      position: relative;
      width: 100%;
      height: 320px;
      margin-top: var(--header-h);
      overflow: hidden;
      cursor: ew-resize;
      -webkit-user-select: none;
      user-select: none;
      touch-action: pan-y;
    }

    .ba-slider img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .ba-img-day {
      z-index: 1;
    }

    .ba-img-night {
      z-index: 2;
      clip-path: inset(0 0 0 50%);
    }

    /* Linea divisoria + handle */
    .ba-line {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 50%;
      width: 2px;
      background: rgba(255,255,255,0.8);
      z-index: 3;
      transform: translateX(-50%);
      pointer-events: none;
    }

    .ba-handle {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 4;
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background: rgba(0,0,0,0.5);
      border: 2px solid rgba(255,255,255,0.8);
      backdrop-filter: blur(4px);
      display: flex;
      align-items: center;
      justify-content: center;
      pointer-events: none;
    }

    .ba-handle::before,
    .ba-handle::after {
      content: '';
      position: absolute;
      width: 8px;
      height: 8px;
      border-top: 2px solid rgba(255,255,255,0.9);
      border-left: 2px solid rgba(255,255,255,0.9);
    }
    .ba-handle::before { left: 6px; transform: rotate(-45deg); }
    .ba-handle::after { right: 6px; transform: rotate(135deg); }

    /* Label giorno/sera */
    .ba-label {
      position: absolute;
      bottom: 14px;
      z-index: 5;
      font-family: var(--font-body);
      font-size: 9px;
      font-weight: 400;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      color: rgba(255,255,255,0.7);
      background: rgba(0,0,0,0.4);
      backdrop-filter: blur(4px);
      padding: 5px 12px;
      pointer-events: none;
    }
    .ba-label-day { left: 14px; }
    .ba-label-night { right: 14px; }

    .chi-siamo-content {
      padding-top: 48px;
      padding-bottom: 64px;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
    }

    .chi-siamo-tagline {
      font-family: var(--font-body);
      font-size: 22px;
      font-weight: 200;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--text);
      line-height: 1.6;
    }

    .chi-siamo-text {
      font-family: var(--font-body);
      font-size: 15px;
      font-weight: 300;
      color: rgba(237,232,224,0.5);
      line-height: 2.2;
      max-width: 340px;
      padding: 0 8px;
    }

    .chi-siamo-text + .chi-siamo-text {
      margin-top: 20px;
    }

    .chi-siamo-text strong {
      font-weight: 400;
      color: rgba(237,232,224,0.8);
    }

    .chi-siamo-closing {
      color: rgba(237,232,224,0.6);
    }

    .chi-siamo-line {
      width: 28px;
      height: 1px;
      background: rgba(237,232,224,0.12);
      margin: 36px 0;
    }

    .chi-siamo-services {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 22px 16px;
      width: 100%;
      max-width: 340px;
    }

    .chi-siamo-service {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
    }

    /* Ultimo servizio centrato se dispari */
    .chi-siamo-service:last-child:nth-child(odd) {
      grid-column: 1 / -1;
    }

    .chi-siamo-service svg {
      width: 22px;
      height: 22px;
      color: rgba(237,232,224,0.3);
    }

    .chi-siamo-service span {
      font-family: var(--font-body);
      font-size: 10px;
      font-weight: 400;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: rgba(237,232,224,0.5);
    }

    .chi-siamo-signature {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
    }

    .chi-siamo-sig-logo {
      height: 40px;
      filter: brightness(0) invert(1);
      opacity: 0.35;
    }

    .chi-siamo-signature span {
      font-family: var(--font-body);
      font-size: 10px;
      font-weight: 300;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: rgba(237,232,224,0.2);
    }

    /* === CONTATTI === */
    .contatti-grid {
      display: flex;
      flex-direction: column;
      gap: 24px;
    }

    .contatti-row {
      display: flex;
      align-items: flex-start;
      gap: 14px;
    }

    .contatti-row svg {
      width: 18px;
      height: 18px;
      flex-shrink: 0;
      color: rgba(237,232,224,0.3);
      margin-top: 2px;
    }

    .contatti-row-content {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .contatti-label {
      font-family: var(--font-body);
      font-size: 9px;
      font-weight: 400;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: rgba(237,232,224,0.3);
    }

    .contatti-value {
      font-family: var(--font-body);
      font-size: 14px;
      font-weight: 300;
      color: rgba(237,232,224,0.7);
      line-height: 1.5;
    }
    .contatti-value a {
      color: rgba(237,232,224,0.7);
      text-decoration: none;
    }

    .contatti-map {
      margin-top: 32px;
      border: 1px solid rgba(255,255,255,0.06);
      overflow: hidden;
      height: 200px;
    }

    .contatti-map iframe {
      width: 100%;
      height: 100%;
      border: none;
      filter: grayscale(0.7) brightness(0.9);
    }

    .contatti-map-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      margin-top: 32px;
      padding: 14px;
      font-family: var(--font-body);
      font-size: 11px;
      font-weight: 400;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: rgba(237,232,224,0.7);
      text-decoration: none;
      border: 1px solid rgba(255,255,255,0.1);
      transition: all 0.25s;
    }
    .contatti-map-btn:active {
      background: rgba(255,255,255,0.05);
      border-color: rgba(255,255,255,0.2);
    }
    .contatti-map-btn svg {
      width: 16px;
      height: 16px;
      stroke: rgba(237,232,224,0.5);
    }

    /* =============================================
       DESKTOP — Step 1: container max-width (safe net)
       Limita il contenuto a 1200px su laptop/desktop, evita stretching
       su monitor 4K/ultrawide. Hero e header restano full-width.
       Step 2+ (header nav, hero redesign) → da completare in sessioni
       successive con maggior cura visiva.
       ============================================= */
    @media (min-width: 1024px) {
      .page-section,
      .site-footer {
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto;
      }
    }