/* Font Agrandir */
    @font-face {
      font-family: 'Agrandir';
      src: url('Agrandir - Free For Personal Use/Agrandir-Regular.otf') format('opentype');
      font-weight: 400;
      font-style: normal;
    }
    @font-face {
      font-family: 'Agrandir';
      src: url('Agrandir - Free For Personal Use/Agrandir-TextBold.otf') format('opentype');
      font-weight: 700;
      font-style: normal;
    }
    @font-face {
      font-family: 'Agrandir';
      src: url('Agrandir - Free For Personal Use/Agrandir-GrandHeavy.otf') format('opentype');
      font-weight: 900;
      font-style: normal;
    }
    @font-face {
      font-family: 'Agrandir';
      src: url('Agrandir - Free For Personal Use/Agrandir-GrandLight.otf') format('opentype');
      font-weight: 300;
      font-style: normal;
    }

    /* Base responsive - gestione zoom e risoluzioni */
    html {
      font-size: 100%; /* 16px di default, scala con lo zoom del browser */
      overflow-x: hidden; /* blocca scroll orizzontale su mobile */
    }

    /* SCALING PROPORZIONALE PER TUTTI GLI SCHERMI - Basato su 1440px */
    @media (min-width: 1500px) { html { zoom: 1.05; } }
    @media (min-width: 1600px) { html { zoom: 1.11; } }
    @media (min-width: 1700px) { html { zoom: 1.18; } }
    @media (min-width: 1800px) { html { zoom: 1.25; } }
    @media (min-width: 1920px) { html { zoom: 1.33; } }
    @media (min-width: 2100px) { html { zoom: 1.46; } }
    @media (min-width: 2400px) { html { zoom: 1.67; } }
    @media (min-width: 2560px) { html { zoom: 1.78; } }
    @media (max-width: 1439px) and (min-width: 1300px) { html { zoom: 0.95; } }
    @media (max-width: 1299px) and (min-width: 1200px) { html { zoom: 0.88; } }
    @media (max-width: 1199px) and (min-width: 1025px) { html { zoom: 0.78; } }

    * {margin:0; padding:0; box-sizing:border-box;}
    body {
      font-family:'Agrandir', 'Montserrat','Poppins',sans-serif;
      color:#1a1a1a;
      background: #ffffff;
      scroll-behavior:smooth;
      overflow-x:hidden;
      position:relative;
      min-height: 100vh;
      font-size: 1rem;
    }
    
    a, button, [role="button"] {
      min-height: 44px;
      min-width: 44px;
      touch-action: manipulation;
    }

    /* HEADER - IDENTICO A INDEX */
    .eday-header {
      width: 100%;
      background: linear-gradient(135deg, #00d49a 0%, #00b88a 30%, #007a5c 100%);
      box-shadow: none;
      padding: 0;
      position: sticky;
      top: 0;
      z-index: 100;
    }
    .header-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      max-width: 81.25rem;
      margin: 0 auto;
      padding: 0.75rem 2.5rem;
      position: relative;
    }
    .header-logo {
      display: flex;
      align-items: center;
    }
    .header-logo img {
      height: 2.25rem;
      filter: brightness(0) invert(1);
      margin: 0;
      display: block;
      transition: transform 0.3s ease, opacity 0.3s ease;
    }
    .header-logo:hover img {
      transform: scale(1.03);
      opacity: 0.9;
    }
    .eday-header nav {
      display: flex;
      justify-content: flex-end;
      align-items: center;
      gap: 0.3125rem;
      padding: 0;
      background: transparent;
    }
    .eday-header nav a {
      color: #ffffff;
      font-weight: 500;
      text-decoration: none;
      font-size: 0.9em;
      letter-spacing: 0.01875rem;
      padding: 0.625rem 1.125rem;
      border-radius: 0.375rem;
      position: relative;
      transition: all 0.25s ease;
      background: transparent;
      border: none;
      font-family: 'Agrandir', sans-serif;
    }
    .eday-header nav a::after {
      content: '';
      position: absolute;
      bottom: 0.375rem;
      left: 1.125rem;
      right: 1.125rem;
      height: 0.125rem;
      background: #ffffff;
      transform: scaleX(0);
      transition: transform 0.25s ease;
      border-radius: 0.0625rem;
    }
    .eday-header nav a:hover::after,
    .eday-header nav a:focus::after,
    .eday-header nav a.nav-active::after {
      transform: scaleX(1);
    }
    .eday-header nav a.nav-active {
      font-weight: 600;
    }
    
    .mobile-menu-toggle {
      display: none;
      background: none;
      border: none;
      cursor: pointer;
      padding: 8px;
      border-radius: 6px;
      width: 40px;
      height: 40px;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 5px;
      transition: background 0.2s ease;
    }
    .mobile-menu-toggle:hover {
      background: rgba(255,255,255,0.12);
    }
    .mobile-menu-toggle .bar {
      display: block;
      width: 22px;
      height: 1.5px;
      background: #ffffff;
      border-radius: 2px;
      transition: transform 0.3s cubic-bezier(0.4,0,0.2,1), opacity 0.3s ease, width 0.3s ease;
      transform-origin: center;
    }
    .mobile-menu-toggle.open .bar:nth-child(1) {
      transform: translateY(6.5px) rotate(45deg);
    }
    .mobile-menu-toggle.open .bar:nth-child(2) {
      opacity: 0;
      width: 0;
    }
    .mobile-menu-toggle.open .bar:nth-child(3) {
      transform: translateY(-6.5px) rotate(-45deg);
    }
    
    @media (max-width: 768px) {
      .header-inner {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 0 1.25rem;
      }
      .header-logo img {
        height: 2rem;
        margin: 0.75rem 0;
      }
      .mobile-menu-toggle {
        display: flex;
      }
      .eday-header nav {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: linear-gradient(180deg, #008c6a 0%, #007a5c 100%);
        flex-direction: column;
        padding: 0.9375rem 1.25rem;
        box-shadow: 0 0.625rem 1.875rem rgba(0,100,70,0.4);
        transform: translateY(-0.625rem);
        opacity: 0;
        visibility: hidden;
        transition: all 0.3s ease;
        z-index: 1000;
        gap: 0.3125rem;
      }
      .eday-header nav.active {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
      }
      .eday-header nav a {
        font-size: 0.95em;
        padding: 0.75rem 0.9375rem;
        text-align: left;
        color: #ffffff;
        border-radius: 0.5rem;
      }
      .eday-header nav a::after {
        display: none;
      }
      .eday-header nav a:hover {
        background: rgba(255,255,255,0.2) !important;
      }
    }

    /* HERO SECTION — MODERN */
    .hero-case {
      position: relative;
      min-height: 100vh;
      max-height: none;
      background:
        radial-gradient(ellipse at 20% 30%, rgba(0, 240, 175, 0.18) 0%, transparent 55%),
        radial-gradient(ellipse at 80% 70%, rgba(0, 176, 112, 0.22) 0%, transparent 55%),
        linear-gradient(135deg, #006b44 0%, #004d30 50%, #00301e 100%);
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      padding: 3.5rem 0 0;
      padding-bottom: 0;
      overflow: hidden;
      isolation: isolate;
    }
    /* Canvas particelle */
    #heroCanvas {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: 0;
      pointer-events: none;
      opacity: 0.55;
    }
    /* Blob decorativo animato */
    .hero-case::before {
      content: '';
      position: absolute;
      top: -10rem;
      right: -10rem;
      width: 36rem;
      height: 36rem;
      background: radial-gradient(circle, rgba(0,240,175,0.25) 0%, rgba(0,240,175,0) 70%);
      border-radius: 50%;
      z-index: 0;
      animation: heroBlob 14s ease-in-out infinite alternate;
    }
    .hero-case::after {
      content: '';
      position: absolute;
      bottom: -12rem;
      left: -12rem;
      width: 40rem;
      height: 40rem;
      background: radial-gradient(circle, rgba(0,176,112,0.2) 0%, rgba(0,176,112,0) 70%);
      border-radius: 50%;
      z-index: 0;
      animation: heroBlob 18s ease-in-out infinite alternate-reverse;
    }
    @keyframes heroBlob {
      0%   { transform: translate(0,0) scale(1); }
      100% { transform: translate(40px, -30px) scale(1.15); }
    }

    .hero-content {
      position: relative;
      z-index: 2;
      max-width: 60rem;
      width: 100%;
      padding: 0 6%;
      margin: 0 auto;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 0;
    }

    /* Logo sopra, grande, senza card */
    .hero-logo-wrap {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 0.4rem;
      opacity: 0;
      transform: translateY(20px);
      animation: heroFade 1s 0.1s cubic-bezier(.2,.8,.25,1) forwards;
    }
    .hero-logo-wrap::before,
    .hero-logo-wrap::after {
      content: '';
      position: absolute;
      top: 50%;
      width: clamp(40px, 8vw, 100px);
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(0,240,175,0.6), transparent);
    }
    .hero-logo-wrap::before { right: 100%; margin-right: 1.25rem; }
    .hero-logo-wrap::after  { left: 100%;  margin-left: 1.25rem; }
    .hero-logo {
      width: clamp(130px, 16vw, 220px);
      height: auto;
      filter: brightness(0) invert(1) drop-shadow(0 14px 40px rgba(0, 240, 175, 0.25));
    }

    /* Label con trattini verdi ai lati */
    .hero-label {
      display: inline-flex;
      align-items: center;
      gap: 0.85rem;
      font-family: 'Agrandir', sans-serif;
      font-size: 0.8em;
      font-weight: 700;
      color: #00f0af;
      letter-spacing: 4px;
      text-transform: uppercase;
      margin-bottom: 0.6rem;
      opacity: 0;
      transform: translateY(14px);
      animation: heroFade 0.8s 0.3s ease forwards;
    }
    .hero-label::before,
    .hero-label::after {
      content: '';
      width: 2rem;
      height: 2px;
      background: #00f0af;
      border-radius: 2px;
    }

    /* Titolo doppia riga centrato */
    .hero-title {
      font-family: 'Agrandir', 'Poppins', sans-serif;
      font-size: clamp(2.8em, 7vw, 6em);
      line-height: 0.88;
      letter-spacing: -3px;
      margin: 0 0 0.5rem 0;
      color: #ffffff;
      font-weight: 300;
      white-space: normal;
      opacity: 0;
      transform: translateY(20px);
      animation: heroFade 0.9s 0.45s ease forwards;
    }
    .hero-title .light {
      display: block;
      font-weight: 300;
      font-style: italic;
      color: rgba(255,255,255,0.85);
      font-size: 0.28em;
      letter-spacing: 1px;
      margin-bottom: 0.4rem;
    }
    .hero-title strong {
      display: block;
      font-weight: 900;
      color: #00f0af;
      text-shadow: 0 8px 40px rgba(0, 240, 175, 0.25);
    }
    @keyframes heroFade {
      to { opacity: 1; transform: translateY(0); }
    }

    .hero-subtitle {
      font-family: 'Agrandir', sans-serif;
      font-size: 1.28em;
      font-weight: 400;
      color: rgba(255,255,255,0.88);
      margin: 0 auto 1.4rem;
      max-width: 38rem;
      line-height: 1.55;
      opacity: 0;
      transform: translateY(14px);
      animation: heroFade 0.8s 0.6s ease forwards;
    }
    .hero-subtitle b { color: #00f0af; font-weight: 700; }

    /* Mini-stats centrati con separatori */
    .hero-mini {
      display: inline-flex;
      align-items: center;
      gap: 0;
      margin: 0 auto 1.4rem;
      padding: 0.85rem 1.3rem;
      background: rgba(255, 255, 255, 0.04);
      border: 1px solid rgba(255, 255, 255, 0.1);
      border-radius: 999px;
      backdrop-filter: blur(10px);
      opacity: 0;
      transform: translateY(14px);
      animation: heroFade 0.8s 0.75s ease forwards;
    }
    .hero-mini-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.15rem;
      padding: 0 1.5rem;
      position: relative;
    }
    .hero-mini-item + .hero-mini-item::before {
      content: '';
      position: absolute;
      left: 0;
      top: 20%;
      bottom: 20%;
      width: 1px;
      background: rgba(255, 255, 255, 0.15);
    }
    .hero-mini-num {
      font-family: 'Agrandir', sans-serif;
      font-size: 1.6em;
      font-weight: 900;
      color: #00f0af;
      line-height: 1;
      letter-spacing: -1px;
    }
    .hero-mini-label {
      font-family: 'Agrandir', sans-serif;
      font-size: 0.65em;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 2px;
      color: rgba(255,255,255,0.65);
    }

    /* TAGS inline, stile minimal (non bottoni) */
    .hero-tags {
      display: inline-flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      gap: 0;
      margin-top: 1.2rem;
      margin-bottom: 0;
      padding-bottom: 0;
      opacity: 0;
      transform: translateY(14px);
      animation: heroFade 0.8s 0.9s ease forwards;
    }
    .hero-tag {
      font-family: 'Agrandir', sans-serif;
      font-size: 0.85em;
      font-weight: 600;
      color: rgba(255, 255, 255, 0.78);
      letter-spacing: 2px;
      text-transform: uppercase;
      padding: 0 0.9rem;
      transition: color 0.3s ease;
    }
    .hero-tag:hover { color: #00f0af; }
    .hero-tag + .hero-tag {
      border-left: 1px solid rgba(255, 255, 255, 0.2);
    }

    /* Scroll hint */
    .hero-scroll {
      position: absolute;
      bottom: 1.5rem;
      left: 50%;
      transform: translateX(-50%);
      z-index: 3;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.5rem;
      color: rgba(255,255,255,0.5);
      font-family: 'Agrandir', sans-serif;
      font-size: 0.68em;
      letter-spacing: 3px;
      text-transform: uppercase;
      animation: heroBob 2.2s ease-in-out infinite;
    }
    .hero-scroll svg { width: 1.1rem; height: 1.1rem; stroke: currentColor; fill: none; stroke-width: 2; }
    @keyframes heroBob {
      0%, 100% { transform: translate(-50%, 0); }
      50%      { transform: translate(-50%, 8px); }
    }

    @media (max-width: 768px) {
      .hero-case {
        min-height: 100svh;
        max-height: none;
        padding: 4.5rem 0 5rem;
        overflow: visible;
      }
      .hero-content {
        padding: 0 5%;
      }
      .hero-logo { width: clamp(100px, 28vw, 160px); }
      .hero-title {
        font-size: clamp(2em, 9vw, 3.5em);
        white-space: normal;
        letter-spacing: -1px;
      }
      .hero-subtitle { font-size: 1em; }
      .hero-mini {
        padding: 0.75rem 0.6rem;
        flex-wrap: wrap;
        justify-content: center;
        border-radius: 20px;
      }
      .hero-mini-item { padding: 0 0.8rem; }
      .hero-mini-num { font-size: 1.25em; }
      .hero-mini-label { font-size: 0.6em; }
      .hero-tag { padding: 0 0.55rem; font-size: 0.75em; letter-spacing: 1.5px; }
      .hero-scroll { display: none; }
    }
    @media (max-width: 480px) {
      .hero-case { padding: 4rem 0 4.5rem; }
      .hero-title { font-size: clamp(1.8em, 8vw, 2.8em); }
      .hero-subtitle { font-size: 0.92em; }
      .hero-mini { gap: 0; padding: 0.65rem 0.4rem; }
      .hero-mini-item { padding: 0 0.65rem; }
      .hero-mini-num { font-size: 1.1em; }
      .hero-tags { gap: 2px; }
      .hero-tag { padding: 0 0.45rem; font-size: 0.7em; }
    }

    /* SEZIONI CONTENUTO */
    .content-section {
      padding: 5rem 0;
      background: #ffffff;
    }
    .content-section:nth-child(odd) {
      background: #f8f8f8;
    }
    .section-inner {
      max-width: 100%;
      margin: 0;
      padding: 0 5%;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 3.75rem;
      align-items: center;
    }
    .section-inner.reverse {
      direction: rtl;
    }
    .section-inner.reverse > * {
      direction: ltr;
    }
    .section-inner--single {
      grid-template-columns: 1fr;
      max-width: 60rem;
      margin: 0;
      text-align: left;
      padding: 0 5%;
    }
    .section-inner--single .section-text {
      align-items: flex-start;
    }
    .section-inner--single .section-desc {
      max-width: 50rem;
    }
    .section-text {
      display: flex;
      flex-direction: column;
      gap: 1.25rem;
    }
    .section-label {
      font-family: 'Agrandir', sans-serif;
      font-size: 0.85em;
      font-weight: 600;
      color: #00c991;
      letter-spacing: 0.125rem;
      text-transform: uppercase;
    }
    .section-title {
      font-family: 'Agrandir', sans-serif;
      font-size: clamp(2em, 4vw, 3em);
      font-weight: 700;
      color: #1a1a1a;
      line-height: 1;
      margin: 0;
    }
    .section-desc {
      font-family: 'Agrandir', sans-serif;
      font-size: 1em;
      font-weight: 400;
      color: #444444;
      line-height: 1.7;
    }
    .section-media {
      display: flex;
      justify-content: center;
      align-items: center;
    }
    .section-media img {
      max-width: 100%;
      height: auto;
      border-radius: 0.75rem;
      box-shadow: 0 1.25rem 3.75rem rgba(0,0,0,0.1);
    }
    .section-media.stacked {
      position: relative;
      padding: 20px;
    }
    .section-media.stacked img {
      position: relative;
      max-width: 280px;
      box-shadow: 0 15px 40px rgba(0,0,0,0.15);
    }
    .section-media.stacked img:nth-child(1) {
      z-index: 3;
      transform: rotate(-5deg) translateX(-20px);
    }
    .section-media.stacked img:nth-child(2) {
      z-index: 2;
      transform: rotate(3deg) translateX(20px) translateY(-40px);
      position: absolute;
      right: 0;
    }
    .section-media.stacked img:nth-child(3) {
      z-index: 1;
      transform: rotate(-2deg) translateY(30px);
      position: absolute;
      bottom: 0;
      left: 20px;
    }
    .phone-mockup {
      max-width: 280px;
      filter: drop-shadow(0 30px 60px rgba(0,0,0,0.2));
    }

    /* VIDEO REEL - singolo video item (riusato in adv-section) */
    .video-item {
      width: 200px;
      flex-shrink: 0;
      border-radius: 12px;
      overflow: hidden;
      position: relative;
      aspect-ratio: 9/16;
    }
    .video-item iframe {
      width: 100%;
      height: 100%;
      border: 0;
      position: absolute;
      top: 0;
      left: 0;
    }

    /* ========= REEL SECTION — EDITORIAL LAYOUT (LIGHT) ========= */
    .reel-section {
      position: relative;
      padding: 6.5rem 0;
      background: #ffffff;
      color: #1a1a1a;
      overflow: hidden;
    }
    .reel-section::before {
      display: none;
    }
    .reel-inner {
      position: relative;
      z-index: 2;
      max-width: 100%;
      padding: 0 5%;
      display: grid;
      grid-template-columns: 1.05fr 1fr;
      gap: 4rem;
      align-items: center;
    }
    .reel-text {
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
    }
    .reel-label {
      display: inline-flex;
      align-items: center;
      gap: 0.75rem;
      font-family: 'Agrandir', sans-serif;
      font-size: 0.8em;
      font-weight: 700;
      color: #00a874;
      letter-spacing: 0.25rem;
      text-transform: uppercase;
    }
    .reel-label::before {
      content: '';
      width: 2.5rem;
      height: 1px;
      background: #00a874;
    }
    .reel-title {
      font-family: 'Agrandir', sans-serif;
      font-size: clamp(2.25em, 4.2vw, 3.4em);
      font-weight: 900;
      line-height: 1.02;
      margin: 0;
      color: #111111;
      letter-spacing: -0.01em;
    }
    .reel-title em {
      font-style: normal;
      color: #00a874;
      font-weight: 900;
    }
    .reel-title::after {
      content: '';
      display: block;
      width: 4rem;
      height: 3px;
      background: #00a874;
      margin-top: 1.25rem;
      border-radius: 2px;
    }
    .reel-desc {
      font-family: 'Agrandir', sans-serif;
      font-size: 1.02em;
      line-height: 1.7;
      color: #444444;
      margin: 0;
      max-width: 34rem;
    }
    .reel-desc b { color: #111111; font-weight: 700; }
    .reel-chips {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.5rem 0;
      margin-top: 1rem;
      padding-top: 1.25rem;
      border-top: 1px solid rgba(0,0,0,0.12);
      font-family: 'Agrandir', sans-serif;
      font-size: 0.78em;
      font-weight: 600;
      letter-spacing: 0.25rem;
      text-transform: uppercase;
      color: #333333;
    }
    .reel-chip {
      position: relative;
      display: inline-flex;
      align-items: center;
      padding: 0 1.1rem;
    }
    .reel-chip:first-child { padding-left: 0; }
    .reel-chip + .reel-chip {
      border-left: 1px solid rgba(0,0,0,0.18);
    }

    /* Carosello 3 video, stile servizi hero */
    .reel-visual {
      position: relative;
      width: 100%;
      max-width: 32rem;
      margin-left: auto;
      perspective: 1200px;
    }
    .reel-carousel {
      position: relative;
      width: 100%;
      aspect-ratio: 9 / 16;
      max-height: 34rem;
    }
    .reel-slide {
      position: absolute;
      top: 0;
      left: 50%;
      width: 62%;
      aspect-ratio: 9 / 16;
      border-radius: 1.25rem;
      overflow: hidden;
      background: #111;
      box-shadow: 0 1.5rem 3.5rem rgba(0,0,0,0.5),
                  0 0 0 1px rgba(255,255,255,0.08);
      transform-origin: center center;
      transition: transform 0.8s cubic-bezier(.65,.05,.36,1),
                  opacity 0.8s ease,
                  filter 0.8s ease;
      cursor: pointer;
      will-change: transform, opacity, filter;
    }
    .reel-slide iframe,
    .reel-slide video {
      position: absolute;
      top: -4%; left: -4%;
      width: 108%; height: 108%;
      border: 0;
      pointer-events: none;
      object-fit: cover;
    }
    .reel-slide::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent 55%, rgba(0, 30, 20, 0.55) 100%);
      pointer-events: none;
      z-index: 2;
    }
    /* Shield grigio sulle slide non attive, copre UI del player */
    .reel-slide-shield {
      position: absolute;
      inset: 0;
      z-index: 6;
      opacity: 0;
      transition: opacity 0.4s ease;
      pointer-events: none;
      background:
        radial-gradient(circle at 50% 50%,
          rgba(60,60,60,0.98) 0%,
          rgba(60,60,60,0.9) 18%,
          rgba(60,60,60,0) 32%),
        linear-gradient(to top,
          rgba(45,45,45,1) 0%,
          rgba(45,45,45,0.95) 12%,
          rgba(45,45,45,0) 22%);
    }
    .reel-slide[data-pos="next"] .reel-slide-shield,
    .reel-slide[data-pos="prev"] .reel-slide-shield { opacity: 1; }

    .reel-slide[data-pos="active"] {
      transform: translate(-50%, 0) scale(1);
      opacity: 1;
      filter: grayscale(0) brightness(1);
      z-index: 5;
    }
    .reel-slide[data-pos="next"] {
      transform: translate(10%, 0) scale(0.78);
      opacity: 0.55;
      filter: grayscale(1) brightness(0.65);
      z-index: 3;
    }
    .reel-slide[data-pos="next"]:hover {
      opacity: 0.85;
      transform: translate(8%, -0.5rem) scale(0.82);
      filter: grayscale(0.4) brightness(0.85);
    }
    .reel-slide[data-pos="prev"] {
      transform: translate(-110%, 0) scale(0.78);
      opacity: 0.55;
      filter: grayscale(1) brightness(0.65);
      z-index: 3;
    }
    .reel-slide[data-pos="prev"]:hover {
      opacity: 0.85;
      transform: translate(-112%, -0.5rem) scale(0.82);
      filter: grayscale(0.4) brightness(0.85);
    }
    .reel-slide[data-pos="hidden"] {
      transform: translate(-50%, 0) scale(0.6);
      opacity: 0;
      pointer-events: none;
      z-index: 1;
    }

    /* Badge "LIVE" sulla slide attiva */
    .reel-badge {
      position: absolute;
      top: 1rem; left: 1rem;
      z-index: 10;
      display: inline-flex;
      align-items: center;
      gap: 0.45rem;
      padding: 0.35rem 0.75rem;
      background: rgba(0,0,0,0.55);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      border-radius: 2rem;
      color: #fff;
      font-family: 'Agrandir', sans-serif;
      font-size: 0.65em;
      font-weight: 700;
      letter-spacing: 0.15rem;
      text-transform: uppercase;
      pointer-events: none;
    }
    .reel-badge::before {
      content: '';
      width: 0.4rem; height: 0.4rem;
      border-radius: 50%;
      background: #00f0af;
      box-shadow: 0 0 0.55rem #00f0af;
      animation: reelPulse 1.6s ease-in-out infinite;
    }
    @keyframes reelPulse {
      0%,100% { opacity: 1; transform: scale(1); }
      50%     { opacity: 0.5; transform: scale(0.8); }
    }

    @media (max-width: 900px) {
      .reel-section { padding: 4rem 0; }
      .reel-inner {
        grid-template-columns: 1fr;
        gap: 2.5rem;
      }
      .reel-visual {
        max-width: 26rem;
        margin: 0 auto;
      }
      .reel-slide { width: 70%; }
      .reel-slide[data-pos="next"] { transform: translate(5%, 0) scale(0.72); }
      .reel-slide[data-pos="prev"] { transform: translate(-105%, 0) scale(0.72); }
    }

    @media (max-width: 768px) {
      .reel-section { overflow: hidden; }
      .reel-inner { padding: 0 5%; }
      .reel-visual {
        max-width: 90vw;
        width: 90vw;
        overflow: hidden;
      }
      .reel-carousel {
        overflow: hidden;
        aspect-ratio: unset;
        height: calc(90vw * 0.62 * 16 / 9);
        max-height: 115vw;
      }
      .reel-slide { width: 62%; }
      .reel-slide[data-pos="next"] { transform: translate(12%, 0) scale(0.74); }
      .reel-slide[data-pos="prev"] { transform: translate(-112%, 0) scale(0.74); }
    }

    @media (max-width: 900px) {
      .section-inner {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
      }
      .section-inner.reverse {
        direction: ltr;
      }
      .section-text {
        order: 2;
      }
      .section-media {
        order: 1;
      }
      .section-media.stacked {
        min-height: 400px;
      }
    }

    /* ========= ADV SECTION — EDITORIAL (GREEN, VIDEO LEFT) ========= */
    .adv-section {
      position: relative;
      padding: 6.5rem 0;
      background:
        radial-gradient(ellipse at 20% 50%, #008c5a 0%, transparent 60%),
        linear-gradient(135deg, #006b44 0%, #004d30 50%, #00301e 100%);
      color: #ffffff;
      overflow: hidden;
    }
    .adv-inner {
      position: relative;
      z-index: 2;
      max-width: 100%;
      padding: 0 5%;
      display: grid;
      grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
      gap: 4rem;
      align-items: center;
    }
    .adv-visual {
      position: relative;
      width: 100%;
      max-width: 17rem;
      aspect-ratio: 9 / 16;
      perspective: 1400px;
    }
    .adv-stack {
      position: absolute;
      inset: 0;
    }
    .adv-card {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border-radius: 1rem;
      overflow: hidden;
      background: #111;
      box-shadow: 0 1.25rem 3rem rgba(0,0,0,0.5),
                  0 0 0 1px rgba(255,255,255,0.08);
      transition:
        transform 0.7s cubic-bezier(.2,.8,.25,1),
        opacity 0.7s ease,
        filter 0.7s ease;
      will-change: transform, opacity, filter;
      transform-origin: center center;
      cursor: pointer;
    }
    .adv-card iframe,
    .adv-card video {
      position: absolute;
      top: -4%; left: -4%;
      width: 108%; height: 108%;
      border: 0;
      pointer-events: none;
      object-fit: cover;
    }
    .adv-card::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent 55%, rgba(0, 30, 20, 0.55) 100%);
      pointer-events: none;
      z-index: 2;
    }
    .adv-card-shield {
      position: absolute;
      inset: 0;
      z-index: 3;
      opacity: 0;
      transition: opacity 0.5s ease;
      pointer-events: none;
      background:
        radial-gradient(circle at 50% 50%, rgba(40,40,40,0.95) 0%, rgba(40,40,40,0.85) 18%, rgba(40,40,40,0) 32%),
        linear-gradient(to top, rgba(30,30,30,1) 0%, rgba(30,30,30,0.95) 12%, rgba(30,30,30,0) 22%);
    }
    /* Stack states: 0 = front, 1 = dietro destra, 2 = ancora più dietro */
    .adv-card[data-pos="0"] {
      transform: translateX(0) scale(1);
      opacity: 1;
      filter: grayscale(0) brightness(1);
      z-index: 10;
    }
    .adv-card[data-pos="1"] {
      transform: translateX(14%) scale(0.94);
      opacity: 0.95;
      filter: grayscale(0.9) brightness(0.75);
      z-index: 9;
    }
    .adv-card[data-pos="1"] .adv-card-shield { opacity: 1; }
    .adv-card[data-pos="2"] {
      transform: translateX(26%) scale(0.88);
      opacity: 0.9;
      filter: grayscale(1) brightness(0.6);
      z-index: 8;
    }
    .adv-card[data-pos="2"] .adv-card-shield { opacity: 1; }
    .adv-card[data-pos="hidden"] {
      transform: translateX(34%) scale(0.82);
      opacity: 0;
      pointer-events: none;
      z-index: 1;
    }
    .adv-text {
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
      text-align: right;
      align-items: flex-end;
    }
    .adv-label {
      display: inline-flex;
      align-items: center;
      gap: 0.75rem;
      font-family: 'Agrandir', sans-serif;
      font-size: 0.8em;
      font-weight: 700;
      color: #00f0af;
      letter-spacing: 0.25rem;
      text-transform: uppercase;
      margin: 0;
      flex-direction: row-reverse;
    }
    .adv-label::before {
      content: '';
      width: 2.5rem;
      height: 1px;
      background: #00f0af;
    }
    .adv-title {
      font-family: 'Agrandir', sans-serif;
      font-size: clamp(2.25em, 4.2vw, 3.4em);
      font-weight: 900;
      line-height: 1.02;
      color: #ffffff;
      letter-spacing: -0.01em;
      margin: 0;
      display: block;
    }
    .adv-title .light {
      display: block;
      font-style: italic;
      font-weight: 300;
      color: rgba(255,255,255,0.85);
      font-size: 0.55em;
      letter-spacing: 0.04em;
      margin-bottom: 0.35rem;
    }
    .adv-title strong {
      display: block;
      font-weight: 900;
      color: #00f0af;
    }
    .adv-title::after {
      content: '';
      display: block;
      width: 4rem;
      height: 3px;
      background: #00f0af;
      margin-top: 1.25rem;
      margin-left: auto;
      border-radius: 2px;
    }
    .adv-desc {
      font-family: 'Agrandir', sans-serif;
      font-size: 1.02em;
      line-height: 1.7;
      color: rgba(255,255,255,0.85);
      margin: 0 0 0 auto;
      max-width: 34rem;
    }
    .adv-desc b { color: #ffffff; font-weight: 700; }
    .adv-chips {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: flex-end;
      gap: 0.5rem 0;
      margin-top: 1rem;
      padding-top: 1.25rem;
      border-top: 1px solid rgba(255,255,255,0.18);
      font-family: 'Agrandir', sans-serif;
      font-size: 0.78em;
      font-weight: 600;
      letter-spacing: 0.25rem;
      text-transform: uppercase;
      color: rgba(255,255,255,0.9);
      align-self: stretch;
    }
    .adv-chip {
      padding: 0 1.1rem;
    }
    .adv-chip:last-child { padding-right: 0; }
    .adv-chip:first-child { padding-left: 0; }
    .adv-chip + .adv-chip {
      border-left: 1px solid rgba(255,255,255,0.25);
    }

    @media (max-width: 900px) {
      .adv-section { padding: 4rem 0; }
      .adv-inner {
        grid-template-columns: 1fr;
        gap: 2.5rem;
        text-align: center;
      }
      .adv-visual { margin: 0 auto; max-width: 14rem; }
      .adv-text { text-align: center; align-items: center; }
      .adv-label { justify-content: center; }
      .adv-title::after { margin-left: auto; margin-right: auto; }
      .adv-chips { justify-content: center; }
    }

    /* ========= LEAD SECTION — EDITORIAL (LIGHT, same as reel) ========= */
    .lead-section {
      position: relative;
      padding: 6.5rem 0;
      background: #ffffff;
      color: #1a1a1a;
      overflow: hidden;
    }
    .lead-inner {
      position: relative;
      z-index: 2;
      max-width: 100%;
      padding: 0 5%;
      display: grid;
      grid-template-columns: 1.05fr 1fr;
      gap: 4rem;
      align-items: center;
    }
    .lead-text {
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
    }
    .lead-label {
      display: inline-flex;
      align-items: center;
      gap: 0.75rem;
      font-family: 'Agrandir', sans-serif;
      font-size: 0.8em;
      font-weight: 700;
      color: #00a874;
      letter-spacing: 0.25rem;
      text-transform: uppercase;
    }
    .lead-label::before {
      content: '';
      width: 2.5rem;
      height: 1px;
      background: #00a874;
    }
    .lead-title {
      font-family: 'Agrandir', sans-serif;
      font-size: clamp(2.25em, 4.2vw, 3.4em);
      font-weight: 900;
      line-height: 1.02;
      color: #111111;
      letter-spacing: -0.01em;
      margin: 0;
    }
    .lead-title em {
      font-style: normal;
      color: #00a874;
      font-weight: 900;
    }
    .lead-title::after {
      content: '';
      display: block;
      width: 4rem;
      height: 3px;
      background: #00a874;
      margin-top: 1.25rem;
      border-radius: 2px;
    }
    .lead-desc {
      font-family: 'Agrandir', sans-serif;
      font-size: 1.02em;
      line-height: 1.7;
      color: #444444;
      margin: 0;
      max-width: 34rem;
    }
    .lead-desc b { color: #111111; font-weight: 700; }
    .lead-chips {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.5rem 0;
      margin-top: 1rem;
      padding-top: 1.25rem;
      border-top: 1px solid rgba(0,0,0,0.12);
      font-family: 'Agrandir', sans-serif;
      font-size: 0.78em;
      font-weight: 600;
      letter-spacing: 0.25rem;
      text-transform: uppercase;
      color: #333333;
    }
    .lead-chip {
      padding: 0 1.1rem;
    }
    .lead-chip:first-child { padding-left: 0; }
    .lead-chip + .lead-chip {
      border-left: 1px solid rgba(0,0,0,0.18);
    }
    .lead-visual {
      /* placeholder per contenuto futuro (immagine / mockup / video) */
      width: 100%;
      min-height: 20rem;
    }
    /* Contenitore video 9:16 dentro lead-visual */
    .lead-video-item {
      width: 17rem;
      aspect-ratio: 9 / 16;
      position: relative;
      overflow: hidden;
      border-radius: 1.25rem;
      box-shadow: 0 1.5rem 3rem rgba(0,0,0,0.28);
      margin: 0 auto;
    }
    .lead-video-item iframe {
      position: absolute;
      top: 0; left: 0;
      width: 100%; height: 100%;
      border: 0;
      display: block;
    }
    @media (max-width: 900px) {
      .lead-section { padding: 4rem 0; }
      .lead-inner {
        grid-template-columns: 1fr;
        gap: 2rem;
      }
      .lead-visual { display: none; }
    }

    /* ========= OTHER CASES — SELETTORE CASE STUDY (ROW SCROLLER) ========= */
    .others-section {
      position: relative;
      padding: 5rem 0 5.5rem;
      background:
        radial-gradient(ellipse at 20% 50%, #008c5a 0%, transparent 60%),
        linear-gradient(135deg, #006b44 0%, #004d30 50%, #00301e 100%);
      color: #ffffff;
      overflow: hidden;
    }
    .others-inner {
      display: grid;
      grid-template-columns: minmax(18rem, 24rem) 1fr;
      gap: 3rem;
      align-items: center;
      padding: 0 5%;
    }
    .others-head {
      display: flex;
      flex-direction: column;
      gap: 1rem;
      max-width: 30rem;
    }
    .others-label {
      display: inline-flex;
      align-items: center;
      gap: 0.75rem;
      font-family: 'Agrandir', sans-serif;
      font-size: 0.8em;
      font-weight: 700;
      color: #00f0af;
      letter-spacing: 0.25rem;
      text-transform: uppercase;
    }
    .others-label::before {
      content: '';
      width: 2.5rem;
      height: 1px;
      background: #00f0af;
    }
    .others-title {
      font-family: 'Agrandir', sans-serif;
      font-size: clamp(1.8em, 3.4vw, 2.6em);
      font-weight: 900;
      line-height: 1.05;
      margin: 0;
      color: #ffffff;
      letter-spacing: -0.01em;
    }
    .others-title em { font-style: normal; color: #00f0af; }
    .others-sub {
      font-family: 'Agrandir', sans-serif;
      font-size: 0.95em;
      font-weight: 300;
      color: rgba(255,255,255,0.78);
      line-height: 1.5;
      margin: 0.25rem 0 0;
      max-width: 24rem;
    }

    /* Controlli sotto il testo */
    .others-controls {
      display: flex;
      align-items: center;
      gap: 1rem;
      margin-top: 0.5rem;
    }
    .others-nav-btn {
      width: 2.8rem;
      height: 2.8rem;
      border-radius: 50%;
      border: 1px solid rgba(255,255,255,0.3);
      background: transparent;
      color: #fff;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition: all 0.25s ease;
    }
    .others-nav-btn:hover {
      background: #00f0af;
      border-color: #00f0af;
      color: #003d2e;
      transform: scale(1.06);
    }
    .others-nav-btn svg {
      width: 1.1rem; height: 1.1rem;
      stroke: currentColor;
      stroke-width: 2.5;
      fill: none;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .others-counter {
      font-family: 'Agrandir', sans-serif;
      font-size: 0.85em;
      font-weight: 600;
      color: rgba(255,255,255,0.7);
      letter-spacing: 0.1rem;
      min-width: 3rem;
    }
    .others-counter em { font-style: normal; color: #00f0af; }

    /* ====== STACK IMPILATO (CTA fissa a sx + card distribuite a dx) ====== */
    .others-stage {
      position: relative;
      width: 100%;
      max-width: 100%;
      justify-self: stretch;
      height: 30rem;
      perspective: 1600px;
      overflow: visible;
      --card-w: clamp(17rem, 24vw, 22rem);
      /* --spread viene calcolato da JS in base al numero di card dietro */
      --spread: 16%;
    }
    .other-card {
      position: absolute;
      top: 50%;
      left: 0;
      width: var(--card-w);
      aspect-ratio: 3 / 4;
      border-radius: 1rem;
      overflow: hidden;
      text-decoration: none;
      color: #fff;
      background: #0c1a12;
      box-shadow: 0 1.25rem 3rem rgba(0,0,0,0.4);
      transform-origin: left center;
      transition: transform 0.7s cubic-bezier(.2,.8,.25,1),
                  opacity 0.6s ease,
                  filter 0.6s ease,
                  box-shadow 0.6s ease;
      will-change: transform, opacity, filter;
      cursor: pointer;
    }
    .other-card::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,0.85) 100%);
      z-index: 2;
    }
    .other-card img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .other-card-shield {
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(0,60,40,0.5) 0%, rgba(0,40,25,0.8) 100%);
      opacity: 0;
      transition: opacity 0.55s ease;
      z-index: 3;
      pointer-events: none;
    }
    .other-card-body {
      position: absolute;
      left: 1.2rem;
      right: 1.2rem;
      bottom: 1.1rem;
      z-index: 4;
      display: flex;
      flex-direction: column;
      gap: 0.2rem;
      opacity: 0;
      transform: translateY(8px);
      transition: opacity 0.5s ease 0.1s, transform 0.5s ease 0.1s;
    }
    .other-card-tag {
      font-family: 'Agrandir', sans-serif;
      font-size: 0.7em;
      font-weight: 700;
      letter-spacing: 0.18rem;
      text-transform: uppercase;
      color: #00f0af;
    }
    .other-card-name {
      font-family: 'Agrandir', sans-serif;
      font-size: 1.6em;
      font-weight: 900;
      margin: 0;
      letter-spacing: -0.01em;
      line-height: 1.02;
      text-transform: uppercase;
    }
    .other-card-arrow {
      position: absolute;
      top: 1rem;
      right: 1rem;
      z-index: 4;
      width: 2.2rem;
      height: 2.2rem;
      border-radius: 50%;
      background: rgba(255,255,255,0.12);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      border: 1px solid rgba(255,255,255,0.3);
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transition: opacity 0.45s ease, background 0.3s ease, transform 0.3s ease;
    }
    .other-card-arrow svg {
      width: 0.9rem; height: 0.9rem;
      stroke: #fff;
      stroke-width: 2.5;
      fill: none;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    /* ---- Stati ----
       "Vedi tutti" è sempre fissa a sinistra (z alto, no shift).
       Le altre card occupano posizioni dinamiche 1..N tramite --i,
       distribuite sullo spread calcolato in JS. */
    .other-card-all {
      transform: translate(0, -50%) scale(1) !important;
      opacity: 1 !important;
      z-index: 20 !important;
    }
    .other-card[data-pos="front"] {
      --i: 0;
      transform: translate(calc(var(--card-w) + 2rem), -50%) scale(1);
      opacity: 1;
      z-index: 15;
    }
    .other-card[data-pos="front"] .other-card-shield { opacity: 0; }
    .other-card[data-pos="front"] .other-card-body,
    .other-card[data-pos="front"] .other-card-arrow {
      opacity: 1;
      transform: translateY(0);
    }
    .other-card[data-pos="back"] {
      /* --i iniettato inline da JS (1,2,3,...) */
      transform:
        translate(
          calc(var(--card-w) + 2rem + var(--spread) * var(--i, 1)),
          -50%
        )
        scale(calc(1 - 0.05 * var(--i, 1)));
      opacity: 1;
      z-index: calc(15 - var(--i, 1));
    }
    .other-card[data-pos="back"] .other-card-shield {
      opacity: calc(0.15 + 0.15 * var(--i, 1));
    }
    .other-card[data-pos="hidden"] {
      transform: translate(calc(100% + 4rem), -50%) scale(0.7);
      opacity: 0;
      z-index: 1;
      pointer-events: none;
    }

    /* Card CTA "Vedi tutti" — prima in pila */
    .other-card-all {
      background: #f5f5f5;
      color: #1a1a1a;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 1.5rem;
    }
    .other-card-all::after { display: none; }
    .other-card-all .other-card-shield { display: none; }
    .other-card-all-text {
      font-family: 'Agrandir', sans-serif;
      line-height: 1.05;
      text-align: left;
      width: 100%;
    }
    .other-card-all-text .light {
      display: block;
      font-size: 1.35em;
      font-weight: 300;
      font-style: italic;
      color: #555;
      margin-bottom: 0.3rem;
    }
    .other-card-all-text .bold {
      display: block;
      font-size: 2.6em;
      font-weight: 900;
      color: #00b070;
      letter-spacing: -0.03em;
      line-height: 0.95;
    }
    .other-card-all .other-card-arrow {
      background: #00b070;
      border-color: #00b070;
      opacity: 1;
    }
    .other-card-all[data-pos="0"] .other-card-arrow { opacity: 1; }
    .other-card-all .other-card-arrow svg { stroke: #fff; }

    @media (max-width: 900px) {
      .others-section { padding: 4rem 0 4.5rem; }
      .others-inner {
        grid-template-columns: 1fr;
        gap: 2.5rem;
      }
      .others-head { max-width: 100%; }
      .others-stage {
        height: 26rem;
        --card-w: clamp(13rem, 55vw, 17rem);
      }
      .other-card[data-pos="front"] {
        transform: translate(calc(var(--card-w) + 1rem), -50%) scale(1);
      }
      .other-card-name { font-size: 1.4em; }
      .other-card-all-text .bold { font-size: 2.2em; }
      .other-card-all-text .light { font-size: 1.1em; }
    }

    /* STATISTICHE (legacy, non più usata) */
    .stats-section {
      background: linear-gradient(135deg, #00d49a 0%, #00b88a 50%, #007a5c 100%);
      padding: 60px 0;
    }
    .stats-intro {
      font-family: 'Agrandir', sans-serif;
      font-size: 1.1em;
      font-weight: 600;
      color: #ffffff;
      text-align: center;
      margin-bottom: 30px;
      padding: 0 5%;
      text-transform: uppercase;
      letter-spacing: 2px;
    }
    .stats-grid {
      max-width: 100%;
      margin: 0;
      padding: 0 5%;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 40px;
      text-align: center;
    }
    .stat-item {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .stat-label {
      font-family: 'Agrandir', sans-serif;
      font-size: 1em;
      font-weight: 600;
      color: #ffffff;
      text-transform: uppercase;
      letter-spacing: 1px;
    }
    .stat-value {
      font-family: 'Agrandir', sans-serif;
      font-size: clamp(2em, 5vw, 3em);
      font-weight: 900;
      color: #003d2e;
      line-height: 1;
    }

    @media (max-width: 600px) {
      .stats-grid {
        grid-template-columns: 1fr;
        gap: 30px;
      }
    }

    /* ========= CTA SECTION — CENTRALE EDITORIAL ========= */
    .cta-section {
      position: relative;
      padding: 6rem 5% 7rem;
      background: #ffffff;
      overflow: hidden;
    }
    .cta-section::before,
    .cta-section::after {
      content: '';
      position: absolute;
      border-radius: 50%;
      filter: blur(80px);
      pointer-events: none;
      z-index: 0;
    }
    .cta-section::before {
      top: -10%;
      left: -5%;
      width: 28rem;
      height: 28rem;
      background: radial-gradient(circle, rgba(0, 240, 175, 0.25) 0%, transparent 70%);
    }
    .cta-section::after {
      bottom: -10%;
      right: -5%;
      width: 32rem;
      height: 32rem;
      background: radial-gradient(circle, rgba(0, 176, 112, 0.22) 0%, transparent 70%);
    }
    .cta-inner {
      position: relative;
      z-index: 2;
      max-width: 52rem;
      margin: 0 auto;
      padding: 0;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 1.25rem;
    }
    .cta-label {
      display: inline-flex;
      align-items: center;
      gap: 0.75rem;
      font-family: 'Agrandir', sans-serif;
      font-size: 0.8em;
      font-weight: 700;
      color: #00a874;
      letter-spacing: 0.25rem;
      text-transform: uppercase;
      margin: 0;
    }
    .cta-label::before,
    .cta-label::after {
      content: '';
      width: 2.5rem;
      height: 1px;
      background: #00a874;
    }
    .cta-title {
      font-family: 'Agrandir', sans-serif;
      font-size: clamp(2.4em, 5.5vw, 4em);
      font-weight: 900;
      color: #0a0a0a;
      margin: 0;
      line-height: 1.02;
      letter-spacing: -0.02em;
    }
    .cta-title em {
      font-style: normal;
      background: linear-gradient(90deg, #00b070 0%, #00d090 50%, #00f0af 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      color: transparent;
    }
    .cta-sub {
      font-family: 'Agrandir', sans-serif;
      font-size: 1.05em;
      font-weight: 300;
      color: #555;
      margin: 0 0 0.75rem;
      max-width: 36rem;
      line-height: 1.5;
    }
    .cta-actions {
      display: inline-flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 1rem;
      margin-top: 0.5rem;
    }
    .cta-btn {
      display: inline-flex;
      align-items: center;
      gap: 0.75rem;
      font-family: 'Agrandir', sans-serif;
      font-size: 1em;
      font-weight: 700;
      text-decoration: none;
      padding: 1rem 2rem;
      border-radius: 999px;
      transition: all 0.3s cubic-bezier(.2,.8,.25,1);
      letter-spacing: 0.02em;
    }
    .cta-btn-primary {
      color: #ffffff;
      background: linear-gradient(135deg, #00b070 0%, #009a60 100%);
      box-shadow: 0 0.75rem 2rem rgba(0, 176, 112, 0.35);
      border: none;
    }
    .cta-btn-primary:hover {
      transform: translateY(-3px);
      box-shadow: 0 1rem 2.5rem rgba(0, 176, 112, 0.5);
    }
    .cta-btn-secondary {
      color: #0a0a0a;
      background: transparent;
      border: 1.5px solid rgba(10,10,10,0.15);
    }
    .cta-btn-secondary:hover {
      border-color: #00b070;
      color: #00b070;
      transform: translateY(-3px);
    }
    .cta-btn svg {
      width: 1.1rem; height: 1.1rem;
      stroke: currentColor;
      stroke-width: 2.5;
      fill: none;
      stroke-linecap: round;
      stroke-linejoin: round;
      transition: transform 0.3s ease;
    }
    .cta-btn-primary:hover svg { transform: translateX(4px); }
    .cta-meta {
      display: inline-flex;
      align-items: center;
      gap: 0.6rem;
      font-family: 'Agrandir', sans-serif;
      font-size: 0.78em;
      font-weight: 600;
      color: #777;
      letter-spacing: 0.15rem;
      text-transform: uppercase;
      margin-top: 1.25rem;
    }
    .cta-meta .dot {
      width: 0.4rem;
      height: 0.4rem;
      border-radius: 50%;
      background: #00d090;
      box-shadow: 0 0 0 4px rgba(0, 208, 144, 0.2);
      animation: ctaPulse 2s ease-in-out infinite;
    }
    @keyframes ctaPulse {
      0%, 100% { box-shadow: 0 0 0 4px rgba(0, 208, 144, 0.2); }
      50% { box-shadow: 0 0 0 8px rgba(0, 208, 144, 0); }
    }

    /* FOOTER - IDENTICO A INDEX */
    .eday-footer {
      background: linear-gradient(160deg, #00d090 0%, #00b070 50%, #009a60 100%);
      padding: 40px 5vw 20px;
      margin-top: 0;
      font-family: 'Agrandir', 'Poppins', sans-serif;
    }

    .footer-top {
      max-width: 1100px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1.2fr 1fr 1fr 1fr;
      gap: 50px;
      padding-bottom: 25px;
      border-bottom: 1px solid rgba(255,255,255,0.25);
      align-items: start;
    }

    .footer-brand {
      display: flex;
      flex-direction: column;
      gap: 12px;
      align-items: flex-start;
    }

    .footer-logo {
      height: 30px;
      width: auto;
      max-width: 120px;
      object-fit: contain;
      filter: brightness(0) invert(1);
    }

    .footer-tagline {
      color: rgba(255,255,255,0.9);
      font-size: 0.85em;
      line-height: 1.5;
      font-weight: 500;
    }

    .footer-col h4 {
      color: #ffffff;
      font-size: 0.85em;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      margin-bottom: 15px;
      margin-top: 0;
    }

    .footer-col ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .footer-col ul li {
      margin-bottom: 8px;
    }

    .footer-col ul li a {
      color: rgba(255,255,255,0.9);
      text-decoration: none;
      font-size: 0.85em;
      font-weight: 500;
      transition: opacity 0.3s ease;
    }

    .footer-col ul li a:hover {
      opacity: 0.7;
    }

    .footer-bottom {
      max-width: 1100px;
      margin: 0 auto;
      padding-top: 20px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 10px;
    }

    .footer-copyright {
      color: rgba(255,255,255,0.8);
      font-size: 0.8em;
      font-weight: 500;
    }

    .footer-legal {
      display: flex;
      gap: 20px;
    }

    .footer-legal a {
      color: rgba(255,255,255,0.8);
      text-decoration: none;
      font-size: 0.8em;
      font-weight: 500;
      transition: opacity 0.3s ease;
    }

    .footer-legal a:hover {
      opacity: 0.7;
    }

    @media (max-width: 768px) {
      /* Footer compatto su mobile: solo dati legali */
      .eday-footer .footer-top {
        display: none;
      }
      .footer-bottom {
        flex-direction: column;
        text-align: center;
        gap: 12px;
        border-top: none;
        padding-top: 0;
      }
    }

    @media (max-width: 480px) {
      .footer-top {
        grid-template-columns: 1fr;
        text-align: center;
      }
      .footer-brand {
        align-items: center;
      }
    }

    /* MOBILE RESPONSIVENESS */
    @media (max-width: 768px) {
      /* Hero */
      .hero-case {
        min-height: 60vh;
        padding: 40px 0;
      }
      .hero-content {
        padding: 0 20px;
      }
      /* Logo più grande */
      .hero-logo {
        height: auto;
        width: clamp(120px, 40vw, 200px);
        max-height: none;
        object-fit: contain;
      }
      .hero-logo-wrap {
        display: flex;
        justify-content: center;
        margin-bottom: 1rem;
      }
      .hero-title {
        font-size: 2em;
      }
      .hero-subtitle {
        font-size: 1em;
      }
      
      /* Hero Tags */
      .hero-tags {
        gap: 6px;
        margin-top: 20px;
      }
      .hero-tag {
        padding: 6px 12px;
        font-size: 0.65em;
      }
      
      /* Content Sections */
      .content-section {
        padding: 50px 0;
      }
      .section-inner {
        padding: 0 20px;
      }
      .section-label {
        font-size: 0.75em;
      }
      .section-title {
        font-size: 1.8em;
      }
      .section-desc {
        font-size: 0.95em;
      }

      /* ── REEL SECTION mobile ── */
      .reel-section { padding: 3rem 0; }
      .reel-inner {
        grid-template-columns: 1fr;
        gap: 2rem;
        text-align: center;
      }
      .reel-text {
        order: 1;
        align-items: center;
        text-align: center;
      }
      .reel-label { justify-content: center; }
      .reel-label::before { display: none; }
      .reel-title::after { margin-left: auto; margin-right: auto; }
      .reel-desc { text-align: center; max-width: 100%; }
      .reel-chips { justify-content: center; }
      .reel-visual {
        order: 2;          /* video SOTTO al testo */
        max-width: 90vw;
        width: 90vw;
        margin: 0 auto;
        overflow: visible;
      }
      .reel-carousel {
        overflow: visible;
        aspect-ratio: unset;
        height: calc(90vw * 0.62 * 16 / 9);
        max-height: 115vw;
      }
      .reel-slide { width: 62%; }
      .reel-slide[data-pos="next"] { transform: translate(12%, 0) scale(0.74); }
      .reel-slide[data-pos="prev"] { transform: translate(-112%, 0) scale(0.74); }

      /* ── ADV SECTION mobile ── */
      .adv-section {
        padding: 3rem 0;
        min-height: auto;
      }
      .adv-inner {
        grid-template-columns: 1fr;
        gap: 2rem;
        padding: 0 5%;
        text-align: center;
      }
      .adv-text {
        order: 1;          /* testo PRIMA */
        text-align: center;
        align-items: center;
      }
      .adv-label { justify-content: center; flex-direction: row; }
      .adv-label::before { display: none; }
      .adv-title { font-size: 1.8em; }
      .adv-title::after { margin-left: auto; margin-right: auto; }
      .adv-desc { font-size: 0.95em; margin: 0 auto; max-width: 100%; }
      .adv-chips { justify-content: center; }
      .adv-visual {
        order: 2;          /* video SOTTO */
        margin: 0 auto;
        max-width: 55vw;
        width: 55vw;
      }
      
      /* ── LEAD SECTION mobile ── */
      .lead-section { padding: 3rem 0; }
      .lead-inner {
        grid-template-columns: 1fr;
        gap: 2rem;
        text-align: center;
      }
      .lead-text {
        order: 1;          /* testo PRIMA */
        align-items: center;
        text-align: center;
      }
      .lead-label { justify-content: center; }
      .lead-label::before { display: none; }
      .lead-title::after { margin-left: auto; margin-right: auto; }
      .lead-desc { text-align: center; max-width: 100%; }
      .lead-chips { justify-content: center; }
      .lead-visual {
        order: 2;          /* immagine/video SOTTO */
        display: block;
        max-width: 100%;
        width: 100%;
        min-height: auto;
        aspect-ratio: 4/5;
        height: auto;
        margin: 0 auto;
      }
      .lead-video-item {
        width: 60vw;
        max-width: 240px;
        border-radius: 1rem;
        box-shadow: 0 8px 24px rgba(0,0,0,0.25);
      }

      /* Stats */
      .stats-section {
        padding: 40px 0;
      }
      .stats-intro {
        font-size: 0.9em;
        padding: 0 20px;
      }
      .stats-grid {
        padding: 0 20px;
        gap: 25px;
      }
      .stat-label {
        font-size: 0.85em;
      }
      .stat-value {
        font-size: 2em;
      }
      
      /* CTA */
      .cta-section {
        padding: 4rem 5% 4.5rem;
      }
      .cta-inner {
        padding: 0;
        gap: 1rem;
      }
      .cta-title {
        font-size: clamp(2em, 8vw, 2.6em);
      }
      .cta-actions { width: 100%; flex-direction: column; }
      .cta-btn { width: 100%; justify-content: center; }
      
      /* Images */
      .section-media img {
        max-width: 100%;
        border-radius: 10px;
      }
      .phone-mockup {
        max-width: 220px;
      }
      .section-media.stacked {
        min-height: 320px;
        padding: 10px;
      }
      .section-media.stacked img {
        max-width: 200px;
      }
    }

    @media (max-width: 480px) {
      .hero-case {
        min-height: 50vh;
      }
      .hero-title {
        font-size: 1.6em;
      }
      .section-title {
        font-size: 1.5em;
      }
      .adv-title {
        font-size: 1.5em;
      }
      .cta-title {
        font-size: 1.5em;
      }
    }

    /* ══════════════════════════════════════════════
       VIDEO NATIVI — stili globali per tutti i contesti
       Sostituiscono gli iframe BunnyCDN
       ══════════════════════════════════════════════ */

    /* Video che erano position:absolute con style inline */
    .reel-slide video,
    .adv-card video,
    .video-item video,
    .lead-video-item video,
    .reel-video-wrap video,
    .other-card video,
    .cs-hero-video video,
    .browser-video-wrap video {
      position: absolute;
      top: -4%; left: -4%;
      width: 108%; height: 108%;
      border: 0;
      pointer-events: none;
      object-fit: cover;
      display: block;
    }

    /* Video che erano position:absolute top:0 left:0 100%x100% */
    .hero-video-wrap video,
    .lavoro-card video,
    .showcase-video video,
    .cs-video-full video,
    .video-full video {
      position: absolute;
      top: 0; left: 0;
      width: 100%; height: 100%;
      border: 0;
      pointer-events: none;
      object-fit: cover;
      display: block;
    }

    /* Tutti i video: no controlli, no interazione */
    video[autoplay] {
      pointer-events: none;
    }