/* =========================================================================
   INTERNATIONAL CLINIC — visual & motion layer
   Solo design/animazione: nessun copy, nessuna struttura nuova.
   ========================================================================= */

/* ---------- 1. HERO: rete internazionale sul nero ---------- */
.hero--intl .hg{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.hero--intl .hg svg{width:100%;height:100%;display:block}
.hero--intl .hg{
  -webkit-mask-image:radial-gradient(64% 58% at 50% 46%,transparent 0,transparent 42%,#000 86%);
  mask-image:radial-gradient(64% 58% at 50% 46%,transparent 0,transparent 42%,#000 86%);
}
.hero--intl .hg::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(52% 46% at 50% 46%,rgba(0,0,0,.92),rgba(0,0,0,0) 72%);
}
.hero--intl .wrap{position:relative;z-index:2}
.hg-dot{fill:var(--emerald);opacity:.16}
.hg-grid{stroke:var(--emerald);stroke-width:.5;opacity:.1;fill:none}
.hg-node{fill:var(--emerald-lift);opacity:.35}
.hg-route{fill:none;stroke:var(--emerald-lift);stroke-width:1;stroke-linecap:round;opacity:0}
.hg-ping{fill:none;stroke:var(--emerald-lift);stroke-width:1;opacity:0}
.hg-lab{font-family:var(--mono);font-size:11px;letter-spacing:.24em;
        fill:var(--emerald-lift);opacity:0}
@media (max-width:768px){
  .hero--intl .hg{opacity:.7}
  .hg-lab{font-size:15px}
}

/* ---------- 2. PLAYER / COACH / CLUB ---------- */
.cards--lvl .card{transition:transform .38s var(--ease),border-color .38s var(--ease),box-shadow .38s var(--ease)}
.cards--lvl .card .kind{display:inline-block;transition:transform .38s var(--ease),opacity .38s var(--ease)}
.cards--lvl .card:hover{transform:translateY(-6px);box-shadow:0 18px 40px -28px rgba(0,0,0,.45)}
.cards--lvl .card:hover .kind{transform:translateY(-3px)}
.cards--lvl .card::after{
  content:"";position:absolute;left:26px;bottom:0;height:1px;width:0;
  background:var(--emerald);transition:width .45s var(--ease);
}
.cards--lvl .card:hover::after{width:calc(100% - 52px)}
.cards--lvl .card .go::after{content:"→";margin-left:8px;opacity:0;display:inline-block;
  transform:translateX(-4px);transition:.32s var(--ease)}
.cards--lvl .card:hover .go::after{opacity:1;transform:translateX(0)}

/* card centrale: composizione visiva, nessuna gerarchia commerciale */
.card--turq{background:var(--emerald) !important;border-color:var(--emerald) !important;color:#04100F}
.card--turq .kind{color:#082523 !important}
.card--turq h3{color:#04100F}
.card--turq p{color:#082523 !important}
.card--turq ul{border-top-color:rgba(255,255,255,.22) !important}
.card--turq li{border-bottom-color:rgba(0,0,0,.22) !important;color:#04100F}
.card--turq li::before{background:#04100F}
.card--turq .go{color:#04100F !important}
.card--turq:hover .go{color:#04100F !important}
.card--turq::before{background:#fff}
.card--turq::after{background:#fff}
.card--turq:hover{box-shadow:0 20px 44px -26px rgba(37,144,142,.6)}

/* ---------- 3. IL CAMPO DIVENTA IL LABORATORIO ---------- */
.labviz{width:min(320px,100%);flex:none;border:1px solid var(--line-d);background:#070C0B;
        position:relative;aspect-ratio:4/3}
.labviz svg{width:100%;height:100%;display:block}
.lv-court{fill:none;stroke:rgba(255,255,255,.16);stroke-width:1}
.lv-net{stroke:rgba(255,255,255,.3);stroke-width:1;stroke-dasharray:3 3}
.lv-path{fill:none;stroke:var(--emerald-lift);stroke-width:1.4;stroke-linecap:round;opacity:.9}
.lv-target{fill:none;stroke:var(--emerald);stroke-width:1;opacity:.75}
.lv-mark{fill:none;stroke:var(--emerald-lift);stroke-width:1;opacity:0}
.lv-ball{fill:#fff}
.lv-step{font-family:var(--mono);font-size:9px;letter-spacing:.2em;fill:var(--ash);opacity:.45;
         transition:opacity .35s var(--ease),fill .35s var(--ease)}
.lv-step.on{opacity:1;fill:var(--emerald-lift)}
@media (max-width:900px){.labviz{width:100%;max-width:420px}}

/* ---------- 4. QUATTRO FORMAT ---------- */
.cards--fmt .card{overflow:hidden}
.fmt-n{
  position:absolute;right:16px;top:6px;font-family:var(--display);font-weight:800;
  font-size:64px;line-height:1;color:var(--mt-text-ink);opacity:.06;pointer-events:none;
  transition:opacity .4s var(--ease),transform .4s var(--ease);
}
.cards--fmt .card:hover .fmt-n{opacity:.14;transform:translateY(-3px)}
.dur{display:flex;align-items:center;gap:0;margin:0 0 18px}
.dur i{width:9px;height:9px;border-radius:50%;border:1px solid var(--emerald);flex:none;
       background:transparent;transition:background .4s var(--ease)}
.dur i.on{background:var(--emerald)}
.dur s{display:block;width:26px;height:1px;background:var(--line-l);position:relative;text-decoration:none}
.dur s::after{content:"";position:absolute;inset:0;width:0;background:var(--emerald);
  transition:width .5s var(--ease)}
.cards--fmt .card:hover .dur s::after{width:100%}
.cards--fmt .card:hover .dur s:nth-of-type(2)::after{transition-delay:.08s}
.cards--fmt .card:hover .dur s:nth-of-type(3)::after{transition-delay:.16s}
.dur b{margin-left:12px;font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;
       text-transform:uppercase;color:var(--emerald);opacity:0;transform:translateX(-4px);
       transition:.35s var(--ease);font-weight:400}
.cards--fmt .card:hover .dur b{opacity:1;transform:translateX(0)}
.cards--fmt .card::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--emerald);
  transition:width .5s var(--ease);
}
.cards--fmt .card:hover::after{width:100%}
.grb-wrap{display:flex;justify-content:flex-start}

/* ---------- 5. MT METHOD NETWORK ---------- */
.netmap .nn{cursor:pointer}
.netmap .nn circle{fill:var(--emerald-lift);transition:r .3s var(--ease),fill .3s var(--ease)}
.netmap .nn text{font-family:var(--mono);font-size:12px;letter-spacing:.2em;fill:var(--ash);
                 transition:fill .3s var(--ease)}
.netmap .nn.on circle{fill:#fff}
.netmap .nn.on text{fill:#fff}
.netmap .nn-halo{fill:none;stroke:var(--emerald-lift);stroke-width:1;opacity:0;
                 transition:opacity .35s var(--ease)}
.netmap .nn.on .nn-halo{opacity:.55}
.netmap .nn-lab{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;
                fill:var(--emerald-lift);opacity:0;transition:opacity .35s var(--ease)}
.netmap .nn.on .nn-lab{opacity:1}
.netmap .link.hot{opacity:1;stroke:var(--emerald-lift);stroke-width:1.6}
.netmap .hub-ring{fill:none;stroke:rgba(255,255,255,.25);stroke-width:1}
html.js .netmap .hub-ring{animation:hubBeat 3.6s var(--ease) infinite}
@keyframes hubBeat{0%{opacity:.35;transform:scale(1)}55%{opacity:0;transform:scale(1.55)}100%{opacity:0;transform:scale(1.55)}}
.netmap .hub-ring{transform-box:fill-box;transform-origin:center}
@media (max-width:640px){
  .netmap .nn text{font-size:20px}
  .netmap .nn-lab{font-size:17px}
}

/* ---------- reduced motion: tutto statico ma leggibile ---------- */
@media (prefers-reduced-motion:reduce){
  .hg-route{opacity:.28}
  .hg-lab{opacity:.6}
  .lv-ball{opacity:1}
  html.js .netmap .hub-ring{animation:none;opacity:.3}
  .cards--lvl .card,.cards--fmt .card,.dur s::after,.fmt-n{transition:none}
}

/* hit area dei nodi network */
.netmap .link{pointer-events:none}
.netmap .nn{pointer-events:auto}
.netmap .nn-halo{fill:rgba(255,255,255,.001)}