body.rep{background:var(--black);color:#D9EEDD}
.r-main{padding-left:0;padding-top:52px}
.r-head{max-width:74rem;margin:0 auto;padding:12vh 4vw 6vh}
.r-head .tag{color:var(--ph)}
.r-head h1{font:800 clamp(2.4rem,6.6vw,6rem)/.95 var(--d);letter-spacing:-.035em;color:#F2FFF4;margin-bottom:1.6rem;max-width:18ch}
.meta{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;border-top:1px solid var(--ph-dim);padding-top:1.2rem}
.meta dt{font:400 .8rem/1 var(--m);color:var(--ph);letter-spacing:.14em;text-transform:uppercase;margin-bottom:.4rem}.meta dd{font:600 1.05rem/1.3 var(--b);color:#fff}
.r-grid{max-width:74rem;margin:0 auto;padding:0 4vw 10vh;display:grid;grid-template-columns:150px 1fr;gap:5vw;align-items:start}
.profile{position:sticky;top:76px;height:calc(100vh - 100px);max-height:560px;display:flex;flex-direction:column}
.profile svg{width:120px;flex:1;min-height:0;border:1px solid var(--ph-dim)}
.plabels{list-style:none;position:absolute;left:128px;top:0;bottom:0;font:400 .7rem/1 var(--m);letter-spacing:.06em;color:#9bb5a1;text-transform:uppercase}
.plabels li{position:absolute;left:0;white-space:nowrap}
.pch{font:400 1.3rem/1 var(--m);color:var(--amber);margin-top:.6rem}
.obs{border-top:1px solid var(--ph-dim);padding:3rem 0 4rem;opacity:.35;transition:opacity .6s;max-width:42rem}
.obs.on{opacity:1}
.code{font:400 .95rem/1 var(--m);color:var(--amber);letter-spacing:.1em;margin-bottom:.9rem}
.obs h2{font:800 clamp(1.8rem,3.6vw,3rem)/1 var(--d);letter-spacing:-.03em;color:#fff;margin-bottom:1.2rem}
.obs p+p{margin-top:1rem}
.cctv{position:relative;margin:1.4rem 0;border:1px solid var(--ph-dim);background:#000;overflow:hidden}
.cctv img{width:100%;aspect-ratio:16/9;object-fit:cover;filter:grayscale(1) contrast(1.2) brightness(1.1)}
.cctv::before{content:"";position:absolute;inset:0;background:#2cff72;mix-blend-mode:multiply;z-index:1}
.cctv::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.32) 0 1px,transparent 1px 3px);z-index:2}
.cctv figcaption{position:absolute;left:.6rem;bottom:.5rem;z-index:3;font:400 .8rem/1 var(--m);color:var(--ph);background:rgba(5,8,6,.75);padding:.3rem .5rem;letter-spacing:.08em}
.grade{display:inline-block;margin-top:1.2rem;font:400 .85rem/1 var(--m);letter-spacing:.1em;text-transform:uppercase;padding:.5rem .7rem;border:1px solid}
.g1{color:var(--ph)}.g3,.g4{color:var(--amber)}
.r-end{padding:4rem 0}.r-end h2{font:800 clamp(1.8rem,4vw,3.4rem)/1 var(--d);color:#fff;letter-spacing:-.03em;margin-bottom:1rem}
.r-end .btn{margin-right:.6rem;margin-bottom:.6rem;background:var(--ph);color:#050806;border-color:var(--ph)}.r-end .btn.ghost{background:transparent;color:var(--ph)}
.rep .foot{padding-left:4vw}
@media(max-width:900px){
 .meta{grid-template-columns:1fr 1fr}
 .r-grid{grid-template-columns:1fr}
 .profile{position:sticky;top:52px;z-index:5;height:64px;max-height:none;flex-direction:row;align-items:center;gap:1rem;background:var(--black);padding:.4rem 0}
 .profile svg{display:none}.plabels{display:none}.pch{margin:0}
 .profile::before{content:"CHAINAGE";font:400 .75rem/1 var(--m);color:var(--ph);letter-spacing:.14em}
 .r-head{padding-top:8vh}
}
