/**
 * Muzammil Case Study Pattern Library
 * Shared front-end/editor styling for reusable portfolio case-study patterns.
 */
:root{--mzcs-bg:#f2efe8;--mzcs-surface:#fbfaf7;--mzcs-surface2:#ebe6dc;--mzcs-ink:#111411;--mzcs-muted:#666b66;--mzcs-line:rgba(17,20,17,.14);--mzcs-black:#101310;--mzcs-green:#21483a;--mzcs-green2:#8dc09a;--mzcs-rose:#e8b7b2;--mzcs-rose2:#f2d9d4;--mzcs-cream:#f4e9d5;--mzcs-orange:#e77245;--mzcs-radius:28px;--mzcs-shadow:0 28px 80px rgba(19,25,21,.10)}
.mz-case-study{box-sizing:border-box;color:var(--mzcs-ink);font-family:inherit;line-height:1.72}
.mz-case-study *{box-sizing:border-box}
.mz-case-study h1,.mz-case-study h2,.mz-case-study h3,.mz-case-study h4{line-height:1.04;letter-spacing:-.045em;margin-top:0}
.mz-case-study h1{font-size:clamp(3.7rem,8.5vw,8.8rem)}
.mz-case-study h2{font-size:clamp(2.55rem,5vw,5.1rem)}
.mz-case-study h3{font-size:clamp(1.35rem,2.25vw,2rem)}
.mz-case-study p{color:var(--mzcs-muted)}
.mz-case-study .eyebrow{display:inline-flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.17em;font-size:.68rem;font-weight:800;color:var(--mzcs-green);margin-bottom:22px}
.mz-case-study .eyebrow:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--mzcs-orange);box-shadow:0 0 0 5px rgba(231,114,69,.12)}
.mz-case-study.hero{position:relative;min-height:88vh;padding:160px max(24px,calc((100vw - 1240px)/2)) 92px;overflow:hidden;background:linear-gradient(112deg,rgba(8,10,8,.99),rgba(18,26,21,.96) 58%,rgba(27,48,38,.94));color:#fff}
.mz-case-study.hero:before{content:"";position:absolute;width:760px;height:760px;right:-150px;top:-130px;border-radius:50%;background:radial-gradient(circle at 38% 36%,rgba(244,233,213,.97) 0 12%,rgba(232,183,178,.93) 13% 30%,rgba(141,192,154,.55) 31% 47%,rgba(255,255,255,.03) 48% 100%);opacity:.92;transform:translate3d(0,var(--mzcs-hero-shift,0),0)}
.mz-case-study.hero>*{position:relative;z-index:2}.mz-case-study.hero h1,.mz-case-study.hero h2,.mz-case-study.hero h3{color:#fff}.mz-case-study.hero h1 span{color:var(--mzcs-rose)}.mz-case-study.hero .lede{color:rgba(255,255,255,.68);font-size:clamp(1.08rem,1.7vw,1.38rem)}
.mz-case-study .hero-grid{gap:70px;align-items:flex-end}.mz-case-study .meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}.mz-case-study .pill{display:inline-block;border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:9px 13px;font-size:.78rem;color:rgba(255,255,255,.76);background:rgba(255,255,255,.05)}
.mz-case-study .hero-card{padding:30px;border:1px solid rgba(255,255,255,.14);border-radius:32px;background:rgba(255,255,255,.075);backdrop-filter:blur(22px)}.mz-case-study .hero-card p{color:rgba(255,255,255,.82)}.mz-case-study .hero-card .big{font-size:clamp(2.8rem,4vw,4.6rem);font-weight:800;line-height:.9;color:#fff}.mz-case-study .hero-card .small{font-size:.63rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mzcs-green2);font-weight:800}
.mz-cs-site-shell{position:fixed;inset:18px 0 auto;z-index:1000;pointer-events:none}.mz-cs-site-nav{width:min(1240px,calc(100% - 36px));margin:auto;min-height:64px;padding:0 10px 0 22px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(14,17,14,.84);backdrop-filter:blur(18px);display:flex;align-items:center;gap:28px;color:#fff;pointer-events:auto}.mz-cs-site-brand{font-weight:800;text-decoration:none;color:#fff}.mz-cs-site-brand i{color:var(--mzcs-rose)}.mz-cs-site-links{display:flex;gap:24px;align-items:center;margin-left:auto}.mz-cs-site-links a{color:rgba(255,255,255,.72);text-decoration:none;font-size:.84rem}.mz-cs-site-cta{background:#fff!important;color:#111!important;padding:10px 17px;border-radius:999px}
.mz-cs-progress-track{position:fixed;left:0;top:0;z-index:1100;width:100%;height:3px;background:rgba(255,255,255,.05)}.mz-cs-progress-bar{height:100%;width:0;background:linear-gradient(90deg,var(--mzcs-rose),var(--mzcs-orange),var(--mzcs-green2))}
.mz-case-study.toc{position:sticky;top:105px}.mz-case-study .mz-cs-toc-title{font-size:.67rem;letter-spacing:.14em;text-transform:uppercase}.mz-case-study .mz-cs-toc-links a{display:flex;justify-content:space-between;text-decoration:none;color:#747b75;padding:8px 0;border-bottom:1px solid rgba(17,20,17,.07);font-size:.78rem}.mz-case-study .mz-cs-toc-links a.active{color:var(--mzcs-ink);padding-left:7px}
.mz-case-study.section-head,.mz-case-study .section-head{margin-bottom:55px}.mz-case-study .section-head,.mz-case-study.section-head>.wp-block-columns{gap:70px}.mz-case-study .intro-grid{gap:70px}.mz-case-study .standfirst{font-size:clamp(1.35rem,2.4vw,2rem);line-height:1.45;letter-spacing:-.03em;color:var(--mzcs-ink)}
.mz-case-study.quote{position:relative;padding:44px 48px;background:var(--mzcs-black);color:#fff;border-radius:30px;overflow:hidden}.mz-case-study.quote:before{content:"“";position:absolute;right:22px;top:-42px;font-size:13rem;font-weight:800;color:rgba(232,183,178,.12);line-height:1}.mz-case-study.quote .mz-cs-quote-text{position:relative;color:#fff;font-size:clamp(1.35rem,2.4vw,2.05rem);font-weight:700;line-height:1.42}.mz-case-study.quote .mz-cs-quote-cite{color:var(--mzcs-green2);font-size:.66rem;text-transform:uppercase;letter-spacing:.13em}
.mz-case-study.metric-grid>.wp-block-columns,.mz-case-study .metric-grid{gap:12px}.mz-case-study.metric,.mz-case-study .metric{position:relative;padding:28px;background:var(--mzcs-surface);border:1px solid var(--mzcs-line);border-radius:26px;overflow:hidden;transition:.35s ease}.mz-case-study.metric:hover,.mz-case-study .metric:hover{transform:translateY(-7px);box-shadow:0 24px 60px rgba(30,39,34,.1)}.mz-case-study .metric .tag,.mz-case-study.metric .tag{font-size:.62rem;text-transform:uppercase;letter-spacing:.13em;font-weight:800;color:var(--mzcs-green)}.mz-case-study .metric .num,.mz-case-study.metric .num{font-size:clamp(2.6rem,4vw,4rem);font-weight:800;line-height:.9;color:var(--mzcs-ink)}
.mz-case-study.diagram-wrap,.mz-case-study .diagram-wrap{position:relative;background:var(--mzcs-black);color:#fff;border-radius:34px;padding:38px;overflow:auto;box-shadow:0 34px 80px rgba(15,19,16,.18)}.mz-case-study.diagram-wrap h3,.mz-case-study .diagram-wrap h3{color:#fff}.mz-case-study.diagram-wrap p,.mz-case-study .diagram-wrap p{color:rgba(255,255,255,.58)}.mz-case-study .diagram-title,.mz-case-study.diagram-wrap .diagram-title{display:flex;justify-content:space-between;gap:30px;align-items:flex-end;margin-bottom:28px}.mz-case-study .mermaid{min-width:700px}
.mz-case-study.timeline,.mz-case-study .timeline{position:relative}.mz-case-study.timeline:before,.mz-case-study .timeline:before{content:"";position:absolute;left:122px;top:4px;bottom:10px;width:1px;background:linear-gradient(var(--mzcs-green),var(--mzcs-rose),rgba(17,20,17,.12))}.mz-case-study .t-item{position:relative;gap:50px}.mz-case-study .t-year{font-weight:800;text-align:right}.mz-case-study .t-year:before{content:"";position:absolute;left:116px;margin-top:7px;width:13px;height:13px;border-radius:50%;background:var(--mzcs-bg);border:3px solid var(--mzcs-orange);box-shadow:0 0 0 7px var(--mzcs-bg)}.mz-case-study .t-body{padding-left:28px}
.mz-case-study.problem-strip{padding:42px;background:var(--mzcs-black);border-radius:34px}.mz-case-study.problem-strip h3,.mz-case-study.problem-strip p{color:#fff}.mz-case-study .kicker{font-size:.62rem;text-transform:uppercase;letter-spacing:.14em;color:var(--mzcs-green2);font-weight:800}
.mz-case-study .stack-card,.mz-case-study.stack-card,.mz-case-study .process-card,.mz-case-study.process-card,.mz-case-study .arch-card,.mz-case-study.arch-card,.mz-case-study .e-card,.mz-case-study .result,.mz-case-study.result,.mz-case-study .lesson,.mz-case-study.lesson{background:var(--mzcs-surface);border:1px solid var(--mzcs-line);border-radius:28px;padding:30px;transition:.35s ease}.mz-case-study .stack-card:hover,.mz-case-study.stack-card:hover,.mz-case-study .process-card:hover,.mz-case-study.process-card:hover,.mz-case-study .arch-card:hover,.mz-case-study.arch-card:hover,.mz-case-study .e-card:hover,.mz-case-study .result:hover,.mz-case-study.result:hover,.mz-case-study .lesson:hover,.mz-case-study.lesson:hover{transform:translateY(-6px);box-shadow:0 24px 60px rgba(22,28,24,.09)}.mz-case-study .label{font-size:.62rem;text-transform:uppercase;letter-spacing:.14em;color:var(--mzcs-orange);font-weight:800}.mz-case-study .mz-cs-card-number,.mz-case-study .mz-cs-lesson-number{font-size:.66rem;letter-spacing:.14em;color:var(--mzcs-orange);font-weight:800}
.mz-case-study .process-grid,.mz-case-study .arch-grid,.mz-case-study .results{gap:14px}.mz-case-study.callout,.mz-case-study .callout{padding:34px 38px;background:linear-gradient(135deg,var(--mzcs-cream),var(--mzcs-rose2));border-radius:28px}.mz-case-study .dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--mzcs-rose);box-shadow:0 0 0 5px rgba(232,183,178,.22);margin-right:10px}
.mz-case-study .principles{width:100%;border-collapse:separate;border-spacing:0;background:var(--mzcs-surface);border:1px solid var(--mzcs-line);border-radius:28px;overflow:hidden}.mz-case-study .principles th,.mz-case-study .principles td{padding:18px 20px;border-bottom:1px solid var(--mzcs-line);text-align:left;vertical-align:top}.mz-case-study .principles th{background:var(--mzcs-surface2);font-size:.65rem;text-transform:uppercase;letter-spacing:.1em}
.mz-case-study .evidence{gap:14px}.mz-case-study .e-card .n{font-size:clamp(2.9rem,4.4vw,4.5rem);font-weight:800;line-height:.9;color:var(--mzcs-ink)}.mz-case-study .e-card .line{height:6px;border-radius:99px;background:#ddd8cf;overflow:hidden}.mz-case-study .e-card .line span{display:block;height:100%;background:linear-gradient(90deg,var(--mzcs-green),var(--mzcs-orange))}.mz-case-study .mz-cs-card-source{font-size:.7rem;color:#8b8f8b}
.mz-case-study.role-band{padding:90px max(24px,calc((100vw - 1240px)/2));background:var(--mzcs-green);color:#fff}.mz-case-study.role-band h2,.mz-case-study.role-band p,.mz-case-study.role-band li{color:#fff}.mz-case-study.role-band .eyebrow{color:var(--mzcs-rose2)}.mz-case-study .mz-cs-role-list{columns:2;gap:36px}
.mz-case-study.image-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:14px}.mz-case-study .mz-cs-image-stack{display:grid;gap:14px}.mz-case-study.image-card,.mz-case-study .image-card{position:relative;min-height:420px;border-radius:32px;overflow:hidden;background:#d6d1c9;box-shadow:var(--mzcs-shadow)}.mz-case-study .image-card.tall{min-height:680px}.mz-case-study.image-card img,.mz-case-study .image-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.78);transition:.7s ease}.mz-case-study.image-card:hover img,.mz-case-study .image-card:hover img{transform:scale(1.06);filter:saturate(1)}.mz-case-study.image-card:after,.mz-case-study .image-card:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 48%,rgba(11,15,12,.76))}.mz-case-study .caption{position:absolute;left:22px;right:22px;bottom:20px;z-index:2;color:rgba(255,255,255,.82);font-size:.72rem}
.mz-case-study .result .value,.mz-case-study.result .value{font-size:clamp(2.5rem,4vw,4rem);font-weight:800;line-height:.9;color:var(--mzcs-green)}.mz-case-study .source{font-size:.72rem;color:#8a8e8a}.mz-case-study .lessons{gap:14px}.mz-case-study.footnote-box,.mz-case-study .footnote-box{padding:25px 28px;background:rgba(255,255,255,.58);border:1px solid var(--mzcs-line);border-radius:22px;font-size:.84rem}
.mz-case-study.sources{padding:80px max(24px,calc((100vw - 1240px)/2));background:#e8e2d8}.mz-case-study .mz-cs-sources-list li{margin-bottom:14px}.mz-case-study .source a{color:inherit}.mz-case-study a{text-underline-offset:4px}
.mz-case-study.mz-cs-closing{padding:80px 0}.mz-case-study .split{gap:60px}
.mz-case-study .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}.mz-case-study .reveal.in,.mz-case-study.reveal.in{opacity:1;transform:none}
@media(max-width:1000px){.mz-case-study .hero-grid,.mz-case-study .intro-grid,.mz-case-study .split,.mz-case-study .role-grid{flex-wrap:wrap}.mz-case-study .metric-grid,.mz-case-study .process-grid,.mz-case-study .arch-grid,.mz-case-study .results{flex-wrap:wrap}.mz-cs-site-links a:not(.mz-cs-site-cta){display:none}.mz-case-study.image-grid{grid-template-columns:1fr}.mz-case-study .mz-cs-role-list{columns:1}}
@media(max-width:700px){.mz-case-study.hero{padding:125px 24px 72px}.mz-case-study.hero:before{width:480px;height:480px;right:-260px;top:40px}.mz-case-study h1{font-size:clamp(3.2rem,16vw,5.2rem)}.mz-case-study.problem-strip,.mz-case-study.diagram-wrap{padding:26px}.mz-case-study .diagram-title{display:block}.mz-case-study.timeline:before,.mz-case-study .timeline:before{left:18px}.mz-case-study .t-year{text-align:left}.mz-case-study .t-year:before{left:12px}.mz-case-study .t-body{padding-left:0}.mz-case-study.image-card,.mz-case-study .image-card{min-height:440px}}
@media(prefers-reduced-motion:reduce){.mz-case-study *{transition:none!important;animation:none!important}.mz-case-study .reveal{opacity:1!important;transform:none!important}}