/* Hope Above Fear · More to the Story — treatment + shoot plan styles.
   Palette sampled from HAF's brand board (Branding 2026/1.png):
   purple #662a99 · blue #406095 · orange #efa13e · teal #2fa6a1 · coral #e97967
   yellow #ffde59 · lavender #e2a9f1 · charcoal #595959
   Type: HAF's lettering is custom brush + a heavy distressed sans. Stand-ins:
   Montserrat (heavy sans), Kaushan Script (brush accent), Inter (body). Swap if HAF sends font files. */
:root{
  --night:#1c1424;--night2:#261c30;--ground:#fbf9fc;--floor:#efebf2;
  --ink:#231c29;--mute:#6e6577;--rule:rgba(35,28,41,.14);--line:rgba(35,28,41,.4);
  --purple:#662a99;--lav:#e2a9f1;--yellow:#ffde59;--teal:#2fa6a1;--orange:#efa13e;--coral:#e97967;--blue:#406095;
  --ph:#d8d5db;--ph-ink:#5d5763;--ph-dark:#332a3b;--ph-dark-ink:#a79daf;
  --pale:#f3eff6;
  --lz-accent:var(--purple);--lz-ground:var(--ground);--lz-line:var(--rule);--lz-ink:var(--ink);--lz-mute:var(--mute)
}
html,body{background:#efeaf2}
body{margin:0;color:var(--ink);font-family:Inter,"Helvetica Neue",Arial,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
.deck{max-width:1400px;margin:0 auto;padding:24px 24px 110px;display:flex;flex-direction:column;gap:24px}
.slide{position:relative;background:var(--ground);border:1px solid var(--rule);overflow:hidden;min-height:420px}
.slide .in{position:relative;z-index:2;padding:64px 72px}
.slide.dark{background:var(--night);color:var(--pale);border-color:rgba(0,0,0,.4)}

/* placeholders */
.ph{background:var(--ph);position:relative;display:flex;align-items:flex-end;overflow:hidden;
  background-image:linear-gradient(135deg,transparent 49.6%,rgba(0,0,0,.07) 49.8%,rgba(0,0,0,.07) 50.2%,transparent 50.4%),linear-gradient(45deg,transparent 49.6%,rgba(0,0,0,.07) 49.8%,rgba(0,0,0,.07) 50.2%,transparent 50.4%)}
.ph>span{position:relative;z-index:1;display:block;padding:14px 18px;font-size:12.5px;line-height:1.45;color:var(--ph-ink);letter-spacing:.02em}
.dark .ph{background-color:var(--ph-dark)}
.dark .ph>span{color:var(--ph-dark-ink)}
.ph.bg{position:absolute;inset:0;z-index:0;align-items:flex-start;justify-content:flex-end}
.ph.bg>span{max-width:36ch;text-align:right;padding:22px 26px}
.slide .shade{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(28,20,36,.94) 0%,rgba(28,20,36,.8) 55%,rgba(28,20,36,.45) 100%);pointer-events:none}
.slide .shade.up{background:linear-gradient(180deg,rgba(28,20,36,.1) 0%,rgba(28,20,36,.55) 55%,rgba(28,20,36,.95) 100%)}

/* type */
.eyebrow{font-family:Montserrat,sans-serif;font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--purple);margin:0 0 12px}
.dark .eyebrow{color:var(--lav)}
.big{font-family:Montserrat,sans-serif;font-weight:800;font-size:clamp(34px,4.6vw,66px);line-height:1.04;margin:0 0 22px;letter-spacing:-.02em;text-wrap:balance}
.big em{font-family:"Kaushan Script",cursive;font-style:normal;font-weight:400;color:var(--purple);letter-spacing:0}
.dark .big em{color:var(--lav)}
.lede{font-size:18px;max-width:60ch;margin:0}
.lede+.lede{margin-top:14px}
.dark .lede{color:var(--pale)}
.head{margin-bottom:34px;display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.head .t,.scene .t{font-family:Montserrat,sans-serif;font-weight:800;font-size:34px;margin:0;line-height:1.08;letter-spacing:-.015em}
.head .m{font-family:Montserrat,sans-serif;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);font-weight:700}
.dark .head .m{color:var(--ph-dark-ink)}
.pnote{margin:26px 0 0;color:var(--mute);font-size:15px;max-width:80ch}

