/* A quiet front door: Dot, a few words, one way in. */
.access-gate{--gate-ease:cubic-bezier(.22,1,.36,1);position:relative;display:flex;flex-direction:column;min-height:100svh;padding:34px clamp(24px,5.5vw,88px) 40px;background:var(--paper,#f8f7f2);color:var(--ink,#252940);overflow:hidden}
.access-gate__header{flex:none;position:relative;z-index:2}
.access-gate__wordmark{display:inline-block;font-family:var(--brand-sans,Manrope,Arial,sans-serif);font-size:38px;font-weight:750;line-height:1;letter-spacing:-.075em;padding-block:4px}
.access-gate__wordmark>span{color:var(--blue,#424ab3)}
.access-gate__composition{display:grid;grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr);align-items:center;column-gap:clamp(30px,6vw,100px);width:min(100%,1020px);margin:auto; padding:54px 0 50px}
.access-gate__character{position:relative;isolation:isolate;width:100%;max-width:500px;justify-self:center;padding-top:30px}
.access-gate__character:after{content:'';position:absolute;left:23%;right:23%;height:7%;bottom:0;border-radius:50%;background:radial-gradient(ellipse,#363b621b,transparent 70%);filter:blur(6px);pointer-events:none;z-index:-1}
.access-gate__dot{position:relative;display:block;width:100%;aspect-ratio:1;padding:0;border:0;border-radius:50%;background:none;touch-action:manipulation;outline-offset:-25px;cursor:pointer}
.access-gate__dot:disabled{cursor:default}
.access-gate__dot:focus-visible{outline:2px solid var(--blue,#424ab3);outline-offset:-25px}
.access-gate__body{display:block;position:relative;transform-origin:50% 78%;will-change:transform}
.access-gate__body>img{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
.access-gate__face{position:absolute;inset:0;pointer-events:none;translate:var(--gate-look-x,0px) var(--gate-look-y,0px);transition:translate .7s var(--gate-ease)}
.access-gate__eyes{position:absolute;inset:0}
.access-gate__eyes>i{position:absolute;left:39%;top:40%;width:5.2%;height:13%;border-radius:999px;background:#fffdf0;transform-origin:center;box-shadow:0 1px 2px #25295c15}
.access-gate__eyes>i+i{left:56%}
.access-gate__mouth{position:absolute;left:39%;top:56%;width:23%;height:12%;stroke:#fffdf0;stroke-width:3.6;stroke-linecap:round;overflow:visible}
.access-gate__open-mouth{opacity:0;fill:#fffdf0;stroke:none;transform-origin:25px 12px}
.access-gate__smile{transform-origin:25px 12px}
.access-gate__bubble{position:absolute;z-index:2;top:0;left:38%;display:flex;align-items:center;width:clamp(195px,17vw,235px);min-height:84px;padding:17px 21px;background:var(--lilac,#e8e8f3);border-radius:23px 23px 23px 5px;color:var(--ink,#252940);font-size:15px;font-weight:450;line-height:1.5;letter-spacing:-.01em;rotate:4deg;transform-origin:15% 100%;pointer-events:none}
.access-gate__bubble:after{content:'';position:absolute;left:0;bottom:-9px;width:15px;height:17px;background:inherit;clip-path:polygon(0 0,100% 0,0 100%)}
.access-gate__bubble>p{max-width:100%;margin:0}
.access-gate__content{width:100%;max-width:370px;position:relative;z-index:1}
.access-gate__content>h1{position:static;font-family:var(--brand-sans,Manrope,Arial,sans-serif);font-size:clamp(58px,5.8vw,80px);font-weight:550;line-height:.99;letter-spacing:-.065em;margin:0 0 25px}
.access-gate__content>h1>span{display:block}
.access-gate__content>h1 em{font-family:Fraunces,Georgia,serif;font-size:1.04em;font-style:italic;font-weight:450;letter-spacing:-.045em;line-height:1;padding:0;color:var(--blue,#424ab3)}
.access-gate__intro{font-size:15px;line-height:1.75;color:var(--muted,#626678);max-width:310px;margin:0}
.access-gate__form{margin-top:32px}
.access-gate__form>label{display:block;margin-bottom:10px;font-size:12px;font-weight:600;line-height:1.5}
.access-gate__input-wrap{position:relative;border:1px solid var(--brand-line,#cbd0e1);border-radius:14px;background:#ffffff3d;transition:border-color .2s,background .2s,box-shadow .2s}
.access-gate__input-wrap:focus-within{border-color:var(--blue,#424ab3);background:#fffef9;box-shadow:0 0 0 3px #424ab30c}
.access-gate__input-wrap:has([aria-invalid=true]){border-color:#93605c}
.access-gate__input-wrap>input{display:block;width:100%;min-width:0;height:54px;margin:0;padding:0 17px;border:0;border-radius:inherit;background:transparent;box-shadow:none;font-family:var(--brand-sans,Manrope,Arial,sans-serif);font-size:16px;font-weight:450;line-height:1.5;color:var(--ink,#252940);letter-spacing:.06em;-webkit-appearance:none;appearance:none}
.access-gate__input-wrap>input::placeholder{font-size:14px;letter-spacing:0;color:#7b7e8c;opacity:1}
.access-gate__input-wrap>input:focus{outline:none}
.access-gate__input-wrap>input:disabled{opacity:.65}
.access-gate__submit{display:flex;align-items:center;justify-content:center;width:100%;min-height:56px;margin-top:12px;padding:14px 20px;border:1px solid var(--blue,#424ab3);border-radius:14px;background:var(--blue,#424ab3);color:#fffdf4;font-family:var(--brand-sans,Manrope,Arial,sans-serif);font-size:14px;font-weight:550;line-height:1.5;letter-spacing:0;transition:background .2s,transform .3s var(--gate-ease),box-shadow .3s}
.access-gate__submit>span{display:block}
.access-gate__submit:not(:disabled):hover{background:#353d9e;border-color:#353d9e;transform:translateY(-2px);box-shadow:0 5px 15px #424ab31a}
.access-gate__submit:not(:disabled):active{transform:translateY(0);box-shadow:none}
.access-gate__submit:disabled{cursor:wait}
.access-gate--success .access-gate__submit{cursor:default}
.access-gate__error{min-height:44px;margin:11px 0 0;font-size:12px;line-height:1.6;color:#865753}
.access-gate--motion .access-gate__body{animation:gate-bob 6.7s ease-in-out infinite}
.access-gate--motion .access-gate__eyes>i{animation:gate-blink 5.3s infinite}
.access-gate--motion .access-gate__eyes>i+i{animation-delay:.05s}
.access-gate--motion .access-gate__bubble>p{animation:gate-line-in .42s var(--gate-ease) both}
.access-gate--motion.access-gate--speaking .access-gate__smile{animation:gate-talk-smile .34s ease-in-out 5}
.access-gate--motion.access-gate--speaking .access-gate__open-mouth{animation:gate-talk-open .34s ease-in-out 5}
.access-gate--motion.access-gate--error .access-gate__body{animation:gate-shrug .65s var(--gate-ease),gate-bob 6.7s .65s ease-in-out infinite}
.access-gate--motion.access-gate--success .access-gate__body{animation:gate-yes .85s var(--gate-ease) both}
.access-gate--motion.access-gate--success .access-gate__eyes>i{height:7%;border-radius:50% 50% 45% 45%;top:42%;animation:none}
@keyframes gate-bob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-11px) rotate(3deg)}}
@keyframes gate-blink{0%,43%,47%,100%{scale:1 1}45%{scale:1 .08}}
@keyframes gate-line-in{from{opacity:0;translate:0 5px}to{opacity:1;translate:0 0}}
@keyframes gate-talk-smile{0%,100%{opacity:1;scale:1 1}45%,60%{opacity:0;scale:.8 .5}}
@keyframes gate-talk-open{0%,100%{opacity:0;scale:.75 .3}45%,60%{opacity:1;scale:1 1}}
@keyframes gate-shrug{0%,100%{transform:rotate(0)}30%{transform:rotate(-7deg)}65%{transform:rotate(5deg)}}
@keyframes gate-yes{0%{transform:translateY(0) scale(1)}18%{transform:translateY(7px) scale(1.06,.93)}53%{transform:translateY(-32px) scale(.97,1.03) rotate(-7deg)}80%{transform:translateY(2px) scale(1.03,.97)}100%{transform:translateY(0) scale(1)}}
@media(min-width:761px) and (max-height:720px){.access-gate{padding-block:25px}.access-gate__composition{padding-block:25px;max-width:900px}.access-gate__character{max-width:400px}.access-gate__content>h1{font-size:65px}.access-gate__bubble{min-height:76px;font-size:14px}}
@media(max-width:760px){
 .access-gate{padding:calc(40px + env(safe-area-inset-top)) var(--gutter,24px) max(20px,env(safe-area-inset-bottom));min-height:100svh}.access-gate__wordmark{font-size:34px;letter-spacing:-.065em}
 .access-gate__composition{display:flex;flex-direction:column;width:100%;max-width:370px;gap:20px;margin:auto;padding:32px 0 8px}
 .access-gate__character{width:245px;max-width:72vw;padding-top:22px;margin-left:-24px}
 .access-gate__bubble{top:0;left:51%;width:164px;min-height:68px;padding:12px 15px;font-size:12px;line-height:1.5;border-radius:18px 18px 18px 4px;rotate:3deg}
 .access-gate__dot{outline-offset:-15px}.access-gate__dot:focus-visible{outline-offset:-15px}
 .access-gate__content{max-width:340px}.access-gate__content>h1{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:.18em;font-size:clamp(36px,10.6vw,46px);line-height:1.08;margin-bottom:17px;letter-spacing:-.045em}.access-gate__content>h1>span{display:inline-block;white-space:nowrap}.access-gate__content>h1 em{font-size:1.03em}
 .access-gate__intro{max-width:315px;font-size:14px;line-height:1.7;text-wrap:pretty}.access-gate__form{margin-top:26px}.access-gate__form>label{font-size:12px;margin-bottom:9px}
 .access-gate__input-wrap>input{height:50px}.access-gate__submit{min-height:52px;font-size:14px;margin-top:10px}.access-gate__error{font-size:12px;min-height:38px;margin-top:10px}
}
@media(max-width:370px){.access-gate__character{width:222px}.access-gate__bubble{left:47%;width:154px}.access-gate__intro{font-size:13px}.access-gate__composition{padding-top:24px}}
@media(max-width:760px) and (max-height:700px){
 .access-gate{padding-top:calc(32px + env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom))}.access-gate__composition{padding-block:18px 0;gap:12px}.access-gate__character{width:190px;padding-top:21px}
 .access-gate__bubble{left:47%;top:0;width:157px;min-height:68px;font-size:12px;padding:11px 13px}.access-gate__content>h1{font-size:36px;margin-bottom:14px}.access-gate__form{margin-top:20px}
 .access-gate__error{min-height:36px}
}
@media(prefers-reduced-motion:reduce){.access-gate *,.access-gate *:before,.access-gate *:after{animation:none!important;transition:none!important}.access-gate__face{translate:0 0}.access-gate__submit:not(:disabled):hover{transform:none}}
