
:root{--a:#90e7ff;--warm:#cee8ff;--bg:#050910;--ink:#f4f8ff;--muted:#b2c4d2;--hair:rgba(189,222,247,.21);--navH:83px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,'Arial',sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}img{max-width:100%;display:block}::selection{color:#08131e;background:var(--a)}
.progress{position:fixed;z-index:90;top:0;left:0;height:3px;background:var(--warm);width:0%;transition:width .08s linear}.previewbar{height:31px;padding:0 max(25px,4.7vw);background:#0b1420;color:#9caebf;border-bottom:1px solid #2d3948;display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:.12em;gap:12px}.previewbar b{color:#fff}.previewbar span:last-child{color:var(--a)}
nav.site{position:sticky;top:0;z-index:80;padding:0 max(25px,4.7vw);height:var(--navH);display:flex;align-items:center;gap:35px;border-bottom:1px solid var(--hair);background:rgba(5,12,20,.94);backdrop-filter:blur(20px)}.logo{display:flex;align-items:center;gap:13px;flex-shrink:0}.logo-icon{position:relative;display:grid;place-items:center;width:43px;height:43px;border:1px solid var(--a);transform:rotate(45deg);box-shadow:0 0 25px #78d3ff24}.logo-icon::before,.logo-icon::after{content:'';position:absolute;inset:7px;border:1px solid rgba(180,231,255,.55)}.logo-icon::after{inset:15px;background:var(--a);border:none}.brandwords{display:flex;flex-direction:column;font-weight:900;line-height:1}.brandwords strong{font-size:23px;letter-spacing:.095em}.brandwords em{font-size:10px;letter-spacing:.51em;font-style:normal;font-weight:550;margin-top:8px;color:var(--a)}.navlinks{display:flex;margin-left:auto;align-items:center;gap:clamp(18px,2.8vw,42px)}.navlinks a{font-size:11px;font-weight:800;letter-spacing:.12em;color:#d0dce6;transition:color .2s}.navlinks a:hover{color:var(--a)}.nav-cta{font-size:11px;white-space:nowrap;font-weight:900;letter-spacing:.1em;color:#06101b;background:var(--a);padding:15px 22px;border:1px solid var(--a);transition:background .2s}.nav-cta:hover,.button.primary:hover{background:white}.hamburger{display:none;background:none;color:#fff;border:1px solid var(--hair);font-size:23px;width:44px;height:44px}
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:730px;background:#050c17}.hero::after{content:'';position:absolute;inset:auto 0 0;height:140px;background:linear-gradient(transparent,var(--bg));pointer-events:none;z-index:-1}.hero-art,.hero-wash,.hero-grid{position:absolute;inset:0;z-index:-2}.hero-art{background-size:cover;background-position:center}.hero-wash{z-index:-1}.hero-grid{z-index:-1;opacity:.14;background:linear-gradient(90deg,transparent 98%,#89bde544 99%) 0 0/88px 88px,linear-gradient(transparent 98%,#89bde544 99%) 0 0/88px 88px;mask-image:linear-gradient(90deg,#000,transparent 67%)}.hero-inner{position:relative;z-index:3;max-width:1720px;margin:auto;padding:clamp(68px,8vw,135px) max(25px,6vw) 120px}.eyebrow{font-size:11px;font-weight:850;letter-spacing:.27em;text-transform:uppercase;color:var(--a);display:flex;gap:12px;align-items:center}.eyebrow .spark{height:6px;width:6px;background:var(--warm);box-shadow:0 0 0 6px color-mix(in srgb,var(--warm),transparent 84%);border-radius:50%}.hero h1{font-size:clamp(65px,8.4vw,152px);text-transform:uppercase;letter-spacing:-.087em;line-height:.87;margin:26px 0 27px;font-weight:950;text-wrap:balance;text-shadow:0 8px 50px #0009}.hero h1 .line{display:block}.hero h1 .accent{color:var(--a)}.hero .lead{font-size:clamp(16px,1.5vw,21px);line-height:1.65;color:#d5e3ed;max-width:550px;margin:0 0 33px;text-shadow:0 2px 12px #001}.actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.button{min-height:54px;display:inline-flex;gap:35px;align-items:center;justify-content:space-between;padding:16px 21px;border:1px solid var(--hair);font-size:12px;font-weight:900;letter-spacing:.07em;text-transform:uppercase;transition:transform .2s,background .2s}.button:hover{transform:translateY(-3px)}.button.primary{background:var(--a);color:#07101b;border-color:var(--a)}.button.ghost{background:rgba(3,12,21,.63);backdrop-filter:blur(10px);color:white}.button span{font-size:18px}.hero-bottom{position:absolute;bottom:25px;left:max(25px,6vw);right:max(25px,6vw);z-index:4;display:flex;justify-content:space-between;align-items:center;color:#d8e9fa;font-size:10px;font-weight:750;letter-spacing:.16em}.hero-bottom span:last-child{color:var(--a)}.hero-deco{position:absolute;z-index:2;pointer-events:none}.section{padding:105px max(25px,6vw);max-width:1800px;margin:0 auto}.kicker{color:var(--a);font-size:11px;letter-spacing:.27em;font-weight:850;display:flex;align-items:center;gap:13px}.kicker::before{content:'';width:26px;height:1px;background:var(--a)}h2{font-size:clamp(47px,5vw,86px);letter-spacing:-.075em;line-height:1;max-width:980px;margin:25px 0 26px;font-weight:900;text-wrap:balance}.outline{color:transparent;-webkit-text-stroke:1px #bcdbef}.intro-row{display:grid;grid-template-columns:1fr .54fr;align-items:end;gap:8vw}.intro-row p,.section-head p{font-size:17px;line-height:1.75;color:var(--muted);max-width:490px}.textlink{font-size:12px;letter-spacing:.09em;font-weight:850;color:var(--a);display:inline-flex;margin-top:19px;padding:0 0 12px;border-bottom:1px solid var(--a);gap:50px}.ticker{overflow:hidden;white-space:nowrap;border-block:1px solid var(--hair);padding:17px 0;color:#c2d5e4;background:#0a111e;font-size:11px;font-weight:900;letter-spacing:.21em}.ticker div{display:inline-block;min-width:200%;animation:scroll 40s linear infinite}.ticker b{color:var(--warm);padding:0 34px}@keyframes scroll{to{transform:translateX(-50%)}}.work{background:radial-gradient(ellipse at 85% 0%,rgba(36,90,132,.27),transparent 38%),#070e18;border-block:1px solid var(--hair);padding-bottom:95px}.work .section{padding-bottom:0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:60px}.work-grid{display:grid;grid-template-columns:1.12fr .84fr .84fr;gap:17px;margin-top:45px}.work-card{position:relative;overflow:hidden;min-height:440px;background:#142030;border:1px solid #2f4960}.work-card:first-child{grid-row:span 2;min-height:700px}.work-card img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .7s ease,filter .7s ease;filter:saturate(1.18) contrast(1.03)}.work-card:hover img{transform:scale(1.06)}.work-card:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(1,6,16,.96),rgba(1,6,16,.08) 70%)}.work-card .badge{position:absolute;top:21px;left:23px;z-index:2;color:white;font-size:10px;letter-spacing:.16em;background:#030c19ac;border:1px solid #bbd7e67a;padding:9px 12px}.work-card .details{position:absolute;bottom:25px;left:26px;right:20px;z-index:2}.work-card .details span{font-size:10px;color:var(--a);font-weight:850;letter-spacing:.18em}.work-card .details h3{font-size:clamp(23px,2.3vw,35px);line-height:1.08;margin:12px 0}.work-card .details p{font-size:12px;color:#b8d1e5;margin:0}.work-card:first-child .details h3{font-size:clamp(31px,3vw,52px)}.services{background:#080f19}.services .section-head h2{margin-bottom:5px}.services-list{margin-top:40px;border-top:1px solid var(--hair)}.service-row{display:grid;grid-template-columns:65px 1fr minmax(240px,.6fr) 50px;align-items:center;gap:24px;padding:27px 8px;border-bottom:1px solid var(--hair);transition:padding .3s,background .3s}.service-row:hover{padding-inline:24px;background:#102338}.service-row .no{font:750 12px monospace;color:var(--a)}.service-row h3{font-size:clamp(22px,2.4vw,38px);letter-spacing:-.045em;margin:0}.service-row p{font-size:13px;color:var(--muted);line-height:1.6;margin:0}.service-row .arrow{font-size:26px;color:var(--warm);text-align:right}.closing{position:relative;background:linear-gradient(120deg,#0c1a2a,#0c2837 50%,#070e19);border-block:1px solid var(--hair);overflow:hidden}.closing::before{content:'AI SYS';position:absolute;font-size:clamp(200px,38vw,620px);font-weight:1000;letter-spacing:-.09em;color:rgba(151,218,255,.035);white-space:nowrap;top:-20%;left:-2%;pointer-events:none}.closing .section{position:relative;display:flex;justify-content:space-between;gap:30px;align-items:end}.closing h2{margin-bottom:0}.contact{background:#060d15}.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:8vw;margin-top:30px}.contact p{font-size:17px;line-height:1.7;color:var(--muted);max-width:480px}.mail{display:inline-block;font-size:clamp(16px,2vw,25px);color:var(--a);font-weight:800;margin-top:23px;overflow-wrap:anywhere}.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:15px;align-items:start}.contact-form label{display:grid;gap:8px;font-size:11px;font-weight:850;letter-spacing:.1em;color:#daebf5;text-transform:uppercase}.contact-form label.wide{grid-column:1/-1}.contact-form input,.contact-form textarea,.contact-form select{background:#0c1928;border:1px solid #3a5264;color:white;border-radius:0;padding:16px 14px;min-width:0}.contact-form textarea{resize:vertical}.contact-form button{justify-content:center}.form-note{font-size:11px!important;line-height:1.4!important;align-self:center;margin:0!important}.contact-form input:focus-visible,.contact-form textarea:focus-visible,.contact-form select:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid var(--warm);outline-offset:3px}footer{border-top:1px solid var(--hair);background:#03080f;padding:33px max(25px,6vw);display:flex;justify-content:space-between;gap:24px;align-items:center;font-size:11px;color:#9fb2c4}footer .logo-icon{width:30px;height:30px}footer .brandwords strong{font-size:15px}footer .brandwords em{font-size:7px}.reveal{opacity:0;transform:translateY(32px);transition:opacity .7s,transform .7s}.reveal.visible{opacity:1;transform:none}
/* CONCEPT 09: editorial split-stage / filmstrip with art foreground */
body.motion{--bg:#070917}.motion .hero{min-height:825px;background:linear-gradient(120deg,#070913,#11152d)}.motion .hero-art{left:34%;background-image:url('assets/hero-09.webp');background-position:center;filter:saturate(1.23)}.motion .hero-wash{background:linear-gradient(90deg,#050812 0%,#060a14 26%,rgba(5,9,19,.88) 48%,rgba(5,9,19,.09) 95%),linear-gradient(0deg,#070a16 2%,transparent 28%)}.motion .hero-inner{padding-top:125px}.motion .hero h1{max-width:1030px;font-size:clamp(75px,10vw,172px)}.motion .hero h1 .accent{color:var(--warm)}.motion .hero .lead{max-width:445px}.motion .hero-deco{right:5.1%;top:12%;width:220px;height:290px;border:1px solid #add8ff55;background:#0410216b;backdrop-filter:blur(1px);box-shadow:0 8px 55px #0009}.motion .hero-deco::before{content:'A / 001  •  PRODUCTION FRAME';font-size:9px;letter-spacing:.1em;position:absolute;top:14px;left:14px;color:#e0eff9}.motion .hero-deco img{position:absolute;left:12px;right:12px;top:43px;width:calc(100% - 24px);height:230px;object-fit:cover}.motion .hero-bottom{border-top:1px solid #d1e8ff4d;padding-top:17px}.motion .work-grid{grid-template-columns:1.2fr 1fr 1fr}.motion .work-card:first-child{min-height:710px}
/* CONCEPT 10: full-bleed bright architectural space / editorial floating panel */
body.immersive{--bg:#061322;--ink:#f8fbff;--muted:#bbcee1}.immersive .hero{min-height:800px}.immersive .hero-art{background-image:url('assets/hero-10.webp');background-position:center 47%;filter:saturate(1.16)}.immersive .hero-wash{background:linear-gradient(90deg,rgba(0,12,27,.94),rgba(1,16,32,.82) 28%,rgba(3,19,38,.23) 80%),linear-gradient(0deg,#061322 0%,transparent 38%)}.immersive .hero-inner{padding-top:130px}.immersive .hero h1{max-width:900px;font-size:clamp(70px,8.7vw,144px)}.immersive .hero h1 .accent{-webkit-text-stroke:1px var(--a);color:transparent}.immersive .hero .lead{max-width:470px}.immersive .hero-deco{right:5vw;top:16%;width:150px;height:150px;border:1px solid #e1f5ff88;border-radius:50%;display:grid;place-items:center;background:#00142664;backdrop-filter:blur(7px)}.immersive .hero-deco::before{content:'CREATIVE / PRODUCTION / DIGITAL ART';width:80px;text-align:center;color:#dceffc;line-height:1.6;font-weight:850;font-size:10px;letter-spacing:.13em}.immersive .work-grid{grid-template-columns:1fr 1.3fr 1fr}.immersive .work-card:first-child{grid-column:2;grid-row:span 2}.immersive .work-card:nth-child(2){grid-column:1;grid-row:1}.immersive .work-card:nth-child(3){grid-column:3;grid-row:1}.immersive .work-card:nth-child(4){grid-column:1;grid-row:2}.immersive .work-card:nth-child(5){grid-column:3;grid-row:2}
/* 11: hybrid a full cinematic reveal with framed hero and picture-led offset */
body.hybrid{--bg:#070c14}.hybrid .hero{min-height:850px;background:#060b14}.hybrid .hero-art{background-image:url('assets/hero-11.webp');background-position:center 45%;filter:saturate(1.18) contrast(1.05)}.hybrid .hero-wash{background:linear-gradient(90deg,#050a13 0%,rgba(5,10,19,.96) 20%,rgba(5,10,19,.74) 50%,rgba(5,10,19,.12) 98%),linear-gradient(0deg,#070c14 0%,transparent 43%)}.hybrid .hero-inner{padding-top:130px}.hybrid .hero h1{max-width:1010px;font-size:clamp(76px,10.4vw,173px);line-height:.88}.hybrid .hero .lead{max-width:480px}.hybrid .hero h1 .accent{color:var(--warm)}.hybrid .hero-deco{right:4.5vw;bottom:12%;width:205px;height:155px;border:1px solid #94e0e685;background:#0616259c;box-shadow:0 15px 60px #0008}.hybrid .hero-deco img{width:100%;height:100%;object-fit:cover;opacity:.95}.hybrid .hero-deco::after{content:'NOW SHOWING  •  SELECTED WORLDS';font-size:9px;letter-spacing:.07em;color:white;position:absolute;bottom:7px;left:9px;background:#061422bb;padding:5px}.hybrid .work-grid{grid-template-columns:1.25fr 1fr 1fr}.hybrid .work-card:first-child{min-height:715px}
@media(max-width:1050px){nav.site{padding-inline:25px}.navlinks{gap:18px}.hero-deco{display:none}.hero h1{font-size:clamp(63px,9vw,100px)}.work-card{min-height:320px}.work-card:first-child{min-height:560px}}
@media(max-width:770px){:root{--navH:68px}.previewbar{padding:0 18px;font-size:8px}.previewbar span:last-child{display:none}nav.site{padding:0 18px}.logo-icon{width:33px;height:33px}.brandwords strong{font-size:18px}.brandwords em{font-size:8px}.navlinks{display:none;position:absolute;top:68px;left:0;right:0;padding:24px;background:#081a2b;flex-direction:column;align-items:stretch;border-bottom:1px solid var(--hair)}.navlinks.open{display:flex}.navlinks a{padding:14px 6px;font-size:13px}.nav-cta{display:none}.hamburger{margin-left:auto;display:block}.hero,.motion .hero,.immersive .hero,.hybrid .hero{min-height:710px}.hero-inner,.motion .hero-inner,.immersive .hero-inner,.hybrid .hero-inner{padding:102px 24px 120px}.hero-art,.motion .hero-art{left:0}.motion .hero-wash,.hybrid .hero-wash{background:linear-gradient(90deg,#050b17ee,#071222a6),linear-gradient(0deg,#060d18 0%,transparent 50%)}.immersive .hero-wash{background:linear-gradient(90deg,#021126ed,#06182cbb),linear-gradient(0deg,#061322 0%,transparent 45%)}.hero h1,.motion .hero h1,.immersive .hero h1,.hybrid .hero h1{font-size:clamp(57px,11vw,99px);letter-spacing:-.085em}.hero .lead{font-size:16px;max-width:410px}.hero-bottom{left:24px;right:24px;font-size:9px}.hero-bottom span:last-child{display:none}.section{padding:75px 24px}.intro-row{grid-template-columns:1fr;gap:12px}.section-head{align-items:start;display:block}.section-head p{max-width:520px}.work-grid,.immersive .work-grid,.hybrid .work-grid{grid-template-columns:1fr 1fr}.work-card,.work-card:first-child,.immersive .work-card:first-child,.immersive .work-card:nth-child(2),.immersive .work-card:nth-child(3),.immersive .work-card:nth-child(4),.immersive .work-card:nth-child(5){grid-column:auto;grid-row:auto;min-height:310px}.work-card:first-child{grid-column:span 2;min-height:430px}.service-row{grid-template-columns:40px 1fr 30px;gap:10px}.service-row p{grid-column:2;grid-row:2}.service-row .arrow{grid-row:1;grid-column:3}.closing .section{display:block}.closing .button{margin-top:26px}.contact-layout{grid-template-columns:1fr;gap:25px}footer{flex-wrap:wrap}}
@media(max-width:480px){.hero h1,.motion .hero h1,.immersive .hero h1,.hybrid .hero h1{font-size:clamp(49px,12vw,67px)}.eyebrow{font-size:9px;letter-spacing:.13em}.hero-bottom{letter-spacing:.09em}.button{width:100%;justify-content:space-between}.work-grid,.immersive .work-grid{grid-template-columns:1fr}.work-card,.work-card:first-child{grid-column:span 1;min-height:360px}.work-card:first-child{min-height:450px}.service-row{padding:24px 0}.service-row h3{font-size:22px}.contact-form{grid-template-columns:1fr}.contact-form label.wide{grid-column:1}.closing h2{font-size:45px}.previewbar{letter-spacing:.035em}.intro-row p{font-size:16px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}
