.gate{position:relative;isolation:isolate;min-height:100svh;display:grid;grid-template-rows:1fr auto;align-items:center;justify-items:start;gap:28px;padding:clamp(32px,6vh,72px) var(--gutter) 28px clamp(16px,7vw,120px);overflow:hidden;background:var(--night)}.gate-scene{z-index:-2;width:100%;height:100%;object-fit:cover;object-position:70% 50%;transition:filter .9s var(--ease-in-out)}.gate-scene,.gate:before{position:absolute;inset:0}.gate:before{content:"";z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(15,26,40,.72),rgba(15,26,40,.28) 46%,rgba(15,26,40,0) 70%),linear-gradient(0deg,rgba(15,26,40,.8),rgba(15,26,40,0) 26%)}.gate-card{position:relative;width:min(100%,452px);padding:0 clamp(24px,3vw,40px) clamp(28px,3vw,40px);border-radius:0 0 var(--r-l) var(--r-l);background:var(--paper);color:var(--ink);box-shadow:0 40px 80px -30px rgba(0,0,0,.75);transition:opacity .6s var(--ease-out),translate .6s var(--ease-out);--fg:var(--ink);--fg-soft:var(--ink-soft);--focus:var(--blue);--error:var(--danger);--accent:var(--red-ink);--field-bg:var(--white);--field-fg:var(--ink);--field-line:var(--line);--q-line:var(--ink)}.gate-brand{margin-bottom:clamp(22px,3vh,34px)}.gate-banner{display:block;width:auto;height:clamp(66px,9vh,86px)}.gate-card h1{font-size:clamp(30px,1.6vw + 20px,42px);line-height:1.08;max-width:14ch}.gate-lede{margin-top:12px;color:var(--ink-soft)}.gate-form{display:grid;gap:18px;margin-top:26px}.gate-error{display:flex;gap:8px;align-items:flex-start;color:var(--danger);font-weight:600;font-size:var(--t-fine)}.gate-error .icon{flex:none;margin-top:1px}.gate-demo{max-width:62ch;font-size:15px;line-height:1.5;color:var(--mist)}.gate:has(.gate-card[data-open]) .gate-scene{filter:brightness(.12) saturate(.4)}.gate-card[data-open]{opacity:0;translate:0 -12px}@media (prefers-reduced-motion:no-preference){.gate-scene{animation:gate-doors 2.6s var(--ease-in-out) both}.gate-card{animation:gate-card .9s var(--ease-out) .5s both}}@keyframes gate-doors{0%{filter:brightness(.3) saturate(.5)}to{filter:none}}@keyframes gate-card{0%{opacity:0;translate:0 -18px}to{opacity:1;translate:0 0}}@media (max-width:759px){.gate{grid-template-rows:auto auto auto;align-items:start;justify-items:stretch;padding:0 0 28px}.gate-scene{position:static;grid-row:1;height:auto;aspect-ratio:3/2;z-index:auto}.gate:before{display:none}.gate-card{grid-row:2;width:auto;margin:-28px 16px 0;border-radius:0 0 var(--r-l) var(--r-l)}.gate-demo{grid-row:3;padding-inline:16px}}