/* Scoped layout and readability repair for the three existing case studies.
   Preserve distinct themes, real artwork/video, working stage controls and links.
   This is not a copy of archived Figma case pages. */
.case-body{overflow-x:clip}
.case-body #process,.case-body #interaction-title,.case-body #status-title{scroll-margin-top:95px}
.case-header{min-height:80px;padding-inline:clamp(24px,4vw,56px)}
.case-brand{min-width:0}
.case-brand-title{display:block;font-family:var(--cas-font);font-size:clamp(17px,1.5vw,22px);font-weight:950;line-height:1.1;letter-spacing:-.035em}
.case-brand-title>span{color:var(--cas-accent)}
.case-brand-title small{display:block;font-family:var(--cas-ui);font-size:9px;font-weight:800;line-height:1.5;letter-spacing:.095em;margin-top:4px}
.case-nav{font-size:13px;gap:clamp(12px,2.2vw,33px)}
.case-nav a{padding-block:11px}
.case-hero{display:grid;grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);align-items:center;gap:clamp(32px,4.2vw,73px);padding:clamp(104px,9vw,143px) clamp(24px,4vw,56px) clamp(94px,8vw,127px);min-height:auto}
.case-hero-copy,.case-visual{min-width:0}
.case-overline{line-height:1.55;font-size:11px;letter-spacing:.095em;overflow-wrap:break-word}
.case-hero h1{font-size:clamp(53px,5.5vw,94px);line-height:1.015;letter-spacing:-.067em;font-weight:950;margin:27px 0 25px;max-width:12ch;overflow-wrap:normal}
.case-hero h1 em{font-style:normal}
.case-hero-lead{font-size:clamp(18px,1.67vw,24px);line-height:1.47;max-width:43ch;letter-spacing:-.02em}
.case-actions{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;margin-top:clamp(26px,3vw,42px)}
.case-cta{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;max-width:100%;min-width:0;min-height:51px;padding:14px 18px;border-width:1.5px;font-size:13px;line-height:1.3;text-align:center;white-space:normal;overflow-wrap:break-word}
.case-cta:hover{transform:none}
.case-visual{box-sizing:border-box;max-width:100%;min-height:clamp(350px,35vw,520px);border-radius:12px;padding:clamp(15px,2.4vw,34px);box-shadow:12px 14px 0 color-mix(in srgb,var(--cas-ink) 9%,transparent)}
.case-visual:before,.case-visual:after{display:none}
.case-visual-footer{font-size:10px;margin-top:18px;line-height:1.5;letter-spacing:.09em;overflow-wrap:break-word}
.case-section{padding:clamp(100px,8vw,130px) clamp(24px,4vw,56px)}
.case-section-title{font-size:clamp(45px,5.8vw,86px);line-height:1.04;letter-spacing:-.065em;margin:27px 0 29px;max-width:16ch}
.case-section-subtitle{font-size:clamp(18px,1.7vw,23px);line-height:1.52;margin:0 0 56px;max-width:65ch}
.case-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,54px)}
.case-step{min-width:0;padding-top:18px;border-top:1px solid color-mix(in srgb,var(--cas-ink) 32%,transparent)}
.case-step h3{font-size:clamp(25px,2.4vw,38px);line-height:1.13;margin:22px 0 13px}
.case-step p{font-size:clamp(15px,1.1vw,18px);line-height:1.54}
.case-demo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:clamp(32px,4vw,68px)}
.case-demo>div{min-width:0}
.case-demo h2{font-size:clamp(42px,4.2vw,69px);line-height:1.05;letter-spacing:-.062em;margin:22px 0}
.case-demo p{font-size:clamp(17px,1.45vw,21px);line-height:1.52}
.case-tablist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:28px}
.case-tablist button{min-width:0;min-height:54px;padding:12px 16px;border-radius:5px;line-height:1.32;overflow-wrap:break-word;text-align:center;font-size:14px}
.case-tablist button:focus-visible{outline-offset:2px}
.case-demo-panel{box-sizing:border-box;min-width:0;min-height:375px;padding:clamp(28px,3.3vw,53px);border-radius:11px;justify-content:space-between;overflow-wrap:break-word}
.case-demo-panel h3{font-size:clamp(34px,3.5vw,58px);line-height:1.07}
.case-demo-panel p{font-size:clamp(17px,1.5vw,21px)}
.case-honesty{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(32px,4vw,65px);padding:clamp(90px,7.2vw,118px) clamp(24px,4vw,56px)}
.case-honesty>div{min-width:0}
.case-honesty h2{font-size:clamp(39px,4.2vw,64px);line-height:1.06;letter-spacing:-.058em;margin:21px 0}
.case-honesty p{font-size:clamp(16px,1.32vw,20px);line-height:1.56;max-width:49ch}
.case-next{padding:clamp(74px,7vw,111px) clamp(24px,4vw,56px);gap:26px}
.case-next>div{min-width:0}
.case-next h2{font-size:clamp(41px,4.7vw,76px);line-height:1.05;margin:15px 0}
.case-next a{display:inline-flex;align-items:center;justify-content:center;min-height:54px;min-width:0;max-width:100%;padding:15px 21px;border-width:1.5px;line-height:1.35;text-align:center}
.case-footer{padding:26px clamp(24px,4vw,56px);font-size:11px;line-height:1.55;letter-spacing:.055em}
.case-body[data-theme="jewellery"] .case-visual{max-width:100%;min-height:440px}
.case-body[data-theme="jewellery"] .case-art-jewel{width:100%;height:410px;min-height:410px;overflow:hidden}
.case-body[data-theme="jewellery"] .jewel-showreel{object-fit:cover;object-position:center}
.case-body[data-theme="jewellery"] .jewel-video-surface{inset:0}

