:root{--paper:#F4F5FB;--ink:#0C1230;--blue:#2440FF;--coral:#FF5A3C;--sun:#FFD037;--mute:#59607F;--line:rgba(12,18,48,.14);--d:"Gabarito",system-ui,sans-serif;--b:"Figtree",system-ui,sans-serif;--h:"Caveat",cursive;
--noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E")}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--ink);font-family:var(--b);font-size:18px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.w{width:min(1240px,100% - 48px);margin-inline:auto;position:relative;z-index:1}
h1,h2,h3{font-family:var(--d);font-weight:900;letter-spacing:-.03em;line-height:1}
h2{font-size:clamp(40px,5.6vw,80px)}
.no{font-family:var(--d);font-weight:800;font-size:17px;margin-bottom:14px}
.no b{color:var(--coral)}
.lede{font-size:21px;color:var(--mute);margin-top:18px;max-width:50ch}
.hd{display:grid;grid-template-columns:auto minmax(300px,470px);justify-content:space-between;gap:18px 60px;align-items:end}
.hd h2{white-space:nowrap}
.mb{display:none}
.hd .lede{margin:0 0 .3em}
.hand{font-family:var(--h);font-weight:700;line-height:1}
section{padding:92px 0;position:relative}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:58px;padding:0 30px;border-radius:99px;font-family:var(--d);font-weight:800;font-size:19px;text-decoration:none;border:2px solid transparent;cursor:pointer;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translate(-2px,-3px);box-shadow:4px 6px 0 rgba(12,18,48,.9)}
.b-white{background:#fff;color:var(--ink)}
.b-ink{background:var(--ink);color:#fff}
.b-ink:hover{box-shadow:4px 6px 0 rgba(255,255,255,.9)}
.b-line{border-color:currentColor}

/* grain: every color block gets a little tooth */
.g::before{content:"";position:absolute;inset:0;background:var(--noise);opacity:.3;mix-blend-mode:overlay;pointer-events:none;border-radius:inherit}
.g.lt::before{mix-blend-mode:multiply;opacity:.13}

/* sheets: each block slides over the one before it */
.sheet{border-radius:48px 48px 0 0;margin-top:-48px;box-shadow:0 -26px 50px -30px rgba(12,18,48,.45)}
.under{padding-bottom:140px}

/* hero: one screen, the work fills it, the headline sits on top */
.hero{position:relative;color:#fff;background:var(--blue);overflow:hidden;display:flex;flex-direction:column;min-height:clamp(600px,100svh,920px);padding-bottom:48px}
.wall{position:absolute;inset:0;perspective:1900px;overflow:hidden}
.plane{position:absolute;left:50%;top:50%;width:2660px;height:1600px;margin:-800px 0 0 -1330px;transform:rotateX(48deg) rotateZ(-26deg)}
.cols{display:flex;gap:24px;height:100%;translate:calc(var(--mx,0)*1px) calc(var(--my,0)*1px);transition:translate .6s cubic-bezier(.2,.7,.3,1);animation:drift 20s ease-in-out infinite alternate}
@keyframes drift{from{transform:translate3d(-26px,14px,0)}to{transform:translate3d(26px,-14px,0)}}
.cols>div{flex:1;display:grid;gap:24px;align-content:start}
.cols>div:nth-child(even){margin-top:-120px}
.cols img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:13px;background:#1A2FD0;box-shadow:0 34px 50px -22px rgba(3,6,60,.9),0 0 0 1px rgba(255,255,255,.14);animation:deal .9s cubic-bezier(.2,.8,.3,1) backwards;animation-delay:calc((var(--c,0) + var(--r,0))*55ms)}
@keyframes deal{from{opacity:0;transform:translateY(70px) scale(.94)}}
.cols>div:nth-child(2){--c:1}.cols>div:nth-child(3){--c:2}.cols>div:nth-child(4){--c:3}.cols>div:nth-child(5){--c:4}.cols>div:nth-child(6){--c:5}.cols>div:nth-child(7){--c:6}
.cols img:nth-child(2){--r:1}.cols img:nth-child(3){--r:2}.cols img:nth-child(4){--r:3}.cols img:nth-child(5){--r:4}.cols img:nth-child(6){--r:5}.cols img:nth-child(7){--r:6}
.wall::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(54% 58% at 50% 55%,rgba(31,56,240,.97) 0,rgba(31,56,240,.93) 42%,rgba(31,56,240,.5) 76%,rgba(22,36,170,.28) 100%),linear-gradient(rgba(10,16,70,.7),rgba(10,16,70,0) 24%)}
.wall::after{content:"";position:absolute;inset:0;z-index:1;background:var(--noise);opacity:.3;mix-blend-mode:overlay}
.top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:24px 0}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--d);font-weight:900;font-size:24px;letter-spacing:-.02em}
.logo svg{width:42px;height:42px;flex:none}
.logo span{font:600 13px/1.2 var(--b);letter-spacing:0;opacity:.85;max-width:15ch}
.top nav{display:flex;align-items:center;gap:26px;font-weight:600;font-size:16px}
.top nav a{text-decoration:none}
.top nav a:not(.btn):hover{text-decoration:underline wavy var(--sun);text-underline-offset:5px}
.top .btn{min-height:46px;padding:0 20px;font-size:16px}
.mid{text-align:center;margin-block:auto;padding:14px 0 30px}
.pill{display:inline-block;background:var(--ink);font-weight:700;font-size:15px;padding:8px 18px;border-radius:99px;margin-bottom:22px;transform:rotate(-1.5deg)}
h1{font-size:clamp(44px,min(6.5vw,11.8vh),100px);text-shadow:0 3px 0 rgba(8,14,90,.3),0 20px 60px rgba(8,14,90,.6)}
h1 s{text-decoration:none;position:relative;display:inline-block}
h1 s::after{content:"";position:absolute;left:-3%;right:-3%;top:52%;height:.1em;background:var(--coral);border-radius:99px;transform:rotate(-1.5deg);transform-origin:left;animation:strike .5s .9s cubic-bezier(.7,0,.2,1) backwards}
@keyframes strike{from{transform:scaleX(0) rotate(-1.5deg)}}
h1 em{font-style:normal;color:var(--sun);position:relative;display:inline-block}
.sq{position:absolute;left:0;right:0;bottom:-.2em;width:100%;height:.26em;overflow:visible}
.sq path{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-dasharray:330;stroke-dashoffset:330;animation:draw .9s 1.3s ease forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.sub{font-size:21px;max-width:46ch;margin:30px auto 26px}
.cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.own{position:absolute;z-index:1;right:3.5%;bottom:82px;font-size:29px;transform:rotate(-5deg);display:none;text-shadow:0 2px 14px rgba(6,10,80,.95),0 0 4px rgba(6,10,80,.8)}

/* the say, and the switch that proves it */
.say{background:#fff;padding-top:96px}
.say .w{display:grid;grid-template-columns:1fr minmax(0,470px);gap:40px 84px;align-items:center}
.say p{font-family:var(--d);font-weight:800;font-size:clamp(31px,4vw,56px);line-height:1.06;letter-spacing:-.025em;max-width:18ch}
.say mark{color:inherit;background:linear-gradient(transparent 52%,var(--sun) 52%,var(--sun) 92%,transparent 92%);padding:0 .08em;margin:0 -.08em}
.txt .hand{display:block;font-size:34px;color:var(--blue);margin-top:26px;transform:rotate(-2deg);transform-origin:left}
.demo{text-align:center}
.swrap{position:relative;display:inline-block}
.sw{display:inline-flex;background:var(--ink);border-radius:99px;padding:5px;margin-bottom:22px}
.sw button{border:0;background:none;color:#fff;font-family:var(--d);font-weight:800;font-size:17px;padding:11px 22px;border-radius:99px;cursor:pointer}
.sw button[aria-pressed=true]{background:var(--sun);color:var(--ink)}
.flip{position:absolute;right:100%;top:-30px;margin-right:6px;white-space:nowrap;font-size:30px;color:var(--blue);transform:rotate(6deg);display:none;align-items:flex-end;gap:4px}
.flip svg{width:54px;height:40px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;transform:scaleX(-1) translateY(16px)}
.cw{position:relative}
.card{background:#fff;color:var(--ink);border-radius:30px;overflow:hidden;text-align:left;border:3px solid var(--ink);box-shadow:12px 14px 0 var(--ink)}
.seal{position:absolute;right:-40px;top:-58px;width:122px;height:122px;z-index:2;filter:drop-shadow(0 10px 10px rgba(12,18,48,.3))}
.seal svg{width:100%;height:100%}
.seal .spin{transform-origin:50% 50%;animation:spin 22s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.li{padding:30px 32px 26px}
.nm{font-family:var(--d);font-weight:900;font-size:30px;letter-spacing:-.02em;line-height:1.05}
.rt{margin-top:10px;font-weight:600;color:var(--mute)}
.rt b{color:var(--ink)}
.rt span{color:#F5A300;letter-spacing:2px}
.sb{font-size:16px;color:var(--mute)}
.sb b{color:#157A3B}
.ac{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.ac span{border:2px solid var(--line);border-radius:99px;padding:9px 17px;font-weight:700;font-size:16px}
.ac .web{border:2px dashed var(--coral);color:#C2371C;transition:background .4s,color .4s}
.web s{display:none;text-decoration:none}
.web u{text-decoration:none}
.after .web{border-style:solid;border-color:var(--blue);background:var(--blue);color:#fff}
.after .web u{display:none}
.after .web s{display:inline}
.pv{background:var(--paper);padding:24px 28px;display:grid;place-items:center;min-height:214px}
.none{width:100%;border:2px dashed rgba(255,90,60,.65);border-radius:20px;padding:30px 24px;text-align:center;font-family:var(--d);font-weight:800;font-size:24px;color:#C2371C}
.none small{display:block;font:500 16px/1.45 var(--b);color:var(--mute);margin-top:8px}
.site{display:none;width:100%;background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 18px 34px -16px rgba(12,18,48,.5);transform:rotate(-1.5deg)}
.after .none{display:none}
.after .site{display:block;animation:pop .45s cubic-bezier(.2,.9,.3,1.25)}
@keyframes pop{from{transform:scale(.88) rotate(3deg);opacity:0}}
.bar{display:flex;align-items:center;gap:6px;padding:10px 13px;background:#E9ECF6;font-size:12px;font-weight:600;color:var(--mute)}
.bar i{width:8px;height:8px;border-radius:50%;background:#C3C8DB;flex:none}
.bar span{margin-left:8px;flex:1;background:#fff;border-radius:99px;padding:3px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg{padding:20px;display:grid;gap:10px}
.pg b{height:24px;width:68%;border-radius:8px;background:var(--ink)}
.pg u{height:10px;width:94%;border-radius:6px;background:#DDE1EE}
.pg u+u{width:62%}
.pg div{display:flex;gap:8px;margin-top:6px}
.pg em{font:800 13px var(--d);padding:9px 17px;border-radius:99px;background:var(--blue);color:#fff}
.pg em+em{background:none;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}

/* work: pick a project, see the mock-up */
.work{background:var(--paper)}
.show{display:grid;grid-template-columns:270px 1fr;gap:34px;margin-top:44px;align-items:start}
.idx{display:grid;gap:4px;position:sticky;top:18px}
.idx button{display:grid;grid-template-columns:36px 1fr;text-align:left;border:0;background:none;padding:13px 16px;border-radius:18px;cursor:pointer;transition:transform .2s}
.idx i{grid-row:span 2;font:800 14px var(--d);color:var(--mute);padding-top:5px}
.idx b{font-family:var(--d);font-weight:800;font-size:21px;letter-spacing:-.015em;line-height:1.15}
.idx span{font-size:14px;color:var(--mute)}
.idx button:hover{background:#fff;transform:translateX(6px)}
.idx button[aria-selected=true]{background:var(--ink);color:#fff;transform:rotate(-1.5deg);box-shadow:6px 7px 0 var(--sun)}
.idx button[aria-selected=true] i,.idx button[aria-selected=true] span{color:rgba(255,255,255,.72)}
.pn{background:#fff;border-radius:32px;overflow:hidden;margin-bottom:24px;box-shadow:0 40px 70px -40px rgba(12,18,48,.5)}
.js .pn{display:none;margin:0}
.js .pn.on{display:block;animation:rise .4s cubic-bezier(.2,.8,.3,1.1)}
@keyframes rise{from{opacity:0;transform:translateY(14px) rotate(.6deg)}}
.mock{display:block;width:100%;position:relative;border:0;cursor:zoom-in;text-align:left;padding:34px 0 0 5%;overflow:hidden;background:radial-gradient(90% 120% at 12% 0,color-mix(in srgb,var(--c) 30%,#fff),color-mix(in srgb,var(--c) 62%,#fff))}
.mock::before{content:"";position:absolute;inset:0;background:var(--noise);opacity:.4;mix-blend-mode:overlay}
.mock::after{content:attr(data-no);position:absolute;right:20px;top:-22px;font:900 190px/1 var(--d);letter-spacing:-.06em;color:#fff;opacity:.42}
.br,.scr{display:block}
.br{position:relative;z-index:1;width:64%;background:#fff;border-radius:14px 14px 0 0;overflow:hidden;box-shadow:0 30px 60px -22px rgba(12,18,48,.7);transition:transform .45s cubic-bezier(.2,.8,.3,1.1)}
.scr{position:relative;aspect-ratio:1280/800;background:var(--c)}
.scr img,.ph img{width:100%;height:100%;object-fit:cover;object-position:top}
.miss img{display:none}
.scr.miss::after{content:attr(data-n);position:absolute;inset:0;display:grid;place-items:center;font:900 34px var(--d);color:#fff}
.ph{position:absolute;z-index:1;right:10%;bottom:-7%;width:17%;padding:5px;border-radius:24px;background:var(--ink);box-shadow:0 26px 44px -16px rgba(12,18,48,.85);transform:rotate(4deg);transition:transform .45s cubic-bezier(.2,.8,.3,1.1)}
.ph span{display:block;aspect-ratio:390/780;border-radius:19px;overflow:hidden;background:#222}
.ph.miss{display:none}
.mock:hover .br{transform:translateY(-8px)}
.mock:hover .ph{transform:rotate(0) translateY(-10px)}
.jot{position:absolute;z-index:1;right:4%;top:11%;width:21%;font:700 26px/1.02 var(--h);color:var(--ink);text-align:center;transform:rotate(5deg)}
.info{display:grid;grid-template-columns:1.35fr 1fr;gap:18px 40px;padding:26px 38px 34px}
.info h3{font-size:34px;margin:10px 0 8px}
.info p{color:var(--mute)}
.info ul{list-style:none;display:grid;gap:9px;align-content:start;padding-top:8px;font-weight:600;font-size:17px}
.info li{padding-left:24px;position:relative}
.info li::before{content:"";position:absolute;left:0;top:.5em;width:11px;height:11px;border-radius:50%;background:var(--c)}
.st{display:inline-block;font:800 14px var(--d);padding:5px 13px;border-radius:99px}
.st.live{background:#DDF7E5;color:#157A3B}
.st.prev{background:#FFF1C2;color:#7A5600}
.st.con{background:#E7EAF5;color:#3D4468}
.legend{font-size:15px;color:var(--mute);margin-top:22px;max-width:88ch}
.legend b{color:var(--ink)}

/* what you get */
.get{background:var(--sun);overflow:hidden}
.get::after{content:"";position:absolute;right:-40px;top:-40px;width:520px;height:520px;background:radial-gradient(var(--ink) 1.700px,transparent 2.200px) 0 0/15px 15px;opacity:.2;-webkit-mask-image:radial-gradient(circle at 100% 0,#000 10%,transparent 68%);mask-image:radial-gradient(circle at 100% 0,#000 10%,transparent 68%)}
.get .lede{color:var(--ink);opacity:.82}
.jobs{list-style:none;counter-reset:j;display:grid;grid-template-columns:repeat(3,1fr);gap:0 44px;margin-top:50px}
.jobs li{counter-increment:j;display:grid;grid-template-columns:70px 1fr;align-content:start;padding:26px 0;border-top:3px solid var(--ink);transition:transform .25s}
.jobs li:hover{transform:translateX(10px)}
.jobs li::before{content:counter(j,decimal-leading-zero);grid-row:span 2;font:900 46px/1 var(--d);letter-spacing:-.05em;color:transparent;-webkit-text-stroke:2.200px var(--ink)}
.jobs li:hover::before{color:var(--ink)}
.jobs b{font-family:var(--d);font-weight:800;font-size:23px;letter-spacing:-.015em;line-height:1.15}
.jobs span{font-size:17px;opacity:.86;margin-top:5px}

/* price list */
.menu{background:#fff}
.stamp{flex:none;font:900 19px/1.1 var(--d);color:var(--coral);border:3px solid var(--coral);border-radius:12px;padding:12px 16px;text-align:center;transform:rotate(7deg);max-width:210px;opacity:.92;text-transform:uppercase;letter-spacing:.02em}
.rows{margin-top:44px;border-bottom:3px solid var(--ink)}
.row{display:grid;grid-template-columns:1fr auto;gap:8px 44px;padding:32px 0;border-top:3px solid var(--ink)}
.row h3{font-size:36px}
.row p{color:var(--mute);margin-top:10px;max-width:56ch}
.row ul{list-style:none;display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.row li{font-size:15px;font-weight:600;background:var(--paper);border-radius:99px;padding:7px 15px}
.pr{text-align:right;font:900 76px/1 var(--d);letter-spacing:-.045em;color:var(--blue);text-shadow:4px 5px 0 var(--sun)}
.pr small{display:block;font:700 15px/1.4 var(--b);letter-spacing:0;color:var(--mute);text-shadow:none}
.pay{display:flex;align-items:center;justify-content:space-between;gap:18px 40px;flex-wrap:wrap;margin-top:36px;background:var(--ink);color:#fff;border-radius:28px;padding:28px 34px;box-shadow:8px 10px 0 var(--sun)}
.pay b{display:block;font-family:var(--d);font-weight:900;font-size:28px;letter-spacing:-.02em;line-height:1.1}
.pay span{display:block;opacity:.82;margin-top:6px;font-size:17px}
.pay .hand{font-size:29px;color:var(--sun);transform:rotate(-3deg)}
.b-sun{background:var(--sun);color:var(--ink)}
.b-sun:hover{box-shadow:4px 6px 0 rgba(255,255,255,.9)}
[hidden]{display:none!important}
.end{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-top:44px}
.fine{font-size:15px;color:var(--mute);max-width:74ch}

/* apps and games */
.more{background:var(--ink);color:#fff;overflow:hidden}
.more::after{content:"";position:absolute;left:50%;top:230px;width:1000px;height:560px;margin-left:-500px;background:radial-gradient(closest-side,rgba(36,64,255,.6),transparent);pointer-events:none}
.more .lede{color:rgba(255,255,255,.78)}
.fones{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;max-width:920px;margin:60px auto 0}
.fone{text-align:center}
.fr{display:block;border-radius:32px;padding:6px;background:#04071A;box-shadow:0 0 0 2px rgba(255,255,255,.24),0 44px 70px -30px #000;transition:transform .4s cubic-bezier(.2,.8,.3,1.1)}
.fr img{width:100%;height:auto;aspect-ratio:390/780;object-fit:cover;object-position:top;border-radius:26px;background:#141A3C}
.fone:nth-child(odd) .fr{transform:rotate(-2deg)}
.fone:nth-child(even) .fr{transform:rotate(2deg) translateY(16px)}
.fone:hover .fr{transform:translateY(-8px)}
.fone figcaption{margin-top:34px}
.fone b{display:block;font-family:var(--d);font-weight:800;font-size:21px;letter-spacing:-.015em}
.fone .hand{display:block;font-size:24px;color:var(--sun);margin-top:4px}
.cap{text-align:center;color:rgba(255,255,255,.72);font-size:17px;max-width:68ch;margin:30px auto 0}
.kind{font-size:40px;margin:70px 0 22px;display:flex;align-items:baseline;gap:16px}
.kind .hand{font-size:30px;color:var(--sun);transform:rotate(-3deg)}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.tier{background:rgba(255,255,255,.06);border:2px solid rgba(255,255,255,.16);border-radius:26px;padding:28px;transition:transform .25s,border-color .25s}
.tier:hover{transform:translateY(-6px);border-color:var(--sun)}
.tier h4{font:800 24px/1.1 var(--d);letter-spacing:-.015em}
.tp{font:900 58px/1 var(--d);letter-spacing:-.045em;color:var(--sun);margin:12px 0 14px}
.tp small{display:block;font:700 14px/1.5 var(--b);letter-spacing:0;color:rgba(255,255,255,.6)}
.tier>p:not(.tp){color:rgba(255,255,255,.82);font-size:17px}
.tier ul{list-style:none;display:grid;gap:8px;margin-top:16px;font-weight:600;font-size:16px}
.tier li{padding-left:22px;position:relative}
.tier li::before{content:"";position:absolute;left:0;top:.5em;width:10px;height:10px;border-radius:50%;background:var(--sun)}
.gm .tp{color:var(--coral)}
.gm li::before{background:var(--coral)}
.gm .tier:hover{border-color:var(--coral)}
.more .fine{color:rgba(255,255,255,.6);margin-top:26px}

/* the route */
.route{background:var(--blue);color:#fff;overflow:hidden}
.route .bgm{position:absolute;inset:0;opacity:.55}
.route .bgm svg{width:100%;height:100%}
.stops{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-top:58px;position:relative}
.stops::before{content:"";position:absolute;left:30px;right:calc((100% - 90px)/4 - 30px);top:28px;border-top:4px dashed rgba(255,255,255,.7)}
.stops li{counter-increment:s;position:relative}
.stops li::before{content:counter(s);display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:#fff;color:var(--ink);font:900 27px var(--d);margin-bottom:22px;box-shadow:5px 6px 0 var(--ink)}
.stops li:last-child::before{background:var(--sun)}
.stops h3{font-size:28px;margin-bottom:8px}
.stops p{font-size:17px;opacity:.94}

/* who */
.who{background:var(--paper)}
.who .lede{max-width:56ch}
.facts{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:50px}
.facts li{background:#fff;border-radius:26px;padding:30px;box-shadow:8px 10px 0 var(--ink);border:3px solid var(--ink);transition:transform .25s}
.facts li:nth-child(1){transform:rotate(-1.4deg)}
.facts li:nth-child(2){transform:rotate(1deg) translateY(10px);background:var(--sun)}
.facts li:nth-child(3){transform:rotate(-1deg)}
.facts li:hover{transform:rotate(0) translateY(-6px)}
.facts b{display:block;font-family:var(--d);font-weight:900;font-size:27px;letter-spacing:-.02em;line-height:1.1;margin-bottom:8px}
.facts span{font-size:17px;color:var(--ink);opacity:.8}

/* contact */
.contact{background:var(--coral)}
.contact .w{display:grid;grid-template-columns:1fr minmax(0,540px);gap:56px;align-items:center}
.contact h2{font-size:clamp(58px,7.4vw,104px);white-space:nowrap}
.contact .lede{color:var(--ink);opacity:.88}
.big{display:grid;gap:12px;margin-top:30px;max-width:380px}
.big .btn{min-height:64px;font-size:21px}
form{background:#fff;border-radius:32px;padding:34px;display:grid;gap:16px;border:3px solid var(--ink);box-shadow:12px 14px 0 var(--ink);transform:rotate(1deg)}
form h3{font-size:30px}
label{display:grid;gap:6px;font-weight:700;font-size:14px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
input,select,textarea{width:100%;min-height:54px;background:#fff;border:2px solid #D3D7E6;border-radius:15px;padding:13px 15px;font-size:17px;font-weight:500}
textarea{min-height:104px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
form .btn{width:100%}
.msg{display:none;border-radius:16px;padding:16px 18px;font-size:16px;font-weight:500}
.msg.show{display:block}
.msg.ok{background:#DDF7E5;color:#0F5C2B}
.msg.err{background:#FFE3DC;color:#8E2410}
.msg.alt{background:#FFF1C2;color:#5E4300}
.msg .btn{margin-top:12px;min-height:50px;font-size:17px;width:auto}
.note{font-size:14px;color:var(--mute);text-align:center}

footer{background:var(--ink);color:rgba(255,255,255,.72);padding:70px 0 0;font-size:14px;position:relative;overflow:hidden}
footer .w{display:grid;gap:12px}
footer b{color:#fff;font-weight:700}
footer p{max-width:96ch}
.giant{font:900 clamp(42px,12.2vw,186px)/.8 var(--d);letter-spacing:-.05em;color:var(--sun);white-space:nowrap;margin-top:44px;transform:translateY(.1em)}
.dock{display:none;position:fixed;z-index:9;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));gap:5px;padding:6px;border-radius:99px;background:var(--ink);box-shadow:0 14px 30px -10px rgba(12,18,48,.6);transform:translateY(170%);transition:transform .35s cubic-bezier(.2,.8,.3,1)}
.dock.show{transform:none}
.dock a{flex:1;text-align:center;text-decoration:none;color:#fff;font:800 17px var(--d);padding:13px 0;border-radius:99px}
.dock a:last-child{background:var(--sun);color:var(--ink)}
dialog{border:0;padding:0;margin:auto;background:none;width:min(1100px,94vw);max-height:92vh;overflow:auto;text-align:center;color:#fff;font-weight:600;font-size:15px}
dialog::backdrop{background:rgba(12,18,48,.86)}
dialog img{width:100%;border-radius:14px}
dialog .lm{width:min(300px,62%);margin:18px auto 12px;border-radius:22px}

@media (min-width:1000px){.flip{display:flex}.own{display:block}}
@media (max-width:1340px){.seal{right:-14px}}
@media (max-width:1100px){
  .jobs{grid-template-columns:1fr 1fr}
  .say .w{gap:40px 50px}
}
@media (max-width:900px){
  .top nav a:not(.btn){display:none}
  .hd{grid-template-columns:1fr}
  .hd .lede{margin:0}
  .hd h2{white-space:normal}
  .mb{display:inline}
  .say .w{grid-template-columns:1fr;gap:54px}
  .cw{max-width:470px;margin:0 auto}
  .seal{right:-10px;top:-52px;width:104px;height:104px}
  .show{grid-template-columns:1fr;gap:18px}
  .idx{position:static;display:flex;flex-wrap:wrap;gap:8px}
  .idx button{display:block;padding:10px 17px;border-radius:99px;background:#fff;box-shadow:inset 0 0 0 2px var(--line)}
  .idx button:hover{transform:none}
  .idx button[aria-selected=true]{box-shadow:4px 5px 0 var(--sun)}
  .idx i,.idx span{display:none}
  .idx b{font-size:17px}
  .info{grid-template-columns:1fr}
  .end{flex-direction:column;align-items:flex-start}
  .fones{grid-template-columns:1fr 1fr;max-width:480px;gap:34px 22px}
  .tiers{grid-template-columns:1fr}
  .stamp{transform:rotate(-3deg)}
  .stops{grid-template-columns:1fr;gap:30px}
  .stops::before{left:28px;right:auto;top:30px;bottom:60px;border-top:0;border-left:4px dashed rgba(255,255,255,.7)}
  .stops li{display:grid;grid-template-columns:60px 1fr;gap:0 20px}
  .stops li::before{grid-row:span 2;margin:0}
  .facts{grid-template-columns:1fr;gap:22px}
  .facts li:nth-child(n){transform:none}
  .contact .w{grid-template-columns:1fr;gap:40px}
}
@media (max-width:640px){
  body{font-size:17px}
  .w{width:calc(100% - 36px)}
  section{padding:64px 0}
  .under{padding-bottom:100px}
  .sheet{border-radius:34px 34px 0 0;margin-top:-34px}
  .hero{padding-bottom:34px;min-height:clamp(560px,100svh,780px)}
  .plane{transform:scale(.6) rotateX(48deg) rotateZ(-26deg)}
  .wall::before{background:radial-gradient(90% 56% at 50% 54%,rgba(31,56,240,.97) 0,rgba(31,56,240,.92) 50%,rgba(31,56,240,.45) 100%),linear-gradient(rgba(10,16,70,.7),rgba(10,16,70,0) 22%)}
  .logo span{display:none}
  .mid{padding:10px 0 26px}
  .sub{font-size:19px;margin:24px auto 24px}
  .cta .btn{width:100%}
  .say{padding-top:70px}
  .txt .hand{font-size:28px}
  .li{padding:24px 22px 22px}
  .nm{font-size:26px}
  .pv{padding:20px;min-height:190px}
  .card{box-shadow:7px 9px 0 var(--ink)}
  .mock{padding:24px 0 0 18px}
  .mock::after{font-size:110px;top:-12px;right:10px}
  .br{width:82%}
  .ph{width:23%}
  .jot{display:none}
  .info{padding:22px 20px 26px}
  .info h3{font-size:29px}
  .jobs{grid-template-columns:1fr;margin-top:34px}
  .jobs li{grid-template-columns:62px 1fr;padding:20px 0}
  .jobs li::before{font-size:40px}
  .rows{margin-top:34px}
  .fones{margin-top:40px}
  .fone:nth-child(n) .fr{transform:none}
  .fone figcaption{margin-top:14px}
  .fr{border-radius:26px;padding:5px}
  .fr img{border-radius:21px}
  .kind{font-size:34px;margin:50px 0 18px}
  .tier{padding:24px}
  .tp{font-size:50px}
  .pay{padding:24px 22px;border-radius:24px;box-shadow:6px 8px 0 var(--sun)}
  .pay b{font-size:24px}
  .row{grid-template-columns:1fr;padding:26px 0}
  .row h3{font-size:31px}
  .pr{text-align:left;font-size:58px}
  .stops{margin-top:40px}
  .facts{margin-top:34px}
  .two{grid-template-columns:1fr}
  form{padding:24px 20px;box-shadow:6px 8px 0 var(--ink);transform:none}
  .facts li{box-shadow:6px 8px 0 var(--ink);padding:24px}
  .dock{display:flex}
  footer{padding-bottom:84px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .sq path{stroke-dashoffset:0}
}