/* ============ CASE STUDY — cinematic project story ============ */
.chero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;padding-bottom:clamp(2rem,5vh,4rem);}
.chero__media{position:absolute;inset:0;z-index:0;transform:translate3d(calc(var(--px,0)*-14px),calc(var(--py,0)*-14px),0) scale(1.06);}
.chero__scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,var(--surface-0) 6%,rgba(var(--scrim),.55) 40%,rgba(var(--scrim),.35) 100%),radial-gradient(70% 60% at 20% 80%,rgba(0,58,155,.34),transparent 60%);}
.chero__body{position:relative;z-index:2;}
.chero__back{display:inline-block;color:var(--text-secondary);font-size:.82rem;letter-spacing:.06em;margin-bottom:2rem;transition:color .3s;}
.chero__back:hover{color:var(--k-gold);}
.chero__title{font-size:var(--d1);font-weight:600;letter-spacing:-.04em;line-height:.88;margin:1.2rem 0;}
.chero__title .serif{display:block;color:var(--k-gold);}
.chero__sub{max-width:52ch;color:var(--text-secondary);font-size:var(--h);}
.chero__facts{position:relative;z-index:2;display:grid;grid-template-columns:repeat(5,auto);gap:2.4rem;margin-top:3rem;padding-top:2rem;border-top:1px solid var(--hair);justify-content:start;}
.chero__facts i{display:block;font-style:normal;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text-dim);margin-bottom:.35rem;}
.chero__facts div{font-size:.92rem;color:var(--text-primary);}

.csec{padding:clamp(4rem,10vh,8rem) 0;}
.csec__grid{display:grid;grid-template-columns:.4fr .6fr;gap:var(--gutter);}
.csec__lead{font-size:var(--d3);font-weight:500;letter-spacing:-.02em;line-height:1.18;margin-bottom:1.5rem;}
.csec__body p{color:var(--text-secondary);max-width:60ch;margin-bottom:1rem;}
.csec__body p:first-child{color:var(--text-primary);}

.cfig{position:relative;height:80vh;min-height:520px;margin:0 var(--gutter) clamp(3rem,6vh,5rem);border-radius:12px;overflow:hidden;}
.cfig .pm{transform:scale(1.05);} 
.cfig figcaption{position:absolute;left:1.5rem;bottom:1.5rem;z-index:3;color:var(--text-secondary);font-size:.82rem;background:rgba(2,5,17,.5);backdrop-filter:blur(6px);padding:.5em 1em;border-radius:100px;border:1px solid var(--hair);}

.ctwo{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter);}
.ctwo__h{font-size:var(--d3);font-weight:600;letter-spacing:-.02em;line-height:1.02;margin:1rem 0 1.2rem;}
.ctwo p{color:var(--text-secondary);max-width:46ch;}

.cquote{position:relative;padding:clamp(5rem,12vh,10rem) 0;overflow:hidden;text-align:center;}
.cquote__glow{position:absolute;inset:0;z-index:0;background:radial-gradient(60% 80% at 50% 50%,var(--k-blue-deep),var(--surface-0) 70%);}
.cquote blockquote{position:relative;z-index:2;font-size:var(--d3);font-weight:500;letter-spacing:-.02em;line-height:1.2;max-width:24ch;margin-inline:auto;}
.cquote .serif{display:block;color:var(--k-gold);margin-top:.4rem;}

.cgal{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1rem,2vw,1.6rem);margin-top:2.5rem;}
.cgal__item{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:4/3;}
.cgal__item--wide{grid-column:1 / -1;aspect-ratio:16/8;}

.cdeliver{list-style:none;margin-top:.5rem;}
.cdeliver li{display:flex;gap:1.2rem;align-items:baseline;padding:1.1rem 0;border-bottom:1px solid var(--hair);font-size:clamp(1.1rem,2vw,1.5rem);font-weight:500;letter-spacing:-.01em;}
.cdeliver li span{color:var(--k-gold);font-size:.8rem;}
.cdeliver__note{color:var(--text-dim);font-size:.85rem;margin-top:1.4rem;max-width:56ch;}

.cnext{position:relative;height:70vh;min-height:440px;overflow:hidden;}
.cnext__link{display:block;height:100%;}
.cnext__media{position:absolute;inset:0;transform:translate3d(calc(var(--px,0)*-12px),calc(var(--py,0)*-12px),0) scale(1.06);transition:transform .6s var(--ease);}
.cnext__link:hover .cnext__media{transform:scale(1.1);}
.cnext__scrim{position:absolute;inset:0;background:linear-gradient(0deg,rgba(var(--scrim),.85),rgba(var(--scrim),.3) 60%,transparent);}
.cnext__body{position:absolute;left:0;right:0;bottom:clamp(2rem,5vh,4rem);z-index:2;}
.cnext__title{font-size:var(--d2);font-weight:600;letter-spacing:-.03em;margin:.8rem 0 1rem;} .cnext__title .serif{color:var(--k-gold);}