/* The document and message visuals stay in their own container, not under the title. */
.case-art-record,.case-art-operations{min-width:0;overflow:hidden}
@media(max-width:1080px){
 .case-hero{grid-template-columns:minmax(0,1fr);gap:46px}
 .case-hero h1{max-width:15ch}
 .case-hero-lead{max-width:60ch}
 .case-visual{width:100%;max-width:800px;min-height:420px;margin-inline:auto}
 .case-demo{grid-template-columns:minmax(0,1fr);gap:37px}
 .case-demo-panel{min-height:320px}
}
@media(max-width:750px){
 .case-header{min-height:72px;gap:13px}
 .case-nav{width:100%}
 .case-hero{padding-top:92px;padding-bottom:89px;gap:35px}
 .case-hero h1{font-size:clamp(51px,8.7vw,78px);line-height:1.025;margin:28px 0 21px}
 .case-hero-lead{font-size:18px;line-height:1.52}
 .case-visual{max-width:none;min-height:390px;box-shadow:8px 9px 0 color-mix(in srgb,var(--cas-ink) 8%,transparent)}
 .case-section{padding-block:94px}
 .case-section-title{font-size:clamp(43px,7.2vw,65px);max-width:none}
 .case-section-subtitle{font-size:18px;line-height:1.52;margin-bottom:42px}
 .case-steps{grid-template-columns:minmax(0,1fr);gap:32px}
 .case-step{max-width:none}
 .case-demo h2{font-size:clamp(40px,7.3vw,62px)}
 .case-demo-panel{padding:27px;min-height:320px}
 .case-honesty{grid-template-columns:minmax(0,1fr);gap:38px}
 .case-honesty h2{font-size:clamp(36px,7vw,53px)}
 .case-next{flex-direction:column;align-items:flex-start;gap:29px}
 .case-footer{gap:15px}
}
@media(max-width:440px){
 .case-header{padding-inline:24px}
 .case-brand-title{font-size:17px}
 .case-hero{padding:92px 24px 82px}
 .case-hero h1{font-size:clamp(45px,12vw,56px);letter-spacing:-.062em;overflow-wrap:break-word}
 .case-overline{font-size:10px}
 .case-actions{flex-direction:column;align-items:stretch;gap:11px}
 .case-actions .case-cta{width:100%;max-width:100%}
 .case-visual{min-height:365px;padding:16px}
 .case-section{padding-inline:24px}
 .case-section-title{font-size:clamp(40px,10.5vw,51px)}
 .case-demo-panel h3{font-size:clamp(30px,9vw,43px)}
 .case-tablist{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .case-tablist button{min-height:51px;padding:11px 9px;font-size:13px}
 .case-honesty,.case-next,.case-footer{padding-inline:24px}
 .case-body[data-theme="jewellery"] .case-art-jewel{height:330px;min-height:330px}
 .case-body[data-theme="jewellery"] .case-visual{padding:13px;min-height:390px}
}
@media(prefers-reduced-motion:reduce){
 .case-cta{transform:none!important}
 .case-body[data-theme="jewellery"] .jewel-video-surface{transform:none!important}
}