@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700;800&family=Unbounded:wght@500;700;800;900&display=swap');
:root{color-scheme:dark;--cream:#eee1cb;--muted:#b8a999;--ink:#231f27;--red:#c76043;--gold:#e4b468}*{box-sizing:border-box}body{margin:0;background:#211e25;color:var(--cream);font-family:Manrope,Arial,sans-serif}.welcome{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(390px,.75fr)}.poster{position:relative;min-height:100vh;overflow:hidden;display:flex;flex-direction:column;background:#2c2730}.poster-top,.poster-bottom{position:relative;z-index:3;display:flex;justify-content:space-between;gap:20px;font-size:11px;letter-spacing:.1em;font-weight:800;color:#d2bfaa}.poster-top{padding:31px 6%}.poster-bottom{margin-top:auto;padding:25px 6%;background:#27232b}.identity{position:relative;z-index:3;padding:clamp(35px,7vh,90px) 6% 0}.brand-mark{font:900 clamp(51px,8vw,122px)/.84 Unbounded,Arial,sans-serif;letter-spacing:-.04em;max-width:900px;color:#efe0c9;text-shadow:0 5px 0 #875342}.brand-mark span,.brand-mark strong{display:block}.brand-mark strong{color:#db805f}.brand-mark i{display:inline-block;width:.17em;height:.17em;background:#ebc783;margin-left:.09em;vertical-align:baseline}.identity p{margin:26px 0 0;font-weight:700;line-height:1.6;font-size:clamp(14px,1.25vw,18px)}.street{position:absolute;inset:36% 0 41px;background:#312b31 url('assets/passport/highway-environment-v2.png') center/cover no-repeat;image-rendering:pixelated}.street:before{content:"";position:absolute;inset:0;background:linear-gradient(#2c2730 0%,transparent 24%,transparent 80%,#27232b 100%)}.street img{position:absolute;image-rendering:pixelated;object-fit:contain}.car{width:clamp(105px,15vw,220px);filter:drop-shadow(7px 8px 2px #14121999)}.car-one{top:24%;left:17%;animation:traffic 12s linear infinite}.car-two{top:43%;left:58%;animation:traffic-reverse 10s linear infinite}.car-three{top:61%;left:14%;animation:traffic 15s linear infinite}.walker{width:clamp(47px,6vw,82px);bottom:3%;left:51%;filter:drop-shadow(5px 7px 1px #14121999)}@keyframes traffic{from{transform:translateX(-35vw) scaleX(-1)}to{transform:translateX(65vw) scaleX(-1)}}@keyframes traffic-reverse{from{transform:translateX(45vw)}to{transform:translateX(-65vw)}}.entry{min-height:100vh;background:#ede5d6;color:#29252a;display:flex;flex-direction:column;padding:40px clamp(28px,5vw,86px) 26px}.entry-inner{width:100%;max-width:450px;margin:auto}.entry-symbol{font-size:24px;color:#b64e37;margin-bottom:38px}.entry-caption{font-size:11px;font-weight:800;letter-spacing:.1em;color:#795043;margin:0 0 20px}.entry h1{font:800 clamp(30px,3.1vw,45px)/1.13 Unbounded,Arial,sans-serif;letter-spacing:-.035em;margin:0}.entry h1 em{font-style:normal;color:#b84f38}.entry-copy{font-size:14px;line-height:1.8;color:#655b58;margin:22px 0 38px;max-width:390px}.entry label{display:block;font-size:12px;font-weight:800;margin-bottom:10px}.entry input{width:100%;height:56px;border:1px solid #b9ada0;border-radius:0;background:#f8f2e8;color:#29252a;font:600 15px Manrope,Arial,sans-serif;padding:0 16px}.entry input::placeholder{color:#6d625d}.entry button{width:100%;min-height:57px;background:#b94e37;color:#fff8ee;border:0;padding:0 19px;text-align:left;font:800 11px Manrope,Arial,sans-serif;letter-spacing:.09em;cursor:pointer}.entry button:hover{background:#933c2d}.entry button span{float:right;font-size:18px}.entry :focus-visible{outline:3px solid #bf693f;outline-offset:3px}.entry-error{color:#a32d20;font-size:12px;min-height:16px;margin:8px 0}.local-note{color:#6f625b;font-size:11px;line-height:1.7;margin:18px 0 0}.entry-foot{display:flex;justify-content:space-between;gap:16px;color:#81746b;font-size:11px;font-weight:800;letter-spacing:.07em;margin-top:45px}::selection{background:#c76043;color:white}@media(max-width:850px){.welcome{grid-template-columns:1fr}.poster{min-height:480px}.identity{padding-top:38px}.street{inset:34% 0 40px}.entry{min-height:auto;padding:56px 8% 24px}.entry-inner{margin:0 auto}.entry-symbol{margin-bottom:22px}.entry-foot{margin-top:48px}}@media(max-width:450px){.poster{min-height:390px}.poster-top,.poster-bottom{font-size:11px}.brand-mark{font-size:clamp(48px,12vw,64px)}.identity p{font-size:13px}.entry h1{font-size:29px}.street{inset:37% 0 38px}}@media(prefers-reduced-motion:reduce){.car{animation:none}.car-one,.car-three{transform:scaleX(-1)}}
