.c-topbar{background:#2447e8;color:#f6f6ee}.c-topbar .header{border-bottom:1px solid #ffffff30}.c-topbar .nav a:after{background:#dfff78}
.c-cinematic{background:#2447e8;color:#f6f6ee}
.c-cinema-backdrop{position:absolute;inset:0;z-index:-3;background:#1634c8;overflow:hidden}
.c-cinema-backdrop>span{position:absolute;inset:0 50% 0 0;background:linear-gradient(130deg,#284eee,#2447e8);background-size:200% 100%;background-position:0 0}
.c-cinema-backdrop>span:nth-child(2){inset:0 0 0 50%;background-position:100% 0}
.c-cinema-grid{position:absolute;inset:0;z-index:-2;background-image:linear-gradient(#ffffff09 1px,transparent 1px),linear-gradient(90deg,#ffffff09 1px,transparent 1px);background-size:calc(100% / 8) 160px;mask-image:linear-gradient(transparent,#000 40%,transparent)}
.c-cinema-layout{position:relative;min-height:800px;padding-top:34px}
.c-cinema-heading{position:relative;text-align:center;z-index:4}
.c-cinema-heading h1{font-size:clamp(98px,10.8vw,164px);line-height:1.02;letter-spacing:-.075em;font-weight:550;margin-top:14px}
.c-cinema-heading .cinema-line{display:block;max-width:100%}
.c-cinema-subtitle{display:block;font-size:27px;line-height:1.4;letter-spacing:-.02em;font-weight:450;margin-top:12px;color:#dfff78}
.c-cinema-scene{position:absolute;left:50%;top:256px;transform:translateX(-50%);width:590px;height:535px;z-index:2;pointer-events:none;isolation:isolate}
.c-cinema-halo{position:absolute;inset:5% -15%;z-index:-2;border-radius:50%;background:radial-gradient(ellipse,#7291ff6b,transparent 67%);transform:translate(calc(var(--scene-x,0px) * -.6),calc(var(--scene-scroll,0px) * -.4));transition:transform 1.4s ease-out}
.c-cinema-orbit{position:absolute;inset:25% -12%;border:1px solid #ffffff30;border-radius:50%;transform:rotate(-22deg);z-index:-1}
.c-cinema-orbit:after{content:'';position:absolute;width:9px;height:9px;background:#dfff78;border-radius:50%;right:8%;top:15%;box-shadow:0 0 20px #dfff7840}
.c-cinema-scene .cinema-art{filter:drop-shadow(0 25px 18px #07196540)}
.c-cinema-intro{position:absolute;left:0;top:370px;width:245px;z-index:3}
.c-cinema-symbol{display:block;font-size:46px;line-height:1;color:#dfff78;margin-bottom:23px}
body[data-page=index] .c-cinema-intro p{font-size:17px!important;line-height:1.65!important}.c-cinema-intro .cinema-link{margin-top:20px}
.c-cinema-action{position:absolute;right:0;top:440px;width:237px;z-index:3}
.c-cinema-action .cinema-button{background:#dfff78;color:#17231f;border-color:#dfff78;border-radius:4px;min-width:100%;font-size:15px;padding-inline:20px}
.c-cinema-action .cinema-button:hover{background:#eaffae;box-shadow:0 8px 24px #132d9626}
body[data-page=index] .c-cinema-action p{font-size:15px!important;line-height:1.6!important;margin-top:24px}.c-cinema-action .cinema-link{margin-top:9px;color:#dfff78}
.c-cinema-bottom{border-top:1px solid #ffffff35;position:relative;z-index:5;background:#1e40d6aa}
.c-cinema-bottom>.s-container{padding-block:21px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.c-cinema-bottom a{display:inline-flex;gap:18px;align-items:center;font-size:14px;text-decoration:underline;text-underline-offset:6px}
.c-cinema-service-list{font-size:12px;color:#dde4ff}
.c-cinematic.motion-ready:not(.is-entered) .c-cinema-backdrop>span:first-child{transform:translateX(-102%)}
.c-cinematic.motion-ready:not(.is-entered) .c-cinema-backdrop>span:nth-child(2){transform:translateX(102%)}
.c-cinematic.motion-ready.is-entered .c-cinema-backdrop>span:first-child{animation:chrome-left 1.3s var(--cinema-ease) both}
.c-cinematic.motion-ready.is-entered .c-cinema-backdrop>span:nth-child(2){animation:chrome-right 1.3s var(--cinema-ease) .1s both}
.c-cinematic.motion-ready.is-entered .cinema-entrance{animation:chrome-arrival 2.6s var(--cinema-ease) .35s both}
.c-cinematic.motion-ready.is-entered .cinema-art{animation:chrome-idle 12s ease-in-out 2.95s infinite}
.c-cinematic.motion-ready.is-entered .c-cinema-orbit{animation:chrome-orbit 16s ease-in-out 2.95s infinite}
.c-cinematic.is-paused .c-cinema-orbit,.c-cinematic.is-offscreen .c-cinema-orbit{animation-play-state:paused!important}
.c-cinematic.is-paused .c-cinema-halo,.c-cinematic.is-offscreen .c-cinema-halo{transform:none;transition:none}
.c-cinematic.is-paused .c-cinema-backdrop>span{animation:none!important;transform:none}
.c-cinematic.motion-ready.is-entered.has-arrived .c-cinema-backdrop>span{animation:none;transform:none}
@keyframes chrome-left{from{transform:translateX(-102%)}to{transform:none}}
@keyframes chrome-right{from{transform:translateX(102%)}to{transform:none}}
@keyframes chrome-arrival{0%{opacity:0;transform:translateY(90px) rotate(-22deg) scale(.62)}18%{opacity:1}80%{transform:translateY(-4px) rotate(1deg) scale(1.008)}100%{opacity:1;transform:none}}
@keyframes chrome-idle{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(-10px) rotate(2deg)}75%{transform:translateY(-3px) rotate(-.7deg)}}
@keyframes chrome-orbit{0%,100%{transform:rotate(-22deg)}50%{transform:rotate(-12deg)}}
/* Keep the former interactive project preview as a purposeful portfolio feature. */
.c-project-selection{display:grid;grid-template-columns:.85fr 1.15fr;gap:64px;padding-block:85px;align-items:center}
.c-selection-intro h2{font-size:clamp(38px,4vw,56px);font-weight:550;line-height:1.1;letter-spacing:-.04em;margin-bottom:25px}.c-selection-intro>p:not(.s-label){max-width:42ch}.c-selection-intro .s-text-link{margin-top:23px}
.c-project-selection .hero-stage{min-height:0;width:100%;padding:25px}.c-project-selection .work-window{margin-top:25px;transform:none}.c-project-selection .work-window:hover{transform:translateY(-3px)}
.c-project-selection .project-ticket{margin-top:20px}.c-project-selection .stage-label{padding-right:0}
@media(min-width:1700px){.c-cinema-layout{min-height:880px}.c-cinema-scene{top:300px;width:625px;height:565px}.c-cinema-heading h1{font-size:170px}}
@media(min-width:801px) and (max-width:1100px){.c-cinema-layout{min-height:810px}.c-cinema-heading h1{font-size:116px}.c-cinema-scene{top:245px;width:min(470px,45vw);height:460px}.c-cinema-intro{top:400px;width:clamp(155px,18.5vw,190px)}.c-cinema-action{top:460px;width:clamp(155px,18.5vw,190px)}.c-cinema-action .cinema-button{font-size:14px;padding-inline:15px;gap:15px}body[data-page=index] .c-cinema-intro p{font-size:16px!important}.c-cinema-service-list{display:none}.c-project-selection{gap:38px}}
@media(max-width:800px){
 .c-topbar .header{height:80px}.c-cinema-layout{display:flex;flex-direction:column;min-height:0;padding-top:28px}
 .c-cinema-heading h1{font-size:clamp(53px,13.5vw,99px);letter-spacing:-.065em;margin-top:20px}.c-cinema-heading .cinema-kicker{max-width:34ch;margin:auto}.c-cinema-subtitle{font-size:21px;margin-top:15px}
 .c-cinema-scene{position:relative;left:auto;top:auto;transform:none;width:100%;height:auto;aspect-ratio:1;max-width:500px;align-self:center;margin-top:8px;order:1}
 .c-cinema-orbit{inset:29% -4%;}.c-cinema-action{position:relative;inset:auto;width:100%;order:2;text-align:center;margin-top:8px;padding-bottom:28px}.c-cinema-action .cinema-button{min-width:0;width:min(310px,100%)}body[data-page=index] .c-cinema-action p{max-width:32ch;margin:18px auto 0}.c-cinema-action .cinema-link{margin-top:4px}
 .c-cinema-intro{position:relative;inset:auto;order:3;width:100%;padding:26px 0 28px;border-top:1px solid #ffffff30}.c-cinema-symbol{display:none}.c-cinema-intro .cinema-link{margin-top:12px}body[data-page=index] .c-cinema-intro p{font-size:17px!important;max-width:58ch}
 .c-cinema-bottom>.s-container{flex-wrap:wrap;gap:18px;padding-block:22px}.c-cinema-service-list{display:none}
 .c-project-selection{grid-template-columns:1fr;gap:30px;padding-block:52px}.c-selection-intro h2{font-size:39px}.c-project-selection .hero-stage{padding:20px}.c-project-selection .work-window{margin-top:24px}
}
@media(max-width:380px){.c-cinema-heading h1{font-size:clamp(45px,14vw,52px)}.c-cinema-subtitle{font-size:19px}.c-cinema-layout{padding-top:24px}.c-cinema-bottom>.s-container{flex-direction:column;align-items:start}.c-project-selection .hero-stage{padding:17px}}
@media(prefers-reduced-motion:reduce){.c-cinematic .c-cinema-backdrop>span{transform:none!important}.c-cinematic .c-cinema-halo{transform:none!important}}