/* Delivery, strategy and carousel pages. Sits on top of theme.css + review.css. */
.hero .k{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:0 0 10px}
.cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:26px 0 0}
.cta .hint{font-size:13px;color:var(--muted);max-width:46ch}
.btn.solid{background:var(--text);color:#F1EFE9;border-color:var(--text);font-size:13.5px;padding:11px 22px;text-decoration:none;display:inline-block}
.btn.solid:hover{background:#2B2926;border-color:#2B2926}

/* Delivery grid. 9:16 tiles take one column, 4:3 tiles take two so rows stay level. */
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 18px;margin:40px 0 0;align-items:start}
.tile{min-width:0}
.tile.wide{grid-column:span 2}
@media(max-width:760px){ .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px} .tile.wide{grid-column:auto} }
.thumb{all:unset;display:block;position:relative;width:100%;aspect-ratio:9/16;border-radius:8px;overflow:hidden;cursor:pointer;
  background:#E9E6DF;border:1px solid var(--line);box-sizing:border-box}
.tile.wide .thumb{aspect-ratio:4/3}
/* On phones a 4:3 tile sits in a 9:16 frame, letterboxed, so the two columns stay even */
@media(max-width:760px){ .tile.wide .thumb{aspect-ratio:9/16;background:#141312} .tile.wide .thumb img{height:100%;object-fit:contain} }
.thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.thumb:hover img{transform:scale(1.03)}
.thumb:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.thumb .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;
  background:rgba(241,239,233,.92);color:var(--text);display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 12px rgba(0,0,0,.25);transition:transform .2s}
.thumb .play svg{margin-left:3px}
.thumb:hover .play{transform:translate(-50%,-50%) scale(1.06)}
.thumb .dur{position:absolute;right:8px;bottom:8px;font-family:var(--f-mono);font-size:10.5px;color:#F1EFE9;background:rgba(20,19,18,.72);border-radius:3px;padding:2px 6px}
.thumb .asp{position:absolute;left:8px;top:8px;font-family:var(--f-mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--text);background:rgba(241,239,233,.92);border-radius:3px;padding:3px 7px}
.tinfo{padding:12px 2px 0}
.tinfo .vnum{margin:0 0 4px}
.tinfo h4{font-family:var(--f-display);font-size:18px;font-weight:600;line-height:1.2;margin:0 0 6px;color:var(--text)}
.tinfo .dl{font-family:var(--f-mono);font-size:10.5px;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.tinfo .dl:hover{color:var(--accent)}

/* Lightbox */
body.lb-open{overflow:hidden}
.lb{position:fixed;inset:0;z-index:50}
.lb[hidden]{display:none}
.lb-bg{position:absolute;inset:0;background:rgba(20,19,18,.92)}
.lb-in{position:absolute;inset:0;display:grid;grid-template-rows:minmax(0,1fr) auto;align-items:center;justify-items:center;padding:52px 64px 18px}
@media(max-width:640px){ .lb-in{padding:48px 8px 64px} }
.lb-stage{height:100%;width:100%;display:flex;align-items:center;justify-content:center;min-height:0}
.lb-stage video{border-radius:8px;background:#000;box-shadow:0 10px 40px rgba(0,0,0,.5);object-fit:contain}
.lb-stage video.tall{height:100%;width:auto;max-width:100%;aspect-ratio:9/16}
.lb-stage video.wide{width:min(100%,1100px,calc((100dvh - 130px) * 4 / 3));height:auto;max-height:100%;aspect-ratio:4/3}
.lb-x,.lb-nav{all:unset;position:absolute;cursor:pointer;color:#F1EFE9;font-family:var(--f-display);line-height:1;
  display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(241,239,233,.1)}
.lb-x:hover,.lb-nav:hover{background:rgba(241,239,233,.22)}
.lb-x{top:12px;right:14px;width:40px;height:40px;font-size:28px}
.lb-nav{top:50%;transform:translateY(-50%);width:44px;height:44px;font-size:34px}
.lb-nav.prev{left:12px}.lb-nav.next{right:12px}
@media(max-width:640px){ .lb-nav{top:auto;bottom:14px;transform:none;width:38px;height:38px;font-size:28px} }
.lb-cap{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;justify-content:center;padding:12px 0 0;color:#F1EFE9}
.lb-cap .n{font-family:var(--f-mono);font-size:10.5px;color:rgba(241,239,233,.6)}
.lb-cap .t{font-family:var(--f-display);font-size:18px;font-weight:600}
.lb-cap a{font-family:var(--f-mono);font-size:10.5px;color:rgba(241,239,233,.7);text-decoration:underline;text-underline-offset:3px}
.lb-cap a:hover{color:#F1EFE9}
@media(max-width:640px){ .lb-cap{padding:10px 56px 0} }

/* Hub badge */
.hub .badge{display:inline-block;margin-left:8px;font-family:var(--f-mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--green,#2F6B3F);border:1px solid currentColor;border-radius:3px;padding:2px 6px;vertical-align:1px}

/* Placeholder tile: ink on paper, for artwork that is not made yet */
.ph-tile{position:relative;width:100%;aspect-ratio:4/5;border-radius:8px;border:1px solid var(--line);background:var(--card-2);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;box-sizing:border-box;padding:12px;
  background-image:repeating-linear-gradient(135deg,transparent 0 11px,rgba(20,19,18,.035) 11px 12px)}
.ph-tile .w{font-family:var(--f-display);font-size:20px;font-weight:600;color:var(--text)}
.ph-tile .s{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}

/* Strategy page */
.film{margin:36px 0 0}
.film video{width:100%;display:block;aspect-ratio:16/9;border-radius:8px;background:#141312;border:1px solid var(--line)}
.film .note{font-family:var(--f-mono);font-size:10.5px;color:var(--faint);margin:10px 0 0}
.week{margin:56px 0 0;padding-top:28px;border-top:1px solid var(--line)}
.week .wk{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:0 0 8px}
.week h2{font-family:var(--f-display);font-size:32px;font-weight:600;line-height:1.15;margin:0 0 8px;color:var(--text)}
.week .blurb{font-size:15px;color:var(--text-soft);max-width:62ch;margin:0}
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:26px 0 0;align-items:start}
@media(max-width:860px){ .posts{grid-template-columns:1fr;gap:28px} }
.post{min-width:0;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:14px 14px 18px}
.post .cover{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;border-radius:6px;background:#E9E6DF}
.post .ph-tile{border-radius:6px}
@media(max-width:860px){ .post{display:grid;grid-template-columns:140px minmax(0,1fr);gap:16px;align-items:start} }
@media(max-width:420px){ .post{grid-template-columns:110px minmax(0,1fr)} .post .ph-tile .w{font-size:15px} }
.post .eyebrow{display:flex;gap:8px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:14px 0 6px}
@media(max-width:860px){ .post .eyebrow{margin-top:2px} }
.post .eyebrow .fmt{color:var(--muted)}
.post h3{font-family:var(--f-display);font-size:21px;font-weight:600;line-height:1.2;margin:0 0 10px;color:var(--text)}
.post .cap p{font-size:13.5px;color:var(--text-soft);margin:0 0 8px;max-width:none}
.post .cap p:last-child{margin-bottom:0}
.feed{margin:64px 0 0;padding-top:28px;border-top:1px solid var(--line)}
.feed .fgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;max-width:560px;margin:24px 0 0}
.feed .cell{position:relative;aspect-ratio:4/5;overflow:hidden;background:#E9E6DF}
.feed .cell img{width:100%;height:100%;object-fit:cover;display:block}
.feed .cell .ph-tile{height:100%;aspect-ratio:auto;border-radius:0;border:0}
.feed .cell .ph-tile .w{font-size:14px}
.feed .tag{position:absolute;left:6px;top:6px;font-family:var(--f-mono);font-size:9px;color:var(--text);background:rgba(241,239,233,.92);border-radius:3px;padding:2px 5px}

/* Carousel frame */
.cgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 18px;margin:40px 0 0;align-items:start}
@media(max-width:1000px){ .cgrid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(max-width:520px){ .cgrid{grid-template-columns:1fr} }
.ccard{min-width:0}
.ccard .cover{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;border-radius:8px}
.ccard .slides{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;margin:8px 0 0}
.ccard .slides img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;border-radius:3px}
.ccard .slides a{display:block;min-width:0}
.ccard .stories{display:grid;grid-template-columns:max-content 56px 56px;justify-content:start;gap:6px;align-items:center;margin:8px 0 0}
.ccard .stories .sl{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);padding-right:6px}
.ccard .stories img{width:56px;aspect-ratio:9/16;object-fit:cover;display:block;border-radius:3px}
.ccard .held{color:var(--faint)}
.ccard .meta2{display:flex;gap:12px;flex-wrap:wrap;align-items:baseline;font-family:var(--f-mono);font-size:10.5px;color:var(--faint);margin:0 0 6px}
.ccard .meta2 a{color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.ccard .meta2 .st{color:var(--amber)}
.ccard details.tx{margin:10px 0 0}
.ccard ol{margin:10px 0 0;padding:0;list-style:none}
.ccard ol li{font-size:13px;color:var(--text-soft);padding:7px 0;border-bottom:1px solid var(--line-soft);display:grid;grid-template-columns:26px minmax(0,1fr);gap:6px}
.ccard ol li:last-child{border-bottom:0}
.ccard ol li b{font-family:var(--f-mono);font-size:10px;font-weight:500;color:var(--faint);padding-top:2px}
.ccard ol li span span{display:block}
.hero .drive{margin:14px 0 0;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.hero .drive .hint{font-size:13px;color:var(--muted)}