/* Recruiter-facing work hierarchy; shared across existing pages. */
.reel-preview {display:block;width:100%;aspect-ratio:16/9;height:auto;object-fit:contain;background:#191d20;border-radius:10px;margin:18px 0 12px;}
.reel-preview:focus-visible {outline:2px solid white;outline-offset:4px;}
.technical-prototype-cover {position:relative;overflow:hidden;background:#191d20;display:flex;flex-direction:column;justify-content:space-between;container-type:inline-size;}
.prototype-cover-heading {padding:9% 8% 0;position:relative;z-index:1;}
.prototype-cover-heading span {display:block;color:#b3c5bc;font-size:3.4cqw;margin-bottom:5%;}
.prototype-cover-heading strong {display:block;font-family:'Bricolage Grotesque','Hanken Grotesk',sans-serif;font-size:8.5cqw;line-height:1.12;letter-spacing:-.03em;color:#fff;}
.prototype-cover-graph {position:relative;height:43%;overflow:hidden;border-top:1px solid #ffffff18;border-bottom:1px solid #ffffff18;}
.prototype-cover-graph img {position:absolute;width:160%;max-width:none;height:auto;left:-30%;top:50%;transform:translateY(-58%);}
.prototype-cover-caption {padding:0 8% 8%;font-size:3.8cqw;line-height:1.65;color:#c7d2cc;}
.review-path {margin:28px 0 44px; padding:28px; background:var(--white-opacity--5,#ffffff0d); border:1px solid var(--white-opacity--15,#ffffff26); border-radius:16px;}
.page-content > .review-path {margin-left:clamp(18px,4vw,48px);margin-right:clamp(18px,4vw,48px);}
.review-path h2,.case-study h2 {font-size:clamp(1.5rem,3vw,2.2rem);line-height:1.2;letter-spacing:-.025em;color:#fff;text-wrap:balance;margin:0 0 16px;}
.review-path p,.case-study p {max-width:none;line-height:1.75;color:#d4cbcd;text-wrap:pretty;}
.work-links {display:flex;flex-wrap:wrap;gap:12px 22px;margin:20px 0;}
.work-links a,.case-study a {color:var(--white,white);text-decoration:underline;text-underline-offset:5px;}
.work-links a {padding:8px 0;}
.work-links a:hover,.case-study a:hover {color:#fff;}
.work-links a:focus-visible,.case-study a:focus-visible,.case-study summary:focus-visible {outline:2px solid #f0b3b9;outline-offset:5px;}
.case-study {padding:32px 40px;max-width:1120px;margin:auto;}
.case-study section {margin-bottom:32px;scroll-margin-top:24px;}
.case-study h3 {font-size:1.25rem;line-height:1.4;color:#fff;margin:24px 0 10px;}
.case-study video,.case-study img {width:100%;height:auto;display:block;border-radius:10px;background:#171415;}
.case-study video {margin:22px 0 12px;}
.case-study .eyebrow,.review-path .eyebrow {font-size:.875rem;letter-spacing:.02em;text-transform:none;color:var(--white-opacity--65,#ffffffa6);}
.case-study .media-note {font-size:.875rem;color:#b3a8ab;}
.tool-list {margin:24px 0;}
.tool-row {display:grid;grid-template-columns:minmax(140px,1fr) 2fr;gap:16px 32px;border-top:1px solid #544347;padding:22px 0;}
.tool-row h3 {margin:0;}
.tool-row p {margin:0 0 10px;}
.case-gallery {display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.case-study figure {margin:0;}
.case-study figcaption {font-size:.875rem;line-height:1.6;color:#c2b5b9;padding:10px 0;}
.case-study summary {cursor:pointer;color:#f0b3b9;padding:16px 0;}
@media(max-width:640px){.case-study{padding:24px 18px}.review-path{padding:22px 18px;margin:20px 0 30px}.tool-row,.case-gallery{grid-template-columns:1fr}.work-links{gap:8px 18px}}
@media(prefers-reduced-motion:reduce){.work-links a{transition:none}}

/* Use the existing site's typography and surface tokens for added content. */
.design-focus {margin:28px clamp(18px,4vw,48px) 32px;}
.design-focus header {margin-bottom:18px;}
.design-focus .focus-label {font-size:.875rem;color:#ffffffa6;margin:0 0 6px;}
.design-focus h2 {font-family:'Bricolage Grotesque','Hanken Grotesk',sans-serif;font-size:clamp(1.5rem,2.8vw,2rem);line-height:1.25;color:white;margin:0;}
.focus-layout {display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px;border-top:1px solid #ffffff26;padding-top:8px;}
.focus-projects a {position:relative;display:block;padding:18px 32px 18px 0;border-bottom:1px solid #ffffff26;color:white;text-decoration:none;}
.focus-projects a > span:first-child {font-size:1.125rem;font-weight:600;}
.focus-projects small {display:block;font-size:.875rem;line-height:1.6;color:#ffffffa6;margin-top:5px;}
.focus-projects .focus-arrow {position:absolute;right:4px;top:20px;}
.focus-projects .focus-all {font-size:.875rem;border-bottom:0;text-decoration:underline;text-underline-offset:4px;padding-bottom:0;}
.focus-projects a:hover {color:#ffc427;}
.focus-projects a:focus-visible {outline:2px solid white;outline-offset:4px;}
.focus-method {padding-top:18px;}
.focus-method h3,.contribution-notes h3 {font-family:'Bricolage Grotesque','Hanken Grotesk',sans-serif;font-size:1.125rem;line-height:1.4;color:white;margin:0 0 12px;}
.focus-method p {font-size:.9375rem;line-height:1.75;margin:0 0 12px;}
.focus-method .focus-support {font-size:.875rem;color:#ffffffa6;}
.contribution-layout {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px;}
.contribution-notes {border-left:1px solid #ffffff26;padding-left:24px;}
.case-study .contribution-notes p {font-size:.875rem;line-height:1.7;}
.case-study .contribution-notes h3 {margin-top:0;}
.case-study > section:last-child {margin-bottom:0;}
.case-study h2 {margin-bottom:12px;font-size:clamp(1.4rem,2.5vw,1.9rem);}
.case-study #production-tools > h3 {margin-top:18px;}
.case-study #production-tools > p:last-child {margin-bottom:0;}
@media(max-width:720px){.focus-layout,.contribution-layout{grid-template-columns:1fr;gap:20px}.contribution-notes{border-left:0;border-top:1px solid #ffffff26;padding:16px 0 0}.focus-method{padding-top:4px}.case-study section{margin-bottom:24px}}
.review-path h2,.case-study h2,.case-study h3,.reel-entry h2,.reel-entry h3 {
  font-family:'Bricolage Grotesque','Hanken Grotesk',system-ui,sans-serif;
  font-weight:600;
}
.review-path p,.case-study p,.reel-entry p {
  font-family:'Hanken Grotesk',system-ui,sans-serif;
  font-size:1rem;line-height:1.8;letter-spacing:.02em;
  color:rgba(255,255,255,.85);font-weight:400;
}
.reel-entry {border-radius:16px;background:var(--white-opacity--5,#ffffff0d);}
.reel-entry a,.reel-jump,.laser-study summary {color:var(--white,white);}
.case-study .media-note,.reel-entry .reel-role {font-size:.875rem;color:var(--white-opacity--65,#ffffffa6);}
.supplemental-work {width:calc(100% - 96px);margin:24px auto;padding:20px 24px;border:1px solid #ffffff26;border-radius:16px;background:#ffffff0d;}
.supplemental-work > summary {display:list-item;font-size:1.125rem;font-weight:600;color:white;}
.project-modal-content .role-toggle-btn {font-family:inherit;line-height:1.5;}
@media(max-width:640px){
  .supplemental-work{width:calc(100% - 36px);padding:18px;}
  .project-modal-content{padding:24px 18px !important;}
  .role-toggle-btn{padding:10px 16px !important;}
  .project-modal-content .project-modal-section-title{font-size:1.35rem;}
}
