  /* =========================
     TB GYMS (scoped)
     ========================= */
  .tb-gyms{
    padding: 4.2rem 2rem;
    background:
      radial-gradient(1200px 320px at 10% -90px, rgba(11,60,136,.22), transparent 60%),
      radial-gradient(1000px 300px at 85% -40px, rgba(255,122,0,.22), transparent 58%),
      #f1f5f9;
  }

  .tb-gyms__header{
    max-width: 980px;
    margin: 0 auto 2.2rem;
    text-align: center;
  }

  .tb-gyms__title{
    font-size: clamp(2.1rem, 3.6vw, 2.8rem);
    margin: 0 0 .55rem;
    color: #0b3c88;
    font-weight: 1000;
    letter-spacing: -.03em;
  }

  .tb-gyms__subtitle{
    max-width: 760px;
    margin: 0 auto 1.2rem;
    opacity: .88;
    color: #FCFCFC;
    font-size: 1.06rem;
  }

  /* Toggle */
  .tb-gyms__toggle{
    display: inline-flex;
    background: rgba(255,255,255,.85);
    border: 1px solid rgba(15,23,42,.10);
    border-radius: 999px;
    overflow: hidden;
    box-shadow: 0 18px 45px rgba(0,0,0,.08);
  }

  .tb-toggle-btn{
    border: 0;
    background: transparent;
    padding: .65rem 1.1rem;
    font-weight: 1000;
    color: rgba(15,23,42,.8);
    cursor: pointer;
    transition: background .2s ease, color .2s ease;
  }

  .tb-toggle-btn.active{
    background: rgba(11,60,136,.92);
    color: #fff;
  }

  /* Grid */
  .tb-gyms__grid{
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    gap: 1.6rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  @media (max-width: 1050px){
    .tb-gyms__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (max-width: 680px){
    .tb-gyms{ padding: 3.2rem 1.2rem; }
    .tb-gyms__grid{ grid-template-columns: 1fr; }
  }

  /* Card */
  .tb-gym{
    background: #fff;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 22px 70px rgba(0,0,0,.10);
    transition: transform .35s ease, box-shadow .35s ease;
    position: relative;
    isolation: isolate;
  }

  .tb-gym:hover{
    transform: translateY(-10px);
    box-shadow: 0 40px 110px rgba(0,0,0,.18);
  }

  .tb-gym__media{
    height: 190px;
    position: relative;
    overflow: hidden;
    background: #e2e8f0;
  }

  .tb-gym__media img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.03);
    transition: transform .8s ease;
  }

  .tb-gym:hover .tb-gym__media img{ transform: scale(1.12); }

  .tb-gym__overlay{
    position: absolute;
    inset: 0;
    background:
      radial-gradient(900px 220px at 20% 0, rgba(255,122,0,.28), transparent 55%),
      linear-gradient(to top, rgba(15,23,42,.78), rgba(15,23,42,0));
    pointer-events: none;
  }

  .tb-pin{
    position: absolute;
    top: 14px;
    left: 14px;
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    padding: .5rem .85rem;
    border-radius: 999px;
    font-weight: 1000;
    font-size: .82rem;
    color: #fff;
    background: rgba(11,60,136,.92);
    box-shadow: 0 10px 25px rgba(0,0,0,.22);
    backdrop-filter: blur(8px);
  }

  .tb-pin::before{
    content:"📍";
    filter: drop-shadow(0 8px 18px rgba(0,0,0,.2));
  }

  .tb-gym__body{
    padding: 1.15rem 1.25rem 1.35rem;
  }

  .tb-gym__title{
    margin: 0 0 .6rem;
    color: #0b3c88;
    font-size: 1.22rem;
    font-weight: 1000;
    letter-spacing: -.02em;
  }

  .tb-gym__meta{
    display: grid;
    gap: .55rem;
    margin-bottom: 1rem;
    color: rgba(15,23,42,.86);
    font-size: .97rem;
    line-height: 1.55;
  }

  .tb-gym__row{
    display: flex;
    gap: .6rem;
    align-items: flex-start;
  }
  .tb-gym__row.addr::before{ content:"🧭"; }
  .tb-gym__row.note::before{ content:"🏀"; }

  .tb-gym__actions{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    flex-wrap: wrap;
  }

  .tb-gym__btn{
    display:inline-flex;
    align-items:center;
    gap:.55rem;
    padding:.7rem 1rem;
    border-radius: 16px;
    font-weight: 1000;
    text-decoration:none;
    color:#fff;
    background: linear-gradient(135deg, rgba(11,60,136,.96), rgba(11,60,136,.82));
    box-shadow: 0 14px 35px rgba(0,0,0,.16);
    transition: transform .2s ease, filter .2s ease;
    cursor: pointer;
    border: 0;
  }

  .tb-gym__btn:hover{
    transform: translateY(-2px);
    filter: brightness(1.05);
  }
  .tb-gym__btn::after{ content:"→"; font-weight: 1000; }

  .tb-gym__link{
    display:inline-flex;
    align-items:center;
    gap:.45rem;
    font-weight: 1000;
    color: rgba(11,60,136,.95);
    text-decoration:none;
    border-bottom: 2px solid rgba(255,122,0,.35);
    padding-bottom: 2px;
  }
  .tb-gym__link::before{ content:"🗺️"; }
  .tb-gym__link:hover{ border-bottom-color: rgba(255,122,0,.9); }

  /* Mappa */
  .tb-gyms__mapWrap{
    max-width: 1200px;
    margin: 1.2rem auto 0;
  }

  .tb-gyms__mapCard{
    background: #fff;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 22px 70px rgba(0,0,0,.10);
  }

  .tb-gyms__mapTop{
    padding: 1.1rem 1.2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: linear-gradient(120deg, rgba(11,60,136,.08), rgba(255,122,0,.10));
    border-bottom: 1px solid rgba(15,23,42,.08);
    flex-wrap: wrap;
  }

  .tb-gyms__mapTitle{
    font-weight: 1000;
    color: #0b3c88;
    font-size: 1.1rem;
  }

  .tb-gyms__mapMeta{
    opacity: .75;
    margin-top: .2rem;
  }

  .tb-gyms__mapLink{
    display:inline-flex;
    align-items:center;
    gap:.55rem;
    padding:.65rem .95rem;
    border-radius: 16px;
    font-weight: 1000;
    text-decoration:none;
    color:#fff;
    background: rgba(11,60,136,.92);
    box-shadow: 0 14px 35px rgba(0,0,0,.16);
  }
  .tb-gyms__mapLink::before{ content:"🗺️"; }
  .tb-gyms__mapLink:hover{ background: rgba(255,122,0,.95); }

  .tb-gyms__iframeWrap{
    height: 420px;
    background: #e2e8f0;
  }
  .tb-gyms__iframeWrap iframe{
    width: 100%;
    height: 100%;
    border: 0;
  }

  .tb-gyms__mapHint{
    padding: .9rem 1.2rem 1.1rem;
    opacity: .75;
    font-size: .95rem;
  }
    /* =========================
     Tobia Basket - NEWS (scoped)
     ========================= */

  .tb-news{
    padding: 4rem 2rem;
    background:
      radial-gradient(1200px 300px at 50% -80px, rgba(255,122,0,.25), transparent 60%),
      radial-gradient(900px 260px at 10% 0, rgba(11,60,136,.22), transparent 55%),
      #f1f5f9;
  }

  .tb-news__header{
    max-width: 980px;
    margin: 0 auto 2.5rem;
    text-align: center;
  }

  .tb-news__title{
    font-size: clamp(2rem, 3.5vw, 2.6rem);
    letter-spacing: -.02em;
    margin: 0 0 .6rem;
    color: #0b3c88; /* blue */
    font-weight: 900;
  }

  .tb-news__subtitle{
    margin: 0 auto;
    max-width: 760px;
    opacity: .82;
    font-size: 1.05rem;
    color: #0f172a;
  }

