@font-face{font-family:'Archivo';src:url(/fonts/archivo.woff2) format('woff2');font-weight:600 900;font-stretch:100% 125%;font-display:swap}
@font-face{font-family:'Manrope';src:url(/fonts/manrope.woff2) format('woff2');font-weight:400 600;font-display:swap}
@font-face{font-family:'Space Mono';src:url(/fonts/spacemono-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Space Mono';src:url(/fonts/spacemono-700.woff2) format('woff2');font-weight:700;font-display:swap}
:root{
  --room:#1A1715; --room-2:#221E1B; --bone:#F0EBE3; --dim:#8B8179; --faint:#57504A; --line:#2F2A26;
  --display:'Archivo',system-ui,sans-serif; --body:'Manrope',system-ui,sans-serif; --slate:'Space Mono',ui-monospace,monospace;
  --pad:clamp(18px,4.5vw,64px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--room);color:var(--bone);font-family:var(--body);font-size:16px;line-height:1.62;-webkit-font-smoothing:antialiased}
a{color:inherit}
a:focus-visible{outline:2px solid var(--bone);outline-offset:4px}
.wrap{max-width:1060px;margin:0 auto;padding:0 var(--pad)}
.slate{font-family:var(--slate);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--faint)}

/* top bar */
.top{display:flex;justify-content:space-between;align-items:center;padding:22px 0}
.top img{width:56px;height:auto;display:block;filter:invert(1);opacity:.92}
.top a.back{font-family:var(--slate);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);text-decoration:none}
.top a.back:hover{color:var(--bone)}

/* header */
.head{padding:clamp(28px,5vw,56px) 0 26px}
.tag{display:inline-block;font-family:var(--slate);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--bone);border:1px solid var(--line);padding:6px 11px;margin-bottom:22px}
h1{font-family:var(--display);font-weight:800;font-variation-settings:'wdth' 116;font-size:clamp(34px,6.4vw,78px);
  line-height:.94;letter-spacing:-.035em;text-transform:uppercase}
.dek{margin-top:18px;max-width:58ch;color:#D6CEC4;font-size:clamp(16px,1.7vw,19px)}

.film{position:relative;aspect-ratio:16/9;background:#000;margin-top:30px}
.film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
.film-cap{margin-top:12px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* honesty block */
.what{margin-top:40px;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.what div{background:var(--room-2);padding:20px 22px}
.what h3{font-family:var(--slate);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--bone);margin-bottom:10px}
.what p{color:#CFC7BE;font-size:15px}

/* sections */
section{padding-top:clamp(52px,7vw,90px)}
.sh{display:grid;grid-template-columns:120px 1fr;gap:20px;align-items:baseline;padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:26px}
.sh h2{font-family:var(--display);font-weight:800;font-variation-settings:'wdth' 112;font-size:clamp(22px,3.2vw,36px);
  line-height:1;letter-spacing:-.025em;text-transform:uppercase}
.prose{max-width:66ch}
.prose p{color:#D6CEC4}
.prose p + p{margin-top:.9em}
.prose strong{color:var(--bone);font-weight:600}

/* brief */
.brief{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.brief div{background:var(--room);padding:18px 20px}
.brief .k{display:block;margin-bottom:6px}
.brief .v{color:#D6CEC4;font-size:15px}

/* budget table */
table{width:100%;border-collapse:collapse;font-size:15px}
th,td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-family:var(--slate);font-weight:400;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
td{color:#D6CEC4}
td.num,th.num{text-align:right;white-space:nowrap;font-family:var(--slate);font-size:13px}
tr.total td{color:var(--bone);font-weight:600;border-bottom:none;border-top:1px solid var(--bone)}
tr.total td.num{font-weight:700}
.note{margin-top:14px;color:var(--dim);font-size:13.5px;max-width:70ch}
.scroll{overflow-x:auto}
.scroll table{min-width:720px}

/* decisions */
.dec{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,40px)}
.dec h3{font-family:var(--slate);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--bone);
  padding-bottom:10px;border-bottom:1px solid var(--line);margin-bottom:6px}
.dec li{list-style:none;padding:12px 0;border-bottom:1px solid var(--line);color:#D6CEC4;font-size:15px}
.dec li b{display:block;color:var(--bone);font-weight:600;margin-bottom:3px}

/* plan */
.plan li{list-style:none;display:grid;grid-template-columns:120px 1fr;gap:20px;padding:13px 0;border-bottom:1px solid var(--line)}
.plan .wk{font-family:var(--slate);font-size:12px;color:var(--bone);letter-spacing:.06em}
.plan .tx{color:#D6CEC4;font-size:15px}

/* learned */
.learned li{list-style:none;padding:13px 0;border-bottom:1px solid var(--line);color:#D6CEC4;font-size:15px;max-width:72ch}
.learned li b{display:block;color:var(--bone);font-weight:600;margin-bottom:3px}

/* placeholders: visible until filled — remove the class once real */
.todo{outline:1px dashed #C9A227;outline-offset:2px;color:#E8C766}

.foot{margin-top:clamp(60px,8vw,100px);padding:26px 0 60px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.foot a{font-family:var(--slate);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);text-decoration:none}
.foot a:hover{color:var(--bone)}
.legal{margin-top:14px;color:var(--faint);font-size:12.5px;max-width:80ch}

@media (max-width:760px){
  .what,.brief,.dec{grid-template-columns:1fr}
  .sh,.plan li{grid-template-columns:1fr;gap:6px}
}

/* storyboard (shot-by-shot) */
.board{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.shotrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(16px,2.6vw,30px);background:var(--room);padding:clamp(14px,2vw,20px)}
.shotimgs{display:grid;gap:8px}
.shotimgs.two{grid-template-columns:1fr}
.shotimgs img{width:100%;height:auto;display:block;aspect-ratio:16/9;object-fit:cover;background:#0F0D0C}
.shotrow h3{font-family:var(--display);font-weight:800;font-variation-settings:'wdth' 108;font-size:19px;letter-spacing:-.015em;line-height:1.15;margin:6px 0 8px}
.shotrow p{color:#CFC7BE;font-size:14.5px}
.how{margin-top:12px;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.how div{background:var(--room-2);padding:10px 12px;font-size:13.5px;color:#CFC7BE}
.how .slate{display:block;margin-bottom:4px;color:var(--dim)}
.verdict{display:inline-block;margin-top:10px;font-family:var(--slate);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--bone);border:1px solid var(--line);padding:4px 9px}
.ref{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(16px,2.6vw,30px);align-items:center;margin-top:26px}
.ref img{width:100%;height:auto;display:block;background:#2a2a2a}
.next{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:clamp(52px,7vw,90px);
  padding:20px 22px;border:1px solid var(--line);background:var(--room-2);text-decoration:none}
.next h3{font-family:var(--display);font-weight:800;font-variation-settings:'wdth' 112;font-size:clamp(20px,2.6vw,28px);text-transform:uppercase;letter-spacing:-.02em}
.next:hover h3{text-decoration:underline;text-underline-offset:5px}
@media (max-width:760px){.shotrow,.ref{grid-template-columns:1fr}.how{grid-template-columns:1fr}}