/* ─── RESET & BASE ─────────────────────────────────── */
      *, *::before, *::after { box-sizing: border-box; }
      html, body { height: auto; min-height: 100vh; margin: 0; padding: 0; }
      body {
        font-family: 'Montserrat', sans-serif;
        font-weight: 400;
        color: #1a1a2e;
        background: #ffffff;
      }
      h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; line-height: 1.15; word-break: break-word; }
      p { margin: 0; padding: 0; line-height: 1.6; }
      a { text-decoration: none; cursor: pointer; }
      figure { margin: 0; }
      ul, ol { margin: 0; padding: 0; list-style: none; }
      img { display: block; max-width: 100%; height: auto; }

      /* ─── CSS VARIABLES ────────────────────────────────── */
      :root {
        --navy:   #1a1a2e;
        --navy2:  #16213e;
        --rose:   #e8365d;
        --rose-soft: rgba(232,54,93,0.12);
        --gold:   #f5a623;
        --white:  #ffffff;
        --off:    #f7f6f4;
        --muted:  #6b6b7b;
        --border: rgba(26,26,46,0.1);
        --max:    1140px;
        --pad:    clamp(1rem, 5vw, 3rem);
      }

      /* ─── UTILITIES ───────────────────────────────────── */
      .container { max-width: var(--max); margin: 0 auto; padding: 0 var(--pad); }
      .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }

      /* ─── NAVBAR ──────────────────────────────────────── */
      .site-nav {
        position: fixed;
        top: 0; left: 0; right: 0;
        z-index: 100;
        background: var(--navy);
        border-bottom: 1px solid rgba(255,255,255,0.06);
      }
      .site-nav .container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 64px;
      }
      .nav-brand {
        display: flex;
        align-items: center;
        gap: 2px;
        text-decoration: none;
      }
      .nav-brand img { width: 36px; height: 36px; }
      .nav-brand-name {
        font-family: 'Lilita One', sans-serif;
        font-size: 1.2rem;
        color: var(--white);
        letter-spacing: 0.02em;
      }
      .nav-links {
        display: flex;
        align-items: center;
        gap: 2rem;
      }
      .nav-links a {
        font-size: 0.78rem;
        font-weight: 600;
        color: rgba(255,255,255,0.65);
        letter-spacing: 0.08em;
        text-transform: uppercase;
        transition: color 0.2s;
      }
      .nav-links a:hover { color: var(--white); }
      .nav-cta {
        display: inline-flex;
        align-items: center;
        padding: 0.5rem 1.25rem;
        background: var(--rose);
        color: var(--white) !important;
        font-size: 0.78rem !important;
        font-weight: 700 !important;
        letter-spacing: 0.06em;
        border-radius: 4px;
        transition: background 0.2s !important;
      }
      .nav-cta:hover { background: #c52c4f !important; }

      /* hamburger */
      .nav-hamburger {
        display: none;
        background: none;
        border: none;
        cursor: pointer;
        padding: 4px;
      }
      .nav-hamburger span {
        display: block;
        width: 22px;
        height: 2px;
        background: var(--white);
        margin: 5px 0;
        border-radius: 2px;
      }

      @media (max-width: 768px) {
        .nav-links { display: none; }
        .nav-hamburger { display: block; }
      }

      /* AMP sidebar */
      .site-sidebar {
        background: var(--navy);
        min-width: 260px;
        padding: 2rem 1.5rem;
      }
      .sidebar-close {
        background: none;
        border: none;
        cursor: pointer;
        margin-bottom: 2rem;
        display: flex;
        align-items: center;
        gap: 8px;
        color: var(--white);
        font-family: 'Montserrat', sans-serif;
        font-size: 0.8rem;
        opacity: 0.6;
      }
      .sidebar-links { display: flex; flex-direction: column; gap: 0.25rem; }
      .sidebar-links a {
        display: block;
        color: rgba(255,255,255,0.75);
        font-size: 1rem;
        font-weight: 600;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.07);
        letter-spacing: 0.02em;
      }
      .sidebar-links .sidebar-cta {
        margin-top: 1.5rem;
        text-align: center;
        background: var(--rose);
        color: var(--white);
        border-radius: 4px;
        padding: 0.9rem;
        border-bottom: none;
      }

      /* ─── HERO ────────────────────────────────────────── */
      .site-hero {
        position: relative;
        min-height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding-top: 64px;
        background-image: url("../images/dji-616-2000x1125.webp");
        background-size: cover;
        background-position: center;
      }
      @media (max-width: 768px) {
        .hero-content { text-align: center; }
        .hero-tag { display: block; }
      }
      .hero-overlay {
        position: absolute;
        inset: 0;
        background: linear-gradient(
          to top,
          rgba(26,26,46,0.92) 0%,
          rgba(26,26,46,0.45) 50%,
          rgba(26,26,46,0.15) 100%
        );
      }
      .hero-content {
        position: relative;
        z-index: 2;
        max-width: 680px;
      }
      .hero-tag {
        display: inline-block;
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: var(--rose);
        margin-bottom: 1.25rem;
      }
      .hero-title {
        font-family: 'Paytone One', sans-serif;
        font-size: clamp(2.2rem, 5.5vw, 4rem);
        color: var(--white);
        line-height: 1.08;
        margin-bottom: 1.5rem;
      }
      .hero-sub {
        font-size: 1rem;
        font-weight: 500;
        color: rgba(255,255,255,0.7);
        margin-bottom: 2.5rem;
        line-height: 1.6;
      }
      .hero-btn {
        display: inline-block;
        padding: 1rem 2.5rem;
        background: var(--rose);
        color: var(--white);
        font-size: 0.9rem;
        font-weight: 700;
        letter-spacing: 0.06em;
        border-radius: 4px;
        text-transform: uppercase;
      }

      /* ─── SECTION: TICKETING ──────────────────────────── */
      .section-tickets {
        display: grid;
        grid-template-columns: 1fr 1fr;
        min-height: 560px;
      }
      .tickets-left {
        background: var(--navy);
        padding: clamp(2.5rem, 6vw, 5rem);
        display: flex;
        flex-direction: column;
        justify-content: center;
        position: relative;
        overflow: hidden;
      }
      .tickets-mascotte {
        display: none;
      }

      @media (max-width: 768px) {
        .tickets-mascotte {
          display: block;
          position: absolute;
          bottom: 0;
          right: 0;
          opacity: 0.15;
        }
      }
      .tickets-eyebrow {
        font-size: 0.7rem;
        font-weight: 700;
        letter-spacing: 0.15em;
        text-transform: uppercase;
        color: var(--rose);
        margin-bottom: 1rem;
      }
      .tickets-title {
        font-family: 'Paytone One', sans-serif;
        font-size: clamp(1.6rem, 3vw, 2.5rem);
        color: var(--white);
        line-height: 1.15;
        margin-bottom: 1.5rem;
      }
      .tickets-meta {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        margin-bottom: 2rem;
      }
      .tickets-meta-item {
        display: flex;
        align-items: flex-start;
        gap: 0.6rem;
        font-size: 0.9rem;
        color: rgba(255,255,255,0.65);
        font-weight: 500;
      }
      .tickets-meta-item strong { color: var(--white); font-weight: 700; }
      .tickets-meta-dot {
        width: 6px;
        height: 6px;
        background: var(--rose);
        border-radius: 50%;
        flex-shrink: 0;
        margin-top: 7px;
      }
      .tickets-right {
        background: var(--white);
        display: flex;
        flex-direction: column;
        justify-content: center;
      }
      .tickets-right .tt-widget { height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 1rem; }

      @media (max-width: 768px) {
        .section-tickets { grid-template-columns: 1fr; }
        .tickets-left { padding: 2.5rem 1.5rem; }
        .tickets-right { min-height: 400px; }
      }

      /* ─── SECTION: HEADLINE BAND ──────────────────────── */
      .section-band {
        background: var(--rose);
        padding: 4rem var(--pad);
        text-align: center;
      }
      .band-title {
        font-family: 'Paytone One', sans-serif;
        font-size: clamp(1.6rem, 3.5vw, 2.5rem);
        color: var(--white);
        margin-bottom: 1rem;
      }
      .band-text {
        font-size: 1rem;
        font-weight: 500;
        color: rgba(255,255,255,0.85);
        max-width: 640px;
        margin: 0 auto;
        line-height: 1.7;
      }

      /* ─── SECTION: SPETTACOLI ─────────────────────────── */
      .section-shows {
        background: var(--navy);
        padding: clamp(3rem, 8vw, 6rem) var(--pad);
      }
      .section-label {
        font-size: 0.7rem;
        font-weight: 700;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: var(--rose);
        margin-bottom: 0.75rem;
        text-align: center;
      }
      .section-title {
        font-family: 'Paytone One', sans-serif;
        font-size: clamp(1.6rem, 3.5vw, 2.6rem);
        color: var(--white);
        text-align: center;
        margin-bottom: clamp(2.5rem, 6vw, 4rem);
        line-height: 1.2;
      }
      .shows-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
        gap: 1px;
        background: rgba(255,255,255,0.07);
        border: 1px solid rgba(255,255,255,0.07);
        border-radius: 8px;
        overflow: hidden;
      }
      .show-card {
        background: rgba(255,255,255,0.03);
        padding: 1.75rem 1.5rem;
        transition: background 0.2s;
      }
      .show-card:hover { background: rgba(255,255,255,0.07); }
      .show-date {
        font-size: 0.7rem;
        font-weight: 700;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: var(--rose);
        margin-bottom: 0.6rem;
      }
      .show-name {
        font-size: 1rem;
        font-weight: 700;
        color: var(--white);
        line-height: 1.35;
        margin-bottom: 0.4rem;
      }
      .show-sub {
        font-size: 0.8rem;
        font-weight: 400;
        color: rgba(255,255,255,0.45);
        line-height: 1.4;
      }

      /* ─── SECTION: GALLERY ────────────────────────────── */
      .section-gallery {
        padding: clamp(3rem, 8vw, 5rem) var(--pad);
        background: var(--white);
      }
      .section-title-dark {
        font-family: 'Paytone One', sans-serif;
        font-size: clamp(1.4rem, 3vw, 2rem);
        color: var(--navy);
        text-align: center;
        margin-bottom: 2rem;
      }
      .gallery-label {
        font-size: 0.7rem;
        font-weight: 700;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: var(--rose);
        margin-bottom: 0.5rem;
        text-align: center;
      }
      .gallery-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
        margin-bottom: 3rem;
      }
      .gallery-grid img {
        border-radius: 6px;
        overflow: hidden;
        display: block;
        width: 100%;
      }

      @media (max-width: 768px) {
        .gallery-grid { grid-template-columns: repeat(2, 1fr); gap: 6px; }
      }

      /* ─── SECTION: ORARI ──────────────────────────────── */
      .section-orari {
        background: var(--off);
        padding: clamp(3rem, 8vw, 5rem) var(--pad);
      }
      .orari-inner {
        max-width: 600px;
        margin: 0 auto;
        text-align: center;
      }
      .orari-badge {
        display: inline-block;
        background: var(--navy);
        color: var(--white);
        font-size: 0.7rem;
        font-weight: 700;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        padding: 0.4rem 1rem;
        border-radius: 20px;
        margin-bottom: 1.5rem;
      }
      .orari-title {
        font-family: 'Paytone One', sans-serif;
        font-size: clamp(1.6rem, 3.5vw, 2.5rem);
        color: var(--navy);
        margin-bottom: 1rem;
        line-height: 1.2;
      }
      .orari-time {
        font-size: 2.2rem;
        font-weight: 800;
        color: var(--rose);
        letter-spacing: -0.01em;
        margin-bottom: 0.5rem;
      }
      .orari-detail {
        font-size: 0.9rem;
        font-weight: 500;
        color: var(--muted);
        line-height: 1.6;
      }
      .orari-note {
        margin-top: 0.75rem;
        font-size: 0.78rem;
        font-weight: 500;
        color: var(--muted);
        font-style: italic;
      }

      /* ─── SECTION: MAPPA ──────────────────────────────── */
      .section-map {
        background: var(--navy2);
        padding: clamp(3rem, 8vw, 5rem) var(--pad);
      }
      .map-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: clamp(2rem, 5vw, 4rem);
        align-items: start;
      }
      .map-frame {
        border-radius: 8px;
        overflow: hidden;
        border: 1px solid rgba(255,255,255,0.08);
      }
      .map-info-label {
        font-size: 0.7rem;
        font-weight: 700;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: var(--rose);
        margin-bottom: 0.75rem;
      }
      .map-info-title {
        font-family: 'Paytone One', sans-serif;
        font-size: 1.6rem;
        color: var(--white);
        margin-bottom: 2rem;
        line-height: 1.2;
      }
      .map-info-item {
        display: flex;
        gap: 1rem;
        margin-bottom: 1.25rem;
        align-items: flex-start;
      }
      .map-info-icon {
        width: 36px;
        height: 36px;
        background: var(--rose-soft);
        border-radius: 6px;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .map-info-icon svg { width: 16px; height: 16px; fill: var(--rose); }
      .map-info-text { font-size: 0.9rem; color: rgba(255,255,255,0.65); line-height: 1.6; }
      .map-info-text strong { color: var(--white); font-weight: 600; }
      .map-info-text a { color: var(--white); font-weight: 600; }
      .map-social {
        display: flex;
        gap: 0.75rem;
        margin-top: 2rem;
      }
      .map-social a {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        background: rgba(255,255,255,0.06);
        border: 1px solid rgba(255,255,255,0.1);
        color: rgba(255,255,255,0.7);
        font-size: 0.78rem;
        font-weight: 600;
        padding: 0.5rem 1rem;
        border-radius: 4px;
        letter-spacing: 0.04em;
      }
      .map-social a:hover { background: rgba(255,255,255,0.1); color: var(--white); }
      .map-social svg { width: 14px; height: 14px; fill: currentColor; }

      @media (max-width: 768px) {
        .map-grid { grid-template-columns: 1fr; }
      }

      /* ─── SECTION: TICKET BOTTOM ──────────────────────── */
      .section-ticket-bottom {
        background: var(--white);
        padding: clamp(2rem, 5vw, 4rem) var(--pad);
      }

      /* ─── FOOTER ──────────────────────────────────────── */
      .site-footer {
        background-color: #1a1a2e;
        color: #ffffff;
        padding: 3rem 0 0;
        font-family: 'Montserrat', sans-serif;
      }
      .site-footer .footer-inner {
        display: flex;
        flex-wrap: wrap;
        gap: 2.5rem;
        justify-content: space-between;
        padding: 0 var(--pad) 2.5rem;
        max-width: var(--max);
        margin: 0 auto;
        border-bottom: 1px solid rgba(255,255,255,0.1);
      }
      .site-footer .footer-col { flex: 1 1 180px; min-width: 160px; }
      .site-footer .footer-col-brand { flex: 1 1 220px; }
      .site-footer .footer-col-right {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 1rem;
      }
      .site-footer .footer-phone {
        font-size: 0.9rem;
        font-weight: 600;
        color: #ffffff;
        letter-spacing: 0.03em;
        opacity: 0.85;
      }
      .site-footer .footer-brand-name {
        font-size: 1.1rem;
        font-weight: 700;
        letter-spacing: 0.05em;
        margin: 0 0 0.4rem;
        color: #f2395c;
        text-transform: uppercase;
      }
      .site-footer .footer-tagline {
        font-size: 0.78rem;
        opacity: 0.55;
        margin: 0 0 1.2rem;
        line-height: 1.5;
      }
      .site-footer .footer-social { display: flex; gap: 0.75rem; margin-top: 0.5rem; }
      .site-footer .footer-social a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: rgba(255,255,255,0.08);
      }
      .site-footer .footer-social a:hover { background: #f2395c; }
      .site-footer .footer-social svg { width: 16px; height: 16px; fill: #ffffff; display: block; }
      .site-footer .footer-bottom {
        max-width: var(--max);
        margin: 0 auto;
        padding: 1.1rem var(--pad);
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
      }
      .site-footer .footer-copy, .site-footer .footer-made {
        font-size: 0.72rem;
        opacity: 0.45;
        margin: 0;
      }
      .site-footer .footer-made a { color: #ffffff; text-decoration: none; }
      .site-footer .footer-made a:hover { text-decoration: underline; }

      @media (max-width: 767px) {
        .site-footer .footer-col-right { align-items: flex-start; flex-direction: row; align-items: center; gap: 1rem; flex: 1 1 100%; }
        .site-footer .footer-col-brand { flex: 1 1 100%; }
        .site-footer .footer-bottom { flex-direction: column; align-items: center; text-align: center; }
      }

      /* ─── SCROLL TO TOP ───────────────────────────────── */
      /* ─── utility classes ─────────────────────────────── */
      .brand-accent { color: #8BD1F3; }
      .sidebar-panel { padding: 1.5rem; }

      /* ─── AMP->HTML conversion compat ─────────────────── */
      img { height: auto; }
      .gallery-img { aspect-ratio: 1 / 1; object-fit: cover; width: 100%; height: 100%; }
      .lightbox-trigger { cursor: pointer; }
      .site-sidebar {
        position: fixed; top: 0; right: 0; height: 100%; width: 280px; max-width: 85vw;
        transform: translateX(100%); transition: transform .3s ease; z-index: 300;
        overflow-y: auto;
      }
      .site-sidebar.open { transform: none; }
      .sidebar-backdrop {
        position: fixed; inset: 0; background: rgba(0,0,0,.5);
        opacity: 0; visibility: hidden; transition: opacity .3s ease; z-index: 250;
      }
      .sidebar-backdrop.open { opacity: 1; visibility: visible; }
      .img-lightbox {
        position: fixed; inset: 0; background: rgba(0,0,0,.9); z-index: 400;
        display: none; align-items: center; justify-content: center; padding: 4vw; cursor: zoom-out;
      }
      .img-lightbox.open { display: flex; }
      .img-lightbox img { max-width: 95vw; max-height: 90vh; width: auto; height: auto; border-radius: 8px; }

      /* footer copyright: break line on mobile */
      @media (max-width: 767px) {
        .footer-copy .copy-sep { display: none; }
        .footer-copy .copy-rights { display: block; }
      }