/* work-olivecore-flagship.css v1.4 - 2nd Aug 2026
   Drop-in styles for /our-works/olivecore-flagship.
   All interface imagery is assembled from genuine olivecore.net browser captures. */

/* Shared case-study primitives used on existing neo optic work pages. */
.phead{padding:clamp(64px,10vh,120px) 0 clamp(38px,6vh,72px)}
.bp-crumb{font-family:var(--fm);font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.bp-crumb a{color:var(--brand-text,var(--brand));text-decoration:none}
.fq-btn{display:inline-flex;align-items:center;gap:.55em;padding:13px 26px;border-radius:999px;background:var(--brand);color:#fff;font-weight:750;text-decoration:none;transition:transform .2s,box-shadow .2s,background .2s}
.fq-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px color-mix(in srgb,var(--brand) 35%,transparent)}
.wd-ctarow{display:flex;align-items:center;gap:12px 18px;flex-wrap:wrap;margin-top:30px}
.wd-ticks{font-family:var(--fm);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:20px}
.wd-ticks i{font-style:normal;color:var(--brand-text,var(--brand));margin:0 .42em 0 1em}
.wd-ticks i:first-child{margin-left:0}
.bp-take{border:1px solid color-mix(in srgb,var(--brand) 35%,var(--line));border-radius:18px;background:linear-gradient(155deg,color-mix(in srgb,var(--brand) 7%,var(--card)),var(--card) 62%);padding:clamp(24px,4vw,42px);margin:0}
.bp-take b{display:block;font-family:var(--fm);font-size:.67rem;letter-spacing:.18em;text-transform:uppercase;color:var(--brand-text,var(--brand));margin-bottom:12px}
.bp-take p{font-size:clamp(1.22rem,2.1vw,1.75rem);line-height:1.42;color:var(--ink);max-width:48ch}
.bp-next{margin-top:24px;display:flex;flex-wrap:wrap;gap:12px}
.bp-next a{font-family:var(--fm);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--brand-text,var(--brand));border:1px solid var(--line-dk);border-radius:999px;padding:10px 16px;text-decoration:none;transition:border-color .25s,transform .2s,background .2s}
.bp-next a:hover{border-color:var(--brand);background:var(--brand-soft);transform:translateY(-1px)}

