/* ══════════════════════════════════════════════════════════════════
   ITERO — pagina di accesso "vetro".
   Blu notte, scheda in vetro, verde acqua del marchio.
   ══════════════════════════════════════════════════════════════════ */

@font-face{font-family:'Playfair';src:url('../fonts/PlayfairDisplay.ttf') format('truetype');
           font-weight:400 900;font-display:swap}
@font-face{font-family:'Jost';src:url('../fonts/Jost.ttf') format('truetype');
           font-weight:300 700;font-display:swap}

.lg-body{margin:0;min-height:100vh;background:#0B1526;color:#E9EFF7;
         font-family:'Jost',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
         -webkit-font-smoothing:antialiased}
.lg{display:flex;min-height:100vh;position:relative}
.lg:before{content:'';position:fixed;top:0;left:0;right:0;bottom:0;
           background:url('../img/accesso.jpg') center center no-repeat;background-size:cover;z-index:0}
.lg > *{position:relative;z-index:1}

/* ── sinistra ── */
.lg-lato{width:56%;padding:0 0 0 112px;display:flex;flex-direction:column;justify-content:center}
.lg-alto{margin-top:auto;padding-top:64px}
.lg-wm{font-family:'Playfair',Georgia,serif;font-weight:700;font-size:100px;
       color:#fff;line-height:.9;letter-spacing:-1px;margin-bottom:18px}
.lg-claim{font-size:10.5px;letter-spacing:3.6px;text-transform:uppercase;color:#8398B3}

/* il filo dell'avanzamento */
.lg-filo{position:relative;width:432px;max-width:100%;height:58px;margin:30px 0 26px}
.lg-bin{position:absolute;left:5px;right:5px;top:5px;height:1px;background:rgba(255,255,255,.17)}
.lg-fatto{position:absolute;left:5px;top:5px;width:61%;height:1px;background:#2FC2A6}
.lg-nodo.n1{left:0}.lg-nodo.n2{left:30.5%}.lg-nodo.n3{left:61%}.lg-nodo.n4{left:auto;right:0}
.lg-filo .e1{left:0}.lg-filo .e2{left:29%}.lg-filo .e3{left:59.5%}
.lg-filo .e4{left:auto;right:0}
.lg-nodo{position:absolute;top:0;width:11px;height:11px;border-radius:50%;background:#2FC2A6;
         box-shadow:0 0 0 5px rgba(47,194,166,.14)}
.lg-nodo.vuoto{background:transparent;border:1px solid rgba(255,255,255,.34);box-shadow:none}
.lg-filo em{position:absolute;top:24px;font-style:normal;font-size:10px;letter-spacing:1.9px;
            text-transform:uppercase;color:#C6D6E8}
.lg-filo em:last-of-type{color:#7E93AE}

.lg-frase{font-size:15.5px;line-height:1.85;color:#A8B8CC;max-width:430px;margin:6px 0 0}
.lg-uff{font-size:11px;letter-spacing:2.2px;text-transform:uppercase;color:#6E829C;margin-top:16px}

/* firma dell'autore */
.lg-firma{margin:auto 0 64px;padding-top:54px}
.lg-eti{display:block;font-size:10px;letter-spacing:2.6px;text-transform:uppercase;color:#5A6C84;margin-bottom:11px}
.lg-marchio{font-family:'Playfair',Georgia,serif;font-size:19px;color:#D7E2EF;text-decoration:none;display:inline-block}
.lg-marchio b{color:#2FC2A6}
.lg-contatti{display:block;margin-top:14px;font-size:13px}
.lg-contatti a{color:#C4D3E4;text-decoration:none;margin-right:20px;padding-bottom:4px;
               border-bottom:1px solid rgba(255,255,255,.18);display:inline-block;margin-bottom:8px}
.lg-contatti a:hover{color:#fff;border-bottom-color:rgba(255,255,255,.5)}
.lg-contatti a.wa{color:#5FD0B4;border-bottom-color:#2FC2A6}
.lg-bolla{display:inline-block;width:15px;height:13px;border-radius:7px 7px 7px 2px;
          border:1.4px solid #2FC2A6;margin-right:9px;vertical-align:-2px}

/* ── destra: la scheda in vetro ── */
.lg-main{width:44%;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:56px 32px}
.lg-scheda{width:440px;max-width:100%;padding:44px 46px;border-radius:18px;
           background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
           -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
           box-shadow:0 40px 90px -40px rgba(0,0,0,.6)}
.lg-timbro{display:none}
.lg-h{font-family:'Playfair',Georgia,serif;font-size:29px;color:#fff;margin:0 0 5px;font-weight:700}
.lg-sub{font-size:13px;color:#A8B8CC;margin:0 0 32px}

.lg-campo{display:block;margin-bottom:20px;font-size:10px;letter-spacing:2.6px;
          text-transform:uppercase;color:#9FB2C8}
.lg-riga{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;
         font-size:10px;letter-spacing:2.6px;text-transform:uppercase;color:#9FB2C8}
.lg-riga a{letter-spacing:.2px;text-transform:none;font-size:12.5px;color:#5FD0B4;text-decoration:none}
.lg-campo input{display:block;width:100%;margin-top:8px;padding:13px 15px;border-radius:8px;
                background:rgba(9,18,32,.42);border:1px solid rgba(255,255,255,.18);color:#EEF4FA;
                font-family:'Jost',Arial,sans-serif;font-size:15px;letter-spacing:normal;text-transform:none}
.lg-campo input:focus{outline:0;border-color:#2FC2A6;box-shadow:0 0 0 3px rgba(47,194,166,.20)}
.lg-pw{position:relative;display:block}
.lg-occhio{position:absolute;right:12px;top:26px;background:none;border:0;
           color:#8FA4BD;font-size:11px;letter-spacing:1.4px;text-transform:uppercase;cursor:pointer}
.lg-otp{text-align:center;font-size:26px !important;letter-spacing:10px !important}
.lg-caps{font-size:12px;color:#E7C46A;margin:-8px 0 14px;text-transform:none;letter-spacing:normal}

.lg-btn{display:block;width:100%;padding:15px;border:0;border-radius:9px;color:#04140F;cursor:pointer;
        font-family:'Jost',Arial,sans-serif;font-size:12.5px;letter-spacing:3px;text-transform:uppercase;
        background:linear-gradient(90deg,#37C9A6 0%,#159C97 100%);
        box-shadow:0 16px 36px -14px rgba(23,160,150,.8)}
.lg-btn:hover{background:linear-gradient(90deg,#2FC2A6 0%,#118C8A 100%)}

.lg-aiuto{text-align:center;font-size:12px;color:#93A7BF;margin:22px 0 0}
.lg-aiuto a,.lg-alt a{color:#5FD0B4;text-decoration:none}
.lg-alt{text-align:center;font-size:12.5px;margin:18px 0 0}
.lg-pub{font-size:12.5px;color:#A8B8CC;margin:26px 0 0;text-align:center}
.lg-pub a{color:#5FD0B4;text-decoration:none}
.lg-credito{font-size:10px;letter-spacing:2.2px;text-transform:uppercase;color:#56688A;margin:14px 0 0;text-align:center}
.lg-piede{font-size:12px;color:#7E93AE;margin-top:22px}
.lg-lucc{margin-right:7px;vertical-align:-3px;display:inline-block}

.alert{border-radius:10px;padding:11px 14px;font-size:13px;margin-bottom:16px}
.alert-info{background:rgba(47,194,166,.12);border:1px solid rgba(47,194,166,.35);color:#B8EEDF}
.alert-err{background:rgba(216,84,79,.14);border:1px solid rgba(216,84,79,.4);color:#F3C3C0}

/* ── telefono e tablet ── */
@media(max-width:1080px){
  .lg{flex-direction:column}
  .lg-lato{width:100%;padding:44px 28px 0;text-align:center}
  .lg-alto{padding-top:0;margin-top:0}
  .lg-wm{font-size:56px}
  .lg-filo{margin:22px auto 22px;width:320px}
  .lg-filo em{font-size:8.5px;letter-spacing:1.2px}
  .lg-frase{margin:0 auto;font-size:14px}
  .lg-main{width:100%;padding:28px 22px 40px}
  .lg-firma{display:none}
}
@media(max-width:560px){
  .lg-scheda{padding:30px 24px;border-radius:16px}
  .lg-filo{width:250px;height:26px}
  .lg-filo em{display:none}
}

/* la "o" del nome è il nodo ancora aperto */
.lg-nodo-wm{display:inline-block;width:.52em;height:.52em;border-radius:50%;
            border:.115em solid #2FC2A6;vertical-align:.02em;margin-left:.06em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* il nodo al posto dell'ultima lettera del nome */
.wm-nodo{display:inline-block;width:.46em;height:.46em;border-radius:50%;
         border:.1em solid #2FC2A6;vertical-align:.02em;margin-left:.06em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}