:root{
  --bg:#000;--bg2:#111;--border:#f5f5f5;--text:#f5f5f5;--text2:#aaa;--muted:#555;
  --accent:#b8ff06;--pink:#FF90E8;--orange:#FF6B35;--error:#FF2D7B;
  --shadow-4:4px 4px 0 0 var(--border);--shadow-6:6px 6px 0 0 var(--border);--shadow-8:8px 8px 0 0 var(--border);
  --shadow-a4:4px 4px 0 0 var(--accent);--shadow-a6:6px 6px 0 0 var(--accent);
  --fh:'Space Grotesk',system-ui,sans-serif;--fb:'Inter',system-ui,sans-serif;--fm:'JetBrains Mono',monospace;
  --snap:0.12s ease;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px}
body{font-family:var(--fb);background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;line-height:1.6}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* BG */
.ambient-bg{position:fixed;inset:0;z-index:0;pointer-events:none}
.grid-overlay{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(184,255,6,.06) 1px,transparent 1px);background-size:32px 32px}

/* LAYOUT */
.onboarding-container{position:relative;z-index:1;max-width:760px;margin:0 auto;padding:24px 20px 40px;min-height:100vh;display:flex;flex-direction:column}

/* HEADER */
.brand-header{padding:12px 0 20px;border-bottom:3px solid var(--border);margin-bottom:24px;display:flex;align-items:center}
.brand-logo{display:flex;align-items:center;gap:12px}
.brand-name{font-family:var(--fh);font-weight:700;font-size:1.4rem;letter-spacing:-.06em;text-transform:uppercase}
.accent-text{font-style:normal;color:var(--accent)}
.brand-tagline{font-family:var(--fm);font-size:.65rem;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;border-left:2px solid #333;padding-left:12px}

/* PROGRESS */
.progress-container{margin-bottom:24px}
.progress-track{height:6px;background:#222;border:2px solid var(--border);overflow:hidden;margin-bottom:14px}
.progress-fill{height:100%;width:14.28%;background:var(--accent);transition:width .35s cubic-bezier(.22,1,.36,1)}
.progress-steps{display:flex;justify-content:space-between}
.progress-step{display:flex;align-items:center;gap:6px}
.step-dot{width:26px;height:26px;background:var(--bg2);border:2px solid #333;display:flex;align-items:center;justify-content:center;transition:var(--snap)}
.step-number{font-size:.65rem;font-weight:700;font-family:var(--fm);color:#555;transition:var(--snap)}
.step-label{font-size:.6rem;font-weight:700;font-family:var(--fm);color:#555;text-transform:uppercase;letter-spacing:.08em}
.progress-step.active .step-dot{border-color:var(--accent);background:var(--accent)}
.progress-step.active .step-number{color:#000}
.progress-step.active .step-label{color:var(--accent)}
.progress-step.completed .step-dot{border-color:var(--accent);background:var(--accent)}
.progress-step.completed .step-number{color:#000}
@media(max-width:700px){.step-label{display:none}}

/* CARD */
.glass-card{background:var(--bg2);border:3px solid var(--border);padding:36px 32px;box-shadow:var(--shadow-6)}
@media(max-width:600px){.glass-card{padding:24px 18px;box-shadow:var(--shadow-4)}}

/* TRANSITIONS */
.form-step{display:none;animation:stepIn .25s cubic-bezier(.22,1,.36,1) forwards}
.form-step.active{display:block}
.form-step.exiting{animation:stepOut .15s ease-in forwards}
@keyframes stepIn{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:translateX(0)}}
@keyframes stepOut{from{opacity:1}to{opacity:0;transform:translateX(-40px)}}

/* STEP HEADER */
.step-header{margin-bottom:28px}
.step-tag{display:inline-block;font-size:.65rem;font-weight:700;font-family:var(--fm);text-transform:uppercase;letter-spacing:.12em;color:#000;background:var(--accent);padding:4px 12px;margin-bottom:14px;border:2px solid var(--border);box-shadow:2px 2px 0 0 var(--border)}
.step-title{font-family:var(--fh);font-size:clamp(1.4rem,4vw,2rem);font-weight:700;letter-spacing:-.05em;line-height:1.05;margin-bottom:8px}
.step-subtitle{font-size:.88rem;color:var(--text2)}

/* FIELDS */
.fields-group{display:flex;flex-direction:column;gap:20px}
.fields-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:550px){.fields-row{grid-template-columns:1fr}}
.field-label{display:block;font-size:.72rem;font-weight:700;font-family:var(--fm);color:var(--text);margin-bottom:6px;text-transform:uppercase;letter-spacing:.06em}
.field-input{width:100%;padding:14px 16px;background:#000;border:2px solid #444;color:var(--text);font-family:var(--fb);font-size:.92rem;transition:var(--snap);outline:none}
.field-input::placeholder{color:#444}
.field-input:hover{border-color:#666}
.field-input:focus{border-color:var(--accent);box-shadow:var(--shadow-a4);transform:translate(-2px,-2px)}
.field-input.invalid{border-color:var(--error);box-shadow:4px 4px 0 0 var(--error);transform:translate(-2px,-2px)}
.field-input.valid{border-color:var(--accent)}
.field-textarea{resize:vertical;min-height:90px;line-height:1.5}
.field-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;cursor:pointer}
.field-select option{background:#111;color:var(--text)}
.field-error{display:block;font-size:.68rem;font-weight:700;font-family:var(--fm);color:var(--error);margin-top:4px;min-height:1em;text-transform:uppercase;letter-spacing:.04em;opacity:0;transition:var(--snap)}
.field-error.visible{opacity:1}
.char-counter{font-size:.68rem;color:var(--muted);text-align:right;margin-top:2px;font-family:var(--fm);font-weight:700}

/* METRIC CARDS */
.metric-cards{display:flex;flex-direction:column;gap:10px}
.metric-card{cursor:pointer}
.metric-card-inner{display:flex;align-items:center;gap:14px;padding:16px 18px;background:#111;border:2px solid #333;transition:var(--snap);position:relative}
.metric-card-inner:hover{border-color:var(--accent);transform:translate(-4px,-4px);box-shadow:var(--shadow-a4)}
.metric-card input:checked~.metric-card-inner{border-color:var(--accent);background:#0a1a00;box-shadow:var(--shadow-a6);transform:translate(-6px,-6px)}
.metric-icon{width:44px;height:44px;background:#1a1a1a;border:2px solid #444;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0;transition:var(--snap)}
.metric-card input:checked~.metric-card-inner .metric-icon{background:var(--accent);color:#000;border-color:var(--border)}
.metric-content{flex:1}
.metric-title{display:block;font-family:var(--fh);font-weight:700;font-size:.92rem;letter-spacing:-.02em}
.metric-desc{display:block;font-size:.72rem;color:#666}
.metric-check{opacity:0;color:var(--accent);font-weight:700;transition:.15s ease}
.metric-card input:checked~.metric-card-inner .metric-check{opacity:1}

/* YES/NO INLINE PILLS */
.state-question{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 0;border-bottom:1px solid #222}
.state-question:last-child{border-bottom:none}
.state-label{flex:1;font-size:.85rem;font-weight:600;min-width:200px}
.yn-inline{display:flex;gap:8px}
.yn-pill{cursor:pointer}
.yn-pill-inner{display:block;padding:8px 20px;background:#111;border:2px solid #333;font-family:var(--fm);font-size:.75rem;font-weight:700;text-transform:uppercase;transition:var(--snap)}
.yn-pill-inner:hover{border-color:var(--accent);transform:translate(-2px,-2px);box-shadow:2px 2px 0 0 var(--accent)}
.yn-pill input:checked~.yn-pill-inner{background:var(--accent);color:#000;border-color:var(--border);box-shadow:var(--shadow-a4);transform:translate(-4px,-4px)}

/* SERVICES GRID */
.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media(max-width:600px){.services-grid{grid-template-columns:repeat(2,1fr)}}
.service-card{cursor:pointer}
.service-inner{text-align:center;padding:18px 8px;background:#111;border:2px solid #333;transition:var(--snap)}
.service-inner:hover{border-color:var(--accent);transform:translate(-3px,-3px);box-shadow:3px 3px 0 0 var(--accent)}
.service-card input:checked~.service-inner{background:var(--accent);color:#000;border-color:var(--border);box-shadow:var(--shadow-a4);transform:translate(-4px,-4px)}
.service-emoji{display:block;font-size:1.5rem;margin-bottom:6px}
.service-name{display:block;font-family:var(--fm);font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.service-desc{display:block;font-size:0.65rem;color:#aaa;margin-top:8px;line-height:1.3;font-family:var(--fm);text-transform:none;letter-spacing:0}
.service-card input:checked~.service-inner .service-desc{color:#333}

/* TIMELINE CARDS */
.timeline-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:550px){.timeline-cards{grid-template-columns:1fr}}
.timeline-card{cursor:pointer}
.timeline-inner{text-align:center;padding:24px 14px;background:#111;border:2px solid #333;transition:var(--snap)}
.timeline-inner:hover{border-color:var(--accent);transform:translate(-4px,-4px);box-shadow:var(--shadow-a4)}
.timeline-card input:checked~.timeline-inner{background:#0a1a00;border-color:var(--accent);box-shadow:var(--shadow-a6);transform:translate(-6px,-6px)}
.timeline-icon{display:block;font-size:1.8rem;margin-bottom:8px}
.timeline-title{display:block;font-family:var(--fh);font-weight:700;font-size:.95rem;margin-bottom:4px}
.timeline-desc{display:block;font-size:.72rem;color:#666}

/* BUDGET CARDS */
.budget-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:550px){.budget-cards{grid-template-columns:1fr}}
.budget-card{cursor:pointer}
.budget-card input{position:absolute;opacity:0;pointer-events:none}
.budget-card-inner{position:relative;padding:28px 14px;text-align:center;background:#111;border:2px solid #333;transition:var(--snap);overflow:hidden}
.budget-card-inner:hover{border-color:var(--accent);transform:translate(-4px,-4px);box-shadow:var(--shadow-a6)}
.budget-card input:checked~.budget-card-inner{border-color:var(--accent);background:#0a1a00;box-shadow:var(--shadow-a6);transform:translate(-6px,-6px)}
.budget-badge{position:absolute;top:0;right:0;font-size:.55rem;font-weight:700;font-family:var(--fm);text-transform:uppercase;background:var(--pink);color:#000;padding:3px 8px;letter-spacing:.08em;border-left:2px solid var(--border);border-bottom:2px solid var(--border)}
.budget-tier{font-size:.65rem;font-weight:700;font-family:var(--fm);color:var(--muted);text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px}
.budget-range{font-family:var(--fh);font-size:clamp(1.1rem,3vw,1.5rem);font-weight:700;letter-spacing:-.03em;color:var(--accent);margin-bottom:6px}
.budget-desc{font-size:.7rem;color:#555;margin-bottom:10px}
.budget-check{opacity:0;color:var(--accent);font-weight:700;font-size:1.2rem;transition:.15s ease}
.budget-card input:checked~.budget-card-inner .budget-check{opacity:1}

/* BUTTONS */
.step-actions{margin-top:28px;display:flex;justify-content:flex-end}
.step-actions-between{justify-content:space-between}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border:none;font-family:var(--fh);font-size:.82rem;font-weight:700;cursor:pointer;text-transform:uppercase;letter-spacing:.05em;transition:transform .1s ease,box-shadow .1s ease}
.btn:disabled{opacity:.35;cursor:not-allowed}
.btn-primary{background:var(--accent);color:#000;border:2px solid var(--border);box-shadow:var(--shadow-4);transform:translate(-4px,-4px)}
.btn-primary:hover:not(:disabled){box-shadow:var(--shadow-6);transform:translate(-6px,-6px)}
.btn-primary:active:not(:disabled){transform:translate(0,0);box-shadow:none}
.btn-ghost{background:transparent;color:var(--text2);border:2px solid #444;transform:none}
.btn-ghost:hover{color:var(--text);border-color:var(--border);transform:translate(-2px,-2px);box-shadow:2px 2px 0 0 var(--border)}
.btn-ghost:active{transform:translate(0,0);box-shadow:none}
.btn-submit{background:var(--accent);color:#000;border:2px solid var(--border);box-shadow:var(--shadow-6);transform:translate(-6px,-6px);padding:14px 32px;font-size:.85rem}
.btn-submit:hover:not(:disabled){box-shadow:var(--shadow-8);transform:translate(-8px,-8px)}
.btn-submit:active:not(:disabled){transform:translate(0,0);box-shadow:none}
.btn-submit.loading .btn-text,.btn-submit.loading .btn-icon{opacity:0}
.btn-submit.loading .btn-spinner{opacity:1}
.btn-submit.loading{transform:translate(0,0);box-shadow:none}
.btn-spinner{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0;animation:spin .7s linear infinite}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.btn-icon{transition:transform .1s ease}

/* SUCCESS SCREEN */
.success-screen{display:none;animation:successIn .25s ease forwards}
.success-screen.active{display:block}
@keyframes successIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.success-content{padding:32px 0;text-align:center}
.success-check-wrap{margin:0 auto 24px;width:90px;height:90px;position:relative}
.success-check-box{width:90px;height:90px;background:var(--accent);border:3px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:700;color:#000;animation:checkPop .3s ease both}
@keyframes checkPop{from{transform:scale(0)}to{transform:scale(1)}}
.success-title{font-family:var(--fh);font-size:clamp(1.6rem,5vw,2.4rem);font-weight:700;letter-spacing:-.05em;margin-bottom:10px;color:var(--accent);text-transform:uppercase}
.success-subtitle{font-size:.92rem;color:var(--text2);max-width:500px;margin:0 auto 28px;line-height:1.5}
.success-subtitle strong{color:var(--accent)}

/* SUMMARY CARD */
.summary-card{text-align:left;max-width:600px;margin:0 auto 28px;background:var(--bg2);border:3px solid var(--border);box-shadow:var(--shadow-6)}
.summary-header{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;background:var(--accent);border-bottom:3px solid var(--border)}
.summary-header-text{font-family:var(--fh);font-weight:700;font-size:.85rem;text-transform:uppercase;letter-spacing:-.02em;color:#000}
.summary-date{font-family:var(--fm);font-size:.65rem;color:#333}
.summary-section{padding:16px 20px;border-bottom:2px solid #222}
.summary-section:last-of-type{border-bottom:none}
.summary-section-title{font-family:var(--fm);font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);margin-bottom:10px}
.summary-grid{display:flex;flex-direction:column;gap:6px}
.summary-row{display:flex;justify-content:space-between;gap:12px;font-size:.85rem;padding:4px 0}
.summary-label{color:var(--muted);font-weight:600;flex-shrink:0}
.summary-value{color:var(--text);font-weight:600;text-align:right;word-break:break-word}
.summary-footer{padding:14px 20px;border-top:2px solid #333;display:flex;justify-content:space-between;align-items:center}
.summary-brand{font-family:var(--fh);font-size:.75rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:-.02em}
.summary-contact-info{font-family:var(--fm);font-size:.62rem;color:var(--muted)}

.success-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* FOOTER */
.site-footer{position:relative;z-index:1;text-align:center;padding:24px 20px;border-top:2px solid #222;display:flex;justify-content:space-between;max-width:760px;margin:0 auto;font-size:.7rem;color:var(--muted);font-family:var(--fm)}

/* KEYBOARD HINT */
.keyboard-hint{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);font-size:.65rem;color:#444;font-family:var(--fm);font-weight:700;display:flex;align-items:center;gap:6px;opacity:.5;pointer-events:none}
.keyboard-hint.hidden{opacity:0}
kbd{font-family:var(--fm);font-size:.62rem;font-weight:700;background:#1a1a1a;border:2px solid #333;padding:2px 8px}

/* FIELD ENTRANCE */
.field{animation:fieldIn .2s ease both}
.field:nth-child(1){animation-delay:.03s}.field:nth-child(2){animation-delay:.06s}.field:nth-child(3){animation-delay:.09s}
@keyframes fieldIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}

/* PRINT STYLES — preserve dark theme + accent colors */
*{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;color-adjust:exact!important}
@media print{
  @page{margin:1cm;size:A4}
  html,body{background:#000!important;color:#f5f5f5!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;color-adjust:exact!important}
  .ambient-bg,.progress-container,.form-wrapper,.keyboard-hint,.success-actions,.site-footer{display:none!important}
  .brand-header{display:flex!important;border-bottom:3px solid #b8ff06!important;padding:8px 0 12px!important;margin-bottom:16px!important}
  .brand-name{color:#f5f5f5!important}.accent-text{color:#b8ff06!important}
  .brand-tagline{color:#888!important}
  .success-screen{display:block!important}
  .success-check-wrap{display:flex!important;justify-content:center!important;margin-bottom:16px!important}
  .success-check-box{background:#b8ff06!important;color:#000!important;border:3px solid #f5f5f5!important;width:60px!important;height:60px!important;font-size:1.8rem!important}
  .success-title{color:#b8ff06!important;font-size:1.6rem!important;margin-bottom:6px!important}
  .success-subtitle{color:#aaa!important;font-size:.82rem!important;margin-bottom:20px!important}
  .success-subtitle strong{color:#b8ff06!important}
  .success-content{padding:0!important}
  .summary-card{max-width:100%!important;border:3px solid #f5f5f5!important;box-shadow:none!important;margin:0 auto 16px!important;background:#111!important}
  .summary-header{background:#b8ff06!important;padding:10px 16px!important;border-bottom:3px solid #f5f5f5!important}
  .summary-header-text{color:#000!important;font-size:.8rem!important}
  .summary-date{color:#333!important}
  .summary-section{padding:12px 16px!important;border-bottom:2px solid #333!important;background:#111!important}
  .summary-section:last-of-type{border-bottom:none!important}
  .summary-section-title{color:#b8ff06!important;font-size:.62rem!important}
  .summary-row{font-size:.78rem!important;padding:3px 0!important}
  .summary-label{color:#888!important}
  .summary-value{color:#f5f5f5!important}
  .summary-footer{background:#111!important;border-top:2px solid #333!important;padding:10px 16px!important}
  .summary-brand{color:#b8ff06!important}
  .summary-contact-info{color:#888!important}
  .onboarding-container{padding:0!important;min-height:auto!important;max-width:100%!important}
}
body.printing .onboarding-container>*:not(.success-screen):not(.brand-header){display:none!important}
body.printing .success-screen{display:block!important}
body.printing .success-actions{display:none!important}

/* SPLASH SCREEN */
.splash-screen {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: var(--bg);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}
.splash-screen.fade-out {
  opacity: 0;
  visibility: hidden;
}
.splash-content {
  text-align: center;
  animation: splashPulse 1.5s cubic-bezier(0.22, 1, 0.36, 1) infinite alternate;
}
.splash-logo {
  font-family: var(--fh);
  font-weight: 700;
  font-size: 2.5rem;
  letter-spacing: -0.06em;
  text-transform: uppercase;
  color: var(--text);
  margin-bottom: 8px;
}
.splash-subtitle {
  font-family: var(--fm);
  font-size: 0.85rem;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
@keyframes splashPulse {
  from { transform: scale(0.98); opacity: 0.8; }
  to { transform: scale(1.02); opacity: 1; }
}