/* Groei-Curve Scan — Wizard CSS v1.1.0 */

.gcs-cta-wrap { display:flex;flex-direction:column;align-items:flex-start;gap:8px }
.gcs-cta-btn { display:inline-block;background:#1a5c72;color:#fff;border:none;border-radius:8px;padding:15px 30px;font-size:16px;font-weight:600;cursor:pointer;transition:background .2s,transform .1s;letter-spacing:.01em }
.gcs-cta-btn:hover { background:#154d60 }
.gcs-cta-btn:active { transform:scale(.98) }
.gcs-cta-sub { font-size:13px;color:#999;margin:0 }

.gcs-overlay { position:fixed;inset:0;background:rgba(4,14,22,.84);z-index:99999;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .22s ease;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px) }
.gcs-overlay--visible { opacity:1;pointer-events:auto }

.gcs-modal { background:#fff;border-radius:20px;width:100%;max-width:760px;max-height:92vh;overflow-y:auto;padding:52px 60px 44px;position:relative;display:flex;flex-direction:column;gap:28px;box-shadow:0 32px 100px rgba(0,0,0,.4);animation:gcs-in .28s cubic-bezier(.34,1.2,.64,1) both }
@keyframes gcs-in { from{transform:translateY(20px) scale(.97);opacity:0} to{transform:none;opacity:1} }

/* BUG #6 FIX: close via SVG, geen tekstknooppunt */
.gcs-close { position:absolute;top:16px;right:20px;background:none;border:none;color:#bbb;cursor:pointer;padding:6px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:color .15s,background .15s;line-height:1 }
.gcs-close:hover { color:#444;background:#f0f0ef }

.gcs-progress-wrap { display:flex;align-items:center;gap:12px;margin-top:-12px }
.gcs-progress-bar { flex:1;height:5px;border-radius:99px;background:linear-gradient(to right,#1a5c72 var(--fill,0%),#e8e8e8 var(--fill,0%));transition:background .35s }
.gcs-progress-label { font-size:12px;color:#bbb;white-space:nowrap }

.gcs-screen { flex:1;min-height:220px }

.gcs-welcome { display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:12px 0 8px }

.gcs-question { padding:4px 0 8px }
.gcs-question__counter { font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#bbb;margin:0 0 10px }
.gcs-question__prompt { font-size:15px;color:#888;margin:0 0 28px;font-style:italic }

.gcs-slider-wrap { display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center }
.gcs-slider-label { font-size:14px;color:#444;line-height:1.45;max-width:220px }
.gcs-slider-label--left { text-align:right }
.gcs-slider-label--right { text-align:left }
.gcs-slider-inner { display:flex;flex-direction:column;align-items:stretch;gap:10px;min-width:160px;max-width:200px }
.gcs-slider { -webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:99px;background:linear-gradient(to right,#1a5c72 var(--fill,40%),#ddd var(--fill,40%));outline:none;cursor:pointer;transition:background .15s }
.gcs-slider::-webkit-slider-thumb { -webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:#1a5c72;box-shadow:0 2px 10px rgba(0,0,0,.2);cursor:pointer;transition:transform .1s }
.gcs-slider::-webkit-slider-thumb:hover { transform:scale(1.15) }
.gcs-slider::-moz-range-thumb { width:24px;height:24px;border-radius:50%;background:#1a5c72;border:none;cursor:pointer }
.gcs-ticks { display:flex;justify-content:space-between;padding:0 2px }
.gcs-tick { font-size:12px;color:#ccc;transition:color .15s,font-weight .15s }
.gcs-tick--active { color:#1a5c72;font-weight:700 }

.gcs-contact { padding:4px 0 }
.gcs-contact__title { font-size:20px;font-weight:700;color:#0f1f28;margin:0 0 8px }
.gcs-contact__sub { font-size:14px;color:#888;margin:0 0 24px;line-height:1.55 }
.gcs-field { margin-bottom:16px }
.gcs-label { display:block;font-size:13px;font-weight:600;color:#333;margin-bottom:5px }
.gcs-input { display:block;width:100%;box-sizing:border-box;padding:11px 14px;border:1.5px solid #ddd;border-radius:8px;font-size:15px;color:#222;background:#fafafa;transition:border-color .15s,box-shadow .15s;outline:none }
.gcs-input:focus { border-color:#1a5c72;box-shadow:0 0 0 3px rgba(26,92,114,.12);background:#fff }
.gcs-input::placeholder { color:#ccc }
.gcs-disclaimer { font-size:12px;color:#bbb;margin:16px 0 0;line-height:1.5 }
.gcs-form-error { background:#fff3f3;border:1px solid #f5c6c6;color:#c0392b;border-radius:6px;padding:10px 14px;font-size:14px;margin-top:12px }

.gcs-thanks { display:flex;flex-direction:column;gap:20px;padding:4px 0 8px }
.gcs-thanks__header { display:flex;align-items:center;gap:12px }
.gcs-thanks__check { display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;flex-shrink:0;background:#eaf7f1;color:#1a5c72;font-size:18px;font-weight:700 }
.gcs-thanks__sent { font-size:14px;color:#888;margin:0 }
.gcs-thanks__fase-card { background:linear-gradient(135deg,#eaf7f1,#e6f3f8);border:1.5px solid #c5e8da;border-radius:14px;padding:24px 28px }
.gcs-thanks__fase-label { font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#1a5c72;margin:0 0 8px }
.gcs-thanks__fase-number { font-size:30px;font-weight:800;color:#0b3d50;margin:0 0 8px;line-height:1.1 }
.gcs-thanks__tagline { font-size:16px;font-weight:600;color:#1a3d4a;margin:0 0 6px;line-height:1.4 }
.gcs-thanks__signal { font-size:14px;color:#4a7a88;margin:0;line-height:1.6 }
.gcs-thanks__action { background:#fffbf0;border-left:4px solid #e8a020;border-radius:0 10px 10px 0;padding:18px 22px }
.gcs-thanks__action-label { font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#b07010;margin:0 0 8px }
.gcs-thanks__action-text { font-size:15px;color:#3a2800;line-height:1.65;margin:0 }
.gcs-thanks__email-note { font-size:13px;color:#bbb;line-height:1.55;margin:0 }

.gcs-nav { display:flex;justify-content:space-between;align-items:center;padding-top:8px;border-top:1px solid #f0f0f0 }
.gcs-btn { border:none;border-radius:8px;padding:12px 24px;font-size:15px;font-weight:600;cursor:pointer;transition:background .15s,transform .1s,opacity .15s }
.gcs-btn:disabled { opacity:.45;cursor:not-allowed }
.gcs-btn:active { transform:scale(.97) }
.gcs-btn--primary { background:#1a5c72;color:#fff }
.gcs-btn--primary:hover:not(:disabled) { background:#154d60 }
.gcs-btn--ghost { background:transparent;color:#999 }
.gcs-btn--ghost:hover:not(:disabled) { background:#f5f5f4;color:#444 }
.gcs-btn--lg { font-size:16px;padding:14px 32px }

@media (max-width:700px) {
  .gcs-modal { padding:36px 24px 28px;border-radius:16px;max-height:96vh }
  .gcs-slider-wrap { grid-template-columns:1fr;grid-template-rows:auto auto auto }
  .gcs-slider-label--left { text-align:left;order:1;max-width:none }
  .gcs-slider-inner { order:2;max-width:none }
  .gcs-slider-label--right { text-align:left;order:3;max-width:none }
  .gcs-thanks__fase-number { font-size:22px }
}

/* =========================================================================
   v1.2.0 additions — welkomstscherm + preview-scherm
   ========================================================================= */

/* --- Welkomstscherm uitgebreid ------------------------------------------- */
.gcs-welcome__eyebrow {
  font-size: 11px; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: #1a5c72; margin: 0 0 12px;
}
.gcs-welcome__title {
  font-size: 24px; font-weight: 700; color: #0f1f28;
  margin: 0 0 20px; line-height: 1.3;
}
.gcs-welcome__bullets {
  list-style: none; padding: 0; margin: 0 0 24px;
  display: flex; flex-direction: column; gap: 10px;
}
.gcs-welcome__bullets li { font-size: 15px; color: #444; line-height: 1.5; }
.gcs-welcome__trust { font-size: 12px; color: #bbb; margin: 14px 0 0; }

/* --- Preview-scherm ------------------------------------------------------ */
.gcs-preview {
  display: flex; flex-direction: column; gap: 20px; padding: 4px 0 8px;
}
.gcs-preview__heading {
  font-size: 13px; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color: #1a5c72; margin: 0;
}
.gcs-preview__fase-reveal {
  background: linear-gradient(135deg, #eaf7f1, #e6f3f8);
  border: 1.5px solid #c5e8da; border-radius: 14px; padding: 24px 28px;
}
.gcs-preview__fase-label {
  font-size: 12px; font-weight: 600; color: #1a5c72;
  text-transform: uppercase; letter-spacing: .08em; margin: 0 0 6px;
}
.gcs-preview__fase-number {
  font-size: 34px; font-weight: 800; color: #0b3d50; margin: 0; line-height: 1;
}
.gcs-preview__locked-block {
  background: #f8f8f8; border: 1.5px dashed #ddd; border-radius: 12px;
  padding: 20px 24px; text-align: center;
  filter: blur(0); /* intentionally clear — content is hidden by design */
}
.gcs-preview__lock-icon { font-size: 22px; margin-bottom: 8px; }
.gcs-preview__lock-text { font-size: 14px; color: #888; margin: 0; line-height: 1.55; }
.gcs-preview__sub { font-size: 14px; color: #555; margin: 0; line-height: 1.6; }

/* S-curve visualisatie op preview-scherm */
.gcs-preview__curve {
  margin: 0 0 4px;
  padding: 8px 0 4px;
}
.gcs-preview__curve svg { overflow: visible; }
