/* FEDEFIABA — gate di accesso, a tema Grid. */
:root{
  --cream:#FBF6EC; --cream-2:#F4EAD7; --ink:#3A3744; --ink-soft:#6E6A78;
  --blue:#7FA8C0; --honey:#D9A441; --honey-dk:#B5832B; --rose:#E6B7B0;
  --sage:#A9BFA0; --line:#E3D7BF;
  --serif:'Fraunces',Georgia,serif; --sans:'Inter',system-ui,sans-serif;
}
*{ box-sizing:border-box; }
html,body{ margin:0; height:100%; }
body{
  font-family:var(--sans); color:var(--ink); min-height:100vh;
  display:flex; align-items:center; justify-content:center; padding:24px;
  background:radial-gradient(900px 600px at 72% 26%, #FFFDF7 0%, #F6ECD6 55%, #EFE0C2 100%);
}

/* decorazioni leggere (stessi motivi della cover) */
.gate-illo{ position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:0; opacity:.9; }

/* la "modale" */
.gate{
  position:relative; z-index:1; width:100%; max-width:440px;
  background:var(--cream); border:1px solid var(--line); border-radius:20px;
  box-shadow:0 26px 80px rgba(60,45,15,.22); padding:42px 40px 38px; text-align:center;
  animation:gatePop .3s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes gatePop{ from{ transform:translateY(10px) scale(.97); opacity:0 } to{ transform:none; opacity:1 } }
.gate__logo{ height:46px; width:auto; margin-bottom:18px; }
.gate__eyebrow{
  font-size:8.5pt; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--honey-dk); margin:0 0 8px;
}
.gate__title{
  font-family:var(--serif); font-weight:600; font-size:32px; line-height:1.05;
  letter-spacing:-.01em; color:var(--ink); margin:0 0 8px;
}
.gate__sub{ font-size:14px; line-height:1.45; color:var(--ink-soft); margin:0 auto 26px; max-width:30ch; }

.gate__form{ display:flex; flex-direction:column; gap:12px; }
.gate__input{
  font-family:var(--sans); font-size:16px; color:var(--ink); text-align:center;
  padding:14px 16px; border:1.5px solid var(--line); border-radius:12px; background:#fff;
  letter-spacing:.04em; transition:border-color .15s ease, box-shadow .15s ease;
}
.gate__input::placeholder{ color:#B7B0A4; letter-spacing:normal; }
.gate__input:focus{ outline:none; border-color:var(--honey); box-shadow:0 0 0 4px rgba(217,164,65,.18); }
.gate__btn{
  font-family:var(--sans); font-size:15px; font-weight:600; color:#fff; cursor:pointer;
  padding:14px 16px; border:none; border-radius:12px; background:var(--honey-dk);
  transition:transform .12s ease, background .15s ease;
}
.gate__btn:hover{ background:#9c7224; }
.gate__btn:active{ transform:scale(.98); }

.gate__error{
  font-size:13px; color:#A8443A; background:rgba(230,183,176,.28);
  border:1px solid var(--rose); border-radius:10px; padding:9px 12px; margin:0 0 18px;
  animation:shake .3s ease both;
}
@keyframes shake{ 0%,100%{transform:translateX(0)} 25%{transform:translateX(-5px)} 75%{transform:translateX(5px)} }

.gate__foot{ margin-top:24px; font-size:11px; letter-spacing:.04em; color:var(--ink-soft); }
.gate__foot b{ color:var(--honey-dk); font-weight:600; }