@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Inter:wght@400;500;600;700;800&display=swap');
:root{--bg:#101010;--paper:#f4f0e9;--muted:#a2a09e;--orange:#f6a13b}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--paper);font-family:Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid var(--orange);outline-offset:6px}button{background:none;border:0}img{display:block;width:100%}header{height:90px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;background:#101010f2;position:sticky;top:0;z-index:20;border-bottom:1px solid #ffffff16;backdrop-filter:blur(18px)}.brand{display:flex;align-items:center;gap:12px}.brand img{width:49px;height:49px;object-fit:cover;border-radius:50%}.brand>span{font-weight:900;font-size:16px;letter-spacing:-.6px;line-height:1.1}.brand span span{display:block;font-size:10px;letter-spacing:5px;margin-top:4px}nav{display:flex;gap:42px;font-size:13px;font-weight:600}nav a{padding:10px 0}nav a:hover,footer a:hover{color:var(--orange)}nav span{margin-left:16px}.menu{display:none}.hero{height:calc(100svh - 90px);min-height:650px;max-height:1050px;position:relative;isolation:isolate;overflow:hidden}.hero-images,.hero-shade{position:absolute;inset:0;z-index:-1}.hero-images img{position:absolute;height:100%;object-fit:cover;opacity:0;transition:opacity 1.1s ease,transform 8s ease;transform:scale(1.045)}.hero-images img.active{opacity:1;transform:scale(1)}.hero-shade{background:linear-gradient(90deg,#100d17a8,transparent 80%),linear-gradient(0deg,#101010 0%,transparent 40%)}.hero-content{padding:8vh 7% 0;position:relative}.eyebrow{font-size:11px;line-height:1.5;font-weight:700;letter-spacing:2px;margin:0 0 24px}.eyebrow i{display:inline-block;background:var(--orange);width:7px;height:7px;border-radius:100%;margin-right:10px}.hero h1{font-family:'Barlow Condensed',Impact,'Arial Narrow',sans-serif;font-weight:900;font-size:clamp(100px,11.5vw,190px);line-height:.79;letter-spacing:-3px;margin:35px 0 26px;position:relative;width:max-content}.hero h1 span{color:#ffce9f}.hero h1 b{font-family:Arial;font-size:15px;position:absolute;right:-20px;bottom:7px}.hero-line{font-size:18px;margin-bottom:30px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:50px;border:1px solid var(--paper);background:var(--paper);color:#111;padding:18px 25px;font-size:13px;font-weight:700;transition:background .25s,transform .25s}.button:hover{background:var(--orange);border-color:var(--orange);transform:translateY(-2px)}.button span{font-size:20px}.hero-bottom{position:absolute;bottom:35px;left:7%;right:7%;display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:1.6px;font-weight:700}.slide-controls{display:flex;gap:8px}.slide-controls button{width:42px;height:24px;position:relative}.slide-controls button:after{content:'';height:3px;background:#ffffff55;position:absolute;left:0;right:0;top:11px;transition:background .4s}.slide-controls button.selected:after{background:var(--orange)}.section{padding:100px 7%}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:42px}h2{font-size:clamp(42px,5vw,72px);line-height:1.04;letter-spacing:-3px;margin:0;font-weight:800}.accent{color:var(--orange)}.small{font-size:10px;letter-spacing:1.5px;color:var(--muted);padding-bottom:8px}.game-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.card-image{position:relative;overflow:hidden;aspect-ratio:1.65}.card-image img{height:100%;object-fit:cover;transition:transform .65s}.game-card:hover img{transform:scale(1.04)}.pill{position:absolute;top:20px;left:20px;background:#101010c9;padding:9px 12px;font-size:9px;letter-spacing:1px}.card-arrow{position:absolute;bottom:18px;right:20px;font-size:29px}.card-copy{padding:25px 0}.card-copy p{color:var(--orange);font-size:9px;letter-spacing:1.5px;font-weight:700}.card-copy h3{font-size:30px;letter-spacing:-1px;margin:14px 0 10px}.card-copy>span{color:var(--muted);font-size:13px}.journey-scene{height:65vw;max-height:750px;position:relative;overflow:hidden}.journey-scene img{height:100%;object-fit:cover}.journey-scene:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#101010,transparent 45%)}.scene-caption{position:absolute;bottom:30px;left:7%;z-index:1;font-size:9px;letter-spacing:2px}.feature-copy{display:grid;grid-template-columns:1.1fr 1fr;gap:10%}.feature-copy h3{font-size:25px;margin:0 0 20px;letter-spacing:-.6px}.feature-copy p:not(.eyebrow),.studio p:not(.eyebrow){font-size:15px;line-height:1.85;color:#c4c2bf;margin-top:0}.feature-copy .muted{font-size:12px!important;color:var(--muted)!important}.text-links{display:flex;flex-wrap:wrap;gap:25px;margin-top:30px;font-size:12px}.text-links button{padding:0;text-align:left}.text-links a,.text-links button{border-bottom:1px solid #777;padding-bottom:8px}.text-links a:hover,.text-links button:hover{color:var(--orange)}.restoration{background:#191919}.credit{font-size:12px!important;border-left:2px solid var(--orange);padding-left:17px;color:#aaa!important;margin:23px 0!important}.outline{background:transparent;color:var(--paper);padding:14px 20px}.wide-shot{display:block;position:relative;width:100%;padding:0;margin:55px 0 20px;overflow:hidden}.wide-shot img{transition:transform .6s}.wide-shot:hover img{transform:scale(1.025)}.wide-shot>span{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#000b);padding:50px 25px 25px;text-align:left;font-size:10px;letter-spacing:2px}.wide-shot b{float:right;font-size:25px}.mini-shots{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.mini-shots button{padding:0;overflow:hidden}.mini-shots img{transition:opacity .3s}.mini-shots button:hover img{opacity:.7}.studio{display:grid;grid-template-columns:.85fr 1fr;gap:12%;align-items:center;padding-top:130px;padding-bottom:130px}.studio-art{background:#f3eee4;overflow:hidden;aspect-ratio:1}.studio-art img{height:100%;object-fit:cover}.studio h2{margin-bottom:30px}.studio-tags{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.studio-tags span{font-size:8px;letter-spacing:1px;border:1px solid #444;padding:10px}.contact{background:var(--orange);color:#141414}.contact-title{display:block;font-size:clamp(45px,6.7vw,100px);font-weight:800;line-height:1.05;letter-spacing:-4px;position:relative}.contact-title>span{position:absolute;right:0;top:0;font-weight:400;transition:transform .3s}.contact-title:hover>span{transform:translate(8px,-8px)}.contact-bottom{border-top:1px solid #14141455;margin-top:45px;padding-top:26px;display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:12px}.contact-bottom a{font-weight:700}footer{padding:40px 7%;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:10px;color:#aaa}.footer-brand{font-weight:800;color:var(--paper);letter-spacing:1px}.reveal{opacity:1}.motion .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s}.motion .reveal.visible{opacity:1;transform:none}.skip{position:fixed;top:-100px;left:15px;background:#fff;color:#000;padding:15px;z-index:100}.skip:focus{top:10px}dialog{width:min(1250px,96vw);max-height:95svh;border:1px solid #454545;padding:20px;background:#111;color:#fff}dialog::backdrop{background:#000e;backdrop-filter:blur(10px)}.gallery-top,.gallery-bottom{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:12px}.gallery-top{margin-bottom:15px}.gallery-top button{font-size:22px}.gallery-stage{position:relative}.gallery-stage img{max-height:73svh;object-fit:contain}.gallery-stage button{position:absolute;top:calc(50% - 23px);background:#111c;width:46px;height:46px;font-size:24px;border:1px solid #777}.gallery-stage #prev{left:10px}.gallery-stage #next{right:10px}.gallery-bottom{margin-top:15px;color:#aaa}.locked{overflow:hidden}@media(min-width:1600px){.hero-content{padding-top:10vh}}@media(max-width:800px){header{height:75px;padding:0 6%}.brand>span{font-size:13px}.brand img{width:40px;height:40px}.menu{display:block;font-size:25px}nav{display:none;position:absolute;left:0;right:0;top:75px;background:#101010;padding:30px 7%;flex-direction:column;gap:20px;border-bottom:1px solid #444}nav.open{display:flex}.hero{height:calc(100svh - 75px);min-height:610px}.hero-content{padding-top:95px}.hero h1{font-size:110px}.hero-line{font-size:15px}.hero-bottom>a{display:none}.hero-images img{object-position:60% center}.hero-shade{background:linear-gradient(90deg,#100d1799,transparent),linear-gradient(0deg,#101010,transparent 60%)}.section{padding:65px 6%}.section-heading{align-items:start}.small{display:none}h2{letter-spacing:-2px}.game-grid{grid-template-columns:1fr;gap:25px}.card-copy h3{font-size:27px}.feature-copy{grid-template-columns:1fr;gap:32px}.journey-scene{height:65vh}.mini-shots{gap:8px}.wide-shot{margin-top:35px}.studio{grid-template-columns:1fr;gap:40px}.studio-art{max-width:400px}.contact-title{font-size:49px;letter-spacing:-2.5px}.contact-title>span{font-size:38px;top:-10px}.contact-bottom{flex-direction:column;align-items:start}.contact-bottom p{margin:0}.contact-bottom a{font-size:13px}footer{padding:35px 6%;flex-wrap:wrap;font-size:9px}.eyebrow{font-size:9px;letter-spacing:1.5px}.gallery-bottom{font-size:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.motion .reveal{opacity:1;transform:none}}

/* Responsive refinements: phones, tablets and short landscape screens. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.game-grid>*,.feature-copy>*,.studio>*{min-width:0}
.menu,#close-gallery{min-width:44px;min-height:44px}
.slide-controls button{min-width:44px;height:44px}
.slide-controls button:after{top:21px}
.gallery-stage{touch-action:pan-y pinch-zoom}
.gallery-bottom>span:first-child{min-width:0;overflow-wrap:anywhere}
#gallery-count{flex-shrink:0}
@media(max-width:1024px) and (min-width:801px){
 .feature-copy{gap:5%;grid-template-columns:1fr 1fr}
 .studio{gap:6%;grid-template-columns:1fr 1fr}
 h2{font-size:clamp(38px,4.8vw,50px)}
 .contact-bottom{flex-wrap:wrap}
}
@media(max-width:800px){
 html{scroll-padding-top:85px}
 nav{max-height:calc(100dvh - 75px);overflow-y:auto;padding:18px 6%;gap:6px}
 nav a{min-height:48px;display:flex;align-items:center}
 .hero{height:calc(100svh - 75px);min-height:550px}
 .hero-content{padding:clamp(50px,10svh,95px) 6% 100px}
 .hero h1{font-size:clamp(68px,20vw,130px);letter-spacing:-2px;max-width:100%}
 .hero-bottom{left:6%;right:6%;bottom:20px;gap:10px;font-size:8px;letter-spacing:1px}
 .hero-bottom>span{max-width:105px;line-height:1.6}
 .slide-controls{gap:4px}
 .section{padding:60px 6%}
 .button{max-width:100%;min-height:48px;gap:24px}
 .text-links{gap:14px}
 .text-links a,.text-links button{min-height:44px;display:inline-flex;align-items:center;gap:8px}
 .contact-title{font-size:clamp(34px,8.8vw,60px);letter-spacing:-1.8px;padding-right:35px}
 .contact-title>span{font-size:32px;top:0}
 .contact-bottom a{overflow-wrap:anywhere;max-width:100%;min-height:44px;display:flex;align-items:center}
 .mini-shots{grid-template-columns:1fr;gap:14px}
 .mini-shots img{aspect-ratio:16/9;object-fit:cover}
 .journey-scene{height:55svh;min-height:280px;max-height:550px}
 .scene-caption{right:6%;line-height:1.8}
 .studio-art{width:100%;margin-inline:auto}
 dialog{width:calc(100% - 20px);max-width:680px;max-height:calc(100dvh - 20px);padding:12px}
 .gallery-top{font-size:11px;line-height:1.6;margin-bottom:10px}
 .gallery-stage{display:grid;grid-template-columns:1fr 1fr;gap:12px}
 .gallery-stage img{grid-column:1/-1;grid-row:1;max-height:calc(100dvh - 190px);min-height:100px}
 .gallery-stage button{position:static;width:100%;height:46px;font-size:24px;grid-row:2}
 .gallery-stage #prev{grid-column:1}.gallery-stage #next{grid-column:2}
 .gallery-bottom{align-items:start;line-height:1.5;gap:15px}
 footer>a{min-height:44px;display:flex;align-items:center}
}
@media(max-width:360px){
 h2{font-size:36px;letter-spacing:-1.8px}
 .brand{gap:8px}.brand>span{font-size:12px}
 .eyebrow{letter-spacing:1px}
 .pill{top:12px;left:12px;font-size:8px}
}
@media(max-height:500px) and (orientation:landscape){
 .hero{min-height:480px}.hero-content{padding-top:35px}
 .hero h1{font-size:90px;margin-top:20px}
 .hero-line{margin-bottom:20px}
}
@media(hover:none){.button:hover{transform:none}.game-card:hover img,.wide-shot:hover img{transform:none}}

/* Larger, closer framing makes the supplied detailed mascot readable. */
.brand img{width:64px;height:64px;object-fit:cover;object-position:center;border:2px solid #ead8b8;clip-path:circle(50%)}
.brand{gap:16px}
.brand>span{font-size:18px}
.brand span span{font-size:11px}
.card-image .rotating-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease,transform .65s}
.card-image .rotating-image.active{opacity:1}
.card-image .pill,.card-image .card-arrow{z-index:2}
.motion-toggle{display:block;margin:0 0 24px auto;padding:10px 15px;border:1px solid #666;min-height:44px;font-size:11px;letter-spacing:.5px}
.motion-toggle:hover{border-color:var(--orange);color:var(--orange)}
@media(max-width:800px){.brand img{width:56px;height:56px}.brand{gap:12px}.brand>span{font-size:15px}.brand span span{font-size:10px}}
@media(max-width:360px){.brand img{width:50px;height:50px}.brand>span{font-size:13px}.brand{gap:9px}}
@media(prefers-reduced-motion:reduce){.card-image .rotating-image{transition:none}}
.brand .logo-mark{display:block;width:64px;height:64px;flex:0 0 64px;border-radius:50%;overflow:hidden;background:#f3eee4;border:2px solid #ead8b8}
.brand .logo-mark img{width:100%;height:100%;border:0;border-radius:0;clip-path:none;transform:scale(1.25);object-fit:cover}
@media(max-width:800px){.brand .logo-mark{width:56px;height:56px;flex-basis:56px}}
@media(max-width:360px){.brand .logo-mark{width:50px;height:50px;flex-basis:50px}}

/* Prominent brand lockup: preserve the full mascot instead of a tiny round crop. */
header{height:132px}
html{scroll-padding-top:142px}
.brand{gap:20px}
.brand .logo-mark{width:138px;height:104px;flex:0 0 138px;border-radius:8px;border:0;background:#f3eee4;overflow:hidden}
.brand .logo-mark img{width:100%;height:100%;object-fit:contain;transform:none;border-radius:0}
.brand>span:not(.logo-mark){font-size:25px;letter-spacing:-.5px}
.brand>span:not(.logo-mark)>span{font-size:14px;letter-spacing:8px;margin-top:8px}
.hero{height:calc(100svh - 132px)}
@media(max-width:800px){
 header{height:112px;padding-inline:5%}
 html{scroll-padding-top:122px}
 .brand{gap:12px}
 .brand .logo-mark{width:110px;height:84px;flex-basis:110px}
 .brand>span:not(.logo-mark){font-size:19px;letter-spacing:-.5px}
 .brand>span:not(.logo-mark)>span{font-size:11px;letter-spacing:6px;margin-top:7px}
 nav{top:112px;max-height:calc(100dvh - 112px)}
 .hero{height:calc(100svh - 112px)}
}
@media(max-width:360px){
 header{padding-inline:12px}
 .brand{gap:10px}
 .brand .logo-mark{width:94px;height:76px;flex-basis:94px}
 .brand>span:not(.logo-mark){font-size:16px}
 .brand>span:not(.logo-mark)>span{font-size:10px;letter-spacing:5px}
}

/* Fit the upcoming game's longer title at every screen size. */
.hero h1{font-size:clamp(68px,9vw,145px);line-height:.9;letter-spacing:-2px}
.hero h1 span{font-size:.77em}
@media(max-width:800px){.hero h1{font-size:clamp(43px,12.8vw,96px);letter-spacing:-1px}}
@media(max-height:500px) and (orientation:landscape){.hero h1{font-size:72px}}