.tb-news__grid{
  max-width: 1200px;
  margin: 0 auto;

  /* da grid → scroll orizzontale */
  display: flex;
  gap: 1.6rem;
  overflow-x: auto;
  padding: .25rem .15rem 1.25rem;

  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;

  /* miglior esperienza touch */
  -webkit-overflow-scrolling: touch;
}

/* scrollbar elegante (non cambia le card) */
.tb-news__grid::-webkit-scrollbar{
  height: 8px;
}
.tb-news__grid::-webkit-scrollbar-thumb{
  background: rgba(255,122,0,.85);
  border-radius: 999px;
}
.tb-news__grid::-webkit-scrollbar-track{
  background: rgba(15,23,42,.08);
  border-radius: 999px;
}

/* le card diventano "slide" mantenendo estetica identica */
.tb-news__grid .tb-card{
  flex: 0 0 380px;          /* larghezza card desktop */
  scroll-snap-align: start; /* snap preciso */
}

@media (max-width: 1050px){
  .tb-news__grid .tb-card{ flex-basis: 340px; }
}
@media (max-width: 680px){
  .tb-news{ padding: 3rem 1.2rem; }
  .tb-news__grid .tb-card{ flex-basis: 88vw; } /* 1 card grande su mobile */
}



  .tb-card{
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 55px rgba(0,0,0,.10);
    transition: transform .35s ease, box-shadow .35s ease;
    cursor: pointer;
    outline: none;
    position: relative;
  }

  .tb-card:hover{
    transform: translateY(-10px);
    box-shadow: 0 30px 80px rgba(0,0,0,.18);
  }

  .tb-card:focus-visible{
    box-shadow: 0 0 0 4px rgba(255,122,0,.35), 0 30px 80px rgba(0,0,0,.18);
  }

  .tb-card__media{
    height: 190px;
    position: relative;
    overflow: hidden;
    background: #e2e8f0;
  }

  .tb-card__media img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.02);
    transition: transform .6s ease;
  }

  .tb-card:hover .tb-card__media img{
    transform: scale(1.08);
  }

  .tb-card__overlay{
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(15,23,42,.65), rgba(15,23,42,0));
    pointer-events: none;
  }

  .tb-card__badge{
    position: absolute;
    top: 14px;
    left: 14px;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .45rem .75rem;
    border-radius: 999px;
    font-weight: 800;
    font-size: .82rem;
    color: #fff;
    background: rgba(11,60,136,.92);
    backdrop-filter: blur(6px);
    box-shadow: 0 10px 25px rgba(0,0,0,.18);
  }

  .tb-card__badge::before{
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: #ff7a00;
    box-shadow: 0 0 0 4px rgba(255,122,0,.25);
  }

  .tb-card__body{
    padding: 1.1rem 1.2rem 1.3rem;
  }

  .tb-card__meta{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .55rem;
    color: rgba(15,23,42,.75);
    font-size: .9rem;
  }

  .tb-card__date{
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    white-space: nowrap;
  }
  .tb-card__date::before{
    content: "🗓️";
  }

  .tb-card__tag{
    display: inline-flex;
    align-items: center;
    padding: .35rem .6rem;
    border-radius: 999px;
    background: rgba(255,122,0,.12);
    color: #b45309;
    font-weight: 800;
    font-size: .82rem;
    white-space: nowrap;
  }

  .tb-card__title{
    margin: 0 0 .55rem;
    color: #0b3c88;
    font-size: 1.12rem;
    line-height: 1.25;
    font-weight: 900;
    letter-spacing: -.01em;
  }

  .tb-card__excerpt{
    margin: 0;
    color: rgba(15,23,42,.88);
    font-size: .98rem;
    line-height: 1.6;
  }

  /* =========================
     Modal
     ========================= */
  .tb-modal{
    position: fixed;
    inset: 0;
    display: none;
    z-index: 3000;
  }
  .tb-modal.open{ display: block; }

  .tb-modal__overlay{
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.65);
    backdrop-filter: blur(6px);
  }

  .tb-modal__dialog{
    position: relative;
    max-width: 980px;
    width: calc(100% - 2rem);
    margin: 4vh auto;
    background: #fff;
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 40px 110px rgba(0,0,0,.35);
    transform: translateY(16px);
    opacity: 0;
    animation: tbModalIn .25s ease forwards;
  }

  @keyframes tbModalIn{
    to { transform: translateY(0); opacity: 1; }
  }

  .tb-modal__close{
    position: absolute;
    top: 12px;
    right: 12px;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: 0;
    cursor: pointer;
    color: #fff;
    font-size: 18px;
    background: rgba(15,23,42,.62);
    backdrop-filter: blur(6px);
    z-index: 2;
    transition: background .2s ease;
  }
  .tb-modal__close:hover{ background: rgba(15,23,42,.80); }

  .tb-modal__media{
    height: 340px;
    background: #e2e8f0;
  }
  .tb-modal__media img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  @media (max-width: 720px){
    .tb-modal__dialog{ margin: 2vh auto; }
    .tb-modal__media{ height: 220px; }
  }

  .tb-modal__content{
    padding: 1.4rem 1.6rem 1.8rem;
  }

  .tb-modal__meta{
    display: flex;
    flex-wrap: wrap;
    gap: .6rem .8rem;
    align-items: center;
    margin-bottom: .45rem;
    color: rgba(15,23,42,.7);
    font-size: .95rem;
  }

  .tb-modal__date::before{ content:"🗓️ "; }

  .tb-modal__tag{
    display: inline-flex;
    align-items: center;
    padding: .35rem .65rem;
    border-radius: 999px;
    background: rgba(11,60,136,.10);
    color: #0b3c88;
    font-weight: 900;
    font-size: .85rem;
  }

  .tb-modal__title{
    margin: .2rem 0 1rem;
    color: #0b3c88;
    font-weight: 1000;
    letter-spacing: -.02em;
    font-size: 1.6rem;
    line-height: 1.2;
  }

  .tb-modal__body{
    color: rgba(15,23,42,.92);
    font-size: 1.02rem;
    line-height: 1.75;
  }

  .tb-modal__body p{ margin: .8rem 0; }
  .tb-modal__body ul{ margin: .8rem 0 .8rem 1.2rem; }
  .tb-modal__body li{ margin: .35rem 0; }

  /* Minor polish: links in modal */
  .tb-modal__body a{
    color: #0b3c88;
    font-weight: 800;
    text-decoration: none;
    border-bottom: 2px solid rgba(255,122,0,.35);
  }
  .tb-modal__body a:hover{
    border-bottom-color: rgba(255,122,0,.9);
  }
    /* =========================
     TB BLU (scoped)
     ========================= */
  .tb-blu{
    padding: 4.2rem 2rem;
    background:
      radial-gradient(1200px 320px at 10% -90px, rgba(11,60,136,.22), transparent 60%),
      radial-gradient(1000px 300px at 85% -40px, rgba(255,122,0,.22), transparent 58%),
      #0100A3;
  }

  .tb-blu__header{
    max-width: 980px;
    margin: 0 auto 2.2rem;
    text-align: center;
  }

  .tb-blu__title{
    font-size: clamp(2.1rem, 3.6vw, 2.8rem);
    margin: 0 0 .55rem;
    color: #E86200;
    font-weight: 1000;
    letter-spacing: -.03em;
  }

  .tb-blu__subtitle{
    max-width: 760px;
    margin: 0 auto 1.2rem;
    opacity: .88;
    color: #FCFCFC;
    font-size: 1.06rem;
  }
     /* =========================
     TB ARANCIO (scoped)
     ========================= */
  .tb-arancio{
    padding: 4.2rem 2rem;
    background:
      radial-gradient(1200px 320px at 10% -90px, rgba(11,60,136,.22), transparent 60%),
      radial-gradient(1000px 300px at 85% -40px, rgba(255,122,0,.22), transparent 58%),
      #E6710E;
  }

  .tb-arancio__header{
    max-width: 980px;
    margin: 0 auto 2.2rem;
    text-align: center;
  }

  .tb-arancio__title{
    font-size: clamp(2.1rem, 3.6vw, 2.8rem);
    margin: 0 0 .55rem;
    color: #0b3c88;
    font-weight: 1000;
    letter-spacing: -.03em;
  }

  .tb-arancio__subtitle{
    max-width: 760px;
    margin: 0 auto 1.2rem;
    opacity: .88;
    color: #FCFCFC;
    font-size: 1.06rem;
  }
       /* =========================
     TB BIANCO (scoped)
     ========================= */
    .tb-bianco{
    padding: 4rem 2rem;
    background:
      radial-gradient(1200px 300px at 50% -80px, rgba(255,122,0,.25), transparent 60%),
      radial-gradient(900px 260px at 10% 0, rgba(11,60,136,.22), transparent 55%),
      #f1f5f9;
  }

  .tb-bianco__header{
    max-width: 980px;
    margin: 0 auto 2.5rem;
    text-align: center;
  }

  .tb-bianco__title{
    font-size: clamp(2rem, 3.5vw, 2.6rem);
    letter-spacing: -.02em;
    margin: 0 0 .6rem;
    color: #0b3c88; /* blue */
    font-weight: 900;
  }

  .tb-bianco__subtitle{
    margin: 0 auto;
    max-width: 760px;
    opacity: .82;
    font-size: 1.05rem;
    color: #0f172a;
  }
    /* =========================
     TOBIA FOOTER (scoped)
     ========================= */
  .tb-footer{
    color: #fff;
    background:
      radial-gradient(1200px 340px at 10% -140px, rgba(255,122,0,.25), transparent 60%),
      radial-gradient(900px 280px at 85% -120px, rgba(255,255,255,.12), transparent 58%),
      linear-gradient(180deg, rgba(11,60,136,.98), rgba(11,60,136,.92));
    position: relative;
    overflow: hidden;
  }

  /* dettaglio diagonale */
  .tb-footer::before{
    content:"";
    position:absolute;
    inset:-120px -120px auto -120px;
    height: 220px;
    background: linear-gradient(135deg, rgba(255,122,0,.26), rgba(255,255,255,0));
    transform: rotate(-6deg);
    pointer-events:none;
  }

  .tb-footer__top{
    padding: 3.2rem 1.2rem 2.2rem;
  }

  .tb-footer__container{
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr 1fr;
    gap: 1.8rem;
  }

  @media (max-width: 980px){
    .tb-footer__container{
      grid-template-columns: 1fr 1fr;
    }
  }

  @media (max-width: 640px){
    .tb-footer__container{
      grid-template-columns: 1fr;
      gap: 1.2rem;
    }
  }

  /* BRAND */
  .tb-footer__brand{
    display: flex;
    gap: 1rem;
    align-items: flex-start;
  }

  .tb-footer__logo{
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.16);
    backdrop-filter: blur(10px);
    box-shadow: 0 18px 45px rgba(0,0,0,.18);
    position: relative;
    overflow: hidden;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
  }

  .tb-footer__ball{
    position:absolute;
    width: 140%;
    height: 140%;
    border-radius: 999px;
    background: radial-gradient(circle at 30% 30%, rgba(255,122,0,.95), rgba(255,122,0,.2));
    opacity: .6;
    transform: translate(-20%, -20%);
    filter: blur(0px);
  }

  .tb-footer__mark{
    position: relative;
    font-weight: 1000;
    letter-spacing: -.02em;
    font-size: 1.05rem;
  }

  .tb-footer__name{
    margin: 0 0 .25rem;
    font-weight: 1000;
    font-size: 1.25rem;
    letter-spacing: -.02em;
  }

  .tb-footer__tagline{
    margin: 0 0 .8rem;
    opacity: .9;
    color: rgba(255,255,255,.92);
    line-height: 1.45;
  }

  .tb-footer__badges{
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
  }

  .tb-badge{
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .38rem .65rem;
    border-radius: 999px;
    font-weight: 1000;
    font-size: .78rem;
    color: #fff;
    background: rgba(255,122,0,.22);
    border: 1px solid rgba(255,122,0,.22);
    backdrop-filter: blur(8px);
  }

  /* COLONNE */
  .tb-footer__col{
    display: grid;
    align-content: start;
    gap: .65rem;
  }

  .tb-footer__title{
    margin: 0 0 .15rem;
    font-size: 1.02rem;
    font-weight: 1000;
    letter-spacing: -.01em;
  }

  .tb-footer__link{
    display: inline-flex;
    gap: .6rem;
    align-items: center;
    text-decoration: none;
    color: rgba(255,255,255,.92);
    opacity: .92;
    padding: .35rem .25rem;
    border-radius: 12px;
    transition: transform .2s ease, background .2s ease, opacity .2s ease;
  }

  .tb-footer__link:hover{
    background: rgba(255,255,255,.10);
    transform: translateY(-2px);
    opacity: 1;
  }

  .tb-footer__link .ic{
    width: 22px;
    display: inline-grid;
    place-items: center;
    opacity: .95;
  }

  .tb-footer__mini{
    margin-top: .25rem;
    font-size: .92rem;
    opacity: .88;
    color: rgba(255,255,255,.92);
  }

  /* SOCIAL */
  .tb-footer__social{
    display: flex;
    gap: .7rem;
    flex-wrap: wrap;
    margin-bottom: .2rem;
  }

  .tb-social{
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    font-weight: 1000;
    text-decoration: none;
    color: #fff;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.14);
    backdrop-filter: blur(10px);
    box-shadow: 0 18px 45px rgba(0,0,0,.14);
    transition: transform .2s ease, background .2s ease;
  }

  .tb-social:hover{
    transform: translateY(-2px);
    background: rgba(255,122,0,.22);
  }

  /* CTA */
  .tb-footer__cta{
    margin-top: .45rem;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.14);
    backdrop-filter: blur(10px);
    box-shadow: 0 22px 70px rgba(0,0,0,.14);
  }

  .tb-footer__ctaTitle{
    font-weight: 1000;
    margin-bottom: .2rem;
  }

  .tb-footer__ctaText{
    opacity: .9;
    margin-bottom: .75rem;
    line-height: 1.45;
  }

  .tb-footer__btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    padding: .7rem 1rem;
    border-radius: 14px;
    font-weight: 1000;
    text-decoration: none;
    color: #0b3c88;
    background: #fff;
    box-shadow: 0 18px 45px rgba(0,0,0,.18);
    transition: transform .2s ease, filter .2s ease;
  }

  .tb-footer__btn:hover{
    transform: translateY(-2px);
    filter: brightness(1.02);
  }

  /* BOTTOM */
  .tb-footer__bottom{
    border-top: 1px solid rgba(255,255,255,.14);
    background: rgba(0,0,0,.10);
    padding: 1.1rem 1.2rem;
  }

  .tb-footer__bottomInner{
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 1rem;
  }

  @media (max-width: 640px){
    .tb-footer__bottomInner{
      grid-template-columns: 1fr;
    }
  }

  .tb-footer__legal{
    display: grid;
    gap: .35rem;
  }

  .tb-footer__legalRow{
    font-size: .92rem;
    line-height: 1.5;
    opacity: .92;
  }

  .tb-footer__legalRow a{
    color: rgba(255,255,255,.95);
    text-decoration: none;
    border-bottom: 2px solid rgba(255,122,0,.35);
    padding-bottom: 1px;
  }
  .tb-footer__legalRow a:hover{
    border-bottom-color: rgba(255,122,0,.95);
  }

  .muted{ opacity: .85; }
  .sep{ opacity: .7; margin: 0 .35rem; }

  /* ToTop */
  .tb-footer__toTop{
    width: 46px;
    height: 46px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.12);
    color: #fff;
    font-weight: 1000;
    cursor: pointer;
    backdrop-filter: blur(10px);
    box-shadow: 0 18px 45px rgba(0,0,0,.16);
    transition: transform .2s ease, background .2s ease;
  }

  .tb-footer__toTop:hover{
    transform: translateY(-2px);
    background: rgba(255,122,0,.22);
  }
  
  .tb-footer__logo--img{
  padding: 8px;
}

