@font-face{font-family:Fredoka;src:url("assets/fredoka.ttf") format("truetype");font-weight:300 700;font-display:swap}
:root{--paper:#f5f6ef;--ink:#143d40;--green:#23745b;--muted:#5f746b;--line:#d9e0d4;--orange:#f6812c}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:32px}
body{margin:0;color:var(--ink);background:var(--paper);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:3px solid #d57125;outline-offset:6px}
::selection{background:#d8e8cc}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:52px}
.site-header{height:116px;display:flex;align-items:center;justify-content:space-between}
.logo{display:block;flex-shrink:0;mix-blend-mode:multiply}
.logo img{width:146px;height:auto;display:block}
nav{display:flex;align-items:center;gap:38px;font-size:14px}
nav a{padding:12px 0}
nav a:hover{color:var(--green)}
.nav-contact{border:1px solid #b6c9b9;border-radius:30px;padding:12px 20px;display:flex;gap:28px;align-items:center}
.nav-contact span{font-size:19px}
.hero{display:grid;grid-template-columns:1fr 1.07fr;align-items:center;gap:12px;padding-top:56px;padding-bottom:64px;min-height:690px}
.eyebrow{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:2px;line-height:1.8;margin:0 0 23px}
.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--orange);margin-right:8px;vertical-align:1px}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-family:Fredoka,Arial,sans-serif;font-weight:450}
h1{font-size:clamp(53px,5.65vw,74px);line-height:1.035;letter-spacing:-2.2px;margin-bottom:26px}
h1 span{color:var(--green)}
.intro{font-size:16px;line-height:1.85;color:var(--muted);margin-bottom:29px}
.button{display:inline-flex;gap:35px;align-items:center;background:var(--green);color:white;border-radius:30px;font-size:14px;padding:17px 23px;transition:background .2s,transform .2s}
.button:hover{background:#175640;transform:translateY(-2px)}
.button span{font-size:20px}
.hero-note{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted);margin-top:31px}
.mini-orbit{height:17px;width:17px;border:1px solid #9caf9d;border-radius:50%;position:relative}
.mini-orbit:after{content:"";position:absolute;background:var(--orange);width:5px;height:5px;border-radius:50%;top:0;right:-1px}
.hero-art{min-width:0}
.kinetic-board{width:112%;max-width:650px;margin-left:-5%;height:auto;overflow:visible;display:block}
.vane{transition:transform 1.25s cubic-bezier(.34,.05,.16,1)}
.vane-orange{transform:rotate(-30deg)}
.vane-blue{transform:rotate(-30deg)}
.vane-green{transform:rotate(24deg)}
.orbit-ball{transform-origin:319px 271px;transition:transform 1.6s cubic-bezier(.34,.05,.16,1)}
.art-caption{display:flex;align-items:center;justify-content:space-between;margin:2px 15px 0 40px;font-size:10px;letter-spacing:1px;color:var(--muted)}
.art-caption>span{text-transform:uppercase}
.art-caption button{display:flex;align-items:center;gap:8px;border:0;background:transparent;padding:11px 0 11px 12px;color:var(--ink);font-size:12px;cursor:pointer}
.move-icon{font-size:23px;transition:transform .3s}
.art-caption button:hover .move-icon{transform:rotate(90deg)}
.motion-strip{border-block:1px solid var(--line);background:#eef1e6}
.strip-inner{display:flex;justify-content:space-between;align-items:center;padding-block:24px}
.strip-inner>span{display:flex;align-items:center;gap:55px;font-family:Fredoka,Arial,sans-serif;font-size:22px;font-weight:400}
.strip-inner i{font:normal 30px Arial;color:#68917b}
.strip-inner>span:first-child i{color:#d47a3c}
.strip-inner>span:last-child i{color:#d47a3c}
.strip-inner .connect-symbol{font-size:26px;letter-spacing:-9px;padding-right:9px}
.games{padding-top:100px;padding-bottom:92px}
.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:44px}
.section-heading .eyebrow{margin-bottom:15px}
h2{font-size:45px;line-height:1.13;letter-spacing:-.8px;margin-bottom:0}
.section-heading>p{font-size:14px;color:var(--muted);line-height:1.9;margin-bottom:3px;max-width:340px}
.game-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px}
.game-visual{border:1px solid #e0e5d7;border-radius:22px;position:relative;overflow:hidden;padding-top:20px}
.vane-visual{background:#edf0e3}
.round-visual{background:#e7efea}
.visual-label{display:block;text-transform:uppercase;letter-spacing:1.6px;font-size:9px;margin-left:26px;color:#617668}
.game-visual svg{display:block;width:100%;height:auto;margin-block:-8px -5px}
.visual-footer{display:flex;align-items:center;justify-content:space-between;padding:0 26px 22px;font-size:11px;color:#486959}
.visual-footer span{font-size:21px}
.game-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:25px 0 13px}
h3{font-size:29px;letter-spacing:-.4px;margin:0}
.tag{font-size:9px;text-transform:uppercase;letter-spacing:.8px;border:1px solid #cbd6c7;border-radius:20px;padding:7px 9px;white-space:nowrap}
.game>p{font-size:14px;line-height:1.85;color:var(--muted);max-width:460px;margin-bottom:14px}
.game .game-category{font-size:10px;letter-spacing:.5px;color:#3b6653}
.game-category span{margin:0 9px}
.studio{border-top:1px solid var(--line);padding-top:78px;padding-bottom:95px;display:grid;grid-template-columns:1fr 1.05fr;gap:72px;align-items:center}
.studio-art{height:345px;position:relative;max-width:430px;width:100%;margin:auto}
.orbit{border:1px solid #cbd9c8;border-radius:50%;position:absolute;left:50%;top:47%;transform:translate(-50%,-50%) rotate(-30deg)}
.orbit-one{width:290px;height:290px}
.orbit-two{width:225px;height:225px}
.orbit-three{width:160px;height:160px}
.studio-ball{position:absolute;border-radius:50%;box-shadow:0 7px 12px #163e4011}
.orange-ball{width:55px;height:55px;background:var(--orange);left:calc(50% - 139px);top:71px}
.green-ball{width:34px;height:34px;background:#68b84c;left:calc(50% + 61px);top:207px}
.studio-center{position:absolute;top:47%;left:50%;transform:translate(-50%,-50%);font-family:Fredoka,Arial;font-size:70px;color:#2d785d}
.studio-art-note{position:absolute;bottom:0;left:0;width:100%;text-align:center;font-size:11px;letter-spacing:1px;color:var(--muted)}
.studio-copy .eyebrow{margin-bottom:15px}
.studio-copy h2{margin-bottom:24px}
.studio-copy>p:not(.eyebrow){font-size:14px;line-height:1.9;color:var(--muted);margin-bottom:15px}
.studio-copy strong{color:var(--ink);font-weight:600}
.studio-copy .studio-signoff{color:var(--ink)!important;font-weight:600;font-size:13px!important;margin-top:23px;display:flex;gap:16px;align-items:center}
.brand-dots{display:flex;gap:5px}.brand-dots i{width:7px;height:7px;border-radius:50%;background:var(--orange)}.brand-dots i+i{background:#68b84c}
.contact{background:#e9eedf;border-block:1px solid #dbe2d0}
.contact-inner{display:flex;justify-content:space-between;align-items:center;gap:30px;padding-block:66px}
.contact .eyebrow{margin-bottom:14px}
.contact h2{font-size:43px}
.contact p:not(.eyebrow){font-size:13px;line-height:1.9;color:#566c5c;margin:21px 0 0}
.email-link{display:flex;align-items:center;gap:30px;font-size:24px;border-bottom:1px solid #90a58e;padding:12px 0;white-space:nowrap}
.email-link:hover{color:var(--green);border-color:var(--green)}
.email-link span{font-size:28px}
footer{min-height:126px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.footer-logo img{width:100px}
footer p,footer>span{font-size:10px;color:var(--muted);margin:0}
.skip{position:absolute;left:20px;top:-80px;background:var(--ink);color:white;padding:15px;z-index:10}.skip:focus{top:10px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(min-width:1400px){.hero{padding-top:65px;padding-bottom:80px}}
@media(max-width:1000px){.wrap{padding-inline:32px}.hero{min-height:620px}.eyebrow{font-size:9px;letter-spacing:1.5px}h1{font-size:59px}.strip-inner>span{gap:30px}.studio{gap:35px}.email-link{font-size:21px;gap:16px}.section-heading>p{max-width:300px}.game-title{align-items:flex-start}.tag{font-size:8px}}
@media(max-width:760px){.wrap{padding-inline:23px}.site-header{height:94px}.logo img{width:115px}nav{gap:20px;font-size:12px}.nav-contact{padding:10px 13px;gap:12px}nav>a:nth-child(2){display:none}.hero{grid-template-columns:1fr;padding-top:38px;padding-bottom:37px;gap:30px;min-height:0}.hero-copy{max-width:480px}h1{font-size:clamp(56px,10vw,74px);letter-spacing:-1.7px}.eyebrow{font-size:9px}.intro{font-size:14px}.hero-note{margin-top:24px}.hero-art{width:100%;max-width:520px;margin:0 auto}.kinetic-board{width:100%;margin:0}.art-caption{margin:0 15px}.strip-inner{padding-block:19px;gap:12px}.strip-inner>span{font-size:16px;gap:12px}.strip-inner i{font-size:23px}.strip-inner .connect-symbol{font-size:21px}.games{padding-top:65px;padding-bottom:62px}.section-heading{display:block;margin-bottom:30px}h2{font-size:38px}.section-heading>p{margin-top:20px;font-size:13px;max-width:100%}.game-grid{gap:42px;grid-template-columns:1fr}.game-title{align-items:center}.tag{font-size:9px}.game>p{max-width:none}.game-visual{max-height:390px}.game-visual svg{max-height:310px}.studio{grid-template-columns:1fr;gap:36px;padding-top:37px;padding-bottom:56px}.studio-art{height:290px}.orbit-one{width:245px;height:245px}.orbit-two{width:185px;height:185px}.orbit-three{width:125px;height:125px}.orange-ball{left:calc(50% - 118px);top:55px;width:47px;height:47px}.green-ball{left:calc(50% + 46px);top:174px}.studio-center{font-size:59px}.contact-inner{display:block;padding-block:49px}.contact h2{font-size:39px}.contact p br{display:none}.email-link{font-size:23px;width:fit-content;margin-top:25px;gap:35px}footer{flex-wrap:wrap;padding-block:24px;min-height:115px}footer p{display:none}.footer-logo img{width:92px}}
@media(max-width:420px){nav{gap:13px}.nav-contact{padding:9px 11px}.nav-contact span{display:none}.strip-inner>span{font-size:14px;gap:7px}.strip-inner i{font-size:19px}.strip-inner{gap:8px}.studio-copy .studio-signoff{font-size:12px!important;gap:9px}.art-caption{margin:0;font-size:9px}}
@media(max-width:360px){.strip-inner>span{font-size:12px;gap:5px}.strip-inner i,.strip-inner .connect-symbol{font-size:17px}.orbit{transform:translate(-50%,-50%)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}