/* ═══════════════════════════════════════════════════════════════
   LIGHT THEME VARIABLES
═══════════════════════════════════════════════════════════════ */
:root{
  --blue-900:#1E3A8A;--blue-700:#1D4ED8;--blue-600:#2563EB;
  --blue-500:#3B82F6;--blue-100:#DBEAFE;--blue-50:#EFF6FF;
  --ink:#0F172A;--slate-700:#334155;--slate-600:#475569;
  --slate-500:#64748B;--slate-400:#94A3B8;--slate-300:#CBD5E1;
  --slate-200:#E2E8F0;--slate-100:#F1F5F9;--slate-50:#F8FAFC;
  --white:#FFFFFF;--amber:#F59E0B;--green:#16A34A;
  --shadow-sm:0 1px 3px rgba(15,23,42,.08);
  --shadow-md:0 4px 16px rgba(15,23,42,.10);
  --shadow-lg:0 12px 40px rgba(15,23,42,.13);
  --radius:14px;--radius-sm:9px;--radius-xs:6px;
}

/* ═══════════════════════════════════════════════════════════════
   BASE
═══════════════════════════════════════════════════════════════ */
.cpv5{font-family:'Inter',-apple-system,sans-serif;color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;background:#F0F4FF}
.cpv5 *{box-sizing:border-box}
.cpv5-wrap{max-width:1100px;margin:0 auto;padding:0 16px 60px}

/* ═══════════════════════════════════════════════════════════════
   HERO  (light version)
═══════════════════════════════════════════════════════════════ */
.cpv5-hero{background:linear-gradient(150deg,#0F1E47,#1E3A8A 60%,#2563EB);border-radius:22px;padding:44px 28px 38px;text-align:center;position:relative;overflow:hidden;margin-bottom:28px}
.cpv5-hero::before{content:'';position:absolute;top:-80px;right:-60px;width:320px;height:320px;background:radial-gradient(circle,rgba(96,165,250,.28),transparent 65%);pointer-events:none}
.cpv5-hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04)1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04)1px,transparent 1px);background-size:32px 32px;pointer-events:none}
.cpv5-hero-inner{position:relative;z-index:2;max-width:700px;margin:0 auto}
.cpv5-hero-pill{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);color:#DBEAFE;font-size:12px;font-weight:600;padding:5px 14px;border-radius:24px;margin-bottom:18px}
.cpv5-hero h1{font-size:34px;font-weight:900;color:#fff;margin:0 0 14px;letter-spacing:-.03em;line-height:1.12}
.cpv5-hero h1 span{background:linear-gradient(120deg,#93C5FD,#A78BFA);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.cpv5-hero-sub{font-size:15px;color:#C7D6F5;max-width:560px;margin:0 auto 26px;line-height:1.7}
.cpv5-trust{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;margin-top:20px}
.cpv5-trust-item{display:flex;align-items:center;gap:6px;color:#BBD0F5;font-size:12px;font-weight:500}
.cpv5-trust-item svg{width:14px;height:14px;color:#7DD3FC}

/* ═══════════════════════════════════════════════════════════════
   SOLVER CARD  (LIGHT THEME — FIX #4)
═══════════════════════════════════════════════════════════════ */
.cpv5-card{background:var(--white);border-radius:20px;box-shadow:var(--shadow-lg);border:1px solid var(--slate-200);overflow:hidden;margin-bottom:22px}

/* Top bar */
.cpv5-topbar{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--slate-100);background:var(--slate-50)}
.cpv5-auto-badge{display:inline-flex;align-items:center;gap:6px;background:var(--blue-600);color:#fff;font-size:11.5px;font-weight:700;padding:5px 12px;border-radius:18px;flex-shrink:0}
.cpv5-auto-badge svg{width:13px;height:13px}
.cpv5-status{font-size:12px;color:var(--slate-500);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.cpv5-status b{color:var(--blue-700)}
.cpv5-manual-btn{font-size:11.5px;color:var(--slate-500);background:var(--white);border:1px solid var(--slate-200);padding:5px 11px;border-radius:8px;cursor:pointer;font-family:inherit;transition:all .14s;flex-shrink:0}
.cpv5-manual-btn:hover{color:var(--blue-700);border-color:var(--blue-100);background:var(--blue-50)}

/* Input row — LIGHT THEME */
.cpv5-input-row{display:flex;gap:10px;padding:14px 16px 10px}
.cpv5-input-shell{flex:1;display:flex;align-items:center;background:var(--white);border:2px solid var(--slate-200);border-radius:12px;transition:border-color .15s,box-shadow .15s;overflow:hidden}
.cpv5-input-shell:focus-within{border-color:var(--blue-500);box-shadow:0 0 0 4px rgba(59,130,246,.12)}
.cpv5-input-shell svg.eq-ico{width:17px;height:17px;color:var(--slate-400);margin-left:13px;flex-shrink:0}
/* KEYBOARD BUTTON FIX (#3 & #6) */
.cpv5-input{flex:1;background:transparent;color:var(--ink);font-family:'DM Mono',monospace;font-size:15px;border:none;padding:13px 10px;outline:none;caret-color:var(--blue-600)}
.cpv5-input::placeholder{color:var(--slate-400);font-size:13px}
.cpv5-kb-toggle{background:linear-gradient(135deg,#EFF6FF,#DBEAFE);border:none;border-left:2px solid #BFDBFE;color:#1D4ED8;cursor:pointer;padding:0 16px;height:100%;display:flex;align-items:center;justify-content:center;gap:4px;transition:all .15s;min-width:54px;position:relative}
.cpv5-kb-toggle:hover{background:linear-gradient(135deg,#DBEAFE,#BFDBFE);color:#1E3A8A;transform:scale(1.04)}
.cpv5-kb-toggle:active{transform:scale(.97)}
.cpv5-kb-toggle svg{width:22px;height:22px;display:block}
.cpv5-kb-toggle::after{content:"⌨";position:absolute;bottom:3px;right:4px;font-size:8px;color:#3B82F6;opacity:.7}
.cpv5-go{background:linear-gradient(135deg,var(--blue-900),var(--blue-600));color:#fff;border:none;border-radius:12px;padding:0 24px;font-size:14.5px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .15s;box-shadow:0 5px 16px rgba(37,99,235,.28);font-family:inherit;white-space:nowrap;height:50px}
.cpv5-go:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(37,99,235,.36)}
.cpv5-go:active{transform:scale(.97)}
.cpv5-go:disabled{opacity:.55;cursor:not-allowed;transform:none}

/* Quick examples */
.cpv5-quick{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 14px;align-items:center}
.cpv5-quick-lbl{font-size:11px;color:var(--slate-400);font-weight:600}
.cpv5-quick-chip{font-family:'DM Mono',monospace;font-size:11.5px;color:var(--blue-700);background:var(--blue-50);border:1px solid var(--blue-100);padding:4px 10px;border-radius:7px;cursor:pointer;transition:all .13s}
.cpv5-quick-chip:hover{background:var(--blue-100);transform:translateY(-1px)}

/* ═══════════════════════════════════════════════════════════════
   KEYBOARD — FULL LIGHT THEME (#3 fix)
═══════════════════════════════════════════════════════════════ */
.cpv5-keyboard{background:var(--slate-50);border-top:1px solid var(--slate-200);padding:12px 14px;display:none}
.cpv5-keyboard.open{display:block;animation:cpvSlide .2s ease}
@keyframes cpvSlide{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.cpv5-kb-sec{margin-bottom:8px}
.cpv5-kb-sec-lbl{font-size:9px;font-weight:700;color:var(--slate-400);text-transform:uppercase;letter-spacing:.1em;margin-bottom:5px}
.cpv5-kb-row{display:flex;gap:5px;margin-bottom:5px}
.cpvk{flex:1;height:36px;display:flex;align-items:center;justify-content:center;border-radius:8px;cursor:pointer;font-size:12px;font-weight:600;border:1.5px solid transparent;user-select:none;transition:all .1s;font-family:'DM Mono',monospace;white-space:nowrap;min-width:0;padding:0 3px;background:var(--white);color:var(--ink)}
.cpvk:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.cpvk:active{transform:scale(.9)}
.cpvk-trig{background:#F0FDFA;border-color:#A7F3D0;color:#065F46}
.cpvk-fn{background:#F5F3FF;border-color:#DDD6FE;color:#5B21B6}
.cpvk-pow{background:#EFF6FF;border-color:#BFDBFE;color:#1D4ED8}
.cpvk-const{background:#FEFCE8;border-color:#FDE68A;color:#92400E}
.cpvk-var{background:#F0FDF4;border-color:#BBF7D0;color:#166534;font-style:italic}
.cpvk-op{background:#F8FAFC;border-color:#E2E8F0;color:#374151}
.cpvk-digit{background:#fff;border-color:#E2E8F0;color:#1E293B;font-size:13px}
.cpvk-rel{background:#FFF7ED;border-color:#FED7AA;color:#C2410C}
.cpvk-del{background:#FFF1F2;border-color:#FECACA;color:#DC2626;font-weight:700}
.cpvk-ac{background:#FEF3C7;border-color:#FDE68A;color:#92400E;font-weight:700}
.cpvk-eq{background:var(--blue-600);border-color:var(--blue-600);color:#fff;font-weight:700}
.cpvk-sep{background:#FFF;border-color:#C7D2FE;color:#4338CA;font-weight:700}

/* category drawer */
.cpv5-cat-drawer{background:var(--white);border-top:1px solid var(--slate-100);padding:12px 16px;display:none}
.cpv5-cat-drawer.open{display:block;animation:cpvSlide .2s ease}
.cpv5-cat-hd{font-size:10px;font-weight:700;color:var(--slate-400);text-transform:uppercase;letter-spacing:.08em;margin-bottom:9px}
.cpv5-cat-chips{display:flex;flex-wrap:wrap;gap:6px}
.cpv5-cat-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border-radius:9px;border:1.5px solid var(--slate-200);background:var(--white);cursor:pointer;font-size:12px;font-weight:500;color:var(--slate-600);font-family:inherit;transition:all .14s}
.cpv5-cat-chip:hover{border-color:#93C5FD;color:var(--blue-700);background:var(--blue-50)}
.cpv5-cat-chip.active{background:var(--blue-900);border-color:var(--blue-900);color:#fff}
.cpv5-cat-chip .ci{font-family:'DM Mono',monospace;font-size:10px;font-weight:700;opacity:.75}
.cpv5-cat-chip.active .ci{opacity:1}

/* ═══════════════════════════════════════════════════════════════
   RESULT CARD
═══════════════════════════════════════════════════════════════ */
.cpv5-result-card{background:var(--white);border-radius:20px;border:1px solid var(--slate-200);box-shadow:var(--shadow-lg);overflow:hidden;display:none}
.cpv5-result-card.show{display:block;animation:cpvRise .3s ease}
@keyframes cpvRise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* ── GLOBAL ANSWER BOX (#4 — persistent top) ── */
.cpv5-answer-box{background:linear-gradient(135deg,#FFFBEB,#FFF7ED);border-bottom:2px solid #FDE68A;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
.cpv5-answer-left{display:flex;align-items:center;gap:12px}
.cpv5-answer-icon{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,#F59E0B,#FBBF24);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cpv5-answer-icon svg{width:20px;height:20px;color:#fff}
.cpv5-answer-label{font-size:10px;font-weight:700;color:#92400E;text-transform:uppercase;letter-spacing:.08em;margin-bottom:3px}
.cpv5-answer-value{font-size:15px;font-weight:700;color:#B45309;overflow-x:auto}
.cpv5-answer-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cpv5-detected-badge{display:inline-flex;align-items:center;gap:6px;background:var(--blue-50);border:1px solid var(--blue-100);color:var(--blue-700);font-size:12px;font-weight:600;padding:5px 12px;border-radius:16px}
.cpv5-detected-badge svg{width:13px;height:13px}
.cpv5-disc-info{font-size:11.5px;color:var(--slate-500);background:var(--slate-50);border:1px solid var(--slate-200);padding:4px 10px;border-radius:8px}
.cpv5-result-btns{display:flex;gap:6px}
.cpv5-rbtn{font-size:11.5px;color:var(--slate-500);background:var(--white);border:1px solid var(--slate-200);padding:5px 11px;border-radius:8px;cursor:pointer;transition:all .13s;font-family:inherit;display:flex;align-items:center;gap:5px}
.cpv5-rbtn:hover{background:var(--slate-50);color:var(--blue-700);border-color:var(--blue-100)}
.cpv5-rbtn svg{width:13px;height:13px}

/* ── METHOD TABS ── */
.cpv5-methods-bar{border-bottom:1px solid var(--slate-200);background:var(--slate-50);padding:0 20px;display:flex;gap:4px;overflow-x:auto}
.cpv5-methods-bar::-webkit-scrollbar{height:3px}
.cpv5-methods-bar::-webkit-scrollbar-thumb{background:var(--slate-300);border-radius:2px}
.cpv5-method-tab{flex-shrink:0;padding:13px 16px;font-size:13px;font-weight:600;color:var(--slate-500);background:none;border:none;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;transition:all .15s;font-family:inherit;display:flex;align-items:center;gap:7px}
.cpv5-method-tab:hover{color:var(--blue-700)}
.cpv5-method-tab.active{color:var(--blue-700);border-bottom-color:var(--blue-600);background:var(--white)}
.cpv5-method-tab .tab-num{width:22px;height:22px;border-radius:50%;background:var(--slate-200);color:var(--slate-600);font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s}
.cpv5-method-tab.active .tab-num{background:var(--blue-600);color:#fff}

/* ── STEPS PANEL ── */
.cpv5-steps-panel{padding:20px;display:none}
.cpv5-steps-panel.active{display:block;animation:cpvFade .2s ease}
@keyframes cpvFade{from{opacity:0}to{opacity:1}}
.cpv5-steps-list{display:flex;flex-direction:column;gap:10px}

/* Individual step card */
.cpv5-step{border:1px solid var(--slate-200);border-left:3px solid var(--blue-100);border-radius:11px;padding:12px 14px;background:var(--white);transition:border-left-color .2s}
.cpv5-step:hover{border-left-color:var(--blue-400,#60A5FA)}
.cpv5-step.step-final{border-left-color:var(--amber);background:#FFFBEB}
.cpv5-step-head{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:var(--slate-700);margin-bottom:10px;font-weight:500;line-height:1.5}
.cpv5-step-num{width:24px;height:24px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;background:var(--blue-600);color:#fff;margin-top:1px;box-shadow:0 2px 6px rgba(37,99,235,.25)}
.cpv5-step.step-final .cpv5-step-num{background:var(--amber);color:#fff}
.cpv5-step-math{overflow-x:auto;padding:10px 14px;background:#fff;border:1px solid var(--slate-200);border-radius:9px;font-size:15px;text-align:center;min-height:44px;display:flex;align-items:center;justify-content:center}
.cpv5-step.step-final .cpv5-step-math{background:#FFFBEB;border-color:#FDE68A}
.cpv5-step-math .katex-display{margin:0}

/* Graph */
.cpv5-graph-wrap{border:1px solid var(--slate-200);border-radius:11px;padding:14px;margin-top:16px;background:var(--white)}
.cpv5-graph-lbl{font-size:10px;font-weight:700;color:var(--blue-700);text-transform:uppercase;letter-spacing:.07em;margin-bottom:10px;display:flex;align-items:center;gap:6px}
.cpv5-graph-lbl svg{width:14px;height:14px}
.cpv5-graph-plot{width:100%;height:240px;overflow:hidden}

/* Note */
.cpv5-note{display:flex;gap:8px;align-items:flex-start;background:var(--blue-50);border:1px solid var(--blue-100);border-radius:9px;padding:11px 13px;margin-top:12px}
.cpv5-note svg{width:14px;height:14px;color:var(--blue-600);flex-shrink:0;margin-top:2px}
.cpv5-note p{font-size:12.5px;color:var(--blue-700);margin:0;line-height:1.6}

/* Loading */
.cpv5-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:50px 20px}
.cpv5-dots{display:flex;gap:7px}
.cpv5-dots span{width:9px;height:9px;border-radius:50%;background:var(--blue-600);animation:cpvdot 1.4s infinite ease-in-out}
.cpv5-dots span:nth-child(1){animation-delay:-.32s}
.cpv5-dots span:nth-child(2){animation-delay:-.16s}
@keyframes cpvdot{0%,80%,100%{transform:scale(0);opacity:.3}40%{transform:scale(1);opacity:1}}
.cpv5-loading p{font-size:13px;color:var(--slate-400)}

/* Error */
.cpv5-err{display:flex;gap:9px;align-items:flex-start;background:#FFF5F5;border:1px solid #FECACA;border-radius:11px;padding:14px;margin:16px}
.cpv5-err-ico{width:20px;height:20px;border-radius:50%;background:#FEE2E2;color:#DC2626;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0}
.cpv5-err h4{font-size:13px;font-weight:700;color:#DC2626;margin:0 0 4px}
.cpv5-err p{font-size:12.5px;color:#B91C1C;margin:0;line-height:1.55}

/* History */
.cpv5-hist{padding:16px 20px}
.cpv5-hist h3{font-size:14px;font-weight:700;margin:0 0 12px;display:flex;justify-content:space-between;align-items:center}
.cpv5-hist-clr{font-size:11.5px;color:#DC2626;background:none;border:none;cursor:pointer;font-family:inherit}
.cpv5-hist-item{display:flex;align-items:center;gap:9px;padding:10px 12px;border:1px solid var(--slate-200);border-radius:9px;margin-bottom:7px;cursor:pointer;transition:all .13s}
.cpv5-hist-item:hover{border-color:#93C5FD;background:var(--blue-50)}
.cpv5-hist-cat{font-size:9.5px;font-weight:700;color:var(--blue-700);background:var(--blue-50);border:1px solid var(--blue-100);padding:3px 8px;border-radius:10px;flex-shrink:0}
.cpv5-hist-expr{font-family:'DM Mono',monospace;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.cpv5-hist-empty{font-size:12.5px;color:var(--slate-400);text-align:center;padding:30px}

/* ═══════════════════════════════════════════════════════════════
   SECTIONS BELOW (askmath-style)
═══════════════════════════════════════════════════════════════ */
.cpv5-section{padding:48px 0 0}
.cpv5-eyebrow{display:flex;align-items:center;justify-content:center;gap:8px;font-size:11.5px;font-weight:700;color:var(--blue-600);text-transform:uppercase;letter-spacing:.1em;margin-bottom:12px}
.cpv5-eyebrow::before,.cpv5-eyebrow::after{content:'';width:22px;height:2px;background:var(--blue-500);opacity:.5}
.cpv5-sec-title{font-size:27px;font-weight:800;text-align:center;letter-spacing:-.025em;margin:0 auto 12px;max-width:640px;line-height:1.2}
.cpv5-sec-sub{font-size:14px;color:var(--slate-500);text-align:center;max-width:560px;margin:0 auto 30px;line-height:1.7}

.cpv5-feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:860px){.cpv5-feat-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.cpv5-feat-grid{grid-template-columns:1fr}}
.cpv5-feat{background:var(--white);border:1px solid var(--slate-200);border-radius:var(--radius);padding:22px 18px;transition:all .2s}
.cpv5-feat:hover{border-color:#BFDBFE;box-shadow:var(--shadow-md);transform:translateY(-3px)}
.cpv5-feat-ico{width:44px;height:44px;border-radius:11px;background:linear-gradient(135deg,var(--blue-900),var(--blue-600));display:flex;align-items:center;justify-content:center;margin-bottom:13px}
.cpv5-feat-ico svg{width:22px;height:22px;color:#fff}
.cpv5-feat h3{font-size:15px;font-weight:700;margin:0 0 8px}
.cpv5-feat p{font-size:13px;color:var(--slate-500);margin:0;line-height:1.65}

.cpv5-how{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:700px){.cpv5-how{grid-template-columns:1fr;gap:12px}}
.cpv5-how-card{background:var(--white);border:1px solid var(--slate-200);border-radius:var(--radius);padding:24px 20px}
.cpv5-how-num{font-size:40px;font-weight:900;line-height:1;background:linear-gradient(135deg,#BFDBFE,var(--blue-500));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:12px;display:block}
.cpv5-how-card h3{font-size:15.5px;font-weight:700;margin:0 0 8px}
.cpv5-how-card p{font-size:13px;color:var(--slate-500);margin:0;line-height:1.65}
.cpv5-how-card code{font-family:'DM Mono',monospace;font-size:11.5px;background:var(--blue-50);color:var(--blue-700);padding:1px 6px;border-radius:5px}

.cpv5-cases{display:flex;flex-direction:column;gap:16px}
.cpv5-case{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;background:var(--white);border:1px solid var(--slate-200);border-radius:var(--radius);padding:28px}
.cpv5-case:nth-child(even) .cpv5-case-vis{order:-1}
@media(max-width:700px){.cpv5-case{grid-template-columns:1fr;gap:16px;padding:20px}.cpv5-case:nth-child(even) .cpv5-case-vis{order:0}}
.cpv5-case-tag{font-size:11px;font-weight:700;color:var(--blue-700);background:var(--blue-50);padding:3px 10px;border-radius:12px;display:inline-block;margin-bottom:11px}
.cpv5-case h3{font-size:19px;font-weight:800;margin:0 0 10px;line-height:1.25}
.cpv5-case p{font-size:13.5px;color:var(--slate-500);margin:0;line-height:1.7}
.cpv5-case-vis{background:linear-gradient(150deg,#0F1E47,#1E3A8A);border-radius:12px;min-height:160px;display:flex;align-items:center;justify-content:center;padding:20px;position:relative;overflow:hidden}
.cpv5-case-vis::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05)1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05)1px,transparent 1px);background-size:22px 22px}
.cpv5-demo{position:relative;z-index:2;width:100%;max-width:260px}
.cpv5-dl{font-family:'DM Mono',monospace;font-size:12px;padding:7px 10px;border-radius:7px;margin-bottom:6px}
.cpv5-dl-q{background:rgba(255,255,255,.1);color:#BFDBFE;border:1px solid rgba(255,255,255,.15)}
.cpv5-dl-s{background:rgba(96,165,250,.12);color:#93C5FD;border:1px solid rgba(96,165,250,.2);font-size:11.5px}
.cpv5-dl-a{background:rgba(74,222,128,.12);color:#86EFAC;border:1px solid rgba(74,222,128,.2)}

.cpv5-why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:760px){.cpv5-why-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.cpv5-why-grid{grid-template-columns:1fr}}
.cpv5-why{display:flex;gap:12px;background:var(--white);border:1px solid var(--slate-200);border-radius:var(--radius-sm);padding:16px}
.cpv5-why-ico{width:36px;height:36px;border-radius:9px;background:var(--blue-50);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cpv5-why-ico svg{width:18px;height:18px;color:var(--blue-600)}
.cpv5-why h4{font-size:13.5px;font-weight:700;margin:0 0 4px}
.cpv5-why p{font-size:12px;color:var(--slate-500);margin:0;line-height:1.55}

.cpv5-testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:860px){.cpv5-testi-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.cpv5-testi-grid{grid-template-columns:1fr}}
.cpv5-testi{background:var(--white);border:1px solid var(--slate-200);border-radius:var(--radius);padding:20px}
.cpv5-testi-stars{color:var(--amber);font-size:13px;letter-spacing:1px;margin-bottom:10px}
.cpv5-testi-txt{font-size:13px;color:var(--slate-600);line-height:1.7;margin:0 0 14px}
.cpv5-testi-who{display:flex;align-items:center;gap:10px}
.cpv5-testi-av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--blue-600),var(--blue-500));color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0}
.cpv5-testi-name{font-size:13px;font-weight:700}
.cpv5-testi-role{font-size:11px;color:var(--slate-400)}

.cpv5-cta{background:linear-gradient(150deg,#0F1E47,#1E3A8A 55%,#2563EB);border-radius:20px;padding:44px 28px;text-align:center;position:relative;overflow:hidden;margin-top:48px}
.cpv5-cta::before{content:'';position:absolute;top:-80px;right:-40px;width:260px;height:260px;background:radial-gradient(circle,rgba(96,165,250,.28),transparent 65%)}
.cpv5-cta-inner{position:relative;z-index:2}
.cpv5-cta h2{font-size:26px;font-weight:800;color:#fff;margin:0 0 11px}
.cpv5-cta p{font-size:14px;color:#C7D6F5;max-width:480px;margin:0 auto 24px;line-height:1.65}
.cpv5-cta-btn{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--blue-900);border:none;border-radius:12px;padding:13px 28px;font-size:14.5px;font-weight:700;cursor:pointer;transition:all .16s;box-shadow:0 8px 24px rgba(0,0,0,.22);font-family:inherit}
.cpv5-cta-btn:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(0,0,0,.28)}

.cpv5-faq{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:8px}
.cpv5-faq-item{background:var(--white);border:1px solid var(--slate-200);border-radius:var(--radius-sm);overflow:hidden;transition:border-color .15s}
.cpv5-faq-item.open{border-color:var(--blue-100)}
.cpv5-faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;background:none;border:none;cursor:pointer;font-size:14px;font-weight:600;text-align:left;font-family:inherit;color:var(--ink)}
.cpv5-faq-q:hover{color:var(--blue-700)}
.cpv5-faq-chev{flex-shrink:0;transition:transform .2s;color:var(--slate-400)}
.cpv5-faq-item.open .cpv5-faq-chev{transform:rotate(180deg)}
.cpv5-faq-a{display:none;padding:0 18px 16px;font-size:13.5px;color:var(--slate-500);line-height:1.75}
.cpv5-faq-item.open .cpv5-faq-a{display:block}
.cpv5-faq-a code{font-family:'DM Mono',monospace;font-size:12px;background:var(--blue-50);color:var(--blue-700);padding:1px 6px;border-radius:5px}

.cpv5-foot{height:40px}

@media(max-width:560px){
  .cpv5-hero{padding:30px 18px 26px;border-radius:18px}
  .cpv5-hero h1{font-size:26px}
  .cpv5-input-row{gap:7px}
  .cpv5-go span{display:none}
  .cpv5-go{padding:0 15px}
  .cpv5-sec-title{font-size:22px}
  .cpv5-section{padding:36px 0 0}
  .cpv5-answer-box{flex-direction:column;align-items:flex-start}
}

/* ── PDF Export button ── */
.cpv5-rbtn-pdf{background:linear-gradient(135deg,#EFF6FF,#DBEAFE);color:#1D4ED8;border-color:#BFDBFE;font-weight:600}
.cpv5-rbtn-pdf:hover{background:linear-gradient(135deg,#DBEAFE,#BFDBFE);border-color:#93C5FD}

/* ── PRINT / PDF STYLES ── */
@media print{
  body > *:not(.cpv5-pdf-frame){display:none!important}
  .cpv5-pdf-frame{display:block!important;position:static!important;margin:0!important;padding:0!important;box-shadow:none!important;border:none!important}
  @page{margin:18mm 14mm;size:A4}
}