/* A single rounded project list; each detail opens and returns to its own row. */
.case-archive { --case-line:rgba(224,169,109,.23); }
.case-intro { display:flex; justify-content:space-between; align-items:flex-end; gap:3rem; }
.case-eyebrow { color:var(--accent-color,#e0a96d); font-size:.72rem; letter-spacing:.16em; margin-bottom:1rem; }
.case-intro h2 { font-size:clamp(1.8rem,3.4vw,3.2rem); letter-spacing:-.045em; line-height:1.25; }
.case-intro > p { max-width:320px; color:var(--text-secondary); line-height:1.8; }
.case-categories { display:flex; flex-wrap:wrap; gap:.7rem; margin-top:2rem; }
.case-categories a { display:flex; align-items:center; gap:.75rem; padding:.85rem 1.25rem; border-radius:999px; background:#ffffff09; color:var(--text-secondary); font-size:.8rem; }
.case-categories a[aria-current] { color:#181714; background:var(--accent-color); }
.case-categories span { font-size:.65rem; opacity:.75; }
.case-note { color:var(--text-secondary); font-size:.8rem; line-height:1.8; margin:1.5rem 0 2rem; }
.case-filters { display:flex; flex-wrap:wrap; gap:.45rem; padding-top:.5rem; }
.case-filters button { font:inherit; cursor:pointer; border:0; border-radius:999px; padding:.55rem 1rem; background:#ffffff06; color:var(--text-secondary); font-size:.78rem; }
.case-filters button[aria-pressed="true"] { background:var(--accent-color,#e0a96d); color:#161411; }
.case-filters span { margin-left:.4rem; font-size:.65rem; }
.case-count { min-height:1.5rem; margin:.7rem 0; color:var(--text-secondary); font-size:.75rem; }
.case-grid { display:block; }
.case-card { margin-bottom:.75rem; min-width:0; }
.case-card summary { position:relative; display:grid; grid-template-columns:2.5rem minmax(0,1.4fr) minmax(0,1fr) 2.75rem; gap:1.5rem; align-items:center; padding:1.6rem; border-radius:22px; background:#ffffff06; cursor:pointer; list-style:none; transition:background-color .3s; }
.case-card summary::-webkit-details-marker { display:none; }
.case-card summary:hover { background:#ffffff0b; }
.case-number { grid-column:1; grid-row:1; color:var(--text-secondary); font-size:.72rem; }
.case-card h3 { grid-column:2; grid-row:1; font-size:clamp(1.2rem,2.2vw,1.9rem); letter-spacing:-.025em; line-height:1.4; }
.case-meta { grid-column:3; grid-row:1; font-size:.68rem; line-height:2; letter-spacing:.05em; color:var(--text-secondary); }
.case-meta span { display:block; }
.case-meta span:last-child { color:var(--accent-color); }
.case-teaser { display:none; }
.case-read { grid-column:4; grid-row:1; display:grid; place-items:center; }
.case-circle { position:relative; display:grid; place-items:center; width:2.5rem; height:2.5rem; border:1px solid var(--accent-color,#e0a96d); border-radius:50%; }
.case-circle::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--accent-color,#e0a96d); }
.case-circle::after { content:''; position:absolute; inset:-1px; border:1px solid var(--accent-color,#e0a96d); border-radius:50%; opacity:0; pointer-events:none; }
.case-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.case-cover { position:absolute; right:9%; top:50%; width:280px; aspect-ratio:16/10; z-index:3; background:#f1eeea; border-radius:20px; overflow:hidden; pointer-events:none; opacity:0; transform:translateY(-45%); transition:opacity .2s,transform .3s; box-shadow:0 20px 50px #0007; }
.case-cover img { display:block; width:100%; height:100%; object-fit:contain; }
.case-cover--figure { background:#c7bbd9; }
@media (hover:hover) {
 .case-card summary:is(:hover,:focus-visible) .case-cover { opacity:1; transform:translateY(-50%); }
}
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
 .case-card summary:is(:hover,:focus-visible) .case-circle::after { animation:case-circle-out .8s cubic-bezier(.16,1,.3,1) both; }
}
@keyframes case-circle-out { from { transform:scale(1); opacity:.5; } to { transform:scale(1.6); opacity:0; } }
.case-card[open] > .case-story { margin-top:1rem; background:#ffffff04; border-radius:24px; }
.case-dialog { --case-line:rgba(224,169,109,.23); width:min(1200px,calc(100% - 3rem)); max-width:none; height:calc(100dvh - 3rem); max-height:calc(100dvh - 3rem); margin:auto; padding:0; border:0; border-radius:28px; background:#181714; color:#f2eee7; overflow:auto; overscroll-behavior:contain; color-scheme:dark; }
.case-dialog::backdrop { background:#080807d9; backdrop-filter:blur(12px); cursor:auto; }
.case-toolbar { display:flex; align-items:center; gap:1rem; padding:1.25rem 2rem; background:#181714; position:sticky; top:0; z-index:2; }
.case-toolbar > span { flex:1; font-size:.65rem; letter-spacing:.15em; color:#e0a96d; }
.case-dialog button { font:inherit; font-size:.8rem; cursor:pointer; color:inherit; border:0; border-radius:999px; background:#ffffff06; padding:.7rem 1rem; }
.case-dialog button:hover { background:#e0a96d1f; }
.case-story { max-width:1100px; margin:auto; padding:2.5rem 3rem; }
.case-heading h2 { font-size:clamp(2.4rem,5vw,5rem); line-height:1.1; letter-spacing:-.045em; margin:.8rem 0 1.5rem; }
.case-heading > p:last-child { color:#c7c1b7; max-width:740px; font-size:1rem; line-height:1.9; }
.case-facts { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; background:#ffffff05; border-radius:22px; margin:2rem 0; padding:1.4rem; }
.case-facts dt { font-size:.7rem; color:#afa89d; margin-bottom:.5rem; }
.case-facts dd { font-size:.85rem; margin:0; }
.case-tabs { display:flex; gap:.5rem; margin-bottom:1.5rem; border-radius:999px; padding:.3rem; background:#ffffff05; }
.case-tabs button { flex:1; padding:.9rem .75rem; text-align:center; }
.case-tabs button[aria-selected="true"] { color:#181714; background:#e0a96d; }
.case-chapters section > h3 { font-size:1.25rem; margin:1.4rem 0 .8rem; }
.case-chapters section > p { color:#c7c1b7; line-height:1.9; max-width:780px; }
.case-preview { display:block; width:100%; height:auto; max-height:60dvh; object-fit:contain; background:#eeeae5; border-radius:18px; }
.case-images figure { margin:1rem 0; }
.case-images figure img { display:block; width:100%; height:auto; max-height:60dvh; object-fit:contain; background:#eeeae5; border-radius:18px; }
.case-images figcaption { color:#aaa397; font-size:.72rem; margin-top:.7rem; }
.case-image-controls { display:flex; align-items:center; justify-content:center; gap:1.5rem; margin:1rem 0; }
.case-image-controls > span { font-size:.8rem; font-variant-numeric:tabular-nums; }
.case-image-dots { display:flex; flex-wrap:wrap; gap:.25rem; }
.case-image-dots button { display:grid; place-items:center; width:44px; height:44px; padding:0; background:transparent; }
.case-image-dots button::before { content:''; width:10px; height:10px; border:1px solid #e0a96d; border-radius:50%; }
.case-image-dots button[aria-pressed="true"]::before { background:#e0a96d; box-shadow:0 0 0 5px #e0a96d12; }
.case-studios { display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem; margin-top:2rem; }
.case-studios span { padding:1.5rem 1rem; background:#ffffff05; border-radius:20px; color:#e0a96d; }
.case-source { margin-top:2.5rem; padding-top:1.2rem; display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.case-source p { font-size:.72rem; color:#aaa397; line-height:1.8; }
.case-source a { color:#e0a96d; font-size:.8rem; flex-shrink:0; }
.case-link-dot { display:inline-block; width:7px; height:7px; margin-left:.5rem; border:1px solid currentColor; border-radius:50%; }
.case-return { max-width:1100px; margin:auto; padding:0 3rem 2.5rem; text-align:center; }
.case-return button { color:#181714; background:#e0a96d; padding:1rem 2rem; }
.case-return button:hover { background:#f0c08a; }
.case-archive [hidden],.case-dialog [hidden] { display:none !important; }
.case-archive :focus-visible,.case-dialog :focus-visible { outline:2px solid #e0a96d; outline-offset:4px; }
html.has-custom-cursor .case-dialog { cursor:auto; }
html.has-custom-cursor .case-dialog button,html.has-custom-cursor .case-dialog a { cursor:pointer; }
@media (max-width:640px) {
 .case-intro { display:block; }.case-intro > p { margin-top:1rem; }
 .case-categories { gap:.4rem; }.case-categories a { padding:.7rem .9rem; font-size:.7rem; }
 .case-card summary { grid-template-columns:1.5rem minmax(0,1fr) 2.5rem; gap:.6rem; padding:1.25rem; }
 .case-meta { grid-column:2; grid-row:2; font-size:.6rem; }
 .case-meta span { display:inline; margin-right:.75rem; }
 .case-read { grid-column:3; grid-row:1/3; }
 .case-cover { display:none; }
 .case-dialog { width:calc(100% - 1rem); height:calc(100dvh - 1rem); max-height:calc(100dvh - 1rem); border-radius:24px; }
 .case-toolbar { padding:1rem; gap:.5rem; }.case-toolbar > span { font-size:.55rem; }
 .case-dialog button { font-size:.72rem; }
 .case-story { padding:1.25rem; }.case-facts { grid-template-columns:1fr 1fr; }
 .case-tabs button { font-size:.7rem; padding:.75rem .35rem; }
 .case-studios { grid-template-columns:1fr 1fr; }.case-source { align-items:flex-start; flex-direction:column; }
 .case-return { padding:0 1.25rem 2rem; }
}
@media (prefers-reduced-motion:reduce) { .case-card summary,.case-cover { transition:none; } }
