*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
    :root {
      --blu:#1a5f8a;
      --turchese:#00b4d8;
      --testo:#1a1a2e;
      --sfondo:#f8f5f0;
      --raggio:12px;
    }
    body.dark-mode {
      --testo: #f1f5f9;
    }
    body {
      font-family:'Inter', sans-serif;
      background:#111;
      color:#fff;
      min-height:100vh;
    }

    /* ── Header ── */
    .header {
      display:flex; align-items:center; justify-content:space-between;
      padding:1.2rem 2rem;
      background:rgba(0,0,0,.6);
      backdrop-filter:blur(10px);
      position:sticky; top:0; z-index:10;
      border-bottom:1px solid rgba(255,255,255,.08);
    }
    .header-brand {
      display:flex; align-items:center; gap:.8rem;
      text-decoration:none; color:#fff;
    }
    .header-brand .brand-name {
      font-family:'Playfair Display', serif;
      font-size:1.15rem; letter-spacing:.02em;
    }
    .header-brand .brand-sub {
      font-size:.72rem; color:rgba(255,255,255,.5);
      letter-spacing:.08em; text-transform:uppercase;
    }
    .header-back {
      display:flex; align-items:center; gap:.5rem;
      color:rgba(255,255,255,.65); text-decoration:none;
      font-size:.85rem; letter-spacing:.04em;
      transition:color .2s;
    }
    .header-back:hover { color:#fff; }

    /* ── Hero text ── */
    .hero-text {
      text-align:center;
      padding:3.5rem 1rem 2rem;
      margin-top: 80px;
    }
    .hero-text .label {
      font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
      color:rgba(255,255,255,.45); margin-bottom:.8rem;
    }
    .hero-text h1 {
      font-family:'Playfair Display', serif;
      font-size:clamp(2rem, 5vw, 3.2rem);
      font-weight:400; color:#fff;
      margin-bottom:.6rem;
    }
    .hero-text p { color:rgba(255,255,255,.5); font-size:.9rem; }
    .divider {
      width:48px; height:2px;
      background:linear-gradient(90deg, var(--turchese), var(--blu));
      margin:.9rem auto;
    }

    /* ── Gallery grid ── */
    .container { max-width:1200px; margin:0 auto; padding:0 1.5rem 4rem; }
    .gallery-grid {
      display:grid;
      grid-template-columns:repeat(3, 1fr);
      gap:1rem;
    }
    .gallery-item {
      position:relative;
      border-radius:var(--raggio);
      overflow:hidden;
      cursor:zoom-in;
      aspect-ratio:4/3;
      background:#1e1e1e;
    }
    /* Foto grandi (16:9, span 2): solo la prima */
    .gallery-item:nth-child(1) { grid-column:span 2; aspect-ratio:16/9; }

    .gallery-item img {
      width:100%; height:100%;
      object-fit:cover;
      display:block;
      transition:transform .5s, filter .4s;
    }
    .gallery-item:hover img {
      transform:scale(1.04);
      filter:brightness(.78);
    }
    .gi-overlay {
      position:absolute; inset:0;
      display:flex; align-items:center; justify-content:center;
      opacity:0; transition:opacity .3s;
    }
    .gallery-item:hover .gi-overlay { opacity:1; }
    .gi-overlay i { font-size:2.2rem; color:#fff; text-shadow:0 2px 12px rgba(0,0,0,.6); }
    .gi-caption {
      position:absolute; bottom:0; left:0; right:0;
      padding:.7rem 1rem;
      background:linear-gradient(transparent, rgba(0,0,0,.75));
      color:#fff; font-size:.8rem; letter-spacing:.04em;
      opacity:0; transition:opacity .3s;
    }
    .gallery-item:hover .gi-caption { opacity:1; }

    /* ── Video item ── */
    .gallery-item.video-item { cursor:pointer; }
    .video-thumb-wrap { position:relative; width:100%; height:100%; }
    .video-thumb-wrap video { width:100%; height:100%; object-fit:cover; pointer-events:none; }
    .play-badge {
      position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
      width:54px; height:54px; border-radius:50%;
      background:rgba(255,255,255,.18); backdrop-filter:blur(4px);
      border:2px solid rgba(255,255,255,.45);
      display:flex; align-items:center; justify-content:center;
      transition:background .2s, transform .2s;
    }
    .gallery-item:hover .play-badge { background:rgba(255,255,255,.32); transform:translate(-50%,-50%) scale(1.12); }
    .play-badge i { font-size:1.4rem; color:#fff; margin-left:4px; }

    /* ── Lightbox video ── */
    .lb-video {
      max-width:90vw; max-height:85vh;
      border-radius:6px;
      box-shadow:0 8px 50px rgba(0,0,0,.7);
      display:none;
    }
    .lb-video.lb-active { display:block; }
    .lb-img.lb-hidden { display:none; }

    /* ── Lightbox ── */
    .lb-overlay {
      position:fixed; inset:0; z-index:9999;
      background:rgba(0,0,0,.96);
      display:flex; align-items:center; justify-content:center;
      opacity:0; pointer-events:none;
      transition:opacity .25s;
    }
    .lb-overlay.lb-open { opacity:1; pointer-events:all; }
    .lb-img {
      max-width:90vw; max-height:85vh;
      object-fit:contain;
      border-radius:6px;
      box-shadow:0 8px 50px rgba(0,0,0,.7);
      transition:opacity .18s;
      display:block;
    }
    .lb-close {
      position:absolute; top:1.2rem; right:1.5rem;
      background:none; border:none; color:#fff;
      font-size:2.4rem; cursor:pointer;
      opacity:.6; transition:opacity .2s; line-height:1;
    }
    .lb-close:hover { opacity:1; }
    .lb-nav {
      position:absolute; top:50%; transform:translateY(-50%);
      background:rgba(255,255,255,.1); border:none; color:#fff;
      font-size:2rem; padding:.6rem 1.2rem;
      border-radius:10px; cursor:pointer;
      transition:background .2s; line-height:1;
    }
    .lb-nav:hover { background:rgba(255,255,255,.22); }
    .lb-prev { left:1.2rem; }
    .lb-next { right:1.2rem; }
    .lb-counter {
      position:absolute; bottom:1.3rem; left:50%; transform:translateX(-50%);
      color:rgba(255,255,255,.45); font-size:.82rem; letter-spacing:.08em;
    }
    .lb-caption {
      position:absolute; bottom:3.2rem; left:50%; transform:translateX(-50%);
      color:rgba(255,255,255,.8); font-size:.9rem; white-space:nowrap;
    }

    /* ── Footer ── */
    .footer {
      text-align:center; padding:2rem;
      color:rgba(255,255,255,.28); font-size:.78rem;
      border-top:1px solid rgba(255,255,255,.06);
    }
    .footer a { color:rgba(255,255,255,.5); text-decoration:none; }
    .footer a:hover { color:#fff; }

    /* ── Responsive ── */
    @media(max-width:900px) {
      .gallery-grid { grid-template-columns:1fr 1fr; }
      .gallery-item:nth-child(1),
      .gallery-item:nth-child(8) { grid-column:span 2; }
    }
    @media(max-width:560px) {
      .gallery-grid { grid-template-columns:1fr; }
      .gallery-item:nth-child(1),
      .gallery-item:nth-child(8) { grid-column:span 1; aspect-ratio:4/3; }
      .lb-nav { padding:.4rem .7rem; font-size:1.5rem; }
      .header { padding:1rem; }
    }