/* OneCode — Dark Cinematic UI (Offline) */

@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
    --bg:#07070A;
    --bg2:#0B0C10;
    --ink:#EAF0FF;
    --text:rgba(234,240,255,.78);
    --muted:rgba(234,240,255,.62);
    --border:rgba(148,163,184,.18);
    --card:rgba(255,255,255,.04);
    --card2:rgba(255,255,255,.06);

    --accent:#60A5FA;   /* blue glow */
    --accent2:#22C55E;  /* green glow */

    --shadow: 0 22px 80px rgba(0,0,0,.55);
    --shadow2: 0 16px 60px rgba(0,0,0,.42);
    --radius:22px;

    --font:"Vazirmatn",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}

*{box-sizing:border-box}
html{direction:rtl}
body{
    margin:0;
    font-family:var(--font);
    background:radial-gradient(1200px 800px at 70% 10%, rgba(96,165,250,.16), transparent 55%),
    radial-gradient(900px 600px at 20% 35%, rgba(34,197,94,.10), transparent 55%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg2) 60%, #07070A 100%);
    color:var(--text);
    line-height:2;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:none}
img{max-width:100%;height:auto}
.hidden{display:none}
.w-full{width:100%}
.mt-3{margin-top:.75rem}

.oc-container{max-width:1160px;margin:0 auto;padding:0 18px}

/* Header */
.oc-header{
    position:sticky;top:0;z-index:50;
    background:rgba(7,7,10,.62);
    backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(148,163,184,.14);
}
.oc-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}

.oc-brand{display:flex;align-items:center;gap:10px;font-weight:950;color:var(--ink);letter-spacing:.2px}
.oc-brand-dot{
    width:10px;height:10px;border-radius:999px;
    background:linear-gradient(135deg,var(--accent),var(--accent2));
    box-shadow:0 18px 60px rgba(96,165,250,.22), 0 18px 60px rgba(34,197,94,.10);
}

.oc-burger{
    width:44px;height:44px;border-radius:14px;
    border:1px solid rgba(148,163,184,.18);
    background:rgba(255,255,255,.03);
    display:inline-flex;align-items:center;justify-content:center;
    gap:4px;cursor:pointer;
}
.oc-burger span{display:block;width:18px;height:2px;background:rgba(234,240,255,.72);border-radius:2px}

.oc-menu{display:none;align-items:center;gap:14px}
.oc-menu-list{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:18px}
.oc-menu-list a{color:rgba(234,240,255,.72);font-weight:900;font-size:14px}
.oc-menu-list a:hover{color:var(--ink)}

.oc-menu-mobile{
    border-top:1px solid rgba(148,163,184,.14);
    background:rgba(7,7,10,.72);
    padding:14px 0;
}
.oc-menu-mobile-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.oc-menu-mobile-list a{font-weight:950;color:rgba(234,240,255,.76)}

.oc-btn{
    display:inline-flex;align-items:center;justify-content:center;
    padding:12px 16px;border-radius:16px;
    font-weight:950;font-size:14px;letter-spacing:.2px;
    border:1px solid transparent;
    transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease, filter .15s ease;
}
.oc-btn:active{transform:translateY(1px)}
.oc-btn-primary{
    background:linear-gradient(135deg, rgba(96,165,250,1), rgba(37,99,235,1));
    color:#071019;
    box-shadow:0 18px 70px rgba(96,165,250,.25);
}
.oc-btn-primary:hover{filter:saturate(1.05);box-shadow:0 22px 90px rgba(96,165,250,.32)}
.oc-btn-ghost{
    background:rgba(255,255,255,.04);
    color:var(--ink);
    border-color:rgba(148,163,184,.18);
}
.oc-btn-ghost:hover{border-color:rgba(148,163,184,.28);background:rgba(255,255,255,.06)}

