/* Case study pages + case study index. Builds on styles.css. */
.c-head{padding:clamp(48px,7vw,112px) 0 clamp(40px,5vw,72px)}
.c-top{display:flex;justify-content:space-between;gap:16px;margin-bottom:clamp(32px,5vw,72px)}
.c-top a{text-decoration:none}
.c-top a:hover{color:var(--signal)}
.c-title{font-size:clamp(59px,12.3vw,197px);line-height:.84;letter-spacing:-.025em;font-weight:600}
.c-title .it{color:var(--signal)}
.c-meta{margin-top:clamp(40px,5vw,72px);row-gap:40px;align-items:start}
.c-meta>.m{grid-column:1/8;max-width:24ch}
.c-meta dl{grid-column:9/13;display:grid;gap:18px}
.c-meta dl div{display:grid;grid-template-columns:96px 1fr;gap:16px;padding-top:14px;border-top:1px solid var(--line)}
.c-meta dd{font-size:16px;line-height:1.45}

.c-hero{margin:0;width:100%;max-height:92vh;overflow:hidden;background:var(--paper-2)}
.c-hero img{width:100%;height:100%;object-fit:cover}

.c-text{padding:clamp(72px,9vw,140px) 0}
.c-text .wrap>*+*{margin-top:clamp(48px,6vw,88px)}
.t-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--g);row-gap:16px;padding-top:20px;border-top:1px solid var(--line)}
.t-row .label{grid-column:1/4}
.t-row p{grid-column:4/12;max-width:58ch}
.t-row p.m{max-width:30ch;grid-column:4/13}

.quote-s{background:var(--ink);color:var(--paper);padding:clamp(80px,10vw,160px) 0}
.quote-s .label{color:var(--mute-dark)}
.quote-s blockquote{font-family:var(--serif);font-style:italic;font-size:clamp(36px,5.4vw,84px);line-height:1.04;letter-spacing:-.01em;max-width:20ch;margin-top:28px}

.c-gallery{padding:0 0 clamp(24px,3vw,40px)}
.c-gallery .wrap{display:flex;flex-direction:column;gap:clamp(12px,1.4vw,20px)}
.g-row{display:flex;gap:clamp(12px,1.4vw,20px);width:100%}
.g-row figure{margin:0;overflow:hidden;background:var(--paper-2);border-radius:6px}
.g-row img{width:100%;height:100%;object-fit:cover;display:block}

.c-next{display:block;background:var(--ink);color:var(--paper);text-decoration:none;padding:clamp(80px,10vw,160px) 0;margin-top:clamp(56px,7vw,112px)}
.c-next .label{color:var(--mute-dark);display:block}
.c-next-name{display:block;font-size:clamp(59px,10.66vw,172px);line-height:.86;letter-spacing:-.025em;font-weight:600;margin:24px 0 28px;transition:color .4s var(--ease),transform .6s var(--ease)}
.c-next-name .arr{display:inline-block;font-size:.5em;vertical-align:middle;transition:transform .4s var(--ease)}
.c-next:hover .c-next-name{color:var(--signal);transform:translateX(12px)}
.c-next:hover .arr{transform:translateX(10px)}
.c-next+footer{padding-top:80px;border-top:1px solid var(--line-dark)}

/* Index list */
.w-list{border-top:1px solid var(--line)}
.w-card{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--g);row-gap:10px;align-items:baseline;padding:clamp(28px,3.4vw,48px) 0;border-bottom:1px solid var(--line);text-decoration:none}
.w-card>.label:first-child{grid-column:1/2}
.w-name{grid-column:2/8;font-size:clamp(44px,6.07vw,105px);line-height:.9;letter-spacing:-.025em;font-weight:600;transition:color .35s var(--ease),transform .5s var(--ease)}
.w-sub{grid-column:8/13;color:var(--mute);font-size:17px;max-width:36ch}
.w-scope{grid-column:8/13}
.w-card:hover .w-name{color:var(--signal);transform:translateX(10px)}

@media (max-width:900px){
  .c-meta>.m,.c-meta dl{grid-column:1/-1}
  .t-row .label,.t-row p,.t-row p.m{grid-column:1/-1}
  .g-row{flex-direction:column}
  .g-row[style]{max-width:none!important}
  .g-row figure{flex:none!important;width:100%}
  .w-card>.label:first-child,.w-name,.w-sub,.w-scope{grid-column:1/-1}
}
