/* =========================================================
   Case study page
   12-col: sticky contents cols 1–3, story cols 5–12.
   H2 = chapter (auto-numbered 01, 02…), .ma-step = process step
   (auto-numbered, giant outline numeral), .ma-stats = results row.
   ========================================================= */

.case__head{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));column-gap:var(--gutter);row-gap:20px;padding:calc(var(--header-h) + env(safe-area-inset-top,0px) + clamp(40px,6vw,96px)) var(--margin) clamp(32px,4vw,56px)}
.case__head .svc-hero__crumbs{grid-column:1/-1}
.case__title{grid-column:1/-1;font-family:var(--f-display);font-weight:700;font-size:clamp(48px,9vw,168px);letter-spacing:-.06em;line-height:.86;text-transform:uppercase;text-wrap:balance;overflow-wrap:anywhere}
.case__summary{grid-column:1/-1;font-family:var(--f-display);font-weight:500;font-size:clamp(20px,2vw,32px);letter-spacing:-.025em;line-height:1.2;max-width:34ch;text-wrap:balance}
.case__facts{grid-column:1/-1;display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));column-gap:var(--gutter);row-gap:20px;margin:12px 0 0}
.case__facts > div{grid-column:span 2;border-top:1px solid var(--line-strong);padding-top:10px;min-width:0}
.case__facts > div.is-wide{grid-column:1/-1}
.case__facts dt{color:var(--mute-2);margin-bottom:6px}
.case__facts dd{margin:0;font-size:16px;line-height:1.45}
.case__facts .is-dim dd{color:var(--mute-2)}
.case__tags{display:flex;flex-wrap:wrap;gap:6px}
@media (min-width:900px){
	.case__summary{grid-column:5/span 7}
	.case__facts > div{grid-column:span 2}
	.case__facts > div:nth-child(3){grid-column:span 4}
	.case__facts > div.is-wide{grid-column:span 6}
}

.case__cover{margin:0;overflow:hidden;max-height:92vh}
.case__cover img{width:100%;height:auto;display:block}

/* body: contents + story */
.case__body{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));column-gap:var(--gutter);padding:clamp(56px,7vw,120px) var(--margin) clamp(48px,6vw,96px)}
.case__toc{display:none}
.case__content{grid-column:1/-1;min-width:0;counter-reset:chapter step}
@media (min-width:1100px){
	.case__toc:not([hidden]){display:flex;flex-direction:column;gap:16px;grid-column:1/span 3;position:sticky;top:calc(var(--header-h) + 32px);align-self:start}
	.case__content{grid-column:5/span 8}
}
.case__toc-k{color:var(--acid)}
.case__toc-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.case__toc-list a{display:grid;grid-template-columns:32px 1fr;gap:8px;padding:10px 0;border-bottom:1px solid var(--line);font-family:var(--f-display);font-weight:500;font-size:16px;color:var(--mute-2);transition:color .3s,padding .5s var(--expo)}
.case__toc-list a span{font-family:var(--f-mono);font-size:11px;padding-top:3px}
.case__toc-list a:hover{color:var(--paper)}
.case__toc-list a.is-active{color:var(--acid);padding-left:8px}
.case__progress{height:2px;background:var(--line)}
.case__progress span{display:block;height:100%;width:100%;background:var(--acid);transform-origin:left;transform:scaleX(0)}
.case__back{font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute-2);transition:color .3s}
.case__back:hover{color:var(--acid)}