.tb-footer__logo--img img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.25));
}
.tb-social svg{
  width: 22px;
  height: 22px;
  fill: #fff;
}

/* Hover con accento brand */
.tb-social.ig:hover{
  background: linear-gradient(135deg, #f58529, #dd2a7b, #8134af);
}

.tb-social.fb:hover{ background: #1877f2; }
.tb-social.tt:hover{ background: #000; }
.tb-social.th:hover{ background: #111; }
.tb-social{
  text-decoration: none;
  color: #fff;
}

.tb-social:visited,
.tb-social:active,
.tb-social:focus{
  color: #fff;
  outline: none;
}
 /* =========================
     TOBIA STORY BASE
     ========================= */
  .tb-story{
    padding: 4.5rem 2rem;
    background:
      radial-gradient(1200px 320px at 10% -90px, rgba(11,60,136,.22), transparent 60%),
      radial-gradient(1000px 300px at 85% -40px, rgba(255,122,0,.22), transparent 58%),
      #f1f5f9;
  }

  .tb-story__header{
    max-width: 980px;
    margin: 0 auto 2.6rem;
    text-align: center;
  }

  .tb-story__title{
    font-size: clamp(2.1rem, 3.6vw, 2.8rem);
    margin: 0 0 .55rem;
    color: #0b3c88;
    font-weight: 1000;
    letter-spacing: -.03em;
  }

  .tb-story__subtitle{
    max-width: 780px;
    margin: 0 auto;
    opacity: .88;
    color: #0f172a;
    font-size: 1.06rem;
  }

  .tb-story__layout{
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    overflow: visible;
    grid-template-columns: 120px 1fr;
    gap: 1.6rem;
    align-items: start;
  }

  @media (max-width: 900px){
    .tb-story__layout{ grid-template-columns: 1fr; }
    .tb-story__rail{ display: none; }
  }

  /* =========================
     RAIL: DOT SULLA LINEA
     ========================= */
  .tb-story__rail{
  position: sticky;
  top: 90px;                 /* regola in base alla navbar */
  align-self: start;         /* IMPORTANTISSIMO dentro un grid */
  height: calc(100vh - 140px);
}


  /* linea + progress centrati */
  .tb-rail__line,
  .tb-rail__progress{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 6px;
    border-radius: 999px;
  }

  .tb-rail__line{
    height: 100%;
    background: rgba(15,23,42,.12);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
  }

  .tb-rail__progress{
    height: 0px; /* JS */
    background: linear-gradient(180deg, rgba(255,122,0,.98), rgba(11,60,136,.92));
    box-shadow: 0 18px 45px rgba(0,0,0,.12);
  }

  /* contenitore dots: stesso layout della rail */
  .tb-rail__dots{
    position: absolute;
    inset: 0;
    display: grid;
    align-content: space-between;
    padding: 8px 0;
  }

  /* DOT centrato sulla rail */
  .tb-dot{
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: 44px;
    height: 44px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    cursor: pointer;

    background: rgba(255,255,255,.72);
    border: 1px solid rgba(15,23,42,.10);
    backdrop-filter: blur(10px);
    box-shadow: 0 14px 35px rgba(0,0,0,.10);
    transition: transform .2s ease, box-shadow .2s ease;
    outline: none;
  }

  .tb-dot:hover{
    transform: translateX(-50%) translateY(-2px);
    box-shadow: 0 22px 55px rgba(0,0,0,.14);
  }

  .tb-dot:focus-visible{
    box-shadow: 0 0 0 4px rgba(255,122,0,.28), 0 22px 55px rgba(0,0,0,.14);
  }

  /* pallino interno */
  .tb-dot::after{
    content:"";
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: rgba(148,163,184,.95);             /* FUTURE */
    box-shadow: 0 0 0 5px rgba(148,163,184,.25);
    transition: background .2s ease, box-shadow .2s ease, transform .2s ease;
  }

  /* VISITED */
  .tb-dot.visited::after{
    background: rgba(11,60,136,.95);
    box-shadow: 0 0 0 6px rgba(11,60,136,.22);
  }

  /* ACTIVE */
  .tb-dot.active::after{
    background: rgba(255,122,0,.98);
    box-shadow: 0 0 0 7px rgba(255,122,0,.30);
    transform: scale(1.1);
  }

  /* ✅ SOLO LABEL A SINISTRA */
  .tb-dot-label{
    position: absolute;
    right: calc(100% + 14px);    /* a sinistra del dot */
    top: 50%;
    transform: translateY(-50%);

    white-space: nowrap;
    font-weight: 1000;
    font-size: .9rem;
    color: rgba(15,23,42,.88);
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(15,23,42,.08);
    padding: .35rem .55rem;
    border-radius: 12px;
    box-shadow: 0 14px 35px rgba(0,0,0,.08);

    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
  }

  .tb-dot:hover .tb-dot-label,
  .tb-dot.active .tb-dot-label{
    opacity: 1;
    transform: translateY(-50%) translateX(-4px);
  }

  /* =========================
     CARDS
     ========================= */
  .tb-story__cards{
    display: grid;
    gap: 1.4rem;
  }

  .tb-story-card{
    background: rgba(255,255,255,.92);
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 22px 70px rgba(0,0,0,.10);
    border: 1px solid rgba(15,23,42,.06);
    transition: transform .35s ease, box-shadow .35s ease;
    position: relative;
    isolation: isolate;
  }

  .tb-story-card:hover{
    transform: translateY(-6px);
    box-shadow: 0 40px 110px rgba(0,0,0,.16);
  }

  .tb-story-card__top{
    display: grid;
    grid-template-columns: 1fr 200px;
    gap: 1.2rem;
    padding: 1.3rem 1.35rem 1.1rem;
    background:
      radial-gradient(900px 220px at 10% 0, rgba(255,122,0,.14), transparent 60%),
      radial-gradient(900px 220px at 90% 0, rgba(11,60,136,.10), transparent 60%),
      linear-gradient(180deg, rgba(255,255,255,.0), rgba(255,255,255,.65));
    border-bottom: 1px solid rgba(15,23,42,.06);
  }

  @media (max-width: 720px){
    .tb-story-card__top{ grid-template-columns: 1fr; }
  }

  .tb-story-card__when{
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    padding: .45rem .75rem;
    border-radius: 999px;
    font-weight: 1000;
    font-size: .86rem;
    color: #0b3c88;
    background: rgba(11,60,136,.10);
    width: fit-content;
  }
  .tb-story-card__when::before{ content:"⏳"; }

  .tb-story-card__title{
    margin: .7rem 0 .45rem;
    color: #0b3c88;
    font-weight: 1000;
    letter-spacing: -.02em;
    font-size: 1.55rem;
    line-height: 1.18;
  }

  .tb-story-card__text{
    margin: 0;
    color: rgba(15,23,42,.88);
    font-size: 1.02rem;
    line-height: 1.75;
    max-width: 62ch;
  }

  .tb-story-card__tag{
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    justify-content: center;
    height: 46px;
    border-radius: 16px;
    font-weight: 1000;
    color: #fff;
    background: linear-gradient(135deg, rgba(11,60,136,.96), rgba(11,60,136,.82));
    box-shadow: 0 14px 35px rgba(0,0,0,.14);
    align-self: start;
    padding: 0 .9rem;
    width: fit-content;
    justify-self: end;
  }
  .tb-story-card__tag::before{ content:"🏀"; }

  @media (max-width: 720px){
    .tb-story-card__tag{ justify-self: start; }
  }

  .tb-story-card__media{
    height: 220px;
    position: relative;
    overflow: hidden;
    background: #e2e8f0;
  }

  .tb-story-card__media img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.02);
    transition: transform .8s ease;
    display: block;
  }

  .tb-story-card:hover .tb-story-card__media img{ transform: scale(1.08); }

  .tb-story-card__overlay{
    position: absolute;
    inset: 0;
    background:
      radial-gradient(900px 220px at 20% 0, rgba(255,122,0,.26), transparent 55%),
      linear-gradient(to top, rgba(15,23,42,.62), rgba(15,23,42,0));
    pointer-events: none;
  }

  /* reveal */
  .tb-reveal{ opacity: 0; transform: translateY(14px); transition: opacity .55s ease, transform .55s ease; }
  .tb-reveal.show{ opacity: 1; transform: translateY(0); }
  .features {
    display: flex;
    justify-content: center;
    padding: 0px;
}

.feature {
    margin: 10px;
    padding: 20px;
    background-color: white;
    border-radius: 5px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.feature:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}
/* =========================
   TOBIA - RESULTS (scoped)
   ========================= */
.tb-results{
  padding: 4rem 2rem;
  background:
    radial-gradient(1000px 260px at 20% -60px, rgba(11,60,136,.18), transparent 60%),
    radial-gradient(900px 260px at 80% 0, rgba(255,122,0,.20), transparent 55%),
    #f1f5f9;
}

.tb-results__header{
  max-width: 980px;
  margin: 0 auto 2rem;
  text-align: center;
}

.tb-results__title{
  font-size: clamp(2rem, 3.5vw, 2.6rem);
  margin: 0 0 .5rem;
  color: #0b3c88;
  font-weight: 900;
  letter-spacing: -.02em;
}

.tb-results__subtitle{
  max-width: 760px;
  margin: 0 auto;
  opacity: .85;
  color: #0f172a;
}

.tb-results__controls{
  max-width: 1200px;
  margin: 1.6rem auto 1.4rem;
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
}

.tb-results__select,
.tb-results__search{
  border: 1px solid rgba(15,23,42,.12);
  background: #fff;
  border-radius: 14px;
  padding: .85rem 1rem;
  font-weight: 700;
  box-shadow: 0 18px 40px rgba(0,0,0,.06);
  outline: none;
}

.tb-results__search{
  min-width: min(520px, 90vw);
}

.tb-results__select:focus,
.tb-results__search:focus{
  box-shadow: 0 0 0 4px rgba(255,122,0,.25), 0 18px 40px rgba(0,0,0,.06);
  border-color: rgba(255,122,0,.45);
}

.tb-results__grid{
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  gap: 1.2rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1050px){
  .tb-results__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px){
  .tb-results{ padding: 3rem 1.2rem; }
  .tb-results__grid{ grid-template-columns: 1fr; }
}

.tb-res-card{
  background: #fff;
  border-radius: 20px;
  padding: 1.1rem 1.2rem;
  box-shadow: 0 20px 55px rgba(0,0,0,.10);
  transition: transform .25s ease, box-shadow .25s ease;
  position: relative;
  overflow: hidden;
}

.tb-res-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 30px 80px rgba(0,0,0,.16);
}

.tb-res-card__top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  margin-bottom: .9rem;
}

