/* Editorial case pages. Typography and site chrome reuse the live portfolio. */
.fcase{--case-paper:#f7f6f2;--case-ink:#282823;--case-muted:#69675f;--case-accent:#704f78;max-width:1440px;margin:0 auto;background:var(--case-paper);color:var(--case-ink);font-family:Instrument,sans-serif}
.case-nova .fcase{--case-accent:#c8ff3d}.case-mirai .fcase{--case-accent:#a34d3c}
.fcase *{box-sizing:border-box;min-width:0}.fcase figure,.fcase p,.fcase dl,.fcase h1,.fcase h2,.fcase pre{margin:0}
.fcase p,.fcase dt,.fcase dd,.fcase figcaption,.fcase a{overflow-wrap:anywhere}
.fcase a{color:inherit;text-underline-offset:.25em}.fcase a:focus-visible,.case-card:focus-visible{outline:3px solid #a34d3c;outline-offset:7px}
.case-section{display:flex;flex-direction:column;align-items:stretch;gap:32px;padding:clamp(32px,5.56vw,80px)}
.fcase-intro{padding-top:48px;padding-bottom:64px}.case-back{align-self:flex-start;font-size:16px;margin-bottom:8px}.fcase h1,.fcase h2,.case-brand-name{font-family:Bricolage,sans-serif;font-weight:500;letter-spacing:-.045em;text-wrap:balance;overflow-wrap:anywhere}
.fcase h1{font-size:clamp(48px,6.667vw,96px);line-height:1.045;max-width:1240px}.fcase h2{font-size:clamp(32px,3.89vw,56px);line-height:1.11;max-width:1280px}
.case-eyebrow{font-size:14px;line-height:1.43;letter-spacing:1.5px;font-weight:500}.case-lead{font-size:clamp(22px,1.95vw,28px);line-height:1.3;color:var(--case-muted);max-width:1100px}
.case-text{font-size:clamp(18px,1.53vw,22px);line-height:1.55;max-width:1200px;text-wrap:pretty}.case-caption{font-size:16px;line-height:1.5;color:var(--case-muted);max-width:1220px}.case-caption a{white-space:normal}.handwritten{font-family:Marker,cursive;font-size:clamp(27px,2.78vw,40px);line-height:1.25}
.fcase-hero{position:relative;isolation:isolate;aspect-ratio:1440/980;background:#282823;overflow:hidden}.fcase .case-photo{display:block;width:100%;height:auto;object-fit:cover}.fcase-hero>.case-photo{height:100%;object-position:center center}.fcase-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0004,#0000);z-index:0;pointer-events:none}
.hero-device{position:absolute;left:7.65%;top:11.2%;width:24.9%;transform:rotate(5deg);z-index:1}.fcase-hero figcaption{position:absolute;right:6.9%;bottom:12%;max-width:43%;color:#fff;z-index:1;text-shadow:0 2px 15px #0009}
.native-device{position:relative;width:100%;max-width:338px;margin-inline:auto;background:#060809;border:1px solid #595c5e;border-radius:15.4%/7.3%;padding:2.65%;box-shadow:0 20px 30px -15px #0006;aspect-ratio:338/714}
.native-device .case-artwork{display:block;width:100%;height:100%;object-fit:contain;border-radius:13.4%/6.2%}.native-device::after{content:"";position:absolute;top:2.65%;left:37.3%;width:24.85%;height:3.37%;border-radius:99px;background:#000;pointer-events:none}
.native-grid-two{grid-template-columns:repeat(2,minmax(0,1fr))!important}.native-grid-two .native-device{padding:9px!important}.lume-lockup{display:flex;align-items:center;gap:16px}.lume-lockup .identity-art:first-child{flex:0 0 23%}.lume-lockup .identity-art:last-child{flex:1}.campaign-lume .native-device{left:72%}
.hero-device .native-device{padding:2.65%}.native-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,4.45vw,64px)}.native-grid figure{display:flex;flex-direction:column;gap:24px;padding-top:10px}.native-grid .native-device{width:88.1%;padding:2.35%}.native-grid figcaption{font-size:14px;line-height:1.5;letter-spacing:1.5px;color:var(--case-muted);overflow-wrap:anywhere}
.case-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:12px!important}.case-facts dt{font-size:14px;letter-spacing:1.5px;line-height:1.45;color:var(--case-muted);margin-bottom:12px}.case-facts dd{font-size:16px;line-height:1.5;margin:0}.case-decisions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.case-decisions>div{display:flex;flex-direction:column;gap:16px}.case-decisions .case-lead{color:inherit}
.case-dark{background:#070a0c;color:#fff}.case-lume .case-dark{background:#704f78}.case-mirai .case-dark{background:#282823}.case-dark .case-eyebrow{color:var(--case-accent)}.case-lume .case-dark .case-eyebrow,.case-mirai .case-dark .case-eyebrow{color:#eadadd}.case-dark .case-caption{color:#d3d2ce}.case-dark .case-lead{color:inherit}.fcase pre{font:clamp(14px,1.25vw,18px)/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;color:inherit;padding-block:6px}
.case-photograph{width:100%;overflow:hidden}.case-photograph .case-photo{aspect-ratio:1280/854;object-position:center}.case-palette{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.case-palette>div{display:flex;flex-direction:column;gap:12px}.swatch{width:100%;aspect-ratio:302/130;border-radius:6px}.case-brand-name{font-size:clamp(64px,6.67vw,96px);line-height:1.05}.brand-expression{display:grid;grid-template-columns:minmax(0,470fr) minmax(0,700fr);gap:clamp(32px,4.86vw,70px);align-items:center}.identity-art{display:flex;align-items:center;justify-content:flex-start;gap:20px}.identity-art img{max-width:100%;width:auto;height:auto}.brand-expression img{width:auto;max-width:100%;height:auto}
.case-campaign{position:relative;display:grid;grid-template-columns:1fr 1fr;min-height:640px;background:#070a0c;overflow:hidden}.campaign-scene{position:relative;min-height:100%;overflow:hidden}.campaign-scene>.case-photo{height:100%;width:100%;object-fit:cover;object-position:center}.campaign-copy{display:flex;flex-direction:column;gap:24px;padding:clamp(24px,3.9vw,56px);color:white}.campaign-copy h2{font-size:clamp(30px,3.89vw,56px)}.campaign-copy .native-device{width:50%;max-width:230px;margin:8px auto 0}.campaign-nova .campaign-scene{grid-column:2;grid-row:1}.campaign-nova .campaign-copy{grid-column:1;grid-row:1;color:#c8ff3d}.campaign-nova .case-lead{color:#fff}.campaign-mirai{background:#f5f1e9}.campaign-mirai .campaign-copy{color:#a34d3c}.campaign-lume{display:block;min-height:0;background:#704f78}.campaign-lume .campaign-scene{aspect-ratio:1280/710}.campaign-lume .native-device{position:absolute;top:4.2%;left:37.1%;width:24.3%;max-width:none;padding:.65%;height:auto}.campaign-caption{padding:36px 40px;color:white;text-align:center}.campaign-caption .handwritten{font-size:clamp(28px,3.3vw,48px)}
.case-next{flex-direction:row;justify-content:space-between;gap:24px;background:#282823;color:white;font-size:clamp(18px,2vw,28px)}.case-next a:last-child{text-align:right}.case-study .site-header{max-width:1440px;margin-inline:auto}
.case-card{color:inherit;text-decoration:none}.case-card .case-card-cover{display:block!important;overflow:hidden;background:#e9e7e0;aspect-ratio:4/3}.case-card .case-card-cover>img{display:block;width:100%!important;height:100%!important;object-fit:cover;object-position:center;transition:transform .45s ease}.case-card:hover .case-card-cover>img{transform:scale(1.025)}.notebook-page[href]{color:inherit;text-decoration:none}
@media(min-width:1001px){.page-fun .case-card-cover{aspect-ratio:4/3;min-height:0}.page-fun .case-card-cover>img{position:absolute;inset:0}}
@media(max-width:1000px){.case-section{padding:40px 32px;gap:28px}.case-facts{gap:24px}.case-campaign{min-height:520px}.native-grid{gap:24px}.native-grid figcaption{font-size:12px;letter-spacing:1px}.brand-expression{grid-template-columns:1fr 1.4fr;gap:24px}.case-card .case-card-cover{aspect-ratio:4/3!important;min-height:0!important}}
@media(max-width:600px){.case-section{padding:40px 22px;gap:24px}.fcase-intro{padding-top:24px;padding-bottom:40px}.case-eyebrow{font-size:12px;letter-spacing:1.25px}.fcase h1{font-size:48px}.fcase h2{font-size:34px}.case-lead{font-size:22px}.case-text{font-size:18px}.case-caption{font-size:15px}.fcase-hero{aspect-ratio:4/5}.fcase-hero>.case-photo{object-position:68% center}.hero-device{width:37%;left:6%;top:14%}.fcase-hero figcaption{font-size:27px;right:6%;bottom:7%;max-width:75%;text-align:right}.case-mirai .fcase-hero>.case-photo{object-position:65% center}.case-lume .fcase-hero>.case-photo{object-position:60% center}.native-grid{grid-template-columns:1fr;gap:36px}.native-grid figure{max-width:320px;width:100%;margin-inline:auto;gap:18px}.native-grid .native-device{width:88%;padding:2.35%}.native-grid figcaption{font-size:13px;letter-spacing:1.3px;text-align:center}.case-facts,.case-decisions{grid-template-columns:1fr;gap:24px}.case-facts>div{border-top:1px solid #28282322;padding-top:18px}.case-palette{grid-template-columns:1fr 1fr;gap:24px 16px}.brand-expression{grid-template-columns:1fr;gap:24px}.brand-expression img{max-width:100%}.case-photograph .case-photo{aspect-ratio:auto}.case-campaign{display:flex;flex-direction:column;min-height:0}.campaign-scene{min-height:0;aspect-ratio:4/5}.campaign-copy{padding:32px 24px;gap:24px}.campaign-copy .native-device{width:55%;max-width:210px}.campaign-copy h2{font-size:34px}.campaign-lume .campaign-scene{aspect-ratio:4/5}.campaign-lume .campaign-scene>.case-photo{object-position:60% center}.campaign-lume .native-device{width:44%;left:28%;top:10%;padding:1.2%}.campaign-caption{padding:26px 20px}.case-next{font-size:18px;align-items:center}.case-card .case-card-cover{aspect-ratio:4/3!important}.page-fun .case-card .app11-name{font-size:clamp(38px,12vw,62px)}}
@media(prefers-reduced-motion:reduce){.case-card .case-card-cover>img{transition:none}.case-card:hover .case-card-cover>img{transform:none}}
@media(max-width:600px){.native-grid-two{grid-template-columns:1fr!important}.campaign-lume .campaign-scene{aspect-ratio:auto;display:flex;flex-direction:column;background:#704f78;gap:28px;padding-bottom:20px}.campaign-lume .campaign-scene>.case-photo{height:auto;aspect-ratio:3/2;object-position:center}.campaign-lume .native-device{position:relative;left:auto;top:auto;width:55%;max-width:240px;padding:6px;flex-shrink:0}}
@media(max-width:600px){.fcase-hero figcaption{left:6%;right:auto;bottom:4%;max-width:70%;text-align:left}.case-lume .fcase-hero{aspect-ratio:auto;display:flex;flex-direction:column;gap:24px;padding-bottom:28px;background:#704f78}.case-lume .fcase-hero>.case-photo{height:auto;aspect-ratio:3/2;object-position:center}.case-lume .hero-device{position:relative;left:auto;top:auto;width:48%;margin-inline:auto;transform:none}.case-lume .fcase-hero::after{display:none}.case-lume .fcase-hero figcaption{position:static;max-width:none;text-align:center;margin-inline:22px}}
@media(min-width:601px){.case-lume .campaign-lume .native-device{left:72%;width:24%}}
@media(max-width:600px){.case-lume .fcase-hero{height:auto;min-height:0;overflow:visible}.case-lume .fcase-hero>*{flex-shrink:0}.case-lume .fcase-hero figcaption{display:block;width:auto;height:auto;min-height:1.5em;line-height:1.4;padding-bottom:8px}}