/* story typography (Gutenberg output) */
.case__content > *{max-width:66ch}
.case__content > * + *{margin-top:1.1em}
.case__content p{font-size:clamp(17px,1.2vw,19px);line-height:1.7;color:#d9d7d0}
.case__content a{color:var(--acid)}
.case__content h2{counter-increment:chapter;max-width:none;font-family:var(--f-display);font-weight:600;font-size:var(--t-xl);letter-spacing:-.04em;line-height:.95;text-transform:uppercase;margin-top:clamp(72px,8vw,136px);padding-top:18px;border-top:1px solid var(--line-strong);scroll-margin-top:calc(var(--header-h) + 24px)}
.case__content h2:first-child{margin-top:0}
.case__content h2::before{content:counter(chapter,decimal-leading-zero) " —";display:block;font-family:var(--f-mono);font-size:12px;font-weight:400;letter-spacing:.1em;color:var(--acid);margin-bottom:18px}
.case__content h3{font-family:var(--f-display);font-weight:600;font-size:clamp(24px,2.2vw,36px);letter-spacing:-.03em;line-height:1.1}
.case__content h2 + *{margin-top:28px}
.case__content figure,.case__content .wp-block-image{max-width:none;margin-top:32px}
.case__content img{width:100%;height:auto;display:block}
.case__content figcaption{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;color:var(--mute-2);margin-top:10px;text-transform:uppercase}
.case__content blockquote{max-width:none;border-left:3px solid var(--acid);padding-left:24px;font-family:var(--f-display);font-size:clamp(24px,2.4vw,40px);letter-spacing:-.03em;line-height:1.15}
.case__content ul,.case__content ol{padding-left:1.2em;color:#d9d7d0;font-size:17px;line-height:1.7}

/* process steps */
.case__content .ma-step{counter-increment:step;max-width:none;position:relative;display:grid;grid-template-columns:1fr;row-gap:14px;padding:28px 0 8px;border-top:1px solid var(--line);margin-top:28px}
.case__content .ma-step::before{content:counter(step,decimal-leading-zero);font-family:var(--f-display);font-weight:700;font-size:clamp(72px,8vw,136px);letter-spacing:-.06em;line-height:.8;color:transparent;-webkit-text-stroke:1.5px var(--mute)}
.case__content .ma-step > *{margin:0;max-width:62ch}
.case__content .ma-step > figure,.case__content .ma-step > .wp-block-image,.case__content .ma-step > .wp-block-gallery{max-width:none;margin-top:12px}
.case__content .ma-step > h3::before{content:"Step " counter(step,decimal-leading-zero);display:block;font-family:var(--f-mono);font-size:11px;font-weight:400;letter-spacing:.1em;text-transform:uppercase;color:var(--acid);margin-bottom:8px}
.case__content .ma-step.is-in::before{-webkit-text-stroke-color:var(--acid)}
@media (min-width:900px){
	.case__content .ma-step{grid-template-columns:minmax(120px,1fr) 3fr;column-gap:var(--gutter)}
	.case__content .ma-step::before{grid-row:1/span 9}
	.case__content .ma-step > *{grid-column:2}
}

/* results */
.case__content .ma-stats{max-width:none;display:grid!important;grid-template-columns:1fr;gap:var(--gutter);margin-top:32px}
.case__content .ma-stats .wp-block-column{border-top:2px solid var(--acid);padding-top:14px;flex-basis:auto!important}
.case__content .ma-stats h4{font-family:var(--f-display);font-weight:700;font-size:clamp(48px,5.4vw,96px);letter-spacing:-.06em;line-height:.85;color:var(--acid)}
.case__content .ma-stats p{font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute-2);margin-top:10px}
@media (min-width:640px){.case__content .ma-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* gallery */
.case__content .wp-block-gallery{max-width:none;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gutter)!important;margin-top:32px}
.case__content .wp-block-gallery figure{margin:0!important;width:auto!important}
.case__content .wp-block-gallery figure:nth-child(3n+1){grid-column:1/-1}
.case__content .wp-block-gallery img{height:100%!important;object-fit:cover}
.case__content .alignwide,.case__content .alignfull{max-width:none}

/* pager + next */
.case__pager{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}
.case__pager a{display:flex;flex-direction:column;gap:6px;padding:28px var(--margin);transition:color .3s}
.case__pager a + a{border-left:1px solid var(--line);text-align:right;align-items:flex-end}
.case__pager .label{color:var(--mute-2)}
.case__prev-t{font-family:var(--f-display);font-weight:600;font-size:clamp(18px,1.6vw,24px);letter-spacing:-.02em}
.case__pager a:hover{color:var(--acid)}
.case__pager a:only-child{grid-column:1/-1}
.case__next{position:relative;overflow:hidden;isolation:isolate}
.case__next-img{position:absolute;right:var(--margin);top:50%;width:min(30vw,420px);aspect-ratio:4/3;object-fit:cover;transform:translateY(-50%) scale(.9) rotate(-3deg);opacity:0;transition:opacity .5s var(--expo),transform .7s var(--expo);z-index:-1;pointer-events:none}
.case__next:hover .case__next-img{opacity:1;transform:translateY(-50%) scale(1) rotate(-3deg)}
@media (max-width:899px){.case__next-img{display:none}}
.case__cta{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding:clamp(48px,6vw,96px) var(--margin);border-top:1px solid var(--line)}
.case__cta-t{font-family:var(--f-display);font-weight:700;font-size:clamp(32px,4.4vw,72px);letter-spacing:-.05em;line-height:.95;text-transform:uppercase;max-width:14ch}

/* project gallery: posts in one even grid, wide banners full width */
.case__content .case-gallery__meta{color:var(--mute-2);margin-top:14px!important;font-size:12px;font-family:var(--f-mono);letter-spacing:.1em}
.case-gallery{max-width:none!important;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row dense;gap:var(--gutter);margin-top:28px!important}
.case-gallery__item{position:relative;display:block;width:100%;margin:0;padding:0;border:0;background:var(--ink-2);cursor:zoom-in;overflow:hidden;aspect-ratio:var(--ar,1)}
.case-gallery__item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .9s var(--expo),opacity .4s}
.case-gallery__item.is-wide{grid-column:1/-1;aspect-ratio:auto}
.case-gallery__item.is-wide img{height:auto;object-fit:fill}
.case-gallery__item.is-fit img{object-fit:contain}
.case-gallery__item:hover img{transform:scale(1.03)}
.case-gallery__n{position:absolute;left:10px;top:10px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.08em;background:var(--ink);color:var(--paper);padding:4px 7px;opacity:0;transition:opacity .3s}
.case-gallery__item:hover .case-gallery__n,.case-gallery__item:focus-visible .case-gallery__n{opacity:1}
@media (min-width:900px){.case-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* full-screen viewer */
.lightbox{position:fixed;inset:0;z-index:120;background:rgba(9,9,9,.96);display:grid;grid-template-columns:64px 1fr 64px;align-items:center;padding:calc(56px + env(safe-area-inset-top,0px)) max(8px,env(safe-area-inset-right,0px)) calc(48px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px))}
.lightbox[hidden]{display:none}
.lightbox__fig{margin:0;grid-column:2;display:flex;justify-content:center;align-items:center;height:100%;min-height:0}
.lightbox__fig img{max-width:100%;max-height:calc(100vh - 120px);width:auto;height:auto;object-fit:contain}
.lightbox__nav{width:56px;height:56px;border:1px solid var(--line-strong);font-family:var(--f-mono);font-size:18px;color:var(--paper);transition:background .3s,color .3s}
.lightbox__nav:hover{background:var(--acid);color:var(--ink);border-color:var(--acid)}
.lightbox__nav--next{grid-column:3;justify-self:end}
.lightbox__close{position:absolute;right:max(20px,env(safe-area-inset-right,0px));top:calc(16px + env(safe-area-inset-top,0px));font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--paper)}
.lightbox__close:hover{color:var(--acid)}
.lightbox__count{position:absolute;left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);color:var(--mute-2)}
@media (max-width:640px){.lightbox{grid-template-columns:1fr}.lightbox__nav{position:absolute;bottom:calc(8px + env(safe-area-inset-bottom,0px));width:48px;height:48px}.lightbox__nav--prev{left:16px}.lightbox__nav--next{right:16px}.lightbox__fig{grid-column:1}}