.tb-res-badge{
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .45rem .75rem;
  border-radius: 999px;
  font-weight: 900;
  font-size: .82rem;
  color: #fff;
  background: rgba(11,60,136,.92);
  box-shadow: 0 10px 25px rgba(0,0,0,.18);
}

.tb-res-badge::before{
  content:"";
  width: 10px; height: 10px;
  border-radius: 999px;
  background: #ff7a00;
  box-shadow: 0 0 0 4px rgba(255,122,0,.22);
}

.tb-res-score{
  font-weight: 1000;
  color: #0b3c88;
  font-size: 1.15rem;
  letter-spacing: .02em;
}

.tb-res-teams{
  display: grid;
  gap: .35rem;
  font-weight: 900;
  color: rgba(15,23,42,.92);
}

.tb-res-team{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
}

.tb-res-team span{
  opacity: .85;
  font-weight: 800;
}

.tb-res-divider{
  height: 1px;
  background: rgba(15,23,42,.08);
  margin: .9rem 0 .7rem;
}

.tb-res-note{
  font-size: .9rem;
  opacity: .75;
}
/* Esito partita: vittoria/sconfitta/pareggio */
.tb-res-card.win{
  box-shadow: 0 22px 60px rgba(34,197,94,.18), 0 20px 55px rgba(0,0,0,.10);
}
.tb-res-card.loss{
  box-shadow: 0 22px 60px rgba(239,68,68,.16), 0 20px 55px rgba(0,0,0,.10);
}
.tb-res-card.draw{
  box-shadow: 0 22px 60px rgba(245,158,11,.16), 0 20px 55px rgba(0,0,0,.10);
}

