:root { color-scheme: dark; --bg:#101210; --paper:#f1f2e9; --muted:#a8afa5; --lime:#d0fa79; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:100px; }
body { margin:0; background:var(--bg); color:var(--paper); font-family:Inter,Arial,Helvetica,sans-serif; line-height:1.6; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
a:focus-visible { outline:3px solid var(--lime); outline-offset:7px; }
.skip-link { position:fixed; top:-80px; left:20px; padding:12px 20px; background:var(--lime); color:var(--bg); z-index:100; }
.skip-link:focus { top:15px; }
.studio-header { display:flex; align-items:center; justify-content:space-between; gap:24px; max-width:1440px; margin:auto; padding:28px 5%; border-bottom:1px solid #ffffff20; }
.studio-brand { display:flex; gap:10px; align-items:center; font-weight:900; letter-spacing:-1px; font-size:24px; }
.studio-brand img { width:38px; height:38px; object-fit:contain; }
.brand-dot { font-size:11px; vertical-align:super; margin-left:3px; }
.studio-header nav { display:flex; gap:38px; font-size:13px; font-weight:600; }
.studio-header nav a:hover,.text-link:hover { color:var(--lime); }
.studio-intro,.section-shell { max-width:1440px; margin:auto; padding:84px 5%; }
.eyebrow { margin:0 0 22px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:2px; }
.status-dot { display:inline-block; width:7px; height:7px; background:var(--lime); border-radius:50%; margin-right:9px; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:32px; font-size:clamp(48px,6.3vw,92px); line-height:1.04; font-weight:600; letter-spacing:-.045em; }
em { font-family:Georgia,serif; font-weight:400; color:var(--lime); }
.intro-bottom { display:flex; justify-content:space-between; align-items:end; gap:30px; }
.intro-bottom p { margin:0; color:var(--muted); font-size:15px; }
.intro-bottom a { font-size:13px; border-bottom:1px solid #68725a; padding-bottom:8px; }
.intro-bottom a span { margin-left:40px; color:var(--lime); }
.featured-game { position:relative; min-height:600px; max-width:1440px; margin:0 auto; overflow:hidden; background:#203e42; }
.featured-art,.featured-shade { position:absolute; width:100%; height:100%; inset:0; object-fit:cover; }
.featured-shade { background:linear-gradient(90deg,rgba(4,14,13,.82),rgba(4,14,13,.15)),linear-gradient(0deg,rgba(4,14,13,.8),transparent 65%); }
.featured-top { position:relative; display:flex; justify-content:space-between; align-items:center; padding:32px 5%; }
.featured-top .eyebrow { margin:0; }
.release-badge { padding:6px 12px; border:1px solid #ffffff55; border-radius:30px; font-size:11px; background:#10121055; }
.featured-content { position:relative; padding:95px 5% 80px; }
.featured-content .eyebrow { color:var(--lime); margin-bottom:15px; }
.featured-content h2 { font-size:clamp(42px,5vw,72px); line-height:1.05; letter-spacing:-3px; margin-bottom:18px; }
.featured-content p { color:#e1e9dc; }
.action { display:inline-flex; gap:50px; align-items:center; background:var(--lime); color:var(--bg); padding:16px 23px; margin-top:12px; font-weight:700; font-size:13px; }
.action:hover { background:#e4ffab; }
.featured-platforms { position:absolute; bottom:27px; right:5%; font-size:10px; letter-spacing:1px; text-transform:uppercase; }
.featured-platforms span { margin:0 12px; color:var(--lime); }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:25px; margin-bottom:35px; }
.section-heading h2 { font-size:52px; font-weight:500; letter-spacing:-2px; margin-bottom:0; line-height:1.1; }
.section-heading p { color:var(--muted); margin-bottom:0; font-size:13px; }
.section-heading .eyebrow { margin-bottom:14px; font-size:11px; color:var(--lime); }
.accent { color:var(--lime); }
.game-card { display:block; max-width:850px; }
.game-card-image { position:relative; overflow:hidden; aspect-ratio:16/8; background:#24322c; }
.game-card-image img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.game-card:hover img { transform:scale(1.025); }
.card-arrow { position:absolute; right:18px; bottom:18px; width:46px; height:46px; background:var(--lime); color:var(--bg); display:grid; place-items:center; font-size:26px; }
.game-card-info { display:flex; justify-content:space-between; gap:25px; padding-top:25px; }
.game-card-info .eyebrow { font-size:9px; color:var(--muted); margin-bottom:7px; }
.game-card-info h3 { font-size:29px; letter-spacing:-1px; margin-bottom:5px; }
.game-card-info p { color:var(--muted); font-size:13px; }
.game-card-status { align-self:start; white-space:nowrap; color:var(--lime); font-size:11px; padding:5px 10px; border:1px solid #d0fa7940; }
.about-section { border-top:1px solid #ffffff20; padding-top:75px; padding-bottom:90px; }
.about-section>.eyebrow { color:var(--lime); }
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:12%; }
.about-grid h2,.contact-section h2 { font-size:clamp(40px,5vw,66px); line-height:1.06; font-weight:500; letter-spacing:-2px; margin-bottom:0; }
.about-grid p { color:var(--muted); font-size:15px; }
.about-grid .about-lede { color:var(--paper); font-size:23px; line-height:1.4; }
.text-link { display:inline-block; font-size:12px; padding-bottom:7px; border-bottom:1px solid #ffffff40; margin-top:15px; }
.contact-section { display:flex; justify-content:space-between; align-items:end; gap:30px; background:var(--lime); color:var(--bg); padding-top:60px; padding-bottom:60px; }
.contact-section>a { font-size:clamp(13px,1.7vw,22px); border-bottom:1px solid #10121070; padding-bottom:6px; }
.studio-footer { display:flex; justify-content:space-between; align-items:center; gap:24px; padding-top:35px; padding-bottom:35px; }
.studio-footer p,.studio-footer>a:last-child { color:var(--muted); font-size:11px; margin:0; }
@media(max-width:700px) { .studio-header { padding:20px 5%; gap:12px; }.studio-brand { font-size:19px; }.studio-brand img { width:28px; height:28px; }.studio-header nav { gap:16px; font-size:11px; }.studio-intro,.section-shell { padding:55px 6%; }h1 { letter-spacing:-2.5px; }.intro-bottom { align-items:start; flex-direction:column; gap:25px; }.featured-game { min-height:560px; }.featured-art { object-position:60% center; }.featured-top { padding:25px 6%; }.featured-top .eyebrow { font-size:9px; }.featured-content { padding:100px 6% 80px; }.featured-platforms { left:6%; right:auto; font-size:8px; }.section-heading { align-items:start; flex-direction:column; gap:16px; }.section-heading h2 { font-size:44px; }.game-card-image { aspect-ratio:4/3; }.game-card-info { flex-direction:column; gap:4px; }.about-grid { grid-template-columns:1fr; gap:30px; }.contact-section { flex-direction:column; align-items:start; }.studio-footer { flex-wrap:wrap; padding-top:25px; padding-bottom:25px; }.studio-footer .studio-brand { width:100%; }.desktop-break { display:none; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }* { transition:none!important; } }

/* Image-led studio homepage */
:root { --bg:#0b1018; --paper:#f2f5f8; --muted:#b0bdcc; --lime:#c9f584; }
.studio-header { max-width:none; padding:20px max(5%, calc((100vw - 1296px)/2)); background:#0b1018; }
.studio-brand img { width:52px; height:52px; }
.home-hero { position:relative; min-height:650px; display:flex; align-items:center; overflow:hidden; }
.home-hero-art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:60% center; }
.home-hero::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#070e19ed,#070e198a 44%,#070e1910 80%),linear-gradient(0deg,#0b1018,transparent 30%); }
.home-hero-copy { position:relative; z-index:1; width:100%; max-width:1440px; margin:auto; padding:76px 5% 145px; }
.home-hero h1 { font-size:clamp(48px,6.5vw,94px); font-weight:750; letter-spacing:-.055em; margin-bottom:24px; }
.home-hero em { font-style:normal; font-weight:750; }
.home-hero-copy>p:not(.eyebrow) { color:#e1e9ef; font-size:18px; line-height:1.7; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:24px; }
.hero-actions .action { gap:22px; margin:0; }
.secondary-action { font-size:14px; border-bottom:1px solid #ffffff80; padding:12px 0; }
.hero-caption { position:absolute; z-index:2; bottom:30px; left:5%; right:5%; display:flex; gap:15px; align-items:center; border-top:1px solid #ffffff35; padding-top:22px; }
.hero-caption img { border-radius:10px; }
.hero-caption strong,.hero-caption div span { display:block; }
.hero-caption div span { color:#c0ccd7; font-size:11px; }
.hero-platforms { margin-left:auto; font-size:12px; color:#dbe4ec; }
.section-heading h2 { font-size:clamp(36px,4.5vw,62px); font-weight:700; }
.play-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.play-card { background:#151e29; border:1px solid #ffffff15; overflow:hidden; }
.play-card>img { width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .3s; }
.play-card:hover>img { transform:scale(1.025); }
.play-card>div { padding:25px; position:relative; }
.play-card .play-icon { width:42px; height:42px; object-fit:contain; margin-bottom:20px; }
.play-card h3 { font-size:23px; line-height:1.2; margin-bottom:12px; }
.play-card p { font-size:14px; color:var(--muted); margin:0; }
.home-universe { background:#111927; border-top:1px solid #ffffff15; }
.universe-intro { color:var(--muted); margin-bottom:35px; }
.home-factions { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:30px; }
.home-faction { display:flex; align-items:center; gap:12px; padding:18px 14px; border:1px solid #ffffff20; border-top:2px solid var(--faction-accent); background:#0b111ccc; }
.home-faction.human { --faction-accent:#e7c77c; }.home-faction.bugvex { --faction-accent:#c2e85b; }.home-faction.cryvum { --faction-accent:#bca3ff; }.home-faction.other { --faction-accent:#ff819b; }
.home-faction img { width:54px; height:64px; object-fit:contain; }
.home-faction h3 { margin:0; font-size:18px; color:var(--faction-accent); }
.home-faction p { margin:4px 0 0; font-size:11px; color:var(--muted); }
.home-faction>span { margin-left:auto; color:var(--faction-accent); }
.home-faction:hover { background:#1b2639; }
.home-fleet { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.fleet-feature { background:#0e151f; border:1px solid #ffffff16; }
.fleet-feature>img { width:100%; aspect-ratio:1.2; object-fit:contain; }
.fleet-feature>div { padding:22px; border-top:1px solid #ffffff12; }
.fleet-feature .eyebrow { color:#a8bbd2; font-size:10px; }
.fleet-feature h3 { font-size:26px; margin:8px 0 10px; }
.fleet-link { font-size:12px; color:var(--lime); }
.about-section { display:grid; grid-template-columns:1fr 1.5fr; gap:10%; align-items:center; }
.studio-identity { text-align:center; padding:30px; background:radial-gradient(ellipse,#262341,transparent 70%); }
.studio-identity>img { width:200px; height:200px; object-fit:contain; margin:0 auto 25px; }
.studio-identity .eyebrow { color:#b6a4df; line-height:1.9; }
.studio-story h2 { font-size:clamp(34px,4vw,52px); line-height:1.05; letter-spacing:-2px; }
.studio-story>p:not(.eyebrow) { color:var(--muted); }
.studio-story .eyebrow { color:var(--lime); }
.studio-socials { display:flex; gap:28px; font-size:13px; margin-top:26px; }
.contact-section { background:#182b2c; color:var(--paper); border-top:1px solid #88c8aa40; }
.contact-section>a { border-color:#88c8aa80; color:var(--lime); overflow-wrap:anywhere; }
@media(max-width:1000px) { .home-factions { grid-template-columns:repeat(2,minmax(0,1fr)); }.play-card>div { padding:20px; }.home-hero { min-height:610px; } }
@media(max-width:700px) {
 .home-hero { min-height:660px; }.home-hero-copy { padding:60px 6% 155px; }.home-hero-art { object-position:57% center; }.home-hero::after { background:linear-gradient(90deg,#070e19e0,#070e1975),linear-gradient(0deg,#0b1018,transparent 40%); }.home-hero h1 { font-size:clamp(42px,10vw,65px); }.hero-caption { left:6%; right:6%; }.hero-platforms { display:none; }
 .play-grid,.home-fleet { grid-template-columns:1fr; }.play-card>img { aspect-ratio:16/10; }.home-factions { gap:10px; }.home-faction { flex-direction:column; align-items:start; padding:16px; }.home-faction>span { display:none; }.home-faction img { height:70px; width:64px; }.home-faction p { font-size:12px; }.about-section { grid-template-columns:1fr; gap:30px; }.studio-identity { padding:0; }.studio-identity>img { width:150px; height:150px; }.fleet-feature>img { aspect-ratio:1.3; }
}