/* Studio 2 - pagina iniziale (home) - 31/10/2026, LOGICA BASE 2.04 passaggio 87
   La copertina della presentazione «Hello World»: «Studio 2» grande con il 2 rosso, logo GMP in alto, «By Soloper» in basso,
   pulsante «Accedi» in alto che apre la finestra di accesso (mail e password: il tipo di utente lo riconosce il programma). */
body.home{margin:0;min-height:100vh;min-height:100dvh;background:radial-gradient(1200px 700px at 78% 18%,#22365F 0%,#14213D 55%,#0E1830 100%) fixed;color:#EEF1F7;
  font-family:"Source Sans 3","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif}
body.home .testata{display:none}
body.home #corpo{max-width:none;padding:0!important;margin:0}
.hm{position:relative;min-height:100vh;min-height:100dvh;box-sizing:border-box;padding:clamp(20px,5vw,72px) clamp(16px,6vw,96px) 40px;display:flex;flex-direction:column}
.hm-top{display:flex;justify-content:flex-end;align-items:flex-start;gap:clamp(14px,3vw,40px)}
.hm-accedi{height:52px;padding:0 24px;border-radius:26px;border:1.5px solid #8FB3E6;background:rgba(143,179,230,.12);color:#F6F3EC;font-family:inherit;font-weight:600;font-size:19px;letter-spacing:.03em;
  display:inline-flex;gap:10px;align-items:center;cursor:pointer;margin-top:clamp(8px,2vw,30px)}
.hm-accedi:hover{background:rgba(143,179,230,.24)}
.hm-accedi:focus-visible{outline:3px solid #fff;outline-offset:3px}
.hm-accedi span{color:#E05252;font-size:22px}
.hm-marchio{width:clamp(120px,16vw,210px);text-align:center}
.hm-marchio img{width:100%;height:auto;display:block}
.hm-marchio i{display:block;height:1px;background:#8FB3E6;margin:10px 0 7px}
.hm-marchio small{display:block;font-family:Poppins,"Segoe UI",system-ui,sans-serif;font-weight:300;font-size:clamp(7px,.9vw,10.5px);letter-spacing:.42em;color:#C6CEDD;white-space:nowrap;margin-right:-.42em}
.hm-nome{margin-top:clamp(10px,3vw,10px)}
html:root body.home .hm-nome h1{font-family:"Cormorant Garamond","Libre Baskerville",Georgia,"Times New Roman",serif;font-weight:600;font-size:clamp(84px,16vw,250px);line-height:.86;color:#F6F3EC;letter-spacing:-.025em;margin:0;white-space:nowrap}
html:root body.home .hm-nome h1 b{color:#C62828;font-style:italic;font-weight:600;margin-left:.14em}
.hm-fil{height:2px;background:#8FB3E6;width:min(640px,80%);margin:clamp(14px,2vw,24px) 0 clamp(10px,1.4vw,16px);transform-origin:left;animation:hm-grow 1.2s cubic-bezier(.6,0,.2,1) both .6s}
.hm-tag{font-family:Poppins,"Segoe UI",system-ui,sans-serif;font-weight:300;font-size:clamp(9px,1.2vw,17px);letter-spacing:.42em;color:#E6EAF3}
.hm-testo{margin-top:auto;padding-top:40px;max-width:1000px;font-size:clamp(16px,1.8vw,26px);line-height:1.5;color:#C6CEDD;white-space:pre-line}
.hm-piede{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-top:28px;padding-top:16px;border-top:1px solid rgba(143,179,230,.25)}
.hm-piede p{margin:0;font-size:13.5px;line-height:1.5;color:#8C97B0;white-space:pre-line;max-width:900px}
.hm-piede a{color:#8FB3E6}
.hm-by{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:500;font-size:clamp(22px,2.4vw,34px);color:#8FB3E6;white-space:nowrap}
.hm-avviso{background:rgba(214,154,26,.16);border:1px solid rgba(214,154,26,.55);color:#F7E2B0;border-radius:10px;padding:10px 14px;font-size:15px;margin:14px 0 0;max-width:720px}
@keyframes hm-grow{from{transform:scaleX(0)}}
@keyframes hm-su{from{opacity:0;transform:translateY(24px)}}
html:root body.home .hm-nome h1,.hm-testo{animation:hm-su .8s cubic-bezier(.2,.75,.2,1) both .1s}
.hm-testo{animation-delay:.5s}
/* finestra «Accedi» */
/* (04/11/2026, passaggio 116) iPhone: la finestra più alta dello schermo (o con la tastiera aperta) si scorre fino a «Entra»;
   prima il centraggio la tagliava in alto e in basso */
.hm-velo{position:fixed;inset:0;background:rgba(8,14,30,.62);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:40;display:flex;align-items:flex-start;justify-content:center;padding:16px 16px calc(16px + env(safe-area-inset-bottom));overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.hm-velo[hidden]{display:none}
.hm-box{margin:auto 0;width:min(520px,100%);background:#FBFAF6;color:#1A2135;border-radius:18px;padding:26px 34px 24px;box-shadow:0 30px 90px rgba(0,0,0,.5);box-sizing:border-box;animation:hm-box .45s cubic-bezier(.2,1.2,.4,1) both}
@keyframes hm-box{from{opacity:0;transform:translateY(20px) scale(.96)}}
.hm-box .tb{display:flex;justify-content:space-between;align-items:center}
.hm-box .bd{font:700 12px/1 "Segoe UI",system-ui,sans-serif;letter-spacing:.12em;color:#fff;background:#C62828;padding:5px 9px;border-radius:4px}
.hm-box .x{border:0;background:none;font-size:30px;line-height:1;color:#7A8194;cursor:pointer;padding:0 4px}
html:root body.home .hm-box h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:44px;color:#14213D;margin:8px 0 2px;text-transform:none;letter-spacing:0}
.hm-box .sub{font-size:16px;color:#4B5468;margin:0 0 16px;line-height:1.45}
.hm-box label.f{display:block;margin:0 0 12px}
.hm-box label.f span{display:block;font-weight:600;font-size:14px;color:#4B5468;margin-bottom:5px}
.hm-box label.f input{width:100%;box-sizing:border-box;height:48px;border:1px solid #D5CFC2;border-radius:10px;padding:0 14px;font-family:inherit;font-size:17px;background:#fff;color:#1A2135}
.hm-box label.f input:focus{outline:2px solid #38559E;outline-offset:0;border-color:#38559E}
.hm-box .pw{position:relative}
.hm-box .pw button{position:absolute;right:6px;bottom:6px;height:36px;border:0;background:none;color:#38559E;font-weight:600;cursor:pointer}
.hm-box .ric{display:flex;gap:10px;align-items:center;font-size:15.5px;color:#4B5468;margin:2px 0 14px}
.hm-box .ric input{width:20px;height:20px;accent-color:#38559E}
.hm-box .entra{width:100%;height:52px;border:0;border-radius:10px;background:#14213D;color:#fff;font-family:inherit;font-weight:700;font-size:19px;letter-spacing:.03em;cursor:pointer}
.hm-box .entra:hover{background:#1C2C50}
.hm-box .entra[disabled]{opacity:.6}
.hm-box .lk{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0 0;font-size:15.5px}
.hm-box .lk button,.hm-box .reg a{border:0;background:none;padding:0;color:#38559E;font-family:inherit;font-weight:600;font-size:15.5px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.hm-box .lk .qr{display:inline-flex;gap:8px;align-items:center;text-decoration:none}
.hm-box .lk .qr svg{width:28px;height:28px;color:#14213D}
.hm-box .reg{margin-top:16px;padding-top:14px;border-top:1px solid #E6E1D6;text-align:center;font-size:15.5px;color:#4B5468}
.hm-box .err .banner{margin-top:10px}
.hm-box .ok{background:#E1EFEA;color:#245C47;border-radius:8px;padding:9px 12px;font-size:15px;margin:0 0 12px}
.hm-box .qr-accesso{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:center}
.hm-box .qr-figura svg{width:150px;height:150px}
@media (max-width:640px){
  .hm{padding:16px 16px 22px}
  .hm-top{justify-content:space-between;align-items:center}
  .hm-marchio{order:-1;width:96px}
  .hm-marchio i,.hm-marchio small{display:none}
  .hm-accedi{height:42px;padding:0 16px;font-size:16px;margin:0}
  .hm-nome{margin-top:12vh}
  .hm-tag{letter-spacing:.3em}
  .hm-velo{place-items:end center;padding:0}
  .hm-box{border-radius:22px 22px 0 0;padding:20px 18px calc(18px + env(safe-area-inset-bottom,0px));animation-name:hm-sale}
  html:root body.home .hm-box h2{font-size:34px}
  .hm-box .qr-accesso{grid-template-columns:1fr}
}
@keyframes hm-sale{from{transform:translateY(100%)}}
@media (prefers-reduced-motion:reduce){.hm *,.hm-box{animation:none!important}}
html.in-simulazione body.home{padding-top:0}

@media (max-width:520px){.hm-box{padding:18px 18px 18px;border-radius:14px} html:root body.home .hm-box h2{font-size:34px}}
