
  .cc-section { padding: 120px 0; background: var(--light-2); position: relative; overflow: hidden; scroll-margin-top: 88px; }
  .cc-section::before { content:""; position:absolute; inset:0; background: radial-gradient(ellipse 50% 40% at 50% 0%, rgba(13,150,104,0.06), transparent 60%); pointer-events:none; }
  .cc-head { max-width: 720px; margin: 0 auto 44px; text-align: center; position: relative; }
  .cc-head .section-body { margin: 18px auto 0; max-width: 620px; }
  .cc-app { max-width: 780px; margin: 0 auto; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: 0 40px 80px -40px rgba(12,20,37,0.22), 0 2px 6px rgba(12,20,37,0.04); overflow: hidden; position: relative; }

  /* Intro */
  .cc-intro { padding: 48px 44px; text-align: center; }
  .cc-pill { display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:10px; letter-spacing:0.16em; text-transform:uppercase; color:var(--sage); background:rgba(13,150,104,0.08); border:1px solid rgba(13,150,104,0.18); border-radius:var(--radius-full); padding:6px 14px; margin-bottom:20px; }
  .cc-pill::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--sage); }
  .cc-intro h3 { font-family:var(--font-display); font-size:clamp(24px,3vw,32px); font-weight:400; letter-spacing:-0.02em; color:var(--text-primary); margin-bottom:12px; }
  .cc-intro > p { color:var(--text-secondary); font-size:15.5px; line-height:1.65; max-width:520px; margin:0 auto; }
  .cc-profiler { display:grid; grid-template-columns:1fr; gap:20px; margin:32px auto 28px; text-align:left; max-width:560px; }
  .cc-field-label { display:block; font-family:var(--font-mono); font-size:10px; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-muted); margin-bottom:10px; }
  .cc-field-label span { text-transform:none; letter-spacing:0; opacity:0.7; }
  .cc-choices { display:flex; gap:8px; flex-wrap:wrap; }
  .cc-choices button { flex:0 0 auto; padding:10px 15px; font-size:12.5px; font-weight:500; color:var(--text-secondary); background:var(--white); border:1px solid var(--border); border-radius:var(--radius-full); cursor:pointer; transition:color 0.18s, background 0.18s, border-color 0.18s, box-shadow 0.18s var(--ease-out); text-align:center; white-space:nowrap; }
  .cc-choices button:hover { border-color:var(--sage); color:var(--text-primary); }
  .cc-choices button.on { border-color:var(--sage); background:rgba(13,150,104,0.08); color:var(--text-primary); box-shadow:0 0 0 1px var(--sage) inset; }
  .cc-privacy { font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); margin-top:16px; }
  .cc-start { margin-top:4px; }

  /* Quiz */
  .cc-quiz { padding: 32px 44px 40px; }
  .cc-progress-top { display:flex; justify-content:space-between; align-items:center; font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-muted); margin-bottom:10px; }
  .cc-progress-bar { height:6px; background:var(--light-2); border-radius:var(--radius-full); overflow:hidden; }
  .cc-progress-bar span { display:block; height:100%; background:linear-gradient(90deg,var(--sage),#34D399); border-radius:var(--radius-full); transition:width 0.45s var(--ease-out); }
  .cc-q { margin-top:30px; }
  .cc-q-fw { display:inline-block; font-family:var(--font-mono); font-size:9.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--sage); background:rgba(13,150,104,0.07); border:1px solid rgba(13,150,104,0.16); border-radius:var(--radius-full); padding:4px 10px; margin-bottom:16px; }
  .cc-q-title { font-family:var(--font-display); font-size:clamp(20px,2.4vw,26px); font-weight:400; letter-spacing:-0.02em; color:var(--text-primary); line-height:1.2; margin-bottom:10px; }
  .cc-q-help { font-size:13.5px; line-height:1.6; color:var(--text-muted); max-width:560px; }
  .cc-options { display:grid; gap:10px; margin-top:24px; }
  .cc-option { display:flex; align-items:flex-start; gap:13px; text-align:left; padding:16px 18px; font-size:14.5px; font-weight:500; color:var(--text-primary); background:var(--white); border:1px solid var(--border); border-radius:var(--radius-lg); cursor:pointer; transition:border-color 0.16s var(--ease-out), background 0.16s var(--ease-out), transform 0.16s var(--ease-out); line-height:1.4; }
  .cc-option:hover { border-color:var(--sage); background:rgba(13,150,104,0.04); }
  .cc-option:active { transform:scale(0.995); }
  .cc-option::before { content:""; flex-shrink:0; width:18px; height:18px; border-radius:50%; border:2px solid var(--border); margin-top:1px; transition:border-color 0.16s, background 0.16s, box-shadow 0.16s var(--ease-out); }
  .cc-option.on { border-color:var(--sage); background:rgba(13,150,104,0.06); }
  .cc-option.on::before { border-color:var(--sage); background:radial-gradient(circle, var(--sage) 0 42%, transparent 46%); box-shadow:0 0 0 3px rgba(13,150,104,0.14); }
  .cc-nav { margin-top:24px; display:flex; align-items:center; }
  .cc-back { display:inline-flex; align-items:center; gap:6px; background:none; border:none; cursor:pointer; font-family:var(--font-mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); padding:8px 0; transition:color 0.16s var(--ease-out); }
  .cc-back:hover { color:var(--text-primary); }
  .cc-back svg { width:14px; height:14px; }

  /* Calculating */
  .cc-calc { padding:80px 44px; text-align:center; }
  .cc-spinner { width:40px; height:40px; margin:0 auto 22px; border-radius:50%; border:3px solid rgba(13,150,104,0.15); border-top-color:var(--sage); animation:cc-spin 0.8s linear infinite; }
  @keyframes cc-spin { to { transform:rotate(360deg); } }
  .cc-calc p { color:var(--text-secondary); font-size:14.5px; }

  /* Results */
  .cc-result-head { padding:40px 44px 36px; text-align:center; color:#fff; position:relative; overflow:hidden; }
  .cc-result-head::after { content:""; position:absolute; inset:0; background:radial-gradient(ellipse 60% 100% at 50% 0%, rgba(255,255,255,0.12), transparent 70%); pointer-events:none; }
  .cc-tier-urgent  { background:linear-gradient(135deg,#7f1d1d,#dc2626); }
  .cc-tier-action  { background:linear-gradient(135deg,#9a3412,#ea7c17); }
  .cc-tier-risk    { background:linear-gradient(135deg,#8a5a12,#d99a2b); }
  .cc-tier-ontrack { background:linear-gradient(135deg,#065f46,#0d9668); }
  .cc-badge { position:relative; display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:11px; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; color:#fff; background:rgba(255,255,255,0.18); border:1px solid rgba(255,255,255,0.25); border-radius:var(--radius-full); padding:7px 16px; margin-bottom:18px; }
  .cc-badge::before { content:""; width:7px; height:7px; border-radius:50%; background:#fff; box-shadow:0 0 0 3px rgba(255,255,255,0.25); }
  .cc-verdict { position:relative; font-family:var(--font-display); font-size:clamp(21px,2.6vw,28px); font-weight:400; letter-spacing:-0.02em; line-height:1.25; margin:0 auto 14px; max-width:520px; }
  .cc-score { position:relative; font-family:var(--font-mono); font-size:11.5px; letter-spacing:0.06em; color:rgba(255,255,255,0.85); margin-bottom:18px; }
  .cc-scorebar { position:relative; display:flex; gap:3px; max-width:320px; margin:0 auto; height:8px; }
  .cc-scorebar span { display:block; height:100%; border-radius:2px; }
  .cc-scorebar .cc-sb-red { background:#fecaca; }
  .cc-scorebar .cc-sb-amber { background:#fde68a; }
  .cc-scorebar .cc-sb-green { background:#a7f3d0; }
  .cc-body { padding:34px 44px 40px; }
  .cc-ni { display:flex; gap:12px; padding:16px 18px; background:rgba(232,151,74,0.09); border:1px solid rgba(232,151,74,0.28); border-radius:var(--radius-lg); margin-bottom:28px; font-size:13.5px; line-height:1.55; color:var(--text-secondary); }
  .cc-ni svg { flex-shrink:0; width:20px; height:20px; color:var(--ember,#C4841F); margin-top:1px; }
  .cc-sub { font-family:var(--font-mono); font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-primary); margin:0 0 16px; display:flex; align-items:center; gap:10px; }
  .cc-sub::after { content:""; flex:1; height:1px; background:var(--border); }
  .cc-finding { border:1px solid var(--border); border-left-width:4px; border-radius:var(--radius-lg); margin-bottom:10px; background:var(--white); overflow:hidden; transition:box-shadow 0.2s var(--ease-out); }
  .cc-finding.red { border-left-color:#dc2626; }
  .cc-finding.amber { border-left-color:var(--ember,#C4841F); }
  .cc-finding.open { box-shadow:0 10px 26px -14px rgba(12,20,37,0.2); }
  .cc-finding-head { width:100%; display:flex; align-items:center; gap:13px; padding:15px 18px; background:none; border:none; cursor:pointer; text-align:left; font-family:inherit; transition:background 0.16s var(--ease-out); }
  .cc-finding-head:hover { background:rgba(12,20,37,0.02); }
  .cc-sevdot { width:9px; height:9px; border-radius:50%; flex-shrink:0; }
  .cc-finding.red .cc-sevdot { background:#dc2626; }
  .cc-finding.amber .cc-sevdot { background:var(--ember,#C4841F); }
  .cc-finding-htext { flex:1; min-width:0; display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 12px; }
  .cc-finding-name { font-family:var(--font-display); font-size:17px; font-weight:400; letter-spacing:-0.015em; color:var(--text-primary); line-height:1.25; }
  .cc-finding-meta { display:inline-flex; align-items:center; gap:8px; }
  .cc-chip { font-family:var(--font-mono); font-size:9px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; padding:3px 9px; border-radius:var(--radius-full); white-space:nowrap; }
  .cc-finding.red .cc-chip { background:rgba(220,38,38,0.1); color:#c62828; border:1px solid rgba(220,38,38,0.2); }
  .cc-finding.amber .cc-chip { background:rgba(232,151,74,0.12); color:#b4700f; border:1px solid rgba(232,151,74,0.25); }
  .cc-fw { font-family:var(--font-mono); font-size:9px; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-muted); white-space:nowrap; }
  .cc-chev { width:18px; height:18px; color:var(--text-muted); flex-shrink:0; transition:transform 0.25s var(--ease-out); }
  .cc-finding.open .cc-chev { transform:rotate(180deg); }
  .cc-finding-detail { display:none; padding:2px 20px 20px 40px; }
  .cc-finding.open .cc-finding-detail { display:block; }
  .cc-finding-what { font-size:13.5px; line-height:1.6; color:var(--text-secondary); margin:0 0 14px; }
  .cc-row { display:grid; grid-template-columns:78px 1fr; gap:12px; margin-bottom:10px; align-items:start; }
  .cc-row .k { font-family:var(--font-mono); font-size:9.5px; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; padding-top:2px; }
  .cc-finding.red .cc-row.exp .k { color:#c62828; }
  .cc-finding.amber .cc-row.exp .k { color:#b4700f; }
  .cc-row.fix .k { color:var(--sage); }
  .cc-row p { font-size:13.5px; line-height:1.55; color:var(--text-secondary); margin:0; }
  .cc-help { display:flex; gap:10px; align-items:flex-start; margin-top:14px; padding:12px 14px; background:rgba(13,150,104,0.05); border-radius:var(--radius-md); font-size:12.5px; line-height:1.5; color:var(--text-secondary); }
  .cc-help svg { flex-shrink:0; width:16px; height:16px; color:var(--sage); margin-top:1px; }
  .cc-help b { color:var(--sage); font-weight:600; }
  .cc-wins { margin-top:30px; }
  .cc-wins ul { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:10px 24px; }
  .cc-wins li { display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--text-secondary); }
  .cc-wins li svg { flex-shrink:0; width:16px; height:16px; color:var(--sage); }
  .cc-disclaimer { margin-top:30px; padding-top:22px; border-top:1px solid var(--border); font-size:11.5px; line-height:1.6; font-style:italic; color:var(--text-muted); }
  .cc-cta-card { margin-top:28px; padding:32px 30px; background:var(--dark,#0A0F1C); border-radius:var(--radius-lg); color:#fff; position:relative; overflow:hidden; }
  .cc-cta-card::before { content:""; position:absolute; inset:0; background:radial-gradient(ellipse 50% 90% at 100% 0%, rgba(16,185,129,0.16), transparent 60%); pointer-events:none; }
  .cc-cta-card > * { position:relative; }
  .cc-cta-card h4 { font-family:var(--font-display); font-size:23px; font-weight:400; letter-spacing:-0.02em; margin:0 0 8px; }
  .cc-cta-card > p { font-size:13.5px; line-height:1.6; color:rgba(247,246,243,0.7); margin:0 0 22px; max-width:520px; }
  .cc-form { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .cc-form .full { grid-column:1 / -1; }
  .cc-form input { width:100%; padding:12px 14px; font-family:var(--font-body); font-size:14px; color:#fff; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.14); border-radius:var(--radius-md); transition:border-color 0.16s var(--ease-out), background 0.16s var(--ease-out); }
  .cc-form input::placeholder { color:rgba(247,246,243,0.4); }
  .cc-form input:focus { outline:none; border-color:var(--sage); background:rgba(255,255,255,0.09); }
  .cc-consent { grid-column:1 / -1; display:flex; align-items:flex-start; gap:10px; font-size:12.5px; line-height:1.5; color:rgba(247,246,243,0.72); cursor:pointer; }
  .cc-consent input { width:16px; height:16px; flex-shrink:0; margin-top:2px; accent-color:var(--sage); }
  .cc-form-actions { grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:4px; }
  .cc-err { grid-column:1 / -1; font-size:12.5px; color:#fca5a5; margin:0; display:none; }
  .cc-cta-done { position:relative; display:flex; align-items:center; gap:12px; font-family:var(--font-display); font-size:19px; font-weight:400; letter-spacing:-0.01em; }
  .cc-cta-done svg { width:26px; height:26px; color:#34D399; flex-shrink:0; }
  .cc-restart { display:block; margin:24px auto 0; background:none; border:none; cursor:pointer; font-family:var(--font-mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-muted); transition:color 0.16s var(--ease-out); }
  .cc-restart:hover { color:var(--sage); }

  @media (max-width:640px) {
    .cc-section { padding:80px 0; }
    .cc-intro, .cc-quiz, .cc-body { padding-left:22px; padding-right:22px; }
    .cc-result-head { padding-left:22px; padding-right:22px; }
    .cc-profiler { grid-template-columns:1fr; gap:18px; }
    .cc-wins ul { grid-template-columns:1fr; }
    .cc-form { grid-template-columns:1fr; }
    .cc-row { grid-template-columns:1fr; gap:2px; }
    .cc-finding-detail { padding:2px 16px 18px 16px; }
    .cc-cta-card { padding:26px 22px; }
  }
  @media (prefers-reduced-motion: reduce) { .cc-spinner { animation:none; } }

/* Keep questionnaire choices, back and restart controls easy to activate. */
.cc-choices button,.cc-back,.cc-restart{min-height:44px}
.cc-option:disabled{cursor:default;opacity:1}
.cc-q-title:focus,.cc-intro h3:focus,.cc-verdict:focus{outline:2px solid var(--sage);outline-offset:6px}