.tb-res-outcome{
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .45rem .75rem;
  border-radius: 999px;
  font-weight: 1000;
  font-size: .82rem;
  white-space: nowrap;
}

.tb-res-outcome.win{
  background: rgba(34,197,94,.12);
  color: rgb(22,101,52);
}
.tb-res-outcome.loss{
  background: rgba(239,68,68,.12);
  color: rgb(127,29,29);
}
.tb-res-outcome.draw{
  background: rgba(245,158,11,.14);
  color: rgb(120,53,15);
}

.tb-res-outcome.win::before{ content:"✅"; }
.tb-res-outcome.loss::before{ content:"❌"; }
.tb-res-outcome.draw::before{ content:"➖"; }
.tb-map-link{
  margin-top: .75rem;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .55rem .8rem;
  border-radius: 12px;
  font-weight: 900;
  font-size: .92rem;
  text-decoration: none;
  color: #fff;
  background: rgba(11,60,136,.92);
  box-shadow: 0 12px 28px rgba(0,0,0,.14);
  transition: transform .2s ease, background .2s ease;
}
.tb-map-link::before{ content:"🗺️"; }
.tb-map-link:hover{
  background: rgba(255,122,0,.95);
  transform: translateY(-2px);
}
/* =========================
   TOBIA - PROSSIMI IMPEGNI
   ========================= */

