/* Case studies: each story gets its own composition */

/* Acqiline: a discovery. A list becomes a sentence, then three questions on night */
.acq{background:var(--night)}
.acq-open{padding:clamp(56px,8vw,120px) 0 clamp(64px,8vw,120px)}
.acq-title{font-size:13px;font-family:var(--f);font-stretch:112%;letter-spacing:.08em;text-transform:uppercase;color:var(--stone);margin:0 0 clamp(32px,4vw,56px)}
.acq-list{display:flex;flex-wrap:wrap;gap:6px 28px;font-family:var(--display);font-size:clamp(30px,3.6vw,56px);line-height:1.05;color:#858d84}
.acq-list span{text-decoration:line-through;text-decoration-thickness:3px;text-decoration-color:var(--rust)}
.acq-arrow{margin:clamp(28px,3vw,40px) 0 12px;color:var(--stone);font-size:17px;max-width:34em}
.acq-line{font-family:var(--display);font-size:clamp(46px,6.6vw,104px);line-height:.95;letter-spacing:-.015em;color:var(--snow);margin:0;max-width:13ch;text-wrap:balance}
.acq-sub{margin:clamp(28px,3vw,40px) 0 0;color:var(--stone);font-size:18px;max-width:34em}
.acq-q{padding:clamp(64px,8vw,120px) 0;border-top:1px solid #2a2f2a}
.acq-q.light{border-top:0}
.acq-q-head{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(20px,4vw,72px);align-items:end;margin-bottom:clamp(32px,4vw,56px)}
.acq-q h2{font-size:clamp(48px,6.4vw,104px);line-height:.92}
.acq-q-head p{margin:0;color:var(--stone);font-size:18px;max-width:34em}
.acq-q.light .acq-q-head p{color:var(--moss)}
.acq-bleed{margin:0;display:flex;justify-content:center;background:#141613}
.acq-bleed img{width:min(100%,1180px);height:auto}
.acq-counters,.acq-crm{margin:0}
.acq-counters img,.acq-crm img{width:100%;height:auto}
.acq-notes{padding:clamp(64px,8vw,110px) 0 0}
.acq-notes h2{font-size:clamp(30px,2.6vw + 10px,46px);margin-bottom:28px}
@media (max-width:760px){
  .acq-q-head{grid-template-columns:1fr;gap:14px}
  .acq-counters{overflow-x:auto}
  .acq-counters img{width:760px;max-width:none}
}

/* Iron Clay: a conversation. Warm paper, the owner's questions and the site's answers */
.ic-story{background:#f2ece2;color:#2a221c}
.ic-open{padding:clamp(56px,8vw,120px) 0 clamp(40px,5vw,72px);background:#f2ece2}
.ic-who{font-size:13px;font-stretch:112%;letter-spacing:.08em;text-transform:uppercase;color:#6b5a4c;margin:0 0 18px}
.ic-open h1{font-size:clamp(64px,10vw,168px);line-height:.9;color:#2a221c;margin-bottom:clamp(24px,3vw,40px)}
.ic-sub{font-size:clamp(18px,.5vw + 15px,21px);color:#4a3d33;max-width:34em;margin:0}
.ic-talk{padding:clamp(40px,5vw,72px) 0 clamp(72px,9vw,130px);background:#f2ece2}
.ic-talk-h{font-family:var(--serif);font-size:clamp(22px,1vw + 16px,28px);line-height:1.25;margin-bottom:clamp(28px,3vw,44px);color:#2a221c;max-width:24em}
.talk{list-style:none;margin:0;padding:0;border-top:1px solid #cdbfae}
.talk li{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(16px,4vw,64px);padding:clamp(24px,3vw,40px) 0;border-bottom:1px solid #cdbfae}
.ask{margin:0;font-family:var(--display);font-size:clamp(28px,2.6vw + 8px,44px);line-height:1.05;color:#2a221c}
.answer{margin:0;padding-left:18px;border-left:2px solid var(--rust-deep)}
.answer p{margin:0;font-family:var(--serif);font-size:clamp(18px,.5vw + 15px,21px);line-height:1.5;color:#3d322a}
.talk-note{margin:0 0 clamp(24px,3vw,36px);font-size:14px;color:#6b5a4c;max-width:40em}
.ic-close{padding:clamp(72px,9vw,130px) 0}
.ic-close-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,80px);align-items:center}
.ic-close h2{font-size:clamp(40px,4.6vw,72px);margin-bottom:22px}
.ic-close p{color:var(--stone);font-size:18px;max-width:30em}
.ic-close figure{margin:0;display:flex;flex-direction:column;gap:18px}
.ic-close img{width:100%;height:auto}
.ic-close .ic-voice{max-width:66%}
@media (max-width:760px){
  .talk li{grid-template-columns:1fr;gap:12px}
  .ic-close-grid{grid-template-columns:1fr}
  .ic-close .ic-voice{max-width:100%}
}

.ic-film{margin-top:clamp(40px,5vw,72px)}
.acq-q .clip{box-shadow:0 40px 80px -40px rgba(0,0,0,.7)}

/* Feederline: an unbuilt concept, set apart from the studio's own palette */
.fl{background:#fafaf7;color:#0b1118}
.fl-open{padding:clamp(56px,8vw,120px) 0 clamp(40px,5vw,72px)}
.fl-tag{font:500 13px/1.4 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em;text-transform:uppercase;color:#2453ff;margin:0 0 18px}
.fl-open h1{font-size:clamp(64px,10vw,168px);line-height:.9;color:#0b1118;margin-bottom:clamp(24px,3vw,40px)}
.fl-sub{font-size:clamp(18px,.5vw + 15px,21px);color:#3b4450;max-width:34em;margin:0 0 24px}
.fl .more{color:#2453ff}
.fl-q{padding:clamp(40px,5vw,72px) 0 clamp(64px,8vw,110px);background:#0b1118;color:#fff}
.fl-q-head{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(20px,4vw,72px);align-items:end;margin-bottom:clamp(32px,4vw,56px);padding-top:clamp(24px,4vw,56px)}
.fl-q h2{font-size:clamp(36px,4.4vw,68px);line-height:.98;color:#fff}
.fl-q-head p{margin:0;color:#aeb6c0;font-size:18px;max-width:34em}
.fl-notes{padding:clamp(64px,8vw,110px) 0 0}
.fl-notes h2{font-size:clamp(30px,2.6vw + 10px,46px);margin-bottom:28px;color:#0b1118}
@media (max-width:760px){.fl-q-head{grid-template-columns:1fr;gap:14px}}
