/* Pagine di accesso (nuova grafica, riferimento design/magellano-ui/riferimenti/login.html): pannello antracite a sinistra,
   modulo su bianco a destra. Su telefono il pannello si riduce a logo e titolo, sopra il modulo. */
body.mg-accesso { margin: 0; background: var(--surface); }
.mg-acc { min-height: 100vh; display: flex; flex-wrap: wrap; background: var(--surface); }
.mg-acc a:not([class]) { color: var(--ink-900); }
.mg-acc a:not([class]):hover { color: var(--gold-700); }

.mg-acc__brand { flex: 1 1 520px; min-width: 0; background: var(--night); color: var(--on-night); position: relative; overflow: hidden;
  padding: 48px 56px; display: flex; flex-direction: column; gap: 40px; }
.mg-acc__brand .mg-logo { position: relative; font-size: 22px; }
.mg-acc__brand a.mg-logo:hover, .mg-acc__brand a.mg-logo:focus { color: var(--on-night); }   /* site.css: a:hover scuro */
.mg-acc__brand .mg-logo__mark { width: 34px; height: 34px; }
.mg-acc__orbite { position: absolute; right: -300px; bottom: -280px; pointer-events: none; }
.mg-acc__claim { position: relative; max-width: 460px; margin-top: auto; }
.mg-acc__eyebrow { font: 700 12px/16px var(--font-sans); letter-spacing: .1em; text-transform: uppercase; color: var(--gold-500); }
.mg-acc__claim h2 { margin: 12px 0 0; font: 800 44px/50px var(--font-display); letter-spacing: -.02em; color: var(--on-night); }
.mg-acc__claim p { margin: 16px 0 0; font-size: 16px; line-height: 26px; color: var(--on-night-muted); }
.mg-acc__benefits { position: relative; display: flex; flex-direction: column; gap: 18px; max-width: 440px; margin-bottom: auto; }
.mg-acc__benefit { display: flex; gap: 14px; align-items: flex-start; }
.mg-acc__benefit .k { flex: none; width: 36px; height: 36px; border-radius: 10px; background: var(--night-800); border: 1px solid var(--night-line); color: var(--gold-500); display: grid; place-items: center; }
.mg-acc__benefit b { display: block; font: 700 15px/21px var(--font-display); color: var(--on-night); }
.mg-acc__benefit span { font-size: 14px; line-height: 20px; color: var(--on-night-muted); }

.mg-acc__main { flex: 1 1 480px; min-width: 0; display: flex; align-items: center; justify-content: center; padding: 48px 24px; }
.mg-acc__form { width: 100%; max-width: 420px; display: flex; flex-direction: column; gap: 20px; }
.mg-acc__form h1 { margin: 0; font: 800 32px/40px var(--font-display); letter-spacing: -.015em; color: var(--ink-900); }
.mg-acc__form .sub { margin: 6px 0 0; color: var(--ink-500); }
.mg-acc__social { display: flex; align-items: center; justify-content: center; gap: 12px; height: 50px; width: 100%; border-radius: 10px;
  border: 1px solid var(--border-strong); background: var(--surface); font: 600 15px/1 var(--font-sans); color: var(--ink-900); cursor: pointer; }
.mg-acc__social:hover { border-color: var(--ink-900); }
.mg-acc__social:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.mg-acc__sep { display: flex; align-items: center; gap: 12px; font-size: 13px; color: var(--ink-500); }
.mg-acc__sep::before, .mg-acc__sep::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.mg-acc__labelrow { display: flex; align-items: center; }
.mg-acc__labelrow a { margin-left: auto; font-size: 13px; font-weight: 600; }
.mg-acc__check { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--ink-700); cursor: pointer; }
.mg-acc__check input { width: 18px; height: 18px; accent-color: var(--gold-500); margin: 0; }
.mg-acc__foot { margin: 0; text-align: center; font-size: 14px; color: var(--ink-500); }
.mg-acc__foot a { font-weight: 700; }
.mg-acc__legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px; font-size: 12px; color: var(--ink-500); }
.mg-acc__legal a, .mg-acc__legal button { color: var(--ink-500); background: none; border: 0; padding: 0; font: inherit; text-decoration: none; cursor: pointer; }
.mg-acc__legal a:hover, .mg-acc__legal button:hover { color: var(--ink-900); text-decoration: underline; }

/* pagine di accesso ancora in Bootstrap (registrazione, password, conferme): occupano la colonna del modulo */
.mg-acc__legacy .row { margin: 0; }
.mg-acc__legacy .row.justify-content-center > [class*="col-"] { flex: 0 0 100%; max-width: 100%; padding: 0; }
.mg-acc__legacy .py-5 { padding-top: 0 !important; padding-bottom: 0 !important; }
.mg-acc__legacy h1 { font-size: 30px; line-height: 38px; letter-spacing: -.015em; margin-bottom: 8px; }
.mg-acc__legacy .text-center { text-align: left !important; }

/* messaggi */
.mg-acc .field-validation-error, .mg-acc .validation-summary-errors { color: var(--danger); font-size: 13px; line-height: 18px; }
.mg-acc .validation-summary-errors ul { margin: 0; padding-left: 18px; }
.mg-acc .validation-summary-valid { display: none; }
.mg-acc .mg-input.input-validation-error { border-color: var(--danger); }
.mg-acc__alert { padding: 12px 14px; border-radius: var(--radius-md); font-size: 14px; line-height: 20px; }
.mg-acc__alert--danger { background: var(--danger-bg); color: var(--danger); }
.mg-acc__alert--info { background: var(--info-bg); color: var(--info); }
.mg-acc__alert a { color: inherit; font-weight: 700; }

@media (max-width: 760px) {
  .mg-acc__brand { flex-basis: 100%; padding: 24px 16px 28px; gap: 20px; }
  .mg-acc__claim { margin-top: 0; }
  .mg-acc__claim h2 { font-size: 28px; line-height: 34px; }
  .mg-acc__claim p { font-size: 15px; line-height: 22px; }
  .mg-acc__benefits { display: none; }
  .mg-acc__orbite { width: 420px; height: 420px; right: -220px; bottom: -220px; }
  .mg-acc__main { flex-basis: 100%; padding: 28px 16px 40px; align-items: flex-start; }
  .mg-acc__form h1 { font-size: 28px; line-height: 34px; }
}

/* Logo di Magellano (09/10/2026): anello e ago in oro, senza disco dietro (design/logo) */
.mg-logo__mark { background: none; color: var(--gold-500); border-radius: 0; }
.mg-logo__mark svg, .mg-logo__mark svg.mg-logo-svg { width: 100%; height: 100%; display: block; }