.case-directory{padding-top:48px;padding-bottom:24px}
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.case-card{display:block;padding:25px;border:1px solid var(--line);border-radius:12px;background:var(--white);transition:transform .18s ease,border-color .18s ease;min-width:0}
.case-card:hover{transform:translateY(-3px);border-color:var(--orange)}
.case-card h3{font:26px/1.25 var(--serif);margin:15px 0}
.case-card p{font-size:14px;line-height:1.8;color:var(--muted)}
.case-card-note{display:block;margin-top:18px;font-size:11px;color:var(--orange)}
.case-related{margin:35px 0 0;padding:25px;border:1px solid #c5dfcf;background:var(--peach);border-radius:12px}
.case-related h2{font-size:29px;margin:12px 0}.case-related p{max-width:70ch}
.case-contents{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;padding:24px;background:var(--white);border:1px solid var(--line);border-radius:12px;margin-bottom:36px}
.case-contents a{font-size:13px;line-height:1.65;text-decoration:underline;text-underline-offset:3px}
.case-guide{max-width:none}.case-guide section,.case-experiment{scroll-margin-top:24px}
.case-experiment{margin-top:48px;padding-top:36px;border-top:1px solid var(--line)}
.case-experiment>p{line-height:1.85}.case-experiment fieldset{margin:24px 0 18px;border:1px solid var(--line);background:var(--peach);padding:18px 22px;border-radius:10px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.case-experiment legend{font-weight:650;padding:0 8px}.case-experiment .field{display:block;font-size:12px;font-weight:600;min-width:0;margin:5px 0}.case-experiment select{display:block;margin-top:8px}.case-experiment fieldset .button{grid-column:1/-1;justify-self:start}
.case-experiment button:disabled{opacity:.55;cursor:default}.case-story-details{margin:22px 0}.case-story-details summary{font-size:18px;cursor:pointer;padding:15px 0;border-bottom:1px solid var(--line)}
.case-story-heading{margin:25px 0;padding-bottom:15px;border-bottom:1px solid var(--line)}.case-story-heading h3{font:36px/1.2 var(--serif);overflow-wrap:anywhere}.case-story-heading p{font-size:12px;color:var(--orange)}
#case-story{max-width:none}#case-story h4{font:24px/1.35 var(--serif);margin:28px 0 12px}#case-story p{line-height:1.9;overflow-wrap:anywhere}
.case-next{margin-top:40px;padding:28px;background:var(--sage);border-radius:12px}.case-next h2{font-size:30px}.case-next .button{white-space:normal;text-align:center}
@media(max-width:1000px){.case-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.case-grid,.case-contents{grid-template-columns:1fr}.case-experiment fieldset{grid-template-columns:1fr;padding:16px}.case-card h3{font-size:24px}.case-contents{padding:20px}.case-related,.case-next{padding:20px}.case-related h2{font-size:25px}.case-experiment .status{min-height:3em}}
@media(prefers-reduced-motion:reduce){.case-card{transition:none}.case-card:hover{transform:none}}
