@font-face{font-family:VHS;src:url('assets/vt323.ttf') format('truetype');font-display:swap}
:root{color-scheme:dark;--paper:#d4dec5;--muted:#9ba68e;--line:#525b42;--signal:#d5ed99;--alarm:#f45740}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px;background:#070906}body{margin:0;color:var(--paper);font-family:VHS,'Courier New',monospace;background:#060805}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid var(--signal);outline-offset:5px}.skip{position:absolute;top:-80px;z-index:20;padding:15px;background:#000}.skip:focus{top:10px}.surveillance-feed{position:fixed;inset:0;z-index:0;pointer-events:none;background:#080b06}.surveillance-feed video{width:100%;height:100%;object-fit:cover;pointer-events:none}.surveillance-feed:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#00000099,transparent 75%),radial-gradient(ellipse,transparent 35%,#000b)}video::-webkit-media-controls{display:none!important}.signal-noise{position:fixed;inset:0;z-index:5;pointer-events:none;opacity:.28;background:repeating-linear-gradient(0deg,#0009 0 1px,transparent 1px 4px);box-shadow:inset 0 0 130px #0008}.signal-noise:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 48%,#ffffff1c 49%,transparent 51%);background-size:100% 180%;animation:tracking 13s linear infinite}main{position:relative;z-index:1}.hero{margin:12px 24px 0;position:relative;min-height:660px;height:calc(100svh - 24px);max-height:1000px;padding:100px 5% 85px;display:flex;align-items:flex-end;border:1px solid #87916b;overflow:hidden}.hero:before,.hero:after{content:'';position:absolute;left:0;right:0;height:2px;background:#c1d39540;pointer-events:none;top:30%;animation:tear 11s steps(1) infinite}.hero:after{top:75%;animation-delay:-4s}.hero-shade{position:absolute;inset:0;background:linear-gradient(0deg,#000000bb,transparent 85%);pointer-events:none}.hero-top,.hero-bottom{position:absolute;left:22px;right:22px;display:flex;justify-content:space-between;gap:15px;font-size:11px;letter-spacing:1px}.hero-top{top:20px}.hero-top>span{padding:6px 8px;background:#070a05c9}.hero-top i{display:inline-block;width:8px;height:8px;background:var(--alarm);margin-right:8px;box-shadow:0 0 10px #f4574060}.hero-bottom{bottom:20px;font-size:10px}.hero-bottom>span:first-child{color:var(--alarm)}.hero-copy{position:relative;max-width:900px}.hero-copy>p{font-size:11px;text-transform:uppercase;letter-spacing:2px;color:#d3dcc1}.hero h1{font-size:clamp(60px,8.5vw,128px);line-height:.88;letter-spacing:-.065em;text-transform:uppercase;font-weight:400;margin:24px 0 36px;text-shadow:2px 0 #c7453270,-2px 0 #a9dac46b;animation:text-drift 9s steps(1) infinite}.tracking-target{position:absolute;right:12%;top:22%;width:150px;height:190px;border:1px solid #b4c58b66;clip-path:polygon(0 0,25% 0,25% 1%,75% 1%,75% 0,100% 0,100% 20%,99% 20%,99% 80%,100% 80%,100% 100%,75% 100%,75% 99%,25% 99%,25% 100%,0 100%,0 80%,1% 80%,1% 20%,0 20%)}.tracking-target span{position:absolute;top:45%;width:100%;text-align:center;font-size:9px;color:#d2dda6}.warning-strip{margin:0 24px;padding:9px 12px;white-space:nowrap;overflow:hidden;background:var(--alarm);color:#120a04;font-size:11px;letter-spacing:3px}.warning-strip span{margin:0 35px}.section{margin:20px 24px;padding:60px 5%;border:1px solid var(--line);background:#080c06ed;box-shadow:inset 0 0 0 5px #151b1066}.section-label,.section-head>span:last-child,figcaption{font-size:11px;line-height:1.6;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}.section-label{color:var(--alarm)}h2{font-size:clamp(32px,4.5vw,64px);line-height:1;letter-spacing:-.04em;font-weight:400;text-transform:uppercase;margin:0 0 30px}.concept{display:grid;grid-template-columns:1fr 3fr;gap:40px}.body-copy{display:grid;grid-template-columns:1fr 1fr;gap:32px;font-size:17px;line-height:1.75;color:#bcc3ad}.body-copy p{margin:0}.section-head{display:flex;justify-content:space-between;align-items:start;gap:30px;margin-bottom:26px;padding-bottom:18px;border-bottom:1px dashed var(--line)}.section-head h2{max-width:650px;margin:0}.film{background:#00000022;padding:24px}.film .section-head{background:#080c06e8;margin:-24px -24px 0;padding:18px 24px}.video-frame{position:relative;aspect-ratio:16/9;max-height:75svh;border:1px solid #afbc8c70;margin-top:20px;box-shadow:inset 0 0 70px #0005}.feed-label,.feed-caption{position:absolute;padding:8px 10px;background:#050803b0;font-size:11px;letter-spacing:2px}.feed-label{top:15px;left:15px;color:var(--alarm)}.feed-caption{bottom:15px;right:15px}.gallery{padding-left:24px;padding-right:24px}.gallery-grid{display:grid;grid-template-columns:1fr;gap:40px}figure{margin:0}.photo-open{display:block;width:100%;padding:5px;background:#11170b;border:1px solid #747e5e;cursor:zoom-in}.photo-open img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;}figcaption{display:flex;justify-content:space-between;padding-top:12px}.system{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr);gap:36px;background:#080a07}.system-title{grid-column:1/-1}.system-title .section-label{margin:0 0 25px}.development{color:var(--muted);line-height:1.7;max-width:500px}.system ol{list-style:none;padding:0;margin:0}.system li{padding:23px 0;display:flex;gap:25px;border-bottom:1px solid var(--line);font-size:18px}.system li:first-child{border-top:1px solid var(--line)}.system li span{font-size:11px;color:var(--alarm)}.project-log>.section-label{margin:0 0 30px}.log-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.log-grid article{padding:24px;border:1px dashed var(--line)}.log-grid article>span{color:var(--alarm);font-size:11px}.log-grid h3{font-size:26px;font-weight:400;text-transform:uppercase;margin:20px 0 15px}.log-grid p{color:var(--muted);font-size:15px;line-height:1.7}dialog{z-index:10;padding:50px 20px 20px;background:#080c06;border:1px solid var(--line);width:min(95vw,1600px);max-height:95svh}dialog::backdrop{background:#000e}dialog img{width:100%;display:block;max-height:80svh;object-fit:contain}.close-viewer{position:absolute;right:14px;top:12px;background:#151b10;color:var(--paper);border:1px solid var(--line);padding:7px 12px;cursor:pointer}@keyframes tracking{from{background-position:0 180%}to{background-position:0 -180%}}@keyframes tear{0%,94%,100%{transform:translateY(0);opacity:.15}95%{transform:translateY(65px);opacity:.7}97%{transform:translateY(-35px);opacity:.3}}@keyframes text-drift{0%,96%,100%{text-shadow:2px 0 #c7453270,-2px 0 #a9dac46b}97%{text-shadow:5px 1px #c7453270,-4px -1px #a9dac46b}98%{text-shadow:-2px 0 #c7453270,3px 0 #a9dac46b}}@media(max-width:700px){.hero{margin:10px 10px 0;min-height:600px;height:calc(100svh - 20px);padding:90px 6%}.hero h1{font-size:clamp(49px,11vw,76px)}.hero-top,.hero-bottom{left:12px;right:12px;font-size:9px;letter-spacing:0}.hero-bottom{flex-direction:column;gap:8px}.hero-copy>p{font-size:10px;line-height:1.5;letter-spacing:1px}.tracking-target{right:15%;top:20%;width:90px;height:110px}.tracking-target span{font-size:7px}.warning-strip{margin:0 10px;font-size:9px}.section{margin:14px 10px;padding:35px 6%}.concept,.body-copy,.system,.log-grid,.gallery-grid{grid-template-columns:1fr;gap:26px}.section-head{flex-direction:column;gap:15px}.body-copy{font-size:16px}.film{padding:14px}.film .section-head{margin:-14px -14px 0;padding:18px 14px}.feed-label,.feed-caption{font-size:8px;letter-spacing:1px}.feed-caption{bottom:8px;right:8px}.feed-label{top:8px;left:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important}}

@media(max-width:700px){.gallery{padding-left:12px;padding-right:12px}}

/* VHS on-screen typography and a single-column system walkthrough. */
.hero-logo{display:block;width:clamp(240px,35vw,450px);max-width:100%;height:auto;margin:26px 0 30px}
.hero h1{letter-spacing:-.025em;line-height:.95;margin-bottom:0}
.hero-copy>p{font-size:17px}.hero-top{font-size:16px}.hero-bottom{font-size:14px}
.section-label,.section-head>span:last-child,figcaption{font-size:16px}
.body-copy{font-size:22px;line-height:1.55}.development{font-size:21px;max-width:700px}
.system-diagram{display:block;width:100%;max-width:1000px;height:auto;margin:0 auto}
.system li{font-size:25px}.system li span{font-size:17px}
.log-grid p{font-size:20px}.log-grid article>span{font-size:16px}
@media(max-width:700px){.hero{min-height:660px}.hero-logo{width:280px;margin:24px 0}.hero h1{font-size:clamp(44px,11vw,76px)}.hero-copy>p{font-size:15px}.hero-top,.hero-bottom{font-size:12px}.body-copy{font-size:21px}.system li{font-size:22px}}

/* Installation enquiries and a continuous vertical reading order. */
.enquire{display:inline-block;margin-top:24px;padding:10px 24px;border:1px solid var(--signal);background:#080a07cc;font-size:22px;text-transform:uppercase}
.enquire:hover{background:var(--signal);color:#080a07}
.concept,.body-copy{grid-template-columns:minmax(0,1fr)}
.concept{gap:24px}.body-copy{gap:22px}
.gallery-grid{gap:14px}
.system{row-gap:12px}.system-title{margin-bottom:16px}
.log-grid{grid-template-columns:minmax(0,1fr);gap:16px}
.log-grid article{display:grid;grid-template-columns:40px minmax(120px,1fr) 3fr;align-items:baseline;gap:24px}
.log-grid h3,.log-grid p{margin:0}
@media(max-width:700px){.log-grid article{grid-template-columns:28px 1fr;gap:12px}.log-grid article p{grid-column:2}.hero{min-height:740px}}

.hero h1{font-size:clamp(28px,3.7vw,56px);line-height:1.12;letter-spacing:-.015em;text-transform:none;max-width:1000px}.hero{height:auto;min-height:calc(100svh - 24px)}
