:root{
    --bg: #0b0c0e;
    --surface: #16181b;
    --surface-2: #1e2124;
    --line: #2c3034;
    --line-soft: #212427;
    --text: #f1efe8;
    --text-muted: #93969b;
    --text-dim: #64676c;
    --gold: #c9a227;
    --gold-bright: #e0bc3f;
    --gold-soft: rgba(201,162,39,.1);
    --red: #a8281c;
    --red-soft: rgba(168,40,28,.12);
    --radius: 8px;
    --maxw: 1160px;
    --display: 'Oswald', sans-serif;
    --body: 'IBM Plex Sans', sans-serif;
    --mono: 'JetBrains Mono', monospace;
  }

  *{ box-sizing:border-box; margin:0; padding:0; }
  html{ scroll-behavior:smooth; overflow-x:hidden; max-width:100%; }
  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  }

  body{
    background:var(--bg);
    color:var(--text);
    font-family:var(--body);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
    width:100%;
  }

  body::before{
    content:"";
    position:fixed; inset:0;
    background:
      repeating-linear-gradient(115deg, rgba(255,255,255,.012) 0px, rgba(255,255,255,.012) 1px, transparent 1px, transparent 68px);
    pointer-events:none;
    z-index:0;
  }

  img{ max-width:100%; display:block; }
  a{ color:inherit; text-decoration:none; }
  ul{ list-style:none; }

  .wrap{ max-width:var(--maxw); margin:0 auto; padding:0 28px; position:relative; z-index:1; }

  h1,h2,h3{ font-family:var(--display); font-weight:600; text-transform:uppercase; letter-spacing:.01em; line-height:1.08; }

  ::selection{ background:var(--gold); color:#161616; }

  :focus-visible{
    outline:2px solid var(--gold-bright);
    outline-offset:3px;
  }

  /* ---------- eyebrow / spec-plate ---------- */
  .plate{
    position:relative;
    display:inline-flex;
    align-items:center;
    gap:.55rem;
    padding:.5rem 1.15rem;
    border:1px solid var(--line);
    background:var(--surface);
    border-radius:var(--radius);
    font-family:var(--mono);
    font-size:.76rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--text-muted);
  }
  .plate::before, .plate::after{
    content:"";
    position:absolute;
    top:5px;
    width:3px; height:3px;
    border-radius:50%;
    background:var(--line);
  }
  .plate::before{ left:7px; }
  .plate::after{ right:7px; }
  .plate--gold{ border-color:rgba(201,162,39,.4); color:var(--gold-bright); background:var(--gold-soft); }
  .plate--gold::before, .plate--gold::after{ background:var(--gold); }
  .dot-live{
    width:6px; height:6px; border-radius:50%; background:var(--gold-bright);
    box-shadow:0 0 0 3px var(--gold-soft);
  }

  /* ---------- buttons ---------- */
  .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;
    padding:1rem 1.85rem;
    font-family:var(--mono);
    font-size:.86rem;
    font-weight:600;
    letter-spacing:.06em;
    text-transform:uppercase;
    border-radius:var(--radius);
    border:1px solid transparent;
    cursor:pointer;
    transition:transform .15s ease, border-color .15s ease, background .15s ease, color .15s ease;
    white-space:nowrap;
  }
  .btn:hover{ transform:translateY(-1px); }
  .btn-primary{ background:var(--gold); color:#161616; }
  .btn-primary:hover{ background:var(--gold-bright); }
  .btn-outline{ border-color:var(--line); color:var(--text); background:transparent; }
  .btn-outline:hover{ border-color:var(--gold); color:var(--gold-bright); }
  .btn-block{ width:100%; }

  /* Bottoni in cima all'hero — leggermente più grandi dei bottoni standard */
  .hero__ctas .btn{ font-size:.92rem; padding:1.05rem 2rem; }
  @media (max-width:600px){
    .hero__ctas .btn{ font-size:.85rem; padding:1rem 1.6rem; }
  }

  /* ---------- nav ---------- */
  .nav{
    position:sticky; top:0; z-index:50;
    background:rgba(11,12,14,.96);
    backdrop-filter:blur(12px);
    border-bottom:1px solid var(--line-soft);
    width:100%;
  }
  .nav__inner{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 28px; max-width:var(--maxw); margin:0 auto;
    gap:16px;
  }
  .nav__logo{ font-family:var(--display); font-size:1.15rem; letter-spacing:.03em; text-transform:uppercase; flex-shrink:0; }
  .nav__logo span{ color:var(--gold); }

  /* Link desktop: riga orizzontale */
  .nav__links{
    display:flex; align-items:center; gap:24px; flex:1; justify-content:center;
  }
  .nav__links a{
    font-family:var(--mono); font-size:.74rem; letter-spacing:.09em; text-transform:uppercase;
    color:var(--text-muted); transition:color .15s ease; white-space:nowrap;
  }
  .nav__links a:hover{ color:var(--text); }

  .nav__cta{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
  .nav__cta .btn-primary{ padding:.7rem 1.3rem; font-size:.76rem; }

  /* Hamburger: rimosso — non esiste più */
  .nav__burger{ display:none !important; }

  /* ---------- nav TABLET (881px → 1080px): comprimi i gap ---------- */
  @media (max-width:1080px) and (min-width:601px){
    .nav__links{ gap:14px; }
    .nav__links a{ font-size:.68rem; }
  }

  /* ---------- nav MOBILE (≤600px): logo + bottone CTA, link su riga sotto ---------- */
  @media (max-width:600px){
    .nav__inner{ flex-wrap:wrap; padding:12px 16px 0; gap:0; }

    /* Riga 1: logo a sinistra, bottone CTA a destra */
    .nav__logo{ font-size:1rem; padding-bottom:12px; }
    .nav__cta{ padding-bottom:12px; }
    .nav__cta .btn-primary{ padding:.55rem .9rem; font-size:.68rem; }

    /* Riga 2: link scrollabili orizzontalmente, sfondo opaco solido */
    .nav__links{
      order:3; width:100%;
      justify-content:flex-start; gap:0;
      overflow-x:auto; -webkit-overflow-scrolling:touch;
      scrollbar-width:none; border-top:1px solid var(--line-soft);
      background:rgba(11,12,14,1);
      padding:0;
    }
    .nav__links::-webkit-scrollbar{ display:none; }
    .nav__links a{
      flex-shrink:0; font-size:.72rem; letter-spacing:.06em;
      color:var(--text);            /* testo SEMPRE visibile, non trasparente */
      padding:12px 14px;
      border-right:1px solid var(--line-soft);
      opacity:1 !important;         /* forza opacità piena */
    }
    .nav__links a:last-child{ border-right:none; }
    .nav__links a:hover{ color:var(--gold-bright); }

    /* Selettore lingua — resta visibile su mobile */
    .lang-switch{ flex-shrink:0; }
  }

  /* ---------- hero ---------- */
  .hero{
    position:relative;
    padding:80px 0 130px;
    clip-path:polygon(0 0, 100% 0, 100% calc(100% - 34px), 0 100%);
    background:
      radial-gradient(ellipse 900px 480px at 82% -10%, rgba(201,162,39,.16), transparent 60%),
      radial-gradient(ellipse 700px 500px at -10% 90%, rgba(168,40,28,.08), transparent 60%),
      var(--bg);
  }
  .hero__inner{ max-width:790px; }
  .hero h1{
    font-size:clamp(2.1rem, 4.6vw, 3.4rem);
    margin-top:22px;
    color:var(--text);
  }
  .hero .accent-line{
    display:block;
    font-size:clamp(2.3rem, 5vw, 3.7rem);
    color:var(--gold-bright);
    margin-top:6px;
  }
  .hero__sub{
    font-family:var(--body);
    font-size:1.06rem;
    color:var(--text-muted);
    max-width:560px;
    margin-top:24px;
    line-height:1.7;
  }
  .hero__ctas{ display:flex; flex-wrap:wrap; gap:14px; margin-top:38px; }
  .hero__micro{
    margin-top:22px;
    font-family:var(--mono);
    font-size:.80rem;
    letter-spacing:.05em;
    color:var(--text-dim);
    display:flex; align-items:center; gap:8px;
  }

  /* ---------- section basics ---------- */
  section{ position:relative; padding:96px 0; }
  .section__head{ max-width:640px; margin-bottom:56px; }
  .section__head h2{ font-size:clamp(1.6rem, 3vw, 2.3rem); margin-top:16px; }
  .section__head p{ color:var(--text-muted); margin-top:14px; font-size:1.05rem; }
  .section-alt{ background:var(--surface); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); }

  /* ---------- pillars ---------- */
  .pillars{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); }
  .pillar{ background:var(--bg); padding:38px 34px; }
  .pillar__num{ font-family:var(--mono); font-size:.72rem; letter-spacing:.14em; color:var(--gold); }
  .pillar h3{ font-size:1.25rem; margin-top:14px; }
  .pillar p{ color:var(--text-muted); margin-top:12px; font-size:1.02rem; }
  .pillar p + p{ margin-top:10px; }
  .pillar strong{ color:var(--text); font-weight:600; }
  @media (max-width:760px){ .pillars{ grid-template-columns:1fr; } }

  /* ---------- audience split ---------- */
  .audience{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
  .audience__col{ background:var(--surface-2); padding:36px 34px; }
  .audience__col--alt{ background:#191c1e; }
  .audience__label{ font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); }
  .audience__col--alt .audience__label{ color:var(--gold-bright); }
  .audience__col h3{ font-size:1.3rem; margin-top:10px; }
  .audience__col ul{ margin-top:22px; display:flex; flex-direction:column; gap:14px; }
  .audience__col li{ display:flex; gap:12px; font-size:1rem; color:var(--text-muted); }
  .audience__col li::before{ content:"—"; color:var(--gold); flex-shrink:0; }
  @media (max-width:760px){ .audience{ grid-template-columns:1fr; } }

  /* ---------- comparison table ---------- */
  .table-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); }
  table{ width:100%; border-collapse:collapse; font-size:1.02rem; }
  thead th{
    font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
    text-align:left; padding:18px 22px; color:var(--text-dim); background:var(--surface); border-bottom:1px solid var(--line);
  }
  thead th:not(:first-child){ text-align:center; }
  thead th.col-win{ color:var(--gold-bright); }
  tbody td{ padding:20px 22px; border-bottom:1px solid var(--line-soft); vertical-align:top; }
  tbody tr:last-child td{ border-bottom:none; }
  tbody td:first-child{ color:var(--text-muted); font-size:.88rem; }
  tbody td:not(:first-child){ text-align:center; font-family:var(--mono); font-size:.96rem; font-weight:700; }
  td.no{ color:#ff4433; }
  td.no::before{ content:"✕  "; }
  td.yes{ color:#ffd23f; }
  td.yes::before{ content:"✓  "; }

  /* ---------- social proof ---------- */
  .quotes{ display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-bottom:48px; }
  .quote{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:30px 30px 26px; }
  .quote__mark{ font-family:var(--display); font-size:2.6rem; color:var(--gold); line-height:.6; display:block; margin-bottom:10px; }
  .quote p{ font-size:1.04rem; color:var(--text); }
  .quote__who{ display:flex; align-items:center; gap:12px; margin-top:22px; }
  .quote__avatar{
    width:38px; height:38px; border-radius:50%; background:var(--gold-soft); border:1px solid rgba(201,162,39,.4);
    display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:.78rem; color:var(--gold-bright);
    flex-shrink:0;
  }
  .quote__name{ font-size:.86rem; font-weight:600; }
  .quote__role{ font-size:.78rem; color:var(--text-dim); }
  @media (max-width:760px){ .quotes{ grid-template-columns:1fr; } }

  .slots{ display:grid; grid-template-columns:repeat(6,1fr); gap:12px; }
  .slot{
    aspect-ratio:1; border:1px dashed var(--line); border-radius:var(--radius);
    display:flex; align-items:center; justify-content:center; color:var(--text-muted);
    font-family:var(--mono); font-size:.66rem; text-align:center; letter-spacing:.04em; padding:8px;
  }
  .slot--cta{ border-style:solid; border-color:var(--gold); color:var(--gold-bright); cursor:pointer; transition:background .15s ease; }
  .slot--cta:hover{ background:var(--gold-soft); }
  .slot--filled{ border-style:solid; border-color:var(--gold); background:var(--gold-soft); color:var(--gold-bright); font-weight:700; }
  /* Container dello slot */
.slot {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px; /* Riduce il padding interno per lasciare più spazio al logo */
  overflow: hidden;
}

/* Gestione avanzata dei loghi */
.slot img {
  width: 100%;
  height: 100%;
  max-width: 85%;   /* Fa occupare gran parte della larghezza */
  max-height: 85%;  /* Fa occupare gran parte dell'altezza */
  object-fit: contain; /* Mantiene le proporzioni senza sgranare */
  display: block;
}
  @media (max-width:760px){ .slots{ grid-template-columns:repeat(3,1fr); } }

  

  /* ---------- form ---------- */
  .form-panel{
    max-width:680px; margin:0 auto; background:var(--surface);
    border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  }
  .form-panel__head{ padding:26px 34px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
  .form-panel__head h3{ font-size:1.05rem; letter-spacing:.06em; }
  .form-panel__body{ padding:34px; }
  .field{ margin-bottom:22px; }
  .field label{ display:block; font-family:var(--mono); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text); margin-bottom:9px; }
  .field input{
    width:100%; background:var(--bg); border:1.5px solid var(--line); border-radius:var(--radius);
    padding:15px 16px; color:var(--text); font-family:var(--body); font-size:1.05rem;
    transition:border-color .15s ease;
  }
  .field input:focus{ border-color:var(--gold); outline:none; }
  .field input::placeholder{ color:var(--text-muted); }
  .radio-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
  .radio-card{
    border:1.5px solid var(--line); border-radius:var(--radius); padding:15px 17px;
    font-size:.95rem; color:var(--text); cursor:pointer; position:relative;
    transition:border-color .15s ease, color .15s ease, background .15s ease;
  }
  .radio-card input{ position:absolute; opacity:0; }
  .radio-card:has(input:checked){ border-color:var(--gold); color:var(--text); background:var(--gold-soft); }
  .radio-card:has(input:focus-visible){ outline:2px solid var(--gold-bright); outline-offset:2px; }
  @media (max-width:600px){ .radio-grid{ grid-template-columns:1fr; } }
  .form-note{ font-family:var(--mono); font-size:.78rem; color:var(--text-muted); margin-top:16px; text-align:center; }
  .skip-to-call{
    display:block; margin-top:18px; font-family:var(--body); font-size:.9rem; color:var(--text-muted);
  }
  .skip-to-call a{ color:var(--gold-bright); text-decoration:underline; text-underline-offset:2px; }
  .skip-to-call a:hover{ color:var(--gold); }
  .consent-check{
    display:flex; align-items:flex-start; gap:10px;
    font-family:var(--body); font-size:.92rem; color:var(--text);
    margin:20px 0 4px; cursor:pointer; line-height:1.5;
  }
  .consent-check input{ margin-top:4px; flex-shrink:0; accent-color:var(--gold); width:18px; height:18px; cursor:pointer; }
  .consent-check a{ color:var(--gold-bright); text-decoration:underline; text-underline-offset:2px; }
  .form-success{ display:none; padding:34px; text-align:center; }
  .form-success.is-visible{ display:block; }
  .form-success h4{ font-family:var(--display); text-transform:uppercase; font-size:1.2rem; color:var(--gold-bright); }
  .form-success p{ color:var(--text-muted); margin-top:10px; font-size:.94rem; }

  /* ---------- faq ---------- */
  .faq-list{ max-width:760px; }
  details{ border-bottom:1px solid var(--line-soft); padding:22px 0; }
  details:first-child{ border-top:1px solid var(--line-soft); }
  summary{
    cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:20px;
    font-family:var(--display); font-size:1rem; text-transform:none; letter-spacing:.01em; font-weight:500;
  }
  summary::-webkit-details-marker{ display:none; }
  summary .idx{ font-family:var(--mono); color:var(--gold); font-size:.78rem; margin-right:14px; }
  summary::after{
    content:"+"; font-family:var(--mono); color:var(--text-muted); font-size:1.3rem; flex-shrink:0; transition:transform .2s ease;
  }
  details[open] summary::after{ transform:rotate(45deg); color:var(--gold-bright); }
  details p{ color:var(--text-muted); margin-top:14px; font-size:1.01rem; max-width:640px; }

  /* ---------- footer ---------- */
  footer{ border-top:1px solid var(--line-soft); padding:50px 0 34px; }
  .footer__inner{ display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:24px; }
  .footer__logo{ font-family:var(--display); text-transform:uppercase; font-size:1.1rem; }
  .footer__logo span{ color:var(--gold); }
  .footer__tag{ font-family:var(--mono); font-size:.72rem; color:var(--text-dim); margin-top:8px; }
  .footer__links{ display:flex; gap:26px; flex-wrap:wrap; font-family:var(--mono); font-size:.72rem; letter-spacing:.06em; color:var(--text-muted); }
  .footer__links a:hover{ color:var(--gold-bright); }
  .footer__bottom{ margin-top:36px; padding-top:20px; border-top:1px solid var(--line-soft); font-family:var(--mono); font-size:.68rem; color:var(--text-dim); }

  .cite{ font-size:.72rem; color:var(--text-dim); text-align:center; margin-top:14px; }

  /* ---------- stats bar (placeholder — sostituire con numeri reali) ---------- */
  /* ==========================================================================
   STATS BAR & CONTATORI ANIMATI
   ========================================================================== */
.stats-bar {
  background: var(--surface);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 40px 0;
}

.stats-bar__title {
  text-align: center;
  margin-bottom: 28px;
}

.stats-bar__title h2 {
  font-family: var(--display);
  font-size: 1.5rem;
  color: var(--text);
  margin-top: 8px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.stats-bar__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 16px;
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  transition: transform 0.25s ease, border-color 0.25s ease;
}

.stat:hover {
  border-color: var(--gold);
  transform: translateY(-2px);
}

.stat__num {
  font-family: var(--display);
  font-size: 2.8rem;
  font-weight: 700;
  color: var(--gold-bright);
  line-height: 1;
  margin-bottom: 8px;
}

.stat__label {
  font-family: var(--mono);
  font-size: 0.84rem;
  color: var(--text-muted);
  line-height: 1.4;
  text-transform: uppercase;
  letter-spacing: .03em;
}

@media (max-width: 760px) {
  .stats-bar__grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .stats-bar__title h2 {
    font-size: 1.2rem;
  }
  .stat__num {
    font-size: 2.2rem;
  }
}

  /* ---------- legal pages ---------- */
  .legal{ max-width:760px; margin:0 auto; padding:70px 0 100px; }
  .legal__updated{ font-family:var(--mono); font-size:.72rem; letter-spacing:.06em; color:var(--text-dim); margin-top:16px; }
  .legal h1{ font-size:clamp(1.7rem, 3.4vw, 2.3rem); }
  .legal h2{ font-family:var(--display); font-size:1.15rem; text-transform:none; letter-spacing:.01em; color:var(--gold-bright); margin-top:44px; margin-bottom:14px; }
  .legal h2:first-of-type{ margin-top:36px; }
  .legal p{ color:var(--text-muted); font-size:1.02rem; margin-top:12px; }
  .legal ul{ margin-top:14px; display:flex; flex-direction:column; gap:10px; }
  .legal li{ color:var(--text-muted); font-size:1.01rem; padding-left:18px; position:relative; }
  .legal li::before{ content:"—"; color:var(--gold); position:absolute; left:0; }
  .legal a{ color:var(--gold-bright); text-decoration:underline; text-underline-offset:2px; }
  .legal strong{ color:var(--text); }
  .legal .table-wrap{ margin-top:16px; }
  .legal table{ min-width:100%; font-size:.85rem; }
  .legal thead th{ text-align:left; }
  .legal thead th:not(:first-child){ text-align:left; }
  .legal tbody td{ text-align:left; font-family:var(--body); color:var(--text-muted); }
  .legal tbody td:first-child{ font-family:var(--mono); font-size:.78rem; color:var(--text); }
  .back-link{ display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:.74rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); margin-bottom:28px; }
  .back-link:hover{ color:var(--gold-bright); }

  /* ---------- language switcher ---------- */
.lang-switch{ display:flex; align-items:center; gap:4px; font-family:var(--mono); font-size:.72rem; }
.lang-btn{ padding:4px 8px; border:1px solid var(--line); border-radius:var(--radius); color:var(--text-muted); transition:all .15s ease; }
.lang-btn.active, .lang-btn:hover{ border-color:var(--gold); color:var(--gold-bright); background:var(--gold-soft); }

/* ==========================================================================
   OTTIMIZZAZIONI SMARTPHONE & TABLET (AGGIUNTE RICHIESTE)
   ========================================================================== */

/* 1. Nascondi pulsante Academy sulla navbar da smartphone */
@media (max-width: 600px) {
  .hide-mobile {
    display: none !important;
  }
}

/* 2. Miglioramento visibilità Tabella di Confronto per Tablet e Smartphone */
@media (max-width: 880px) {
  /* Riduciamo i padding e i font per far entrare meglio i contenuti senza scroll eccessivo */
  table {
    font-size: 0.9rem;
  }
  thead th {
    padding: 12px 8px;
    font-size: 0.65rem;
  }
  tbody td {
    padding: 14px 10px;
  }
  tbody td:first-child {
    font-size: 0.75rem;
  }
  tbody td:not(:first-child) {
    font-size: 0.85rem;
  }

  /* Evidenziamo maggiormente la colonna "Sistema TurboDetail" per guidare l'occhio */
  thead th.col-win {
    background: var(--gold-soft);
    border-bottom: 1px solid var(--gold);
  }
  tbody td:nth-child(3) {
    background: rgba(201, 162, 39, 0.03); /* Leggero sfondo per staccare la colonna vincente */
  }

  /* Su smartphone molto piccoli aggiungiamo un'ombra interna per suggerire che è possibile scorrere lateralmente */
  .table-wrap {
    box-shadow: inset -12px 0 12px -12px rgba(201, 162, 39, 0.3);
  }
}
/* risolve problema navbar su smartphone */
@media (max-width: 600px) {
  .nav__links {
    display: none !important;
  }
}
