/* ---------- glass system ---------- */
.glass{position:relative;border-radius:var(--r);border:1px solid var(--line);
  background:linear-gradient(145deg,rgba(255,255,255,.30),rgba(255,255,255,.08) 60%,rgba(255,255,255,.14));
  -webkit-backdrop-filter:blur(26px) saturate(190%);backdrop-filter:blur(26px) saturate(190%);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.6),inset 0 -1px 0 rgba(255,255,255,.1),inset 0 0 22px rgba(255,255,255,.06),0 24px 48px -18px var(--shadow),0 3px 8px rgba(10,20,50,.12);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.glass::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .4s;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.34),transparent 62%)}
.glass:hover::after{opacity:1}
.flat{border-radius:22px;background:rgba(255,255,255,.1);box-shadow:inset 0 2px 7px rgba(10,20,50,.2),inset 0 -1px 0 rgba(255,255,255,.28);
  transition:transform .45s var(--ease),background .3s}
.lift:hover{transform:translateY(-4px)}
.t-shadow{text-shadow:0 1px 14px rgba(10,20,50,.28)}

.wrap{max-width:1120px;margin-inline:auto;display:grid;gap:18px}
.reveal{animation:up .8s var(--ease) backwards;animation-delay:calc(var(--i,0)*70ms)}
@keyframes up{from{opacity:0;transform:translateY(26px) scale(.98)}}