/* Layout proportions measured from the supplied 306 × 2048 landing reference.
   Desktop measurements use a 1920px design canvas; the original mobile gallery
   layouts remain in style.css. The five supplied compositions stay uncropped. */
:root{--page-width:1920px;--gold:#ffe36c;--blue:#3679b8;--muted:#aba6bc}
body{position:relative;isolation:isolate}
.cosmos{position:absolute;top:0;bottom:-260px;left:0;right:0;background-repeat:repeat-y;background-size:100% auto;background-position:center top}
.cosmos:after{display:none}
#main-nav>a:not(.contact),.side-nav a,.store-links,.email{color:var(--blue)}
#main-nav>a.active,.side-nav a.active,#main-nav>a:hover,.side-nav a:hover,.store-links a:hover{color:var(--gold)}
.header{background:rgba(0,0,5,.94)}
.hero{height:auto;min-height:0;aspect-ratio:1920/952}
.hero-scene{transition:opacity 1.15s ease,visibility 1.15s;filter:none}
.hero-scene:after{display:none}
.hero-art{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;filter:blur(5px);opacity:1;transition:filter 1.15s ease;max-width:none}
.hero-scene.active .hero-art{filter:blur(0)}
.hero-mist{display:none}
.hero-controls{bottom:4px;gap:2px;opacity:0;transition:opacity .2s}
.hero:hover .hero-controls,.hero:focus-within .hero-controls{opacity:1}
.hero-controls button{color:var(--blue)}
.hero-controls button:hover,.hero-controls button[aria-current=true]{color:var(--gold)}
.hero-dots button:after{background:var(--blue)}
.frame{opacity:1}
.asset-thumb[aria-pressed=true]{border-color:transparent;background:none}
.games .gallery-main{transform:none;padding:0}
.featured-project{background:transparent}
.page-info{display:none}
.project-thumbs.short-grid{grid-template-rows:repeat(3,minmax(0,1fr))}
.released .panel-arrow.prev{left:48%}
.released .panel-arrow.next{right:1%}
.games .gallery-main{height:119%;align-self:end;transform:translateY(-1%)}
@media (min-width:801px), (min-width:601px) and (orientation:landscape){
 :root{--u:min(.0520833333vw,1px);--header:calc(100 * var(--u))}
 .header{padding:0 calc(60 * var(--u));gap:calc(95 * var(--u))}
 .brand{width:calc(233 * var(--u))}
 .header-caption{font-size:max(14px,calc(22 * var(--u)));letter-spacing:.06em}
 #main-nav{gap:calc(34 * var(--u));font-size:max(14px,calc(22 * var(--u)))}
 .contact{font-size:max(14px,calc(24 * var(--u)));padding:calc(7 * var(--u)) calc(24 * var(--u));line-height:1.6}
 .cosmos{top:calc(var(--header) + 49.583333vw);background-size:100% calc(3010 * var(--u))}
 .portfolio-layout{grid-template-columns:calc(244 * var(--u)) minmax(0,1fr);gap:calc(34 * var(--u));max-width:1920px;padding:calc(70 * var(--u)) calc(60 * var(--u)) 0}
 .side-nav nav{top:calc(var(--header) + 50 * var(--u));padding-top:calc(10 * var(--u));gap:0}
 .side-nav h2{font-size:calc(38 * var(--u));line-height:1.25;margin:0 0 calc(16 * var(--u));letter-spacing:.02em}
 .side-nav a{font-size:max(14px,calc(28 * var(--u)));max-width:calc(230 * var(--u));line-height:1.8;border-color:#3679b840}
 .chapter{margin-bottom:calc(56 * var(--u));scroll-margin-top:calc(20 * var(--u))}
 .section-heading{margin:0 0 calc(46 * var(--u)) calc(60 * var(--u));gap:calc(24 * var(--u));flex-wrap:nowrap;min-height:calc(166 * var(--u))}
 .section-heading h2{font-size:calc(112 * var(--u));line-height:1.12;letter-spacing:-.025em}
 .section-heading p{font-size:max(14px,calc(28 * var(--u)));line-height:1.4;margin-top:0;letter-spacing:.015em}
 .store-links{font-size:max(12px,calc(22 * var(--u)));gap:calc(20 * var(--u));padding:0 calc(28 * var(--u)) calc(4 * var(--u)) 0;color:var(--blue)}
 .store-links img{width:calc(29 * var(--u));height:calc(36 * var(--u))}
 .art-panel{aspect-ratio:1508/648}
 .released-content{inset:8% 4%;grid-template-columns:1.07fr 1fr;gap:7%}
 .featured-project{border-radius:calc(22 * var(--u))}
 .project-thumbs{gap:calc(24 * var(--u)) calc(26 * var(--u));grid-template-rows:repeat(3,minmax(0,1fr))}
 .project-thumb{border:0;border-radius:calc(9 * var(--u))}
 .project-thumb img{object-fit:contain}
 .panel-arrow{font-size:calc(60 * var(--u));width:calc(42 * var(--u));height:calc(68 * var(--u));color:#8d7ea7}
 .play-marker{display:none}
 .portfolio-layout#projects{padding-bottom:calc(60 * var(--u))}
 .capabilities-layout{padding-top:calc(38 * var(--u));border-top:1px solid #ffffff24}
 .capabilities-layout .chapter{margin-bottom:calc(92 * var(--u))}
 .capabilities-layout .chapter.stylization{margin-bottom:calc(145 * var(--u))}
 .capabilities-layout .chapter:is(.icons,.logos,.backgrounds,.games,.marketing){margin-bottom:calc(160 * var(--u))}
 .capabilities-layout .section-heading{margin-bottom:calc(72 * var(--u))}
 .gallery-content{inset:7% 5%;gap:6%;grid-template-columns:1.1fr 1fr}
 .gallery-thumbs{gap:calc(10 * var(--u))}
 .asset-thumb{padding:0;border-radius:calc(8 * var(--u))}
 .characters .gallery-content{inset:2% 5% 0;grid-template-columns:1.25fr 1fr;gap:5%}
 .characters .gallery-thumbs{grid-template-rows:repeat(2,minmax(0,1fr));gap:calc(12 * var(--u));padding:3% 0}
 .characters .gallery-main{height:117%;transform:translateY(-1%)}
 .stylization .art-panel{margin-top:0;margin-bottom:calc(66 * var(--u))}
 .styles-stage{inset:-10% 8% 0;gap:9%}
 .style-item{height:81%;width:25%;align-self:center;transform:translateY(6%)}
 .style-item.center{height:112%;width:32%;transform:translateY(3%)}
 .style-label{font-size:max(14px,calc(26 * var(--u)));top:100%;color:#7d7693}
 .style-item.center .style-label{color:#c7bfd5}
 .stylization .panel-arrow.prev{left:4%}.stylization .panel-arrow.next{right:4%}
 .icons .gallery-content{inset:4% 5% 3%;grid-template-columns:1.2fr 1fr;gap:6%}
 .icons .gallery-thumbs{gap:calc(10 * var(--u));padding:3% 0}
 .icons .gallery-main{height:114%;align-self:end;transform:translateY(-1%)}
 .logos .gallery-content{inset:0 5%;grid-template-columns:.25fr 1fr;gap:8%}
 .logos .gallery-thumbs{gap:5%;padding:10% 0}
 .logos .gallery-main{height:117%;transform:translateY(-9%)}
 .backgrounds .gallery-content{inset:8% 4%;grid-template-columns:.47fr 1fr;gap:4%}
 .backgrounds .gallery-thumbs{gap:calc(8 * var(--u))}
 .backgrounds .gallery-main img{object-fit:contain;border-radius:calc(22 * var(--u))}
 .games .gallery-content{inset:5% 6%;grid-template-columns:.3fr 1fr;gap:7%}
 .games .gallery-main{height:120%;transform:translateY(-3%)}
 .games .gallery-thumbs{gap:calc(18 * var(--u));padding:3% 0}
 .marketing-content{inset:16% 8%;grid-template-columns:454fr 763fr;gap:4%}
 .marketing-content button:first-child img{border-radius:0}
 .about{padding:calc(18 * var(--u)) calc(60 * var(--u)) calc(90 * var(--u));scroll-margin-top:calc(20 * var(--u))}
 .about .section-heading{margin-left:calc(75 * var(--u));margin-bottom:calc(42 * var(--u))}
 .social-links{font-size:max(14px,calc(24 * var(--u)));gap:calc(50 * var(--u));padding:0 calc(65 * var(--u)) calc(5 * var(--u)) 0}
 .about-panel{grid-template-columns:calc(475 * var(--u)) minmax(0,1fr);gap:calc(95 * var(--u));padding:calc(90 * var(--u)) calc(80 * var(--u));min-height:calc(1090 * var(--u));border-radius:calc(24 * var(--u));background:rgba(0,0,8,.65);border-color:#9287b64a;box-shadow:none}
 .profile img{width:calc(330 * var(--u));margin:0 auto calc(65 * var(--u))}
 .profile ul{font-size:max(14px,calc(28 * var(--u)));line-height:1.7;color:var(--blue)}
 .about-copy p{font-size:max(16px,calc(28 * var(--u)));line-height:1.6;margin-bottom:calc(28 * var(--u));color:#938ba6}
 .about-copy .intro{font-size:calc(35 * var(--u));line-height:1.55;margin-bottom:calc(42 * var(--u));color:#ece7f4}
 .about-copy .availability{color:#60b65b;margin:calc(32 * var(--u)) 0}
 .about-copy .email{display:none}
 footer{padding:calc(25 * var(--u)) calc(65 * var(--u));min-height:calc(118 * var(--u));font-size:max(12px,calc(20 * var(--u)))}
}
@media(max-width:1100px) and (min-width:801px){.header-caption{display:none}.header{gap:24px}.store-links{gap:10px}.section-heading{flex-wrap:wrap;gap:6px}.section-heading p{font-size:14px}.about-panel{min-height:0}.about-copy .intro{font-size:22px}.profile ul{font-size:14px}}
@media (max-width:800px) and (orientation:portrait), (max-width:600px){
 .hero{height:auto;min-height:0;aspect-ratio:1920/952}
 .hero-controls{opacity:1;bottom:0}
 .hero-controls button{height:28px;min-width:28px}
 .cosmos{top:var(--header);background-size:auto 1900px}
 .project-thumbs.short-grid{grid-template-rows:repeat(2,minmax(0,1fr))}
 .released .panel-arrow.prev{left:-20px}.released .panel-arrow.next{right:-20px}
 .games .gallery-main{height:100%;transform:none}
}
@media(prefers-reduced-motion:reduce){.hero-art{filter:none!important;transition:none!important}.cosmos{transform:none!important}}
