/* Through the Diamonds — framework, individual cards, packaging and practice. */

/* Explain the model before translating it into the workshop. */
.fd-case .fd-framework{background:var(--fd-paper)}
.fd-case .fd-framework-map{padding-top:9px}
.fd-case .fd-model-diagram{display:block;width:100%;max-width:936px;height:auto;margin:0 auto 48px}
.fd-case .fd-model-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.fd-case .fd-model-stages>article{padding-top:19px;border-top:1px solid var(--fd-rule)}
.fd-case .fd-model-stages .fd-kicker{font-size:9px;letter-spacing:.055em;color:var(--fd-red);margin-bottom:12px}
.fd-case .fd-model-stages>article:nth-child(n+3) .fd-kicker{color:var(--fd-blue)}
.fd-case .fd-model-stages h3{font-size:28px;line-height:1.12;letter-spacing:-.025em;margin-bottom:12px}
.fd-case .fd-model-stages p:not(.fd-kicker){font-size:13px;line-height:1.75;color:var(--fd-muted);max-width:290px}
.fd-case .fd-credit{font-size:10px;line-height:1.8;color:var(--fd-muted);max-width:820px;margin-top:29px}
.fd-case .fd-credit a{color:var(--fd-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:#b7b7b0}
.fd-case .fd-credit a:hover{color:var(--fd-blue);text-decoration-color:currentColor}

/* A single horizontal strip presents each card at a readable, consistent size. */
.fd-case .fd-card-browser{margin-top:47px;min-width:0}
.fd-case .fd-card-browser-head{display:flex;align-items:center;justify-content:space-between;gap:28px;border-bottom:1px solid var(--fd-rule)}
.fd-case .fd-card-browser .fd-card-tabs{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch;gap:0;margin:0;border:0;max-width:100%;overflow-x:auto;scrollbar-width:none}
.fd-case .fd-card-browser .fd-card-tabs::-webkit-scrollbar{display:none}
.fd-case .fd-card-browser .fd-card-tabs button{flex:0 0 auto;width:auto;justify-content:flex-start;gap:13px;padding:18px 24px;font-size:12px;line-height:1.5;border-bottom:2px solid transparent;white-space:nowrap}
.fd-case .fd-card-browser .fd-card-tabs button:first-child{padding-left:0}
.fd-case .fd-card-browser .fd-card-tabs button>span{font-size:9px}
.fd-case .fd-card-browser .fd-card-tabs button[aria-selected=true]{border-bottom-color:var(--fd-red);color:var(--fd-red)}
.fd-case .fd-card-browser .fd-card-tabs button.fd-deck-material[aria-selected=true]{border-bottom-color:#8b7562;color:#8b7562}
.fd-case .fd-card-browser .fd-card-tabs button.fd-deck-tech[aria-selected=true]{border-bottom-color:var(--fd-blue);color:var(--fd-blue)}
.fd-case .fd-gallery-controls{display:flex;flex:none;align-items:center;justify-content:flex-end;gap:13px;padding-block:8px}
.fd-case .fd-gallery-controls button{display:grid;place-items:center;width:38px;height:38px;border:1px solid #bec7c4;border-radius:50%;padding:0;background:transparent;font-family:var(--font-site);font-size:17px;line-height:1;color:var(--fd-ink);cursor:pointer;transition:color .18s,border-color .18s,background .18s}
.fd-case .fd-gallery-controls button:hover:not(:disabled):not([aria-disabled=true]){color:var(--fd-blue);border-color:var(--fd-blue);background:#fff}
.fd-case .fd-gallery-controls button:disabled,.fd-case .fd-gallery-controls button[aria-disabled=true]{opacity:.3;cursor:default}
.fd-case .fd-gallery-controls>span{font-family:var(--fd-mono);font-size:10px;line-height:1.5;letter-spacing:.02em;min-width:45px;text-align:center;white-space:nowrap;color:var(--fd-muted);font-variant-numeric:tabular-nums}
.fd-case .fd-card-description{font-size:13px;line-height:1.75;color:var(--fd-muted);max-width:650px;margin:20px 0 25px}
.fd-case .fd-card-intro{display:flex;align-items:baseline;justify-content:space-between;gap:12px 28px;flex-wrap:wrap}
.fd-case .fd-card-hint{font-family:var(--fd-mono);font-size:10px;color:var(--fd-muted);white-space:nowrap;margin:0 0 20px}
.fd-case .fd-card-hint span{font-family:var(--font-site);font-size:16px;margin-left:6px}
.fd-case .fd-card-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 72px)/3.35);grid-template-rows:auto;align-items:start;gap:24px;width:100%;max-width:100%;padding:4px 3px 19px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;scroll-padding-inline:3px;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#9ba8a3 transparent;outline-offset:4px}
.fd-case .fd-card-track::-webkit-scrollbar{height:3px}
.fd-case .fd-card-track::-webkit-scrollbar-track{background:#dfe4e0}
.fd-case .fd-card-track::-webkit-scrollbar-thumb{background:#9ba8a3}
.fd-case .fd-card-track:focus-visible{outline:2px solid var(--fd-blue)}
.fd-case .fd-card-slide{display:flex;flex-direction:column;gap:0;width:100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:normal;margin:0}
.fd-case .fd-card-flip{position:relative;display:block;width:100%;aspect-ratio:2/3;padding:0;border:0;background:transparent;perspective:1100px;cursor:pointer}
.fd-case .fd-card-turner{position:absolute;inset:0;display:block;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.22,.7,.2,1)}
.fd-case .fd-card-flip[aria-pressed=true] .fd-card-turner{transform:rotateY(180deg)}
.fd-case .fd-card-face{position:absolute;inset:0;display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.fd-case .fd-card-back{transform:rotateY(180deg)}
.fd-case .fd-card-face>img{display:block;width:100%;height:100%;max-height:none;object-fit:contain;filter:none}
.fd-case .fd-card-flip-cue{position:absolute;right:12px;bottom:12px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#fafaf8ed;border:1px solid #d9dcd7;color:var(--fd-ink);font:20px/1 var(--font-site);box-shadow:0 2px 8px #0000000a}
.fd-case .fd-card-flip:focus-visible,.fd-case .fd-card-zoom:focus-visible{outline:2px solid var(--fd-blue);outline-offset:4px}
.fd-case .fd-card-flip:hover .fd-card-flip-cue{background:#fff;color:var(--fd-blue)}
.fd-case .fd-card-slide figcaption{display:flex;gap:12px;font-size:10px;line-height:1.6;color:var(--fd-muted);margin-top:12px;min-height:1.6em}
.fd-case .fd-card-slide figcaption>span:first-child{font-family:var(--fd-mono);color:var(--fd-blue)}
.fd-case .fd-card-slide .fd-card-label{flex:1}
.fd-case .fd-card-zoom{display:grid;place-items:center;flex:none;width:32px;height:32px;margin-top:-8px;padding:0;border:1px solid #c9d0cb;border-radius:50%;background:transparent;color:var(--fd-muted);font:17px/1 var(--font-site);cursor:zoom-in}
.fd-case .fd-card-zoom:hover{color:var(--fd-blue);border-color:var(--fd-blue)}

/* Packaging views remain large, with manufacturing detail available on demand. */
.fd-case .fd-packaging-visuals{display:grid;grid-template-columns:minmax(0,1fr);gap:34px;width:100%}
.fd-case .fd-packaging-visuals>.fd-photo{width:100%;max-width:none;margin-inline:0}
.fd-case .fd-packaging-visuals>.fd-photo+.fd-photo{margin-top:0}
.fd-case .fd-packaging-visuals .fd-image>img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
.fd-case .fd-package-gallery{min-width:0;width:100%}
.fd-case .fd-package-track{display:flex;gap:24px;width:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab;user-select:none;touch-action:pan-x pan-y}
.fd-case .fd-package-track::-webkit-scrollbar{display:none}
.fd-case .fd-package-track>.fd-photo{flex:0 0 88%;min-width:0;max-width:none;width:88%;margin:0;scroll-snap-align:start;scroll-snap-stop:always}
.fd-case .fd-package-track .fd-image{width:100%;aspect-ratio:3/2;background:#e9e8e4;cursor:inherit}
.fd-case .fd-package-track .fd-image>img{display:block;width:100%;height:100%;max-height:none;object-fit:contain;-webkit-user-drag:none}
.fd-case .fd-package-track.is-dragging{cursor:grabbing;scroll-snap-type:none}
.fd-case .fd-package-track:focus-visible{outline:2px solid var(--fd-blue);outline-offset:5px}
.fd-case .fd-package-gallery-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:16px}
.fd-case .fd-package-gallery-footer>p{font-size:11px;color:var(--fd-muted);margin:0}
.fd-case .fd-package-gallery-footer>p>span{display:inline-block;margin-left:9px;color:var(--fd-ink)}
.fd-case .fd-package-progress{position:relative;width:160px;height:2px;flex:none;background:#d6d9d4;overflow:hidden}
.fd-case .fd-package-progress>span{position:absolute;top:0;left:0;width:33.33%;height:100%;background:#6d7974}
@media(max-width:700px){
 .fd-case .fd-package-track{gap:14px}
 .fd-case .fd-package-track>.fd-photo{flex-basis:90%;width:90%}
 .fd-case .fd-package-gallery-footer{gap:16px}
 .fd-case .fd-package-gallery-footer>p{font-size:10px}
 .fd-case .fd-package-progress{width:90px}
}
.fd-case .fd-package-details{display:grid;grid-template-columns:minmax(0,.32fr) minmax(0,.68fr);gap:7%;align-items:start;padding-top:31px;margin-top:41px;border-top:1px solid #d5d5cd}
.fd-case .fd-package-details>.fd-photo{width:100%;max-width:none;margin:0}
.fd-case .fd-package-details .fd-image>img{width:100%;height:auto;max-height:none;object-fit:contain}
.fd-case .fd-package-details .fd-kicker{color:var(--fd-blue);font-size:9px;margin-bottom:16px}
.fd-case .fd-package-details h3{font-size:29px;line-height:1.13;letter-spacing:-.03em;margin-bottom:15px;max-width:360px}
.fd-case .fd-package-details p:not(.fd-kicker){font-size:13px;line-height:1.75;color:var(--fd-muted);max-width:350px}
.fd-case .fd-package-details p+p{margin-top:14px}
.fd-case .fd-production-drawing{margin-top:30px;border-block:1px solid #d5d5cd}
.fd-case .fd-production-drawing summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:17px 0;font-size:11px;line-height:1.6;list-style:none;cursor:pointer}
.fd-case .fd-production-drawing summary::-webkit-details-marker{display:none}
.fd-case .fd-production-drawing summary::after{content:'+';font-family:var(--font-site);font-size:20px;line-height:1;color:var(--fd-red);flex:none}
.fd-case .fd-production-drawing[open] summary::after{content:'−'}
.fd-case .fd-production-drawing summary:focus-visible{outline:2px solid var(--fd-blue);outline-offset:4px}
.fd-case .fd-production-drawing>.fd-photo,.fd-case .fd-production-drawing>.fd-image{padding-bottom:22px;width:100%;max-width:none;margin:0}
.fd-case .fd-production-drawing .fd-image>img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
.fd-case .fd-production-drawing>p{font-size:11px;line-height:1.7;color:var(--fd-muted);margin-bottom:21px}
.fd-case .fd-production-drawing+.fd-packaging-visuals{margin-top:38px}
.fd-case .fd-exhibition .fd-packaging-photo{margin-bottom:42px}
.fd-case .fd-exhibition-gallery{min-width:0;width:100%;margin-bottom:42px}
.fd-case .fd-exhibition-track{display:flex;gap:24px;width:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.fd-case .fd-exhibition-track::-webkit-scrollbar{display:none}
.fd-case .fd-exhibition-track>.fd-photo{flex:0 0 min(72%,680px);min-width:0;max-width:none;margin:0;scroll-snap-align:start;scroll-snap-stop:always}
.fd-case .fd-exhibition-track .fd-image{display:block;width:100%;aspect-ratio:3/4;background:transparent}
.fd-case .fd-exhibition-track .fd-image>img{display:block;width:100%;height:100%;max-height:none;object-fit:contain}
.fd-case .fd-exhibition-track:focus-visible{outline:2px solid var(--fd-blue);outline-offset:5px}
.fd-case .fd-exhibition-gallery-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:16px}
.fd-case .fd-exhibition-gallery-footer>p{font-size:11px;color:var(--fd-muted);margin:0}
.fd-case .fd-exhibition-gallery-footer .fd-gallery-controls{width:auto;padding:0}
@media(max-width:700px){
 .fd-case .fd-exhibition-track{gap:16px}
 .fd-case .fd-exhibition-track>.fd-photo{flex-basis:88%}
 .fd-case .fd-exhibition-gallery{margin-bottom:30px}
 .fd-case .fd-exhibition-gallery-footer{align-items:flex-end;gap:12px}
 .fd-case .fd-exhibition-gallery-footer>p{font-size:10px;max-width:120px}
}

/* Each stage sits on its own workshop photograph, with copy in the quiet areas. */
.fd-case .fd-skill-stories{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
.fd-case .fd-skill-scene{position:relative;isolation:isolate;aspect-ratio:2400/1597;overflow:hidden;background:#363d3d;color:#fff;--fd-skill-brightness:1.4;--fd-skill-contrast:1.12}
.fd-case .fd-skill-scene>img{display:block;position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:cover;filter:brightness(var(--fd-skill-brightness)) contrast(var(--fd-skill-contrast))}
.fd-case .fd-skill-scene::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at top left,rgba(8,19,24,.78),rgba(8,19,24,.36) 32%,transparent 66%)}
.fd-case .fd-skill-copy{position:absolute;z-index:2;left:4.5%;top:5%;width:39%;max-width:460px;text-shadow:0 1px 12px #0003}
.fd-case .fd-skill-copy .fd-kicker{font-size:10px;line-height:1.6;letter-spacing:.08em;color:#fff;margin-bottom:15px}
.fd-case .fd-skill-copy h3{font-size:clamp(28px,3.1vw,43px);line-height:1.12;letter-spacing:-.025em;margin-bottom:17px;color:#fff}
.fd-case .fd-skill-copy>p{font-size:13px;line-height:1.75;color:#fff;max-width:320px;margin:0}
.fd-case .fd-skill-tags{display:flex;flex-wrap:wrap;gap:7px 8px;list-style:none;padding:0;margin:0 0 17px}
.fd-case .fd-skill-tags li{font-family:var(--fd-mono);font-size:9px;line-height:1.6;letter-spacing:.015em;color:#fff;padding:5px 8px;border:1px solid #ffffff7a;background:#0b192126}
.fd-case .fd-skill-define{--fd-skill-brightness:1.45;--fd-skill-contrast:1.18}
.fd-case .fd-skill-define::after{background:radial-gradient(ellipse at bottom right,rgba(8,19,24,.82),rgba(8,19,24,.34) 30%,transparent 63%)}
.fd-case .fd-skill-define .fd-skill-copy{left:auto;top:auto;right:4.5%;bottom:5%;width:31%}
.fd-case .fd-skill-develop{--fd-skill-brightness:1.36;--fd-skill-contrast:1.12}
.fd-case .fd-skill-develop::after{background:radial-gradient(ellipse at bottom left,rgba(8,19,24,.85),rgba(8,19,24,.34) 30%,transparent 63%)}
.fd-case .fd-skill-develop .fd-skill-copy{top:auto;bottom:5%;width:32%}
.fd-case .fd-skill-deliver{--fd-skill-brightness:1.43;--fd-skill-contrast:1.1}
.fd-case .fd-skill-deliver .fd-skill-copy{width:49%;max-width:550px}
.fd-case .fd-skill-deliver .fd-skill-copy>p{max-width:470px}
.fd-case .fd-learning-note{max-width:760px;padding-top:25px;margin-top:34px;border-top:1px solid var(--fd-rule);font-size:12px;line-height:1.8;color:var(--fd-muted)}

@media(max-width:1100px){
 .fd-case .fd-model-stages{gap:22px}
 .fd-case .fd-model-stages h3{font-size:25px}
 .fd-case .fd-model-stages p:not(.fd-kicker){font-size:12px}
 .fd-case .fd-card-browser-head{gap:17px}
 .fd-case .fd-card-browser .fd-card-tabs button{padding-inline:18px;gap:10px}
 .fd-case .fd-card-track{grid-auto-columns:40%;gap:21px}
 .fd-case .fd-skill-copy{width:44%}
 .fd-case .fd-skill-copy h3{font-size:30px}
 .fd-case .fd-skill-copy>p{font-size:12px}
 .fd-case .fd-skill-define .fd-skill-copy,.fd-case .fd-skill-develop .fd-skill-copy{width:36%}
}
@media(max-width:700px){
 .fd-case .fd-framework-map{padding-top:0}
 .fd-case .fd-model-diagram{margin-bottom:25px}
 .fd-case .fd-model-stages{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 20px}
 .fd-case .fd-model-stages>article{padding-top:16px}
 .fd-case .fd-model-stages .fd-kicker{font-size:8px;margin-bottom:11px}
 .fd-case .fd-model-stages h3{font-size:25px;margin-bottom:10px}
 .fd-case .fd-model-stages p:not(.fd-kicker){font-size:12px;line-height:1.7}
 .fd-case .fd-credit{font-size:9px;line-height:1.8;margin-top:23px}
 .fd-case .fd-card-browser{margin-top:31px}
 .fd-case .fd-card-browser-head{flex-wrap:wrap;gap:0;border-bottom:0}
 .fd-case .fd-card-browser .fd-card-tabs{width:100%;border-bottom:1px solid var(--fd-rule);padding:0}
 .fd-case .fd-card-browser .fd-card-tabs button{flex:1 0 auto;justify-content:flex-start;padding:14px 13px;font-size:11px;gap:9px}
 .fd-case .fd-card-browser .fd-card-tabs button>span{font-size:8px}
 .fd-case .fd-gallery-controls{width:100%;justify-content:flex-end;gap:13px;padding:14px 0 0}
 .fd-case .fd-gallery-controls button{width:40px;height:40px;font-size:17px}
 .fd-case .fd-gallery-controls>span{font-size:9px}
 .fd-case .fd-card-description{font-size:12px;line-height:1.75;margin:17px 0 19px}
 .fd-case .fd-card-track{grid-auto-columns:76%;gap:17px;padding-bottom:16px}
 .fd-case .fd-card-slide figcaption{font-size:10px;margin-top:10px}
 .fd-case .fd-card-slide .fd-enlarge{opacity:1;transform:none}
 .fd-case .fd-packaging-visuals{gap:25px}
 .fd-case .fd-package-details{grid-template-columns:1fr;gap:25px;padding-top:25px;margin-top:30px}
 .fd-case .fd-package-details .fd-kicker{font-size:8px;margin-bottom:13px}
 .fd-case .fd-package-details h3{font-size:27px;margin-bottom:13px;max-width:none}
 .fd-case .fd-package-details p:not(.fd-kicker){font-size:12px;max-width:520px}
 .fd-case .fd-production-drawing{margin-top:25px}
 .fd-case .fd-production-drawing summary{font-size:10px;padding-block:15px}
 .fd-case .fd-production-drawing>.fd-photo,.fd-case .fd-production-drawing>.fd-image{padding-bottom:17px}
 .fd-case .fd-skill-stories{gap:18px}
 .fd-case .fd-skill-scene{aspect-ratio:1/1;min-height:350px}
 .fd-case .fd-skill-copy,.fd-case .fd-skill-define .fd-skill-copy,.fd-case .fd-skill-develop .fd-skill-copy,.fd-case .fd-skill-deliver .fd-skill-copy{width:auto;max-width:350px;left:22px;right:22px;top:22px;bottom:auto}
 .fd-case .fd-skill-define .fd-skill-copy,.fd-case .fd-skill-develop .fd-skill-copy{top:auto;bottom:22px}
 .fd-case .fd-skill-copy .fd-kicker{font-size:8px;margin-bottom:11px}
 .fd-case .fd-skill-copy h3{font-size:27px;margin-bottom:12px}
 .fd-case .fd-skill-copy>p{font-size:11px;line-height:1.65;max-width:290px}
 .fd-case .fd-skill-tags{margin-bottom:12px;gap:6px 7px}
 .fd-case .fd-skill-tags li{font-size:8px;padding:3px 7px}
 .fd-case .fd-skill-scene::after{background:linear-gradient(180deg,rgba(8,19,24,.76),rgba(8,19,24,.45) 30%,transparent 70%)}
 .fd-case .fd-skill-define::after,.fd-case .fd-skill-develop::after{background:linear-gradient(0deg,rgba(8,19,24,.85),rgba(8,19,24,.45) 30%,transparent 70%)}
 .fd-case .fd-learning-note{font-size:11px;line-height:1.8;margin-top:27px;padding-top:21px}
}
@media(prefers-reduced-motion:reduce){
 .fd-case .fd-card-track{scroll-behavior:auto}
 .fd-case .fd-card-turner{transition:none}
 .fd-case .fd-gallery-controls button{transition:none}
}