/* cover */
.cover{min-height:min(80vh,760px);display:flex;align-items:flex-end}
.cover .in{padding:72px}
.cover .big{font-size:clamp(48px,8vw,124px);max-width:11ch;line-height:1.14;margin-bottom:34px}
.cover .big em{font-size:1.12em}
.cover .sub{display:flex;gap:26px;flex-wrap:wrap;font-family:Montserrat,sans-serif;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ph-dark-ink);font-weight:700;margin-top:26px}
.cover .sub b{color:#fff}
.logo{position:absolute;left:72px;top:56px;z-index:3;height:120px;width:auto;display:block}

/* two col */
.two{display:grid;grid-template-columns:300px 1fr;gap:56px;align-items:start}
.two h2{font-family:Montserrat,sans-serif;font-weight:800;font-size:26px;line-height:1.15;margin:0;text-wrap:balance}
.two p{margin:0 0 16px;max-width:62ch;font-size:17.5px}
.two p:last-child{margin:0}

/* idea */
.idea{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;margin-top:34px;align-items:start}
.said{background:var(--night);color:#fff;padding:40px 36px;border-left:4px solid var(--purple)}
.said .vo{font-family:Montserrat,sans-serif;font-weight:700;font-size:28px;line-height:1.2;margin:0 0 18px}
.said .cut{margin:0;font-family:Montserrat,sans-serif;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--yellow);font-weight:700}

/* shape strip */
.shape{display:flex;gap:3px;min-height:130px}
.shape>div{min-width:0;padding:12px 10px;display:flex;flex-direction:column;gap:4px;background:var(--floor);border-top:4px solid var(--mute);overflow:hidden}
.shape b{font-family:Montserrat,sans-serif;font-size:11px;letter-spacing:.08em;color:var(--mute);font-weight:700;font-variant-numeric:tabular-nums}
.shape span{font-family:Montserrat,sans-serif;font-weight:800;font-size:13.5px;line-height:1.15}
.shape i{font-style:normal;font-size:12px;color:var(--mute);line-height:1.3}
.shape .s-open{border-color:var(--ink)}
.shape .s-reed{border-color:var(--purple)}
.shape .s-act{border-color:var(--teal)}
.shape .s-found{border-color:var(--orange)}
.shape .s-mem{border-color:#000;background:#2a2230}
.shape .s-mem span,.shape .s-mem b{color:#fff}
.shape .s-end{border-color:var(--purple);background:var(--night)}
.shape .s-end span,.shape .s-end b{color:#fff}
.lines{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:34px}
.lines .k{display:block;font-family:Montserrat,sans-serif;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--purple);font-weight:700;margin-bottom:8px}
.lines p{margin:0;font-size:16px;line-height:1.45}

/* scene slides */
.scene .in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:56px;align-items:center}
.scene.flip .in{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
.scene.flip .frame{order:2}
.scene .frame{aspect-ratio:16/9;width:100%}
.scene .t{margin:0 0 16px;text-wrap:balance}
.scene .txt>p:not(.eyebrow){margin:0 0 14px;font-size:16.5px;max-width:58ch}
.scene dl{margin:22px 0 0;display:grid;grid-template-columns:110px 1fr;gap:10px 18px;border-top:1px solid var(--rule);padding-top:18px}
.dark.scene dl{border-color:rgba(255,255,255,.14)}
.scene dt{font-family:Montserrat,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);font-weight:700;padding-top:3px}
.dark.scene dt{color:var(--ph-dark-ink)}
.scene dd{margin:0;font-size:15px}
.osw{display:inline-block;font-family:Montserrat,sans-serif;font-weight:700;font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;color:#fff;background:var(--night);padding:5px 10px 5px 12px;border-left:3px solid var(--yellow);margin-right:6px;line-height:1.3}

/* what they found */
.found{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.found>div{display:flex;flex-direction:column;gap:12px}
.found .ph{aspect-ratio:4/5}
.found .osw{background:transparent;padding-left:10px;align-self:flex-start}
.quote{margin:34px 0 0;font-family:Montserrat,sans-serif;font-weight:700;font-size:24px;line-height:1.3;max-width:40ch}
.quote span{display:block;margin-top:10px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--lav);font-weight:700}

/* people */
.people{display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:start}
.cast{display:flex;flex-direction:column;gap:22px}
.cast>div{border-top:1px solid var(--rule);padding-top:16px}
.cast h3{font-family:Montserrat,sans-serif;font-weight:800;font-size:21px;margin:0 0 6px}
.cast h3 span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--purple);font-weight:700;margin-left:12px;vertical-align:middle}
.cast p{margin:0;font-size:15.5px;max-width:56ch}
.rulesbox{border:1px solid var(--rule);padding:26px 28px;background:#fff}
.rulesbox h3{font-family:Montserrat,sans-serif;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--purple);margin:0 0 14px;font-weight:700}
.rulesbox ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px;font-size:15px}
.rulesbox li{padding-left:16px;position:relative}
.rulesbox li:before{content:"";position:absolute;left:0;top:.7em;width:7px;height:2px;background:var(--purple)}