@media(max-width:900px){
  .csec__grid,.ctwo{grid-template-columns:1fr;gap:1.5rem;}
  .chero__facts{grid-template-columns:repeat(2,1fr);gap:1.4rem;}
  .cgal{grid-template-columns:1fr;} .cgal__item--wide{aspect-ratio:16/10;}
  .cfig{height:56vh;min-height:360px;}
}

/* ============ CASE — family-specific system articulation (design-led depth) ============ */
.csys{padding:clamp(3rem,7vh,6rem) 0;border-top:1px solid var(--hair);}
.csys__k{display:block;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--k-gold);margin-bottom:1rem;}
.csys__principle{font-family:var(--serif);font-style:italic;font-size:clamp(1.3rem,2.6vw,2rem);line-height:1.2;color:var(--text-primary);}

/* BRAND family: type specimen + system panels */
.csys__type{margin:2rem 0 3rem;border-bottom:1px solid var(--hair);padding-bottom:2rem;}
.csys__specimen{font-size:clamp(3rem,12vw,9rem);font-weight:700;letter-spacing:-.04em;line-height:.9;color:var(--text-primary);}
.csys__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,2rem);}
@media(max-width:760px){.csys__grid{grid-template-columns:1fr;}}
.csys__panel{border:1px solid var(--hair);border-radius:12px;padding:1.6rem;background:linear-gradient(160deg,var(--surface-1),var(--surface-0));}
.csys__panel p{color:var(--text-secondary);font-size:.9rem;margin-top:1rem;}
.csys__swatches{display:flex;gap:.5rem;} .csys__swatches i{width:44px;height:44px;border-radius:8px;box-shadow:0 6px 16px rgba(0,0,0,.4);}
.csys__typescale{display:flex;align-items:baseline;gap:1rem;color:var(--text-primary);font-weight:600;}

/* PACKAGING family */
.csys__packrow{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3rem);margin:2rem 0 2.5rem;}
@media(max-width:760px){.csys__packrow{grid-template-columns:1fr;}}
.csys__variants{display:flex;gap:.8rem;} .csys__variants i{width:56px;height:80px;border-radius:6px;background:linear-gradient(160deg,var(--k-blue-deep),var(--surface-2));border:1px solid var(--line-strong);}
.csys__variants i:nth-child(2){height:96px;} .csys__variants i:nth-child(3){height:72px;}
.csys__packcol p{color:var(--text-secondary);margin-top:1rem;font-size:.92rem;}
.csys__palette{display:flex;align-items:center;gap:.8rem;border-top:1px solid var(--hair);padding-top:2rem;}
.csys__palette .csys__k{margin-bottom:0;margin-right:1rem;} .csys__sw{width:40px;height:40px;border-radius:8px;}

/* DIGITAL family: device frames + journey */
.csys__devices{display:flex;align-items:flex-end;gap:1.5rem;justify-content:center;margin:2rem 0 3rem;perspective:1200px;}
.csys__device{border:1px solid var(--line-strong);border-radius:10px;background:linear-gradient(160deg,var(--surface-2),var(--surface-0));position:relative;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.45);}
.csys__device span{position:absolute;inset:8% 6%;border-radius:4px;background:linear-gradient(180deg,rgba(0,58,155,.3),transparent);border-top:3px solid var(--k-gold);}
.csys__device--desktop{width:min(46vw,440px);aspect-ratio:16/10;}
.csys__device--tablet{width:min(20vw,150px);aspect-ratio:3/4;}
.csys__device--mobile{width:min(12vw,84px);aspect-ratio:9/17;}
@media(max-width:760px){.csys__device--tablet,.csys__device--mobile{display:none;} .csys__device--desktop{width:100%;}}
.csys__journey{text-align:center;} .csys__journey .csys__k{margin-bottom:1rem;}
.csys__flow{display:inline-flex;flex-wrap:wrap;gap:.8rem;align-items:center;justify-content:center;font-weight:600;font-size:clamp(1.1rem,2.4vw,1.8rem);}
.csys__flow i{color:var(--k-blue-soft);font-style:normal;}
.csys__flow b{color:var(--text-primary);} .csys__journey .csys__principle{margin-top:1.5rem;}

/* CAMPAIGN family: key-frame grid + channels */
.csys__frames{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:2rem 0 2.5rem;}
@media(max-width:640px){.csys__frames{grid-template-columns:repeat(2,1fr);}}
.csys__frame{aspect-ratio:4/3;border-radius:8px;background:linear-gradient(160deg,var(--k-blue-deep),var(--surface-2));border:1px solid var(--line-strong);position:relative;display:flex;align-items:flex-end;padding:.8rem;}
.csys__frame::after{content:"";position:absolute;top:.7rem;right:.7rem;width:8px;height:8px;border-radius:50%;background:var(--k-gold);}
.csys__frame span{font-size:.72rem;color:var(--text-secondary);font-variant-numeric:tabular-nums;}
.csys__channels{border-top:1px solid var(--hair);padding-top:2rem;display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;}
.csys__channels .csys__k{margin-bottom:0;margin-right:.5rem;width:100%;}
.csys__chip{font-size:.8rem;color:var(--text-secondary);border:1px solid var(--hair);border-radius:100px;padding:.4em 1.1em;}