.tb-next{
  padding: 4rem 2rem;
  background:
    radial-gradient(900px 260px at 80% -60px, rgba(255,122,0,.22), transparent 60%),
    radial-gradient(900px 260px at 20% 0, rgba(11,60,136,.18), transparent 55%),
    #f1f5f9;
}

.tb-next__header{
  max-width: 980px;
  margin: 0 auto 2.2rem;
  text-align: center;
}

.tb-next__title{
  font-size: clamp(2rem, 3.5vw, 2.6rem);
  margin: 0 0 .5rem;
  color: #0b3c88;
  font-weight: 900;
  letter-spacing: -.02em;
}

.tb-next__subtitle{
  max-width: 760px;
  margin: 0 auto;
  opacity: .85;
  color: #fcfcfc;
}

.tb-next__grid{
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  gap: 1.4rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1050px){
  .tb-next__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px){
  .tb-next{ padding: 3rem 1.2rem; }
  .tb-next__grid{ grid-template-columns: 1fr; }
}

.tb-next-card{
  background: #fff;
  border-radius: 20px;
  padding: 1.2rem 1.3rem;
  box-shadow: 0 20px 55px rgba(0,0,0,.10);
  transition: transform .25s ease, box-shadow .25s ease;
  position: relative;
  overflow: hidden;
}

.tb-next-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 30px 80px rgba(0,0,0,.16);
}

.tb-next-top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  margin-bottom: .9rem;
}

.tb-next-badge{
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .45rem .75rem;
  border-radius: 999px;
  font-weight: 900;
  font-size: .82rem;
  color: #fff;
  background: rgba(11,60,136,.92);
  box-shadow: 0 10px 25px rgba(0,0,0,.18);
}

.tb-next-vs{
  font-weight: 900;
  color: rgba(15,23,42,.9);
  font-size: 1.05rem;
}

.tb-next-teams{
  display: grid;
  gap: .5rem;
  margin-bottom: .9rem;
  font-weight: 900;
}

.tb-next-team{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
}

.tb-next-team span{
  opacity: .75;
  font-weight: 800;
}

.tb-next-when{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-weight: 900;
  font-size: .95rem;
  color: #0b3c88;
  background: rgba(11,60,136,.08);
  padding: .55rem .8rem;
  border-radius: 12px;
}

.tb-next-when::before{
  content: "⏱️";
}

.tb-next-venue{
  margin-top: .8rem;
  font-size: .92rem;
  opacity: .78;
  display: grid;
  gap: .35rem;
}

.tb-next-venue .row{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}

.tb-next-venue .row:first-child::before{ content: "📍"; }
.tb-next-venue .row:last-child::before{ content: "📅"; }

.tb-next-countdown{
  margin-top: .9rem;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-weight: 1000;
  font-size: .92rem;
  color: #0b3c88;
  background: rgba(255,122,0,.14);
  padding: .55rem .8rem;
  border-radius: 12px;
}