/* look */
.strip{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:34px}
.strip .ph{aspect-ratio:4/3}
.rules{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.rules h3{font-family:Montserrat,sans-serif;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--purple);margin:0 0 8px;font-weight:700}
.rules p{margin:0;font-size:15px}

/* close */
.close .in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.endcards{display:flex;flex-direction:column;gap:12px}
.card{aspect-ratio:16/9;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px 28px;position:relative;border:1px solid rgba(255,255,255,.1)}
.card img{width:26%;height:auto;margin-bottom:10px}
.card .mem{font-family:Inter,sans-serif;font-style:italic;font-size:18px;color:#e9e4ee;margin:0;max-width:30ch}
.card .prev{font-size:12.5px;color:#d8d0de;margin:0;line-height:1.5}
.card .last{font-family:Montserrat,sans-serif;font-weight:800;font-size:26px;color:#fff;margin:0}
.card .last em{font-family:"Kaushan Script",cursive;font-style:normal;font-weight:400;color:var(--lav)}
.card .tc{position:absolute;left:12px;bottom:8px;font-family:Montserrat,sans-serif;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:#7e7488;font-weight:700}
.next{display:inline-block;margin-top:28px;font-family:Montserrat,sans-serif;font-weight:700;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#fff;text-decoration:none;border:1px solid var(--lav);padding:12px 18px}
.next:hover{background:var(--lav);color:var(--night)}

.foot{display:flex;justify-content:space-between;color:var(--mute);font-family:Montserrat,sans-serif;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:0 8px;font-weight:700}
.credit{font-size:11.5px;letter-spacing:.02em;color:var(--mute);margin:0 8px}

@media(max-width:1000px){.lines,.rules{grid-template-columns:1fr 1fr}.found{grid-template-columns:1fr 1fr}}
@media(max-width:820px){
  .slide .in,.cover .in{padding:40px 24px}
  .logo{left:24px;top:24px;height:80px}
  .ph.bg>span{display:none}
  .two,.people,.idea,.scene .in,.scene.flip .in,.close .in{grid-template-columns:1fr;gap:28px}
  .scene.flip .frame{order:0}
  .shape{flex-direction:column;min-height:0}
  .shape>div{flex:none!important;flex-direction:row;align-items:baseline;gap:10px;border-top:0;border-left:4px solid var(--mute)}
  .strip{grid-template-columns:1fr 1fr}
  .lines,.rules{grid-template-columns:1fr}
  .scene dl{grid-template-columns:1fr;gap:2px}
  .scene dd{margin-bottom:10px}
  .foot{flex-direction:column;gap:6px}
}

/* primary / secondary voice plan */
.prompts{display:flex;flex-direction:column;gap:12px}
.said.alt{background:#2e2438;border-left-color:var(--lav)}
.said.alt .cut{color:var(--lav)}
.plan2{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:34px}
.plan2 .k{display:block;font-family:Montserrat,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--purple);font-weight:700;margin-bottom:12px}
.plan2 .q{margin:0 0 12px;font-size:15.5px}
.plan2 .q span{display:block;color:var(--mute);font-size:14.5px;margin-top:2px}
.plan2 ol{margin:0 0 14px;padding-left:20px;font-size:15.5px;display:flex;flex-direction:column;gap:6px}
.plan2 .sl{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.plan2 .sl li{border-left:3px solid var(--lav);padding:2px 0 2px 12px;font-size:15px}
@media(max-width:820px){.plan2{grid-template-columns:1fr;gap:28px}}