:root{
  --project-blue:#5ec8ff;
  --project-cyan:#72f2e7;
  --project-navy:#08131b;
  --project-steel:#9cb0bc;
}
.project-header .brand{display:inline-flex;align-items:center;gap:12px}
.pixel-spark{position:relative;width:20px;height:20px;display:inline-block;image-rendering:pixelated}
.pixel-spark::before,.pixel-spark::after{content:"";position:absolute;background:var(--project-blue);box-shadow:6px 0 0 var(--project-blue),12px 0 0 rgba(94,200,255,.38),6px -6px 0 rgba(114,242,231,.7),6px 6px 0 rgba(94,200,255,.65)}
.pixel-spark::before{width:4px;height:4px;left:0;top:8px}
.pixel-spark::after{width:4px;height:4px;left:10px;top:2px}
.project-header-tools{display:flex;align-items:center;gap:22px}
.page-language{border:1px solid var(--line);background:rgba(255,255,255,.02);color:var(--muted);padding:8px 11px;font:inherit;font-size:10px;font-weight:800;letter-spacing:.12em;cursor:pointer}
.project-hero{min-height:min(88vh,920px);background-position:center;position:relative;overflow:hidden}
.project-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.16) 68%),linear-gradient(0deg,rgba(0,0,0,.9),transparent 62%);pointer-events:none}
.project-hero>div{position:relative;z-index:1}
.project-hero h1{max-width:1250px;font-size:clamp(52px,8vw,126px)}
.project-hero p{color:#e7eff2}
.status{display:inline-flex;margin-bottom:16px;padding:9px 12px;border:1px solid rgba(94,200,255,.48);background:rgba(0,0,0,.58);font-size:10px;font-weight:800;letter-spacing:.18em;color:var(--project-blue)}
.content--narrative{align-items:start}
.copy-stack{display:grid;gap:28px}
.copy-stack p{margin:0}
.intro-line{max-width:1080px;margin:0;font-size:clamp(25px,3.2vw,52px)!important;line-height:1.14;letter-spacing:-.035em;color:var(--text)!important}
.facts strong{text-align:right;max-width:64%}
.film-section{margin:0 clamp(20px,4vw,64px) clamp(80px,9vw,150px);display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.58fr);gap:8vw;align-items:center;padding:clamp(42px,6vw,90px);border:1px solid var(--line);background:radial-gradient(circle at 78% 22%,rgba(94,200,255,.14),transparent 34%),linear-gradient(120deg,#0a0e12,#08090b)}
.film-copy h2{margin:10px 0 28px;font-size:clamp(42px,6.6vw,94px);line-height:.94;letter-spacing:-.055em}
.film-copy p:last-child{max-width:740px;color:var(--muted);font-size:16px}
.phone-stage{display:grid;justify-items:center;gap:16px}
.phone-shell{width:min(100%,400px);padding:10px;border:1px solid rgba(255,255,255,.22);border-radius:36px;background:#020304;box-shadow:0 34px 90px rgba(0,0,0,.55)}
.phone-shell video{width:100%;display:block;border-radius:27px;background:#000;aspect-ratio:9/16;object-fit:cover}
.runtime{font-size:10px;letter-spacing:.16em;color:var(--muted)}
.chapter{padding:0 clamp(20px,4vw,64px) clamp(70px,9vw,140px)}
.chapter-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,.45fr);gap:7vw;align-items:end;padding-bottom:32px;border-bottom:1px solid var(--line)}
.chapter-head h2{max-width:1080px;margin:8px 0 0;font-size:clamp(40px,6.4vw,92px);line-height:.94;letter-spacing:-.055em}
.chapter-head p:last-child{margin:0;color:var(--muted);font-size:15px}
.project-gallery{align-items:start}
.project-gallery figure{margin:0;position:relative;overflow:hidden;background:#101318}
.project-gallery figure.wide{grid-column:1/-1}
.project-gallery img{aspect-ratio:9/16;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.project-gallery figure.wide img{aspect-ratio:16/7;object-position:center 64%}
.project-gallery figure:hover img{transform:scale(1.012)}
.project-gallery figcaption{position:absolute;left:16px;bottom:14px;padding:7px 9px;background:rgba(0,0,0,.72);backdrop-filter:blur(10px);font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.statement{margin:0 clamp(20px,4vw,64px) clamp(70px,9vw,140px);min-height:72vh;display:grid;align-items:end;padding:clamp(48px,8vw,110px);background:linear-gradient(120deg,rgba(0,0,0,.94),rgba(0,0,0,.2)),url('smart-logistics-aerial.jpg') center 54%/cover}
.statement>div{max-width:1280px}
.statement blockquote{margin:18px 0 36px;font-size:clamp(40px,6.8vw,100px);line-height:.94;letter-spacing:-.055em}
.statement p:last-child{max-width:760px;color:#d2dde2;font-size:17px}
.process{padding:0 clamp(20px,4vw,64px) clamp(70px,9vw,140px)}
.process-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--line)}
.process-grid article{min-height:300px;padding:25px 22px 30px 0;border-bottom:1px solid var(--line)}
.process-grid article+article{padding-left:22px;border-left:1px solid var(--line)}
.process-grid span{font-size:11px;letter-spacing:.16em;color:var(--project-blue)}
.process-grid h3{margin:58px 0 12px;font-size:20px}
.process-grid p{margin:0;color:var(--muted);font-size:13px}
.closing-note{margin:0 clamp(20px,4vw,64px) clamp(70px,9vw,140px);padding:clamp(54px,7vw,100px);border:1px solid var(--line);background:linear-gradient(120deg,rgba(94,200,255,.12),transparent 38%),#0b0f13}
.closing-note h2{max-width:1120px;margin:12px 0 30px;font-size:clamp(40px,6vw,82px);line-height:.98;letter-spacing:-.05em}
.closing-note p:last-child{max-width:800px;color:var(--muted)}
@media(max-width:1050px){.process-grid{grid-template-columns:repeat(3,1fr)}.process-grid article:nth-child(4){border-left:0;padding-left:0}}
@media(max-width:900px){.chapter-head,.film-section{grid-template-columns:1fr}.project-header-tools{gap:12px}.process-grid{grid-template-columns:1fr 1fr}.process-grid article:nth-child(3),.process-grid article:nth-child(5){border-left:0;padding-left:0}.film-copy{text-align:left}}
@media(max-width:620px){
  .project-header{padding:16px 18px}.project-header .brand{gap:8px}.pixel-spark{display:none}.back{font-size:9px}.page-language{padding:7px 8px}main{padding-top:62px}
  .project-hero{min-height:78vh;padding:34px 20px;background-position:center}.project-hero h1{font-size:clamp(44px,13.5vw,68px)}
  .film-section{margin-left:20px;margin-right:20px;padding:36px 20px}.phone-shell{max-width:330px}
  .process-grid{grid-template-columns:1fr}.process-grid article,.process-grid article+article{min-height:auto;padding:24px 0;border-left:0}.process-grid h3{margin-top:30px}
  .statement{margin-left:0;margin-right:0;padding:50px 20px}.closing-note{margin-left:20px;margin-right:20px;padding:42px 20px}
  .project-gallery img,.project-gallery figure.wide img{aspect-ratio:9/14}
}