.tb-next-countdown::before{
  content: "⏳";
}
.tb-map-link{
  margin-top: .75rem;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .55rem .8rem;
  border-radius: 12px;
  font-weight: 900;
  font-size: .92rem;
  text-decoration: none;
  color: #fff;
  background: rgba(11,60,136,.92);
  box-shadow: 0 12px 28px rgba(0,0,0,.14);
  transition: transform .2s ease, background .2s ease;
}
.tb-map-link::before{ content:"🗺️"; }
.tb-map-link:hover{
  background: rgba(255,122,0,.95);
  transform: translateY(-2px);
}
  .tb-socialbar{
    padding: 3.2rem 2rem;
    background:
      radial-gradient(1100px 260px at 10% -80px, rgba(11,60,136,.18), transparent 60%),
      radial-gradient(900px 240px at 85% -60px, rgba(255,122,0,.20), transparent 58%),
      #f1f5f9;
  }

  .tb-socialbar__header{
    max-width: 980px;
    margin: 0 auto 1.8rem;
    text-align: center;
  }

  .tb-socialbar__title{
    font-size: clamp(1.8rem, 3vw, 2.25rem);
    margin: 0 0 .45rem;
    color: #0b3c88;
    font-weight: 1000;
    letter-spacing: -.02em;
  }

  .tb-socialbar__subtitle{
    margin: 0 auto;
    max-width: 760px;
    color: rgba(15,23,42,.85);
    font-size: 1.03rem;
    line-height: 1.55;
  }

  .tb-socialbar__grid{
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  @media (max-width: 980px){
    .tb-socialbar__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @media (max-width: 560px){
    .tb-socialbar{ padding: 2.6rem 1.2rem; }
    .tb-socialbar__grid{ grid-template-columns: 1fr; }
  }

  .tb-socialcard{
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(15,23,42,.06);
    border-radius: 18px;
    box-shadow: 0 18px 50px rgba(0,0,0,.08);
    padding: 1rem 1rem 1.05rem;
    display: grid;
    gap: .6rem;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    text-decoration: none;
    color: inherit;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }

  .tb-socialcard:hover{
    transform: translateY(-6px);
    box-shadow: 0 30px 85px rgba(0,0,0,.14);
    border-color: rgba(255,122,0,.22);
  }

  .tb-socialcard::before{
    content:"";
    position:absolute;
    inset:-60px -60px auto -60px;
    height: 140px;
    background: radial-gradient(circle at 20% 20%, rgba(255,122,0,.22), transparent 60%);
    transform: rotate(-8deg);
    pointer-events:none;
    z-index: 0;
  }

  .tb-socialcard__top{
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap: .8rem;
    position: relative;
    z-index: 1;
  }

  .tb-socialcard__icon{
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display:grid;
    place-items:center;
    background: rgba(11,60,136,.92);
    box-shadow: 0 14px 35px rgba(0,0,0,.12);
    border: 1px solid rgba(255,255,255,.18);
    backdrop-filter: blur(10px);
    flex: 0 0 auto;
    transition: transform .25s ease, filter .25s ease;
  }

  .tb-socialcard:hover .tb-socialcard__icon{
    transform: translateY(-2px);
    filter: brightness(1.05);
  }

  .tb-socialcard__icon svg{
    width: 22px;
    height: 22px;
    fill: #fff;
  }

  .tb-socialcard__badge{
    font-weight: 1000;
    font-size: .78rem;
    color: #0b3c88;
    background: rgba(11,60,136,.10);
    padding: .35rem .55rem;
    border-radius: 999px;
    border: 1px solid rgba(11,60,136,.10);
  }

  .tb-socialcard__name{
    margin: 0;
    font-weight: 1000;
    letter-spacing: -.01em;
    font-size: 1.08rem;
    color: #0b3c88;
    position: relative;
    z-index: 1;
  }

  .tb-socialcard__handle{
    margin: 0;
    color: rgba(15,23,42,.80);
    font-weight: 900;
    font-size: .95rem;
    position: relative;
    z-index: 1;
  }

  .tb-socialcard__cta{
    margin-top: .1rem;
    display:inline-flex;
    align-items:center;
    gap: .55rem;
    font-weight: 1000;
    color: #0b3c88;
    position: relative;
    z-index: 1;
  }

  .tb-socialcard__cta::after{
    content:"→";
    font-weight: 1000;
  }

  /* Brand hover colors */
  .tb-socialcard.ig:hover .tb-socialcard__icon{
    background: linear-gradient(135deg, #f58529, #dd2a7b, #8134af);
  }
  .tb-socialcard.fb:hover .tb-socialcard__icon{ background: #1877f2; }
  .tb-socialcard.tt:hover .tb-socialcard__icon{ background: #000; }
  .tb-socialcard.th:hover .tb-socialcard__icon{ background: #111; }

  /* remove link feel */
  .tb-socialcard,
  .tb-socialcard:hover,
  .tb-socialcard:visited{
    text-decoration:none;
    -webkit-tap-highlight-color: transparent;
  }

  .tb-socialcard:focus-visible{
    outline: none;
    box-shadow: 0 0 0 4px rgba(255,122,0,.28), 0 30px 85px rgba(0,0,0,.14);
  }
  
    /* =========================
     TEAMS SECTION
     ========================= */
  .tb-teams{
    padding: 4rem 2rem;
    background:
      radial-gradient(1200px 320px at 12% -120px, rgba(255,122,0,.22), transparent 60%),
      radial-gradient(1000px 300px at 88% -120px, rgba(11,60,136,.18), transparent 58%),
      #f1f5f9;
  }

  .tb-teams__header{
    max-width: 1000px;
    margin: 0 auto 2.2rem;
    text-align: center;
  }

  .tb-teams__title{
    margin: 0 0 .45rem;
    font-size: clamp(2rem, 3.4vw, 2.6rem);
    font-weight: 1000;
    letter-spacing: -.03em;
    color: #0b3c88;
  }

  .tb-teams__subtitle{
    margin: 0 auto;
    max-width: 780px;
    color: rgba(15,23,42,.85);
    font-size: 1.05rem;
    line-height: 1.55;
  }

  /* Grid: 3/2/1 */
  .tb-teams__grid{
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    gap: 1.8rem; /* ✅ più spazio tra righe e colonne */
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  @media (max-width: 1020px){
    .tb-teams__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (max-width: 620px){
    .tb-teams{ padding: 3.2rem 1.2rem; }
    .tb-teams__grid{ grid-template-columns: 1fr; }
  }

  /* =========================
     CARD
     Foto FULL card (cover) + overlay info
     ========================= */
  .tb-team{
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    min-height: 420px;
    background: #0b3c88;
    box-shadow: 0 22px 75px rgba(0,0,0,.14);
    border: 1px solid rgba(15,23,42,.08);
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
    isolation: isolate;
  }

  .tb-team:hover{
    transform: translateY(-10px);
    box-shadow: 0 40px 130px rgba(0,0,0,.20);
    border-color: rgba(255,122,0,.28);
  }

  .tb-team__imgBtn{
    position: absolute;
    inset: 0;
    border: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    cursor: zoom-in;
  }

  .tb-team__img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit: cover; /* ✅ foto occupa tutta la card */
    object-position: 50% 30%; /* ✅ alza il punto di focus (prima era default 50% 50%) */
    display:block;
    transform: scale(1.02);
    transition: transform .9s ease;
  }

/* opzionale: su mobile ancora un pelo più alta */
@media (max-width: 620px){
  .tb-team__img{ object-position: 50% 25%; }
}

  .tb-team:hover .tb-team__img{
    transform: scale(1.08);
  }

.tb-team__shade{
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 280px at 20% 0, rgba(255,122,0,.32), transparent 60%),
    linear-gradient(
      to top,
      rgba(15,23,42,.92) 0%,
      rgba(15,23,42,.75) 40%,
      rgba(15,23,42,.35) 65%,
      rgba(15,23,42,0) 85%
    );
  pointer-events:none;
}


  .tb-team__content{
    position: relative;
    z-index: 2;
    padding: 1.15rem 1.15rem 1.25rem;
    display: grid;
    gap: .8rem;
    height: 100%;
    align-content: end; /* info in basso */
  }

  .tb-team__badge{
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    width: fit-content;
    padding: .4rem .65rem;
    border-radius: 999px;
    font-weight: 1000;
    font-size: .82rem;
    color: #fff;
    background: rgba(11,60,136,.85);
    border: 1px solid rgba(255,255,255,.14);
    backdrop-filter: blur(8px);
    box-shadow: 0 14px 35px rgba(0,0,0,.22);
  }
  .tb-team__badge::before{
    content:"🏀";
    filter: saturate(1.1);
  }

.tb-team__name{
  margin: 0;
  font-weight: 1000;
  letter-spacing: -.02em;
  font-size: 1.4rem;
  line-height: 1.15;
  color: #ffffff;
  text-shadow: 
    0 4px 12px rgba(0,0,0,.6),
    0 8px 24px rgba(0,0,0,.6);
}


.tb-team__train{
  margin: 0;
  color: rgba(255,255,255,.98);
  font-weight: 900;
  line-height: 1.55;
  font-size: 1rem;
  text-shadow: 
    0 4px 12px rgba(0,0,0,.55),
    0 8px 24px rgba(0,0,0,.55);
}


  .tb-team__actions{
    display: grid;
    gap: .65rem;
    margin-top: .2rem;
  }

  .tb-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    width: 100%;
    padding: .82rem 1rem;
    border-radius: 14px;
    border: 0;
    cursor: pointer;
    font-weight: 1000;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    transition: transform .2s ease, filter .2s ease, background .2s ease, box-shadow .2s ease;
  }

  .tb-btn--primary{
    background: #ff7a00;
    color: #0b3c88;
    box-shadow: 0 18px 45px rgba(0,0,0,.20);
  }
  .tb-btn--primary::after{ content:"→"; font-weight: 1000; }

  .tb-btn--ghost{
    background: rgba(255,255,255,.12);
    color: #fff;
    border: 1px solid rgba(255,255,255,.18);
    backdrop-filter: blur(8px);
  }
  .tb-btn--ghost::before{ content:"📅"; }

  .tb-btn:hover{ transform: translateY(-2px); filter: brightness(1.02); }
  .tb-btn:active{ transform: translateY(0px) scale(.99); }

  /* =========================
     MODALS (shared)
     ========================= */
/* FULLSCREEN IMAGE MODAL */

.tb-modal__dialog--img{
  width: 100vw;
  height: 100vh;
  margin: 0;
  border-radius: 0;
  background: #000;
  display: flex;
  flex-direction: column;
}

.tb-modal__imgWrap{
  flex: 1;
  display:flex;
  align-items:center;
  justify-content:center;
}

.tb-modal__imgWrap img{
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  padding: 0;
}

.tb-modal__caption{
  position: absolute;
  bottom: 20px;
  left: 0;
  right: 0;
  text-align: center;
  color: white;
  font-weight: 900;
  font-size: 1.2rem;
  background: transparent;
  border: none;
  text-shadow: 0 6px 16px rgba(0,0,0,.8);
}

.tb-modal__close{
  background: rgba(0,0,0,.6);
}


  /* Image modal */
  .tb-modal__dialog--img{
    background:
      radial-gradient(1000px 340px at 10% 0, rgba(255,122,0,.18), transparent 60%),
      radial-gradient(900px 300px at 85% 0, rgba(255,255,255,.10), transparent 58%),
      rgba(11,60,136,.95);
    border: 1px solid rgba(255,255,255,.14);
  }

  .tb-modal__imgWrap img{
    width: 100%;
    height: min(78vh, 760px);
    object-fit: contain;
    display: block;
    padding: 18px;
    filter: drop-shadow(0 18px 28px rgba(0,0,0,.35));
  }

  .tb-modal__caption{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1.1rem 1rem;
    color: #fff;
    background: rgba(0,0,0,.18);
    border-top: 1px solid rgba(255,255,255,.12);
    font-weight: 1000;
    letter-spacing: -.01em;
  }

  .tb-modal__hint{
    opacity: .9;
    font-weight: 850;
    font-size: .92rem;
  }

  /* Calendar modal */
  .tb-modal__dialog--cal{
    background: #fff;
    border: 1px solid rgba(15,23,42,.10);
  }

  .tb-modal__head{
    padding: 1.2rem 1.4rem 1rem;
    background:
      radial-gradient(900px 240px at 10% 0, rgba(255,122,0,.16), transparent 60%),
      radial-gradient(900px 240px at 90% 0, rgba(11,60,136,.10), transparent 60%),
      #fff;
    border-bottom: 1px solid rgba(15,23,42,.08);
  }

  .tb-modal__badge{
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .38rem .6rem;
    border-radius: 999px;
    font-weight: 1000;
    font-size: .82rem;
    color: #0b3c88;
    background: rgba(11,60,136,.10);
    border: 1px solid rgba(11,60,136,.12);
    width: fit-content;
  }
  .tb-modal__badge::before{ content:"📅"; }

  .tb-modal__title{
    margin: .65rem 0 .2rem;
    color: #0b3c88;
    font-weight: 1000;
    letter-spacing: -.02em;
    font-size: 1.55rem;
    line-height: 1.2;
  }

  .tb-modal__sub{
    margin: 0;
    color: rgba(15,23,42,.8);
    font-weight: 850;
  }

  .tb-modal__body{
    padding: 1rem 1.4rem 1.4rem;
  }

  .tb-modal__frameWrap{
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid rgba(15,23,42,.08);
    background: #f8fafc;
    height: min(68vh, 640px);
  }

  .tb-modal__frameWrap iframe{
    width: 100%;
    height: 100%;
    border: 0;
  }

  .tb-modal__actions{
    display: flex;
    flex-wrap: wrap;
    gap: .7rem;
    justify-content: flex-end;
    margin-top: 1rem;
  }

  @media (max-width: 720px){
    .tb-team{ min-height: 400px; }
    .tb-modal__dialog{ margin: 2vh auto; }
    .tb-modal__imgWrap img{ height: 75vh; }
    .tb-modal__frameWrap{ height: 72vh; }
  }

  /* A11y */
  @media (prefers-reduced-motion: reduce){
    .tb-team, .tb-team__img, .tb-btn, .tb-modal__dialog{ transition: none !important; animation: none !important; }
  }