/* Page variables and global rhythm. */
.ocf-page{
  --ocf-deep:#10101a;
  --ocf-deep-2:#111c23;
  --ocf-paper:#f5f1eb;
  --ocf-olive:#8e9f49;
  --ocf-copper:#a76555;
  --ocf-blue:#397b99;
  --ocf-green:#2fd17b;
}
.ocf-page .sec{overflow:clip}
.ocf-page figure{margin:0}
.ocf-page figure img{display:block;width:100%;height:auto}
.ocf-page .disp .acc{color:var(--brand-text,var(--brand))}
.ocf-section-head{max-width:1050px;margin-bottom:clamp(36px,5vw,64px)}
.ocf-section-head .eyebrow{margin-bottom:18px}
.ocf-section-head h2{font-size:clamp(2.65rem,6.1vw,6.2rem);max-width:15ch}
.ocf-section-head--wide{max-width:1260px}
.ocf-section-head--wide h2{max-width:18ch}
.ocf-section-head .sec-lede{margin-top:24px;max-width:66ch;font-size:clamp(1.02rem,1.35vw,1.25rem);line-height:1.7}
.ocf-copy .eyebrow{margin-bottom:18px}
.ocf-copy h2{font-size:clamp(2.35rem,5vw,5.1rem);line-height:.96;margin-bottom:28px}
.ocf-copy>p{color:var(--muted);font-size:clamp(1rem,1.18vw,1.14rem);line-height:1.78;margin-bottom:1.25em;max-width:58ch}
.ocf-copy>p strong{color:var(--ink)}
.ocf-split{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);gap:clamp(34px,6vw,96px);align-items:center}
.ocf-split--copy-first{grid-template-columns:minmax(340px,.82fr) minmax(0,1.18fr)}
.ocf-dark{background:linear-gradient(145deg,var(--ocf-deep),var(--ocf-deep-2));color:#f6f1f7}
.ocf-dark .eyebrow{color:#d6cddd}
.ocf-dark .eyebrow::before{background:#e56eb6}
.ocf-dark .ocf-copy>p,.ocf-dark .sec-lede{color:#c0b7c6}
.ocf-dark .ocf-copy>p strong{color:#fff}
.ocf-dark .acc{color:#b9ca69}
.ocf-dark .disp{color:#f7f2f8}

/* Hero. */
.ocf-hero{position:relative;overflow:hidden;background:
  radial-gradient(circle at 78% 14%,color-mix(in srgb,var(--brand) 12%,transparent),transparent 32%),
  radial-gradient(circle at 16% 80%,color-mix(in srgb,#7e9343 12%,transparent),transparent 28%)}
.ocf-hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.42;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(90deg,#000,transparent 78%)}
.ocf-hero .wrap{position:relative;z-index:1;max-width:1600px}
.ocf-hero-grid{display:grid;grid-template-columns:minmax(340px,.7fr) minmax(0,1.3fr);grid-template-areas:"copy figure" "proof proof";gap:clamp(28px,4vw,66px) clamp(34px,5vw,78px);align-items:center;margin-top:30px}
.ocf-hero-copy{grid-area:copy;padding:clamp(8px,2vw,28px) 0}
.ocf-hero-copy .eyebrow{margin-bottom:20px}
.ocf-hero-copy h1{font-size:clamp(3.3rem,7vw,7.4rem);line-height:.84;max-width:8ch}
.ocf-hero-copy h1 .acc{display:block;color:var(--brand);font-size:.88em;line-height:.92;margin-top:.1em}
.ocf-hero-lede{font-size:clamp(1.03rem,1.35vw,1.26rem);line-height:1.7;color:var(--muted);max-width:55ch;margin-top:28px}
.ocf-hero-lede strong{color:var(--ink)}
.ocf-hero-lede a{color:var(--brand-text,var(--brand));font-weight:700;text-underline-offset:3px}
.ocf-secondary{display:inline-flex;align-items:center;gap:.55em;padding:12px 2px;color:var(--brand-text,var(--brand));font-family:var(--fm);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--brand) 55%,transparent)}
.ocf-secondary:hover{border-bottom-color:var(--brand)}

.ocf-proofline{grid-area:proof;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:9px 28px;margin-top:-6px;font-family:var(--fm);font-size:.67rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.ocf-proofline span{display:inline-flex;align-items:center;gap:.65em;white-space:nowrap}
.ocf-proofline i{font-style:normal;color:var(--brand-text,var(--brand));font-size:.9rem;line-height:1}
.ocf-hero-figure{grid-area:figure;position:relative;border-radius:18px;overflow:hidden;border:1px solid color-mix(in srgb,var(--brand) 22%,var(--line));box-shadow:0 42px 100px -46px rgba(24,14,31,.72),0 20px 54px -34px color-mix(in srgb,var(--brand) 68%,transparent);transform:rotate(.45deg)}
.ocf-hero-figure::after{content:"REAL CAPTURES / SHARED CONTENT / SEVEN THEMES";position:absolute;left:18px;bottom:16px;padding:8px 11px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(12,11,19,.72);color:#f8edf6;font:650 .55rem var(--fm);letter-spacing:.13em;text-transform:uppercase;backdrop-filter:blur(8px)}

/* Brief and facts. */
.ocf-intro{background:var(--bg)}
.ocf-prose-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:clamp(34px,6vw,100px);align-items:start}
.ocf-prose p{color:var(--muted);font-size:clamp(1.03rem,1.25vw,1.2rem);line-height:1.82;margin-bottom:1.3em;max-width:64ch}
.ocf-brief-note{position:relative;padding:clamp(26px,3.2vw,42px);border:1px solid var(--line-dk);border-radius:18px;background:var(--card);box-shadow:0 24px 70px -48px rgba(25,14,31,.65)}
.ocf-brief-note::before{content:"";position:absolute;left:0;top:0;width:72px;height:4px;background:var(--brand)}
.ocf-brief-note b{display:block;font-family:var(--fm);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-text,var(--brand));margin-bottom:16px}
.ocf-brief-note p{font-family:var(--fa);font-style:italic;font-size:clamp(1.35rem,2.2vw,2rem);line-height:1.38;color:var(--ink)}
.ocf-kpis{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-dk);border-bottom:1px solid var(--line-dk);margin-top:clamp(42px,6vw,78px)}
.ocf-kpis>div{padding:clamp(24px,3.2vw,42px);border-right:1px solid var(--line)}
.ocf-kpis>div:last-child{border-right:0}
.ocf-kpis dt{font-family:var(--fd);font-weight:850;font-size:clamp(2.5rem,5vw,5rem);line-height:.82;letter-spacing:-.06em;color:var(--ink)}
.ocf-kpis>div:nth-child(2) dt,.ocf-kpis>div:nth-child(4) dt{color:var(--brand)}
.ocf-kpis dd{margin-top:14px;font-family:var(--fm);font-size:.67rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}

/* Figures and diagrams. */
.ocf-diagram,.ocf-wide-card,.ocf-wide-figure,.ocf-qa-figure{position:relative;overflow:hidden;border:1px solid color-mix(in srgb,var(--brand) 18%,var(--line));background:var(--card);box-shadow:0 32px 80px -54px rgba(25,15,32,.75)}
.ocf-diagram,.ocf-wide-card{border-radius:18px}
.ocf-wide-figure,.ocf-qa-figure{border-radius:22px}
.ocf-diagram figcaption,.ocf-wide-figure figcaption{padding:13px 16px;background:var(--card);border-top:1px solid var(--line);font-family:var(--fm);font-size:.62rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);line-height:1.55}
.ocf-dark .ocf-diagram{border-color:#393342;background:#15121c;box-shadow:0 34px 90px rgba(0,0,0,.26)}
.ocf-dark .ocf-diagram figcaption{background:#15121c;border-color:#393342;color:#aaa0b2}
.ocf-themes{background:color-mix(in srgb,var(--brand) 3%,var(--bg))}
.ocf-wide-figure img{background:#f5f1eb}
.ocf-matrix-section{background:var(--bg)}

/* Checklist. */
.ocf-checklist{list-style:none;padding:0;margin:30px 0 0;display:grid;gap:0;border-top:1px solid var(--line-dk)}
.ocf-checklist li{position:relative;padding:16px 10px 16px 36px;border-bottom:1px solid var(--line);color:var(--muted);line-height:1.55}
.ocf-checklist li::before{content:"+";position:absolute;left:4px;top:15px;color:var(--brand-text,var(--brand));font:700 1rem var(--fm)}

/* QA. */
.ocf-qa-section{background:
  radial-gradient(circle at 12% 18%,rgba(185,57,136,.17),transparent 30%),
  radial-gradient(circle at 90% 78%,rgba(91,130,74,.14),transparent 31%),
  linear-gradient(145deg,#11101b,#101a21)}
.ocf-qa-figure{border-color:#3c3443;background:#111018;box-shadow:0 48px 120px rgba(0,0,0,.35)}
.ocf-qa-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,.75fr);gap:clamp(34px,6vw,90px);align-items:start;margin-top:clamp(42px,6vw,76px)}
.ocf-qa-copy h3{font-size:clamp(1.65rem,2.7vw,2.6rem);line-height:1.08;margin-bottom:20px;color:#fff}
.ocf-qa-copy p{color:#bdb4c3;line-height:1.78;margin-bottom:1.2em;max-width:60ch}
.ocf-qa-copy strong{color:#fff}
.ocf-run-facts{display:grid;grid-template-columns:1fr 1fr;border:1px solid #3e3646;border-radius:18px;overflow:hidden;background:rgba(255,255,255,.025)}
.ocf-run-facts>div{padding:clamp(22px,3vw,34px);border-right:1px solid #3e3646;border-bottom:1px solid #3e3646}
.ocf-run-facts>div:nth-child(even){border-right:0}
.ocf-run-facts>div:nth-child(n+3){border-bottom:0}
.ocf-run-facts dt{font-weight:850;font-size:clamp(1.65rem,3vw,3rem);line-height:1;color:#fff;letter-spacing:-.04em}
.ocf-run-facts>div:nth-child(2) dt,.ocf-run-facts>div:nth-child(3) dt{color:#b9ca69}
.ocf-run-facts dd{margin-top:10px;font-family:var(--fm);font-size:.64rem;letter-spacing:.11em;text-transform:uppercase;color:#a79dad}

/* Review and performance. */
.ocf-review-section{background:var(--bg)}
.ocf-quote{margin-top:30px;padding:22px 0 22px 24px;border-left:4px solid var(--brand);font-family:var(--fa);font-style:italic;font-size:clamp(1.25rem,2vw,1.75rem);line-height:1.42;color:var(--ink);max-width:43ch}
.ocf-performance-section{background:color-mix(in srgb,var(--brand) 4%,var(--bg))}
.ocf-performance-section .ocf-wide-card{align-self:center}

/* Mobile proof. */
.ocf-mobile-section{background:linear-gradient(180deg,var(--ocf-deep),#131d23);color:#f8f3f9}
.ocf-mobile-section .eyebrow{color:#d4cbd9}
.ocf-mobile-section .eyebrow::before{background:#e36eb5}
.ocf-mobile-section .disp{color:#fff}
.ocf-mobile-section .acc{color:#b8c96a}
.ocf-mobile-section .sec-lede{color:#bfb6c5}
.ocf-mobile-section .ocf-wide-figure{border-color:#3b3542;background:#111019}
.ocf-mobile-section .ocf-wide-figure figcaption{background:#111019;border-color:#3b3542;color:#aaa1b0}

/* Outcomes. */
.ocf-outcome-section{background:var(--bg)}
.ocf-outcomes{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line-dk);border-bottom:1px solid var(--line-dk)}
.ocf-outcomes article{position:relative;padding:clamp(26px,3.4vw,44px);border-right:1px solid var(--line);min-height:280px;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--brand) 3%,transparent));transition:background .3s,transform .3s var(--ease)}
.ocf-outcomes article:last-child{border-right:0}
.ocf-outcomes article:hover{background:var(--brand-soft);transform:translateY(-5px)}
.ocf-outcomes span{font-family:var(--fm);font-size:.65rem;letter-spacing:.14em;color:var(--brand-text,var(--brand))}
.ocf-outcomes h3{font-size:clamp(1.25rem,1.8vw,1.65rem);line-height:1.08;margin:48px 0 16px;max-width:13ch}
.ocf-outcomes p{color:var(--muted);font-size:.95rem;line-height:1.65}

/* Live result and close. */
.ocf-live-section{background:var(--ocf-paper);color:#241c29}
[data-theme=dark] .ocf-live-section{background:#211a26;color:#f4eef6}
.ocf-live-grid{display:grid;grid-template-columns:minmax(320px,.68fr) minmax(0,1.32fr);gap:clamp(34px,6vw,88px);align-items:center}
.ocf-live-section .ocf-copy>p{color:#6d626f}
[data-theme=dark] .ocf-live-section .ocf-copy>p{color:#b7abbc}
.ocf-live-section .ocf-copy>p strong{color:inherit}
.ocf-live-section .fq-btn{margin-top:14px}
.ocf-closing{padding-top:clamp(68px,8vw,108px);padding-bottom:clamp(78px,9vw,120px)}
.ocf-closing .wrap{max-width:1120px}

/* Dark theme refinements for light surfaces. */
[data-theme=dark] .ocf-hero::before{opacity:.22}
[data-theme=dark] .ocf-brief-note,[data-theme=dark] .ocf-diagram,[data-theme=dark] .ocf-wide-card,[data-theme=dark] .ocf-wide-figure{box-shadow:0 30px 80px -54px rgba(0,0,0,.92)}
[data-theme=dark] .ocf-themes,[data-theme=dark] .ocf-performance-section{background:color-mix(in srgb,var(--brand) 6%,var(--bg))}
[data-theme=dark] .ocf-brief-note::before{background:var(--brand)}
[data-theme=dark] .ocf-kpis dt{color:var(--ink)}

/* Responsive. */
@media(max-width:1180px){
  .ocf-hero-grid{grid-template-columns:minmax(300px,.8fr) minmax(0,1.2fr)}
  .ocf-hero-copy h1{font-size:clamp(3.1rem,6.4vw,5.8rem)}
  .ocf-outcomes{grid-template-columns:1fr 1fr}
  .ocf-outcomes article:nth-child(2){border-right:0}
  .ocf-outcomes article:nth-child(-n+2){border-bottom:1px solid var(--line)}
}
@media(max-width:960px){
  .ocf-hero-grid{grid-template-areas:"copy" "proof" "figure"}
  .ocf-hero-grid,.ocf-split,.ocf-split--copy-first,.ocf-qa-grid,.ocf-live-grid,.ocf-prose-grid{grid-template-columns:1fr}
  .ocf-hero-copy{max-width:820px}
  .ocf-hero-copy h1{font-size:clamp(3.2rem,10vw,6.3rem);max-width:9ch}
  .ocf-hero-figure{margin-top:12px;transform:none}
  .ocf-split .ocf-diagram,.ocf-split .ocf-wide-card{order:2}
  .ocf-split--copy-first .ocf-copy{order:1}
  .ocf-split--copy-first .ocf-diagram{order:2}
  .ocf-kpis{grid-template-columns:1fr 1fr}
  .ocf-kpis>div:nth-child(2){border-right:0}
  .ocf-kpis>div:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .ocf-qa-grid{margin-top:40px}
  .ocf-run-facts{max-width:720px}
}
@media(max-width:680px){
  .phead.ocf-hero{padding-top:54px}
  .ocf-hero-grid{margin-top:22px}
  .ocf-hero-copy h1{font-size:clamp(3rem,15vw,4.8rem)}
  .ocf-hero-lede{font-size:1rem}
  .ocf-hero-figure{border-radius:12px}
  .ocf-hero-figure::after{display:none}
  .wd-ctarow{align-items:stretch}
  .fq-btn,.ocf-secondary{justify-content:center;width:100%}
  .ocf-proofline{display:grid;grid-template-columns:1fr;justify-content:stretch;gap:8px;margin-top:4px;line-height:1.45}
  .ocf-proofline span{white-space:normal}
  .ocf-section-head h2,.ocf-copy h2{font-size:clamp(2.4rem,12vw,4rem)}
  .ocf-kpis{grid-template-columns:1fr}
  .ocf-kpis>div{border-right:0!important;border-bottom:1px solid var(--line)}
  .ocf-kpis>div:last-child{border-bottom:0}
  .ocf-kpis dt{font-size:3.2rem}
  .ocf-diagram,.ocf-wide-card,.ocf-wide-figure,.ocf-qa-figure{border-radius:11px}
  .ocf-diagram figcaption,.ocf-wide-figure figcaption{font-size:.56rem}
  .ocf-run-facts{grid-template-columns:1fr}
  .ocf-run-facts>div{border-right:0!important;border-bottom:1px solid #3e3646!important}
  .ocf-run-facts>div:last-child{border-bottom:0!important}
  .ocf-outcomes{grid-template-columns:1fr}
  .ocf-outcomes article{border-right:0!important;border-bottom:1px solid var(--line)!important;min-height:0}
  .ocf-outcomes article:last-child{border-bottom:0!important}
  .ocf-outcomes h3{margin-top:30px}
  .bp-next{display:grid}
  .bp-next a{text-align:center}
}

@media(prefers-reduced-motion:reduce){
  .fq-btn,.ocf-outcomes article,.bp-next a{transition:none}
  .fq-btn:hover,.ocf-outcomes article:hover,.bp-next a:hover{transform:none}
  .ocf-hero-figure{transform:none}
}