.case__cover--video{max-height:none;background:#003f5c}
.case__cover--video video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.case__content .wp-block-video{max-width:none;margin-top:28px}
.case__content .wp-block-video video{width:100%;height:auto;display:block}

/* short layout: every service except Brand Identity (cover → brand info → gallery) */
.case__body--simple{display:block}
.case__content--simple{max-width:none}
.case__content > .case__about{max-width:none}
.case__about{display:grid;grid-template-columns:1fr;gap:16px;padding-bottom:clamp(32px,4vw,56px);margin-bottom:clamp(24px,3vw,40px);border-bottom:1px solid var(--line)}
.case__about-k{color:var(--acid)}
.case__about-t p{font-family:var(--f-display);font-weight:500;font-size:clamp(20px,1.9vw,30px);line-height:1.25;letter-spacing:-.02em;max-width:52ch}
.case__about-t p+p{margin-top:.7em;font-family:var(--f-body);font-weight:400;font-size:clamp(16px,1.2vw,19px);line-height:1.6;color:var(--mute-2);letter-spacing:0}
.case__about-t a{color:var(--acid);text-decoration:underline;text-underline-offset:3px}
.case__content--simple .case-gallery{margin-top:0!important}
@media (min-width:900px){.case__about{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter)}.case__about-k{grid-column:1/span 3}.case__about-t{grid-column:4/span 9}}

/* gallery polish */
.case-gallery{gap:clamp(10px,1.2vw,18px)}
.case-gallery__item{border-radius:4px}
.case-gallery__item img{transition:transform .9s var(--expo),opacity .4s,filter .4s}
.case-gallery:hover .case-gallery__item img{filter:brightness(.72)}
.case-gallery .case-gallery__item:hover img{filter:none}
.case-gallery__item.is-fit{background:#141414}
@media (min-width:1100px){.case__content--simple .case-gallery{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:599px){.case-gallery{gap:8px}.case-gallery__item{border-radius:3px}}
@media (hover:none){.case-gallery:hover .case-gallery__item img{filter:none}}
@media (min-width:900px){
	.case__content--simple .case-gallery__item.is-wide{grid-column:span 2}
	.case__content--simple .case-gallery__item.is-wide:first-child{grid-column:1/-1}
}
@media (min-width:900px) and (max-width:1099px){.case__content--simple .case-gallery__item.is-wide{grid-column:1/-1}}
@media (min-width:1100px){
	.case__content--simple .case-gallery__item.is-wide:not(:first-child){aspect-ratio:16/10;background:#121212}
	.case__content--simple .case-gallery__item.is-wide:not(:first-child) img{height:100%;object-fit:contain}
}