/* Hero */
.oc-hero{
    position:relative;
    padding:12px 0 0;
    color:var(--ink);
    overflow:hidden;
}
.oc-hero-bg{
    position:absolute;inset:-2px;
    background-image:linear-gradient(rgba(234,240,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(234,240,255,.06) 1px, transparent 1px);
    background-size:56px 56px;
    mask-image:radial-gradient(420px 300px at 70% 22%, #000 42%, transparent 74%);
    opacity:.55;
    pointer-events:none;
}
.oc-hero-wrap{
    position:relative;
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:22px;
    padding:70px 0 52px;
}
.oc-hero-content{min-width:0}
.oc-hero-panel{min-width:0;display:flex;align-items:flex-end}

.oc-pill{
    display:inline-flex;align-items:center;gap:10px;
    padding:10px 12px;border-radius:999px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(148,163,184,.18);
    color:rgba(234,240,255,.80);
    font-weight:800;font-size:13px;
}
.oc-pill-dot{
    width:8px;height:8px;border-radius:999px;
    background:linear-gradient(135deg,var(--accent),var(--accent2));
    box-shadow:0 18px 60px rgba(96,165,250,.18);
}

.oc-h1{margin:14px 0 0;font-size:60px;line-height:1.06;font-weight:1000;letter-spacing:-.8px}
.oc-gradient-text{
    background:linear-gradient(90deg, rgba(96,165,250,1) 0%, rgba(167,243,208,1) 55%, rgba(96,165,250,1) 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
}
.oc-lead{margin:16px 0 0;max-width:58ch;font-size:16.8px;line-height:2;color:rgba(234,240,255,.70)}
.oc-hero-actions{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}

.oc-metrics{margin-top:26px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.oc-metric{
    padding:12px 14px;border-radius:16px;
    background:rgba(255,255,255,.035);
    border:1px solid rgba(148,163,184,.16);
}
.oc-metric strong{display:block;font-weight:1000;font-size:13.5px;color:rgba(234,240,255,.90)}
.oc-metric span{display:block;color:rgba(234,240,255,.62);font-size:12.5px;margin-top:2px}

/* Panel */
.oc-panel{
    width:100%;
    border-radius:var(--radius);
    background:rgba(255,255,255,.035);
    border:1px solid rgba(148,163,184,.16);
    box-shadow:var(--shadow);
    padding:16px;
}
.oc-panel-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.oc-panel-title{font-weight:1000;letter-spacing:.2px;color:rgba(234,240,255,.92)}
.oc-status{
    font-size:12px;font-weight:1000;
    padding:6px 10px;border-radius:999px;
    background:rgba(34,197,94,.14);
    border:1px solid rgba(34,197,94,.18);
    color:rgba(234,255,245,.92);
}
.oc-steps{display:grid;gap:10px}
.oc-step{
    display:flex;gap:10px;align-items:flex-start;
    padding:10px 12px;border-radius:16px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(148,163,184,.14);
}
.oc-step span{
    width:10px;height:10px;border-radius:999px;margin-top:6px;
    background:rgba(96,165,250,.95);
    box-shadow:0 18px 60px rgba(96,165,250,.20);
}
.oc-step b{display:block;font-weight:1000;color:rgba(234,240,255,.90)}
.oc-step small{display:block;margin-top:2px;color:rgba(234,240,255,.62);font-size:12.5px}

/* Sections */
.oc-section{padding:62px 0}
.oc-muted{background:transparent}
.oc-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap}
.oc-h2{margin:0;font-size:28px;line-height:1.25;font-weight:1000;color:rgba(234,240,255,.92);letter-spacing:-.2px}
.oc-sub{margin:10px 0 0;color:rgba(234,240,255,.60);max-width:64ch}

/* Cards */
.oc-grid4{margin-top:22px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.oc-card{
    display:block;
    border-radius:var(--radius);
    background:rgba(255,255,255,.03);
    border:1px solid rgba(148,163,184,.14);
    padding:18px;
    box-shadow:var(--shadow2);
    transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
}
.oc-card:hover{
    transform:translateY(-2px);
    box-shadow:0 24px 110px rgba(0,0,0,.60);
    border-color:rgba(148,163,184,.22);
    background:rgba(255,255,255,.05);
}
.oc-card-ico{
    width:42px;height:42px;border-radius:14px;
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg, rgba(96,165,250,.14), rgba(34,197,94,.10));
    border:1px solid rgba(96,165,250,.18);
    color:rgba(234,240,255,.92);
    font-weight:1000;
}
.oc-card-title{margin-top:12px;font-weight:1000;color:rgba(234,240,255,.92)}
.oc-card-text{margin-top:6px;color:rgba(234,240,255,.62);font-size:14px;line-height:1.9}

/* Split + bullets */
.oc-split{display:grid;grid-template-columns:1.1fr .9fr;gap:16px;align-items:start}
.oc-bullets{margin-top:18px;display:grid;gap:10px}
.oc-bullet{
    padding:14px 16px;border-radius:18px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(148,163,184,.14);
}
.oc-bullet b{display:block;font-weight:1000;color:rgba(234,240,255,.90)}
.oc-bullet span{display:block;margin-top:4px;color:rgba(234,240,255,.62);font-size:14px}

/* Tags */
.oc-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.oc-tags span{
    padding:8px 10px;border-radius:999px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(148,163,184,.14);
    font-weight:1000;font-size:13px;color:rgba(234,240,255,.74);
}
.oc-note{margin-top:12px;color:rgba(234,240,255,.60);font-size:14px}

/* CTA */
.oc-cta{
    background:radial-gradient(900px 500px at 70% 30%, rgba(96,165,250,.22), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.02) 0%, rgba(255,255,255,.01) 100%);
    border-top:1px solid rgba(148,163,184,.14);
    border-bottom:1px solid rgba(148,163,184,.14);
}
.oc-cta-wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.oc-cta-actions{display:flex;gap:12px;flex-wrap:wrap}

/* Footer */
.oc-footer{
    background:rgba(255,255,255,.02);
    border-top:1px solid rgba(148,163,184,.14);
    padding:48px 0;
}
.oc-footer-top{
    display:flex;
    justify-content:space-between;
    gap:20px;
    flex-wrap:wrap;
    align-items:flex-start;
}
.oc-footer-title{
    font-weight:1000;
    color:rgba(234,240,255,.92);
}
.oc-footer-sub{
    margin-top:6px;
    color:rgba(234,240,255,.62);
    font-weight:800;
}
.oc-footer-menu{
    list-style:none;margin:0;padding:0;
    display:flex;flex-direction:column;gap:10px;
}
.oc-footer-menu a{
    color:rgba(234,240,255,.72);
    font-weight:1000;
    font-size:14px;
}
.oc-footer-menu a:hover{color:rgba(234,240,255,.92)}
.oc-footer-bottom{
    margin-top:22px;
    font-size:14px;
    color:rgba(234,240,255,.55);
    font-weight:800;
}

/* Prose (content for posts/pages/projects) */
.prose{color:rgba(234,240,255,.74)}
.prose h1,.prose h2,.prose h3,.prose h4{color:rgba(234,240,255,.92);line-height:1.35;margin:1.5em 0 .5em}
.prose h1{font-size:2rem}
.prose h2{font-size:1.5rem}
.prose h3{font-size:1.25rem}
.prose p{margin:1em 0}
.prose ul,.prose ol{margin:1em 0;padding-right:1.25rem}
.prose li{margin:.35em 0}
.prose a{color:rgba(96,165,250,.95);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.prose blockquote{
    margin:1.2em 0;
    padding:1rem 1.25rem;
    background:rgba(255,255,255,.03);
    border-right:4px solid rgba(96,165,250,.35);
    border-radius:1rem;
}
.prose code{
    font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
    font-size:.95em;
    background:rgba(255,255,255,.06);
    padding:.15em .35em;
    border-radius:.5rem;
}
.prose pre{
    background:rgba(255,255,255,.04);
    color:rgba(234,240,255,.92);
    border:1px solid rgba(148,163,184,.14);
    padding:1rem 1.25rem;
    border-radius:1rem;
    overflow:auto;
}
.prose pre code{background:transparent;padding:0}

/* Responsive */
@media (max-width: 980px){
    .oc-hero-wrap{grid-template-columns:1fr;gap:16px}
    .oc-hero-panel{display:none}
    .oc-grid4{grid-template-columns:repeat(2,minmax(0,1fr))}
    .oc-split{grid-template-columns:1fr}
    .oc-h1{font-size:48px}
}
@media (max-width: 560px){
    .oc-grid4{grid-template-columns:1fr}
    .oc-h1{font-size:40px}
}
/* Desktop menu */
@media (min-width: 768px){
    .oc-burger{display:none}
    .oc-menu{display:flex}
    .oc-menu-mobile{display:none !important}
}

/* Pagination */
.page-numbers{list-style:none;margin:0;padding:0;display:flex;gap:8px;flex-wrap:wrap}
.page-numbers li{display:block}
.page-numbers a,.page-numbers span{
    display:inline-flex;align-items:center;justify-content:center;
    min-width:40px;height:40px;padding:0 12px;
    border-radius:14px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(148,163,184,.16);
    color:rgba(234,240,255,.78);
    font-weight:950;
}
.page-numbers a:hover{border-color:rgba(148,163,184,.28);background:rgba(255,255,255,.05)}
.page-numbers .current{
    background:linear-gradient(135deg, rgba(96,165,250,1), rgba(37,99,235,1));
    color:#071019;border-color:transparent;
}
@media (max-width: 980px){
    .oc-container > div[style*="grid-template-columns:repeat(3"]{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}
@media (max-width: 560px){
    .oc-container > div[style*="grid-template-columns:repeat(3"]{
        grid-template-columns:1fr !important;
    }
}
/* Cinematic Cover Cards */
.oc-card-cover{
    padding:0;
    overflow:hidden;
}
.oc-cover{
    position:relative;
    aspect-ratio: 16 / 9;
    background: rgba(255,255,255,.03);
    border-bottom:1px solid rgba(148,163,184,.14);
}
.oc-cover img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    filter:saturate(1.05) contrast(1.04);
    transform:scale(1.03);
    transition:transform .35s ease, filter .35s ease;
}
.oc-cover::after{
    content:"";
    position:absolute;
    inset:0;
    background:
            radial-gradient(600px 260px at 70% 20%, rgba(96,165,250,.25), transparent 60%),
            linear-gradient(180deg, rgba(7,7,10,0) 0%, rgba(7,7,10,.65) 100%);
    pointer-events:none;
}
.oc-card:hover .oc-cover img{
    transform:scale(1.08);
    filter:saturate(1.12) contrast(1.06);
}
.oc-card-body{
    padding:16px 18px 18px;
}
.oc-card-meta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    color:rgba(234,240,255,.55);
    font-weight:900;
    font-size:12px;
}
.oc-card-title2{
    margin-top:10px;
    color:rgba(234,240,255,.92);
    font-weight:1000;
    font-size:16px;
    line-height:1.75;
}
.oc-card-text2{
    margin-top:8px;
    color:rgba(234,240,255,.62);
    font-size:14px;
    line-height:1.9;
}
.oc-card-link{
    margin-top:14px;
    color:rgba(96,165,250,.95);
    font-weight:1000;
    font-size:13px;
}
/* Home latest grids responsive */
@media (max-width: 980px){
    .oc-container > div[style*="grid-template-columns:repeat(3"]{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}
@media (max-width: 560px){
    .oc-container > div[style*="grid-template-columns:repeat(3"]{
        grid-template-columns:1fr !important;
    }
}
/* ===== Cinematic Case Study (Single Project) ===== */
.oc-case-hero{position:relative;overflow:hidden;padding:0 0 26px}
.oc-case-hero-bg{position:absolute;inset:0;opacity:.9}
.oc-case-hero-bg img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.08) contrast(1.06)}
.oc-case-hero-overlay{
    position:absolute;inset:0;
    background:
            radial-gradient(900px 520px at 70% 25%, rgba(96,165,250,.28), transparent 62%),
            radial-gradient(900px 520px at 20% 55%, rgba(34,197,94,.12), transparent 62%),
            linear-gradient(180deg, rgba(7,7,10,.35) 0%, rgba(7,7,10,.85) 60%, rgba(7,7,10,1) 100%);
}
.oc-case-hero-inner{position:relative;padding:54px 0 0}
.oc-case-breadcrumb{display:flex;gap:10px;align-items:center;color:rgba(234,240,255,.58);font-weight:900;font-size:13px}
.oc-case-breadcrumb a{color:rgba(234,240,255,.72)}
.oc-case-breadcrumb a:hover{color:rgba(234,240,255,.92)}
.oc-case-title{margin:16px 0 0;font-size:54px;line-height:1.07;font-weight:1000;letter-spacing:-.8px;color:rgba(234,240,255,.95)}
.oc-case-lead{margin:14px 0 0;max-width:62ch;color:rgba(234,240,255,.70);font-size:16.8px;line-height:2}
.oc-case-hero-grid{margin-top:22px;display:grid;grid-template-columns:1.2fr .8fr;gap:16px;align-items:end}
.oc-case-chips{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px}
.oc-chip{
    display:inline-flex;align-items:center;gap:8px;
    padding:8px 10px;border-radius:999px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(148,163,184,.16);
    color:rgba(234,240,255,.72);
    font-weight:1000;font-size:12.5px;
}
.oc-case-roles{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px}
.oc-case-roles span{
    padding:8px 10px;border-radius:999px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(148,163,184,.14);
    color:rgba(234,240,255,.68);
    font-weight:1000;font-size:12.5px;
}
.oc-case-actions{margin-top:18px;display:flex;gap:10px;flex-wrap:wrap}

/* Right snapshot */
.oc-case-mini{
    border-radius:var(--radius);
    background:rgba(255,255,255,.035);
    border:1px solid rgba(148,163,184,.16);
    box-shadow:var(--shadow);
    padding:16px;
}
.oc-case-mini-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.oc-mini-title{font-weight:1000;color:rgba(234,240,255,.92)}
.oc-mini-badge{
    padding:6px 10px;border-radius:999px;
    background:rgba(96,165,250,.14);
    border:1px solid rgba(96,165,250,.18);
    color:rgba(234,240,255,.86);
    font-weight:1000;font-size:12px;
}
.oc-mini-grid{margin-top:14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.oc-mini-item{padding:12px 12px;border-radius:16px;background:rgba(255,255,255,.03);border:1px solid rgba(148,163,184,.14)}
.oc-mini-k{font-size:12px;color:rgba(234,240,255,.55);font-weight:1000}
.oc-mini-v{margin-top:6px;color:rgba(234,240,255,.86);font-weight:1000}
.oc-mini-outcomes{margin-top:12px;display:grid;gap:10px}
.oc-mini-outcome{padding:12px 12px;border-radius:16px;background:rgba(255,255,255,.03);border:1px solid rgba(148,163,184,.14);display:flex;gap:10px;align-items:center}
.oc-mini-outcome-v{min-width:46px;height:34px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(96,165,250,.14);border:1px solid rgba(96,165,250,.18);font-weight:1000;color:rgba(234,240,255,.92)}
.oc-mini-outcome-t{font-weight:1000;color:rgba(234,240,255,.74);font-size:13px}

/* Sticky bar */
.oc-case-sticky{
    position:sticky;top:64px;z-index:40;
    background:rgba(7,7,10,.55);
    backdrop-filter:blur(14px);
    border-top:1px solid rgba(148,163,184,.12);
    border-bottom:1px solid rgba(148,163,184,.12);
}
.oc-case-sticky-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0}
.oc-case-sticky-title{color:rgba(234,240,255,.70);font-weight:1000;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55%}
.oc-case-sticky-actions{display:flex;gap:10px;flex-wrap:wrap}

/* Body */
.oc-case-body{max-width:980px}
.oc-case-head{margin-top:10px}
.oc-case-s2{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.oc-case-block{
    border-radius:var(--radius);
    background:rgba(255,255,255,.03);
    border:1px solid rgba(148,163,184,.14);
    box-shadow:var(--shadow2);
    padding:18px;
}
.oc-case-block-h{display:flex;align-items:center;gap:10px;font-weight:1000;color:rgba(234,240,255,.92)}
.oc-ico{width:30px;height:30px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.03);border:1px solid rgba(148,163,184,.14);color:rgba(234,240,255,.88)}

/* Stack rows */
.oc-case-stack{margin-top:14px}
.oc-case-stack-row{margin-top:14px;display:grid;grid-template-columns:140px 1fr;gap:14px;align-items:start}
.oc-case-stack-k{color:rgba(234,240,255,.62);font-weight:1000;font-size:13px}
.oc-case-stack-tags{display:flex;flex-wrap:wrap;gap:8px}
.oc-case-stack-tags span{
    padding:8px 10px;border-radius:999px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(148,163,184,.14);
    color:rgba(234,240,255,.74);
    font-weight:1000;font-size:12.5px;
}

/* Outcomes grid */
.oc-case-outcomes{margin-top:14px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.oc-case-outcome{
    border-radius:var(--radius);
    background:rgba(255,255,255,.03);
    border:1px solid rgba(148,163,184,.14);
    box-shadow:var(--shadow2);
    padding:18px;
}
.oc-case-outcome-top{display:flex;justify-content:space-between;gap:10px;align-items:center}
.oc-case-outcome-t{font-weight:1000;color:rgba(234,240,255,.92)}
.oc-case-outcome-v{font-weight:1000;color:rgba(96,165,250,.95)}
.oc-case-outcome-d{margin-top:8px;color:rgba(234,240,255,.62);font-size:14px;line-height:1.9}

/* Scope */
.oc-case-scope{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px}
.oc-case-scope span{
    padding:8px 10px;border-radius:999px;
    background:rgba(96,165,250,.10);
    border:1px solid rgba(96,165,250,.14);
    color:rgba(234,240,255,.82);
    font-weight:1000;font-size:12.5px;
}

/* Challenges */
.oc-case-challenges{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.oc-case-challenge{
    border-radius:var(--radius);
    background:rgba(255,255,255,.03);
    border:1px solid rgba(148,163,184,.14);
    box-shadow:var(--shadow2);
    padding:18px;
}
.oc-case-challenge-t{font-weight:1000;color:rgba(234,240,255,.92)}
.oc-case-challenge-d{margin-top:8px;color:rgba(234,240,255,.62);font-size:14px;line-height:1.9}

/* Quote */
.oc-case-quote{
    margin-top:14px;
    border-radius:var(--radius);
    background:radial-gradient(900px 420px at 70% 10%, rgba(96,165,250,.16), transparent 60%),
    rgba(255,255,255,.03);
    border:1px solid rgba(148,163,184,.14);
    box-shadow:var(--shadow2);
    padding:18px;
    position:relative;
    overflow:hidden;
}
.oc-case-quote-mark{
    position:absolute;top:-14px;right:14px;
    font-size:84px;line-height:1;
    color:rgba(234,240,255,.12);
    font-weight:1000;
}
.oc-case-quote-text{color:rgba(234,240,255,.78);font-weight:900;line-height:2}
.oc-case-quote-meta{margin-top:12px;color:rgba(234,240,255,.58);font-weight:1000;font-size:14px;display:flex;gap:8px;align-items:center}
.oc-case-quote-sep{opacity:.6}

/* Gallery */
.oc-case-gallery{margin-top:14px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.oc-case-shot{
    display:block;
    border-radius:18px;
    overflow:hidden;
    border:1px solid rgba(148,163,184,.14);
    background:rgba(255,255,255,.03);
    box-shadow:var(--shadow2);
}
.oc-case-shot img{
    width:100%;
    height:210px;
    object-fit:cover;
    display:block;
    transform:scale(1.02);
    filter:saturate(1.06) contrast(1.04);
    transition:transform .35s ease, filter .35s ease;
}
.oc-case-shot:hover img{transform:scale(1.08);filter:saturate(1.12) contrast(1.06)}

/* Final CTA */
.oc-case-final{
    margin-top:18px;
    border-radius:var(--radius);
    background:radial-gradient(900px 420px at 70% 10%, rgba(96,165,250,.18), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03) 0%, rgba(255,255,255,.02) 100%);
    border:1px solid rgba(148,163,184,.14);
    box-shadow:var(--shadow2);
    padding:18px;
    display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center;
}
.oc-case-final-t{font-weight:1000;color:rgba(234,240,255,.92)}
.oc-case-final-d{margin-top:6px;color:rgba(234,240,255,.62)}
.oc-case-final-right{display:flex;gap:10px;flex-wrap:wrap}

/* Responsive */
@media (max-width: 980px){
    .oc-case-hero-grid{grid-template-columns:1fr}
    .oc-case-hero-right{display:none}
    .oc-case-title{font-size:44px}
    .oc-case-s2{grid-template-columns:1fr}
    .oc-case-outcomes{grid-template-columns:repeat(2,minmax(0,1fr))}
    .oc-case-challenges{grid-template-columns:1fr}
    .oc-case-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
    .oc-case-sticky-title{max-width:42%}
}
@media (max-width: 560px){
    .oc-case-title{font-size:38px}
    .oc-case-outcomes{grid-template-columns:1fr}
    .oc-case-gallery{grid-template-columns:1fr}
    .oc-case-sticky{display:none}
}
/* ===== Case Study polish (override) ===== */
.oc-case-hero{padding-bottom:14px}
.oc-case-hero-inner{padding:62px 0 0}
.oc-case-title{font-size:58px}
.oc-case-lead{max-width:70ch}

.oc-case-hero-fallback{
    width:100%;height:100%;
    background:
            radial-gradient(900px 520px at 70% 25%, rgba(96,165,250,.18), transparent 62%),
            radial-gradient(900px 520px at 20% 55%, rgba(34,197,94,.10), transparent 62%),
            rgba(255,255,255,.02);
}

/* Chips more premium */
.oc-chip{
    background:rgba(255,255,255,.035);
    border-color:rgba(148,163,184,.14);
    color:rgba(234,240,255,.78);
}
.oc-chip:hover{border-color:rgba(148,163,184,.24)}

/* Body width + spacing */
.oc-case-body{max-width:980px}
.oc-case-s2{margin-top:18px}
.oc-case-block{padding:20px}
.oc-case-outcome{padding:20px}
.oc-case-challenge{padding:20px}

/* Stack -> better layout */
.oc-case-stack-row{grid-template-columns:120px 1fr}
.oc-case-stack-k{opacity:.9}

/* Gallery shots premium */
.oc-case-shot img{height:240px}

/* Sticky bar: slimmer */
.oc-case-sticky-inner{padding:8px 0}
.oc-case-sticky-title{color:rgba(234,240,255,.62)}

/* Better typography inside prose */
.prose{color:rgba(234,240,255,.74)}
.prose h2,.prose h3{color:rgba(234,240,255,.92)}
.prose a{color:rgba(96,165,250,.95)}
.prose p{line-height:2.05}

/* Responsive tweaks */
@media (max-width: 980px){
    .oc-case-title{font-size:46px}
    .oc-case-hero-inner{padding-top:54px}
}
@media (max-width: 560px){
    .oc-case-title{font-size:38px}
}
