.kh-case { --kh-ink:#121611; --kh-muted:#50584e; --kh-line:#d6dbd0; color:var(--kh-ink); }
.kh-case main { overflow:visible; overflow-wrap:anywhere; }
.kh-case main * { min-width:0; }
.kh-case .kh-wrap { width:min(1240px,calc(100% - 64px)); margin-inline:auto; }
.kh-case h1,.kh-case h2,.kh-case h3 { font-family:Inter,sans-serif; color:inherit; }
.kh-case .kh-kicker { font-size:.76rem; letter-spacing:.13em; text-transform:uppercase; font-weight:750; color:#315420; margin:0 0 1.2rem; }
.kh-case .kh-hero { padding:3rem 0 4rem; display:grid; grid-template-columns:1.02fr 1fr; align-items:center; gap:3.5rem; }
.kh-case .kh-hero h1 { font-size:clamp(2.6rem,4.7vw,4.6rem); line-height:1.04; letter-spacing:-.065em; margin:0 0 1.5rem; max-width:13ch; }
.kh-case .kh-hero h1 em { font-style:normal; color:#315420; }
.kh-case .kh-lead { font-size:1.12rem; line-height:1.7; max-width:56ch; color:var(--kh-muted); }
.kh-case .kh-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem 1.4rem; margin-top:1.75rem; }
.kh-case .kh-actions a { min-height:44px; display:inline-flex; align-items:center; gap:.75rem; }
.kh-case .kh-button { background:#141811; border:1px solid #141811; color:#fff; padding:.9rem 1.3rem; border-radius:7px; font-weight:650; text-decoration:none; }
.kh-case .kh-button:hover { background:#315420; }
.kh-case .kh-link { color:inherit; text-decoration:underline; text-underline-offset:5px; }
.kh-case a:focus-visible,.kh-case summary:focus-visible,.kh-case [tabindex="0"]:focus-visible { outline:3px solid #315420; outline-offset:5px; }
.kh-case .kh-hero-media { margin:0; padding:2rem 1.25rem 1.25rem; border:1px solid #d6dbd0; background:#e9eddf; border-radius:14px; }
.kh-case .kh-browser { border:1px solid #c3c9bc; border-radius:8px; overflow:hidden; background:white; box-shadow:0 20px 40px #16250912; }
.kh-case .kh-browser-bar { display:flex; align-items:center; gap:1rem; padding:.65rem .85rem; font-size:.73rem; color:#4a5246; background:#fcfcfa; border-bottom:1px solid #d6dbd0; overflow-wrap:anywhere; }
.kh-case .kh-browser-bar span { letter-spacing:.1em; color:#7f887a; }
.kh-case .kh-browser img { width:100%; height:auto; display:block; }
.kh-case .kh-hero-media figcaption { display:flex; flex-wrap:wrap; gap:.55rem; margin:1.3rem 0 .1rem; font-size:.76rem; font-weight:650; }
.kh-case .kh-hero-media figcaption span { padding:.4rem .65rem; background:#f9faf5; border:1px solid #c8cfbe; border-radius:4px; }
.kh-case .kh-stats { display:grid; grid-template-columns:repeat(4,1fr); margin:0; border-top:1px solid var(--kh-line); border-bottom:1px solid var(--kh-line); }
.kh-case .kh-stats>div { padding:1.8rem 1.5rem; border-right:1px solid var(--kh-line); }
.kh-case .kh-stats>div:first-child { padding-left:0; }.kh-case .kh-stats>div:last-child { border:0; }
.kh-case .kh-stats dt { font-size:.86rem; font-weight:600; }.kh-case .kh-stats dd { margin:.4rem 0 0; font-size:clamp(2rem,3vw,3rem); line-height:1.2; font-weight:750; letter-spacing:-.05em; }
.kh-case .kh-stats small { display:block; margin-top:.6rem; font-size:.75rem; font-weight:400; letter-spacing:normal; line-height:1.5; color:var(--kh-muted); }
.kh-case .kh-jump { display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; padding:1.5rem 0; border-bottom:1px solid var(--kh-line); }
.kh-case .kh-jump a { display:flex; align-items:center; min-height:44px; font-size:.88rem; font-weight:650; text-decoration:underline; text-underline-offset:4px; color:#315420; }
.kh-case .kh-section { padding-block:5.5rem; scroll-margin-top:1rem; }
.kh-case .kh-section+.kh-section { border-top:1px solid var(--kh-line); }
.kh-case .kh-heading { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:end; margin-bottom:2.5rem; }
.kh-case .kh-heading h2,.kh-case .kh-crm h2 { font-size:clamp(2rem,3.1vw,3rem); letter-spacing:-.055em; line-height:1.12; margin:0; max-width:19ch; }
.kh-case .kh-heading p:last-child { line-height:1.75; color:var(--kh-muted); margin:0; }
.kh-case .kh-story { display:grid; grid-template-columns:1fr 1fr; gap:4rem; }
.kh-case .kh-story h2 { font-size:clamp(1.8rem,2.4vw,2.5rem); line-height:1.16; letter-spacing:-.04em; margin:0 0 1rem; }
.kh-case .kh-story p { line-height:1.8; color:var(--kh-muted); }
.kh-case .kh-scope { margin:0; }.kh-case .kh-scope>div { padding:1.05rem 0; border-bottom:1px solid var(--kh-line); }.kh-case .kh-scope dt { font-weight:700; display:flex; align-items:baseline; gap:1rem; }.kh-case .kh-scope dd { margin:.3rem 0 0 3.4rem; color:var(--kh-muted); font-size:.9rem; line-height:1.6; }.kh-case .kh-scope b { color:#315420; font-size:.8rem; flex:0 0 2.4rem; }
.kh-case .kh-duo { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.kh-case .kh-shot { margin:0; min-width:0; }.kh-case .kh-shot img { width:100%; height:auto; display:block; border:1px solid var(--kh-line); border-radius:8px; background:#fff; }
.kh-case .kh-shot figcaption { margin-top:1rem; color:var(--kh-muted); line-height:1.65; font-size:.88rem; }
.kh-case .kh-shot h3 { color:var(--kh-ink); font-size:1.15rem; letter-spacing:-.025em; margin:0 0 .4rem; }
.kh-case .kh-shot figcaption p { margin:.4rem 0; }.kh-case .kh-shot a.kh-link { display:inline-flex; align-items:center; min-height:44px; font-size:.83rem; }
.kh-case .kh-note { font-size:.83rem; line-height:1.7; color:var(--kh-muted); max-width:95ch; margin:1.25rem 0; }
.kh-case .kh-table-wrap { overflow-x:auto; border:1px solid var(--kh-line); border-radius:8px; margin:1.5rem 0; background:#fff; }
.kh-case table { width:100%; border-collapse:collapse; font-size:.9rem; text-align:left; margin:0; }.kh-case caption { text-align:left; padding:1.2rem; font-size:.8rem; font-weight:650; color:#315420; background:#f0f3e9; }
.kh-case th,.kh-case td { padding:1.1rem 1.2rem; border-bottom:1px solid #e2e5dd; line-height:1.6; vertical-align:top; }.kh-case th { font-weight:650; }.kh-case th[scope="col"] { font-size:.8rem; }.kh-case td { white-space:nowrap; }.kh-case tr:last-child>* { border-bottom:0; }.kh-case th span { display:block; font-weight:400; font-size:.78rem; color:var(--kh-muted); }.kh-case table a { color:#315420; text-underline-offset:4px; }
.kh-case .kh-proof { margin-top:2rem; }.kh-case .kh-proof>summary,.kh-case .kh-gallery>summary { padding:1.1rem 0; cursor:pointer; font-weight:650; font-size:.94rem; border-top:1px solid var(--kh-line); border-bottom:1px solid var(--kh-line); }.kh-case .kh-proof[open]>summary,.kh-case .kh-gallery[open]>summary { margin-bottom:1.5rem; }
.kh-case .kh-proof-grid { display:grid; grid-template-columns:1fr 1fr; gap:2.5rem 1.5rem; }
.kh-case .kh-crm { background:#172013; color:#fff; padding:5rem 0; }
.kh-case .kh-crm .kh-kicker { color:#b4e678; }.kh-case .kh-crm .kh-wrap { display:grid; grid-template-columns:1.1fr .9fr; align-items:center; gap:5rem; }
.kh-case .kh-crm p { line-height:1.8; color:#d0d7cb; }.kh-case .kh-crm-flow { list-style:none; padding:0; margin:2rem 0; display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }.kh-case .kh-crm-flow li { border-top:1px solid #65725c; padding-top:1rem; }.kh-case .kh-crm-flow strong { display:block; margin-bottom:.4rem; font-size:1.05rem; }.kh-case .kh-crm-flow span { color:#d0d7cb; font-size:.87rem; line-height:1.7; display:block; }
.kh-case .kh-phone-figure { margin:0 auto; max-width:350px; width:100%; }.kh-case .kh-phone { padding:1rem; border:5px solid #637256; border-radius:32px; background:#f4f6f8; color:#172034; box-shadow:0 24px 70px #0004; }.kh-case .kh-phone-notch { height:6px; background:#172034; width:52px; margin:.2rem auto 1.3rem; border-radius:6px; }.kh-case .kh-phone p { color:#465269; line-height:1.5; margin:.5rem 0; font-size:.83rem; }.kh-case .kh-phone small { color:#465269; font-size:.75rem; }.kh-case .kh-phone h3 { margin:.3rem 0 1rem; font-size:1.4rem; color:#172034; }
.kh-case .kh-phone-address { background:#fff; border:1px solid #c9d0da; padding:.8rem; border-radius:7px; }.kh-case .kh-phone-label { background:#172034; color:white; padding:.8rem; margin:1rem 0; text-align:center; border-radius:7px; font-weight:650; font-size:.83rem; }
.kh-case .kh-phone-steps { display:grid; grid-template-columns:1fr 1fr; padding:0; margin:1.3rem 0; gap:.75rem; list-style:none; font-size:.78rem; }.kh-case .kh-phone-steps li { padding:.6rem; background:#fff; border:1px solid #c9d0da; border-radius:5px; }
.kh-case .kh-phone-dossier { border:1px solid #c9d0da; padding:1rem; background:white; border-radius:8px; }.kh-case .kh-phone-dossier strong { font-size:.94rem; }.kh-case .kh-phone-files { display:grid; gap:.4rem; margin-top:.8rem; }.kh-case .kh-phone-files span { font-size:.8rem; padding:.7rem; border:1px dashed #738198; border-radius:5px; }
.kh-case .kh-phone-nav { border-top:1px solid #c9d0da; padding-top:1rem; margin-top:1.2rem; display:flex; flex-wrap:wrap; gap:.8rem; font-size:.75rem; color:#465269; }.kh-case .kh-phone-figure figcaption { color:#d0d7cb; font-size:.77rem; line-height:1.7; margin-top:1rem; text-align:center; }
.kh-case .kh-creative-columns { display:grid; grid-template-columns:1fr 1fr; gap:2rem; }.kh-case .kh-creative-columns h3 { font-size:1.35rem; margin:0 0 1.2rem; }.kh-case .kh-creative-columns .kh-shot { margin-bottom:1.2rem; }.kh-case .kh-creative-columns .kh-shot img { border:0; border-radius:8px; }.kh-case .kh-gallery-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem 1rem; }.kh-case .kh-gallery-grid figcaption { margin-top:.6rem; font-size:.8rem; }
.kh-case .kh-final { border:1px solid #cad5bc; border-radius:12px; background:#e7f1d9; padding:3rem; display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center; margin:1rem auto 5rem; }.kh-case .kh-final h2 { font-size:clamp(1.9rem,3vw,2.7rem); letter-spacing:-.05em; line-height:1.15; margin:0; }.kh-case .kh-final p { line-height:1.75; color:#3c4d32; margin-top:0; }
@media(max-width:900px){.kh-case .kh-hero{gap:2rem;grid-template-columns:1fr}.kh-case .kh-hero h1{max-width:19ch;font-size:clamp(2.8rem,7vw,4.4rem)}.kh-case .kh-hero-media{max-width:700px}.kh-case .kh-crm .kh-wrap{gap:2rem}.kh-case .kh-stats{grid-template-columns:1fr 1fr}.kh-case .kh-stats>div:nth-child(2){border-right:0}.kh-case .kh-stats>div:nth-child(3){padding-left:0;border-top:1px solid var(--kh-line)}.kh-case .kh-stats>div:nth-child(4){border-top:1px solid var(--kh-line)}}
@media(max-width:640px){.kh-case .kh-wrap{width:calc(100% - 40px)}.kh-case .kh-hero{padding:2rem 0;gap:1.5rem}.kh-case .kh-hero h1{font-size:2.7rem;letter-spacing:-.055em}.kh-case .kh-hero-media{padding:1rem .7rem}.kh-case .kh-stats>div{padding:1.4rem .7rem}.kh-case .kh-stats dt{font-size:.8rem}.kh-case .kh-stats small{font-size:.75rem}.kh-case .kh-section{padding-block:3.5rem}.kh-case .kh-heading,.kh-case .kh-story,.kh-case .kh-duo,.kh-case .kh-crm .kh-wrap,.kh-case .kh-creative-columns,.kh-case .kh-proof-grid,.kh-case .kh-final{grid-template-columns:1fr;gap:1.75rem}.kh-case .kh-crm{padding:3rem 0}.kh-case .kh-crm-flow{gap:1.2rem}.kh-case .kh-phone-figure{max-width:320px}.kh-case .kh-gallery-grid{grid-template-columns:1fr}.kh-case .kh-heading h2,.kh-case .kh-crm h2{max-width:none}.kh-case .kh-final{padding:1.5rem;margin-block:0 3rem}.kh-case .kh-jump{gap:.25rem 1.1rem}.kh-case .kh-jump a{font-size:.83rem}.kh-case .kh-creative-columns{gap:3rem}.kh-case th,.kh-case td{padding:.9rem}.kh-case .kh-phone{padding:.85rem}}
@media(prefers-reduced-motion:reduce){.kh-case *{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.kh-case .kh-app-preview { max-width:285px; }
.kh-case .kh-app-preview img { display:block; width:100%; height:auto; border:1px solid #65725c; border-radius:12px; box-shadow:0 24px 70px #0004; }
.kh-case .kh-mobile-screens { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3rem 2rem; }
.kh-case .kh-mobile-screens .kh-shot img { max-width:300px; margin-inline:auto; }
.kh-case .kh-mobile-screens .kh-shot figcaption { max-width:300px; margin:1.2rem auto 0; }
.kh-case .kh-image-note { font-size:.8rem; font-style:italic; }
@media(max-width:900px){.kh-case .kh-mobile-screens{grid-template-columns:repeat(2,minmax(0,1fr));gap:2.5rem 1.5rem}}
@media(max-width:640px){.kh-case .kh-mobile-screens{grid-template-columns:1fr;gap:2.5rem}.kh-case .kh-mobile-screens .kh-shot img,.kh-case .kh-mobile-screens .kh-shot figcaption{max-width:340px}}
