@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700;800;900&display=swap');

:root {
  --d2q-dark:        #292929;
  --d2q-orange:      #fc8902;
  --d2q-orange-h:    #e07900;
  --d2q-orange-soft: rgba(252,137,2,.12);
  --d2q-bg:          #f5f6f8;
  --d2q-panel:       #ffffff;
  --d2q-border:      #e2e8f0;
  --d2q-text:        #292929;
  --d2q-muted:       #6b7280;
  --d2q-soft:        #fff8ef;
  --d2q-error:       #dc2626;
  --d2q-success:     #16a34a;
  --d2q-radius:      14px;
  --d2q-radius-sm:   8px;
  --d2q-shadow-card: 0 4px 28px rgba(41,41,41,.07);
  --d2q-transition:  .15s ease;
}

/* === Isolated page === */
.d2-quote-isolated-page { margin:0; background:var(--d2q-bg); color:var(--d2q-text); font-family:Arial,Helvetica,sans-serif; }
.d2-quote-isolated-wrap { max-width:840px; margin:0 auto; padding:32px 24px 48px; }
.d2-quote-app-shell { font-family:Arial,Helvetica,sans-serif; }
.d2q-app * { box-sizing:border-box; }
.d2q-app   { color:var(--d2q-text); }

/* === Header === */
.d2q-header { margin-bottom:28px; }
.d2q-logo { display:inline-block; font-family:'Montserrat',Arial,sans-serif; font-size:30px; font-weight:900; color:var(--d2q-dark); letter-spacing:-1px; line-height:1; text-decoration:none; margin-bottom:14px; }
.d2q-logo span { color:var(--d2q-orange); }
.d2q-header h1 { margin:0 0 6px; font-size:24px; font-weight:700; }
.d2q-header p  { margin:0; color:var(--d2q-muted); font-size:15px; }

/* === Step indicator === */
.d2q-steps { display:flex; align-items:center; margin-bottom:28px; }
.d2q-step  { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.d2q-step-num { width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; background:var(--d2q-border); color:var(--d2q-muted); flex-shrink:0; transition:background var(--d2q-transition),color var(--d2q-transition); }
.d2q-step-label { font-size:11px; font-weight:600; color:var(--d2q-muted); white-space:nowrap; transition:color var(--d2q-transition); }
.d2q-step-line { flex:1; height:2px; background:var(--d2q-border); margin:0 6px; min-width:8px; transition:background var(--d2q-transition); }
.d2q-step--active .d2q-step-num   { background:var(--d2q-orange); color:#fff; box-shadow:0 0 0 4px var(--d2q-orange-soft); }
.d2q-step--active .d2q-step-label { color:var(--d2q-dark); }
.d2q-step--done .d2q-step-num     { background:var(--d2q-dark); color:#fff; }
.d2q-step--done .d2q-step-label   { color:var(--d2q-dark); }
.d2q-step-line--done               { background:var(--d2q-dark); }

/* === Card === */
.d2q-card { background:var(--d2q-panel); border:1px solid var(--d2q-border); border-radius:var(--d2q-radius); padding:28px; box-shadow:var(--d2q-shadow-card); }
.d2q-card h2 { margin:0 0 4px; font-size:20px; font-weight:700; }
.d2q-sub { margin:0 0 22px; color:var(--d2q-muted); font-size:14px; }

/* === STEP 1: Area cards === */
.d2q-area-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-bottom:24px; }
.d2q-area-card { display:flex; align-items:flex-start; gap:14px; padding:18px; border:2px solid var(--d2q-border); border-radius:var(--d2q-radius-sm); cursor:pointer; background:#fff; user-select:none; outline:none; transition:border-color var(--d2q-transition),background var(--d2q-transition),box-shadow var(--d2q-transition); }
.d2q-area-card:hover { border-color:rgba(252,137,2,.4); background:var(--d2q-soft); }
.d2q-area-card:focus-visible { box-shadow:0 0 0 3px var(--d2q-orange-soft); border-color:var(--d2q-orange); }
.d2q-area-card.selected { border-color:var(--d2q-orange); background:var(--d2q-soft); }
.d2q-area-icon  { font-size:26px; line-height:1; flex-shrink:0; margin-top:2px; }
.d2q-area-body  { flex:1; min-width:0; }
.d2q-area-title { font-weight:700; font-size:15px; margin-bottom:4px; color:var(--d2q-dark); }
.d2q-area-desc  { font-size:13px; color:var(--d2q-muted); line-height:1.5; }
.d2q-area-check { width:22px; height:22px; border-radius:50%; flex-shrink:0; border:2px solid var(--d2q-border); background:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; transition:background var(--d2q-transition),border-color var(--d2q-transition),color var(--d2q-transition); }
.d2q-area-card.selected .d2q-area-check { background:var(--d2q-orange); border-color:var(--d2q-orange); color:#fff; }
.d2q-units-row   { margin-top:4px; }
.d2q-units-wrap  { display:flex; align-items:center; gap:12px; margin-top:6px; }
.d2q-units-input { max-width:120px; }
.d2q-units-help  { font-size:13px; color:var(--d2q-muted); }

/* === STEP 2: Sector === */
.d2q-sector-list { display:flex; flex-direction:column; gap:10px; }
.d2q-sector-card { display:flex; align-items:flex-start; gap:14px; padding:16px 18px; border:2px solid var(--d2q-border); border-radius:var(--d2q-radius-sm); cursor:pointer; background:#fff; user-select:none; outline:none; transition:border-color var(--d2q-transition),background var(--d2q-transition); }
.d2q-sector-card:hover { border-color:rgba(252,137,2,.4); background:var(--d2q-soft); }
.d2q-sector-card:focus-visible { box-shadow:0 0 0 3px var(--d2q-orange-soft); border-color:var(--d2q-orange); }
.d2q-sector-card.selected { border-color:var(--d2q-orange); background:var(--d2q-soft); }
.d2q-sector-icon  { font-size:24px; line-height:1; flex-shrink:0; margin-top:2px; }
.d2q-sector-body  { flex:1; min-width:0; }
.d2q-sector-title { font-weight:700; font-size:15px; margin-bottom:3px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.d2q-sector-desc  { font-size:13px; color:var(--d2q-muted); line-height:1.5; }
.d2q-sector-badge { display:inline-block; font-size:11px; font-weight:700; padding:2px 8px; border-radius:10px; background:#dcfce7; color:#166534; }
.d2q-sector-check { width:22px; height:22px; border-radius:50%; flex-shrink:0; border:2px solid var(--d2q-border); background:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; transition:background var(--d2q-transition),border-color var(--d2q-transition),color var(--d2q-transition); }
.d2q-sector-card.selected .d2q-sector-check { background:var(--d2q-orange); border-color:var(--d2q-orange); color:#fff; }

/* === STEP 3: Concern cards === */
.d2q-concern-grid { display:flex; flex-direction:column; gap:10px; }
.d2q-concern-card { display:flex; align-items:center; gap:14px; padding:14px 16px; border:2px solid var(--d2q-border); border-radius:var(--d2q-radius-sm); cursor:pointer; background:#fff; user-select:none; outline:none; transition:border-color var(--d2q-transition),background var(--d2q-transition); }
.d2q-concern-card:hover { border-color:rgba(252,137,2,.4); background:var(--d2q-soft); }
.d2q-concern-card:focus-visible { box-shadow:0 0 0 3px var(--d2q-orange-soft); border-color:var(--d2q-orange); }
.d2q-concern-card.selected { border-color:var(--d2q-orange); background:var(--d2q-soft); }
.d2q-concern-icon  { font-size:20px; width:28px; text-align:center; flex-shrink:0; }
.d2q-concern-title { flex:1; font-size:14px; font-weight:600; color:var(--d2q-dark); line-height:1.4; }
.d2q-concern-check { width:22px; height:22px; border-radius:50%; flex-shrink:0; border:2px solid var(--d2q-border); background:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; transition:background var(--d2q-transition),border-color var(--d2q-transition),color var(--d2q-transition); }
.d2q-concern-card.selected .d2q-concern-check { background:var(--d2q-orange); border-color:var(--d2q-orange); color:#fff; }

/* === STEP 4: Tier badge === */
.d2q-tier-badge { display:flex; align-items:center; gap:8px; flex-wrap:wrap; background:#f8f9fa; border:1px solid var(--d2q-border); border-radius:var(--d2q-radius-sm); padding:10px 16px; margin-bottom:20px; font-size:13px; color:var(--d2q-muted); }
.d2q-tier-badge strong { color:var(--d2q-dark); font-size:14px; }
.d2q-tier-badge-prefix { }
.d2q-tier-badge-range  { color:var(--d2q-muted); }
.d2q-sector-pill { display:inline-block; font-size:11px; font-weight:700; padding:2px 8px; border-radius:10px; background:#dcfce7; color:#166534; }

/* === STEP 4: Product rows === */
.d2q-pkg-section-label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--d2q-muted); margin:20px 0 10px; }
.d2q-pkg-section-label:first-child { margin-top:0; }
.d2q-pkg-section-label--opt { }
.d2q-pkg-list { display:flex; flex-direction:column; gap:8px; }
.d2q-pkg-row { display:flex; align-items:flex-start; gap:12px; padding:14px 16px; border:1.5px solid var(--d2q-border); border-radius:var(--d2q-radius-sm); background:#fafafa; transition:border-color var(--d2q-transition),background var(--d2q-transition); }
.d2q-pkg-row.selected { border-color:var(--d2q-orange); background:var(--d2q-soft); }
.d2q-pkg-check-wrap { padding-top:2px; flex-shrink:0; }
.d2q-toggle { width:18px; height:18px; cursor:pointer; accent-color:var(--d2q-orange); flex-shrink:0; }
.d2q-pkg-info  { flex:1; min-width:0; }
.d2q-pkg-name  { font-weight:700; font-size:14px; margin-bottom:4px; line-height:1.3; }
.d2q-pkg-desc  { font-size:13px; color:var(--d2q-muted); line-height:1.5; }
.d2q-pkg-price { flex-shrink:0; text-align:right; min-width:100px; }
.d2q-pkg-total { font-weight:700; font-size:15px; color:var(--d2q-dark); }
.d2q-pkg-scope { font-size:11px; color:var(--d2q-muted); white-space:nowrap; }
.d2q-product-badge { display:inline-block; font-size:10px; font-weight:700; padding:2px 7px; border-radius:4px; margin-left:7px; vertical-align:middle; background:#fef3c7; color:#92400e; }
.d2q-product-badge--rec { background:#dcfce7; color:#166534; }

/* === Trial card === */
.d2q-trial-card { border:2px dashed var(--d2q-border); border-radius:var(--d2q-radius-sm); padding:18px; background:#fafafa; transition:border-color var(--d2q-transition),background var(--d2q-transition); }
.d2q-trial-card.selected { border-color:var(--d2q-orange); border-style:solid; background:var(--d2q-soft); }
.d2q-trial-top { display:flex; align-items:flex-start; gap:14px; }
.d2q-trial-icon { font-size:28px; line-height:1; flex-shrink:0; margin-top:2px; }
.d2q-trial-info { flex:1; min-width:0; }
.d2q-trial-name { font-weight:700; font-size:15px; margin-bottom:6px; display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.d2q-trial-badge { display:inline-block; font-size:10px; font-weight:700; padding:2px 8px; border-radius:4px; background:var(--d2q-orange); color:#fff; }
.d2q-trial-desc { font-size:13px; color:var(--d2q-muted); line-height:1.6; }
.d2q-trial-right { flex-shrink:0; display:flex; flex-direction:column; align-items:flex-end; min-width:140px; }
.d2q-trial-inline { margin-top:14px; padding:10px 14px; background:var(--d2q-soft); border-radius:var(--d2q-radius-sm); border:1px solid rgba(252,137,2,.25); font-size:14px; font-weight:600; color:var(--d2q-orange); }

/* === Totals === */
.d2q-totals { margin-top:20px; padding:18px; background:var(--d2q-soft); border-radius:var(--d2q-radius-sm); border:1px solid rgba(252,137,2,.18); }
.d2q-totals-row { display:flex; justify-content:space-between; align-items:center; padding:6px 0; font-size:15px; }
.d2q-totals-row--grand { font-weight:700; font-size:20px; color:var(--d2q-orange); border-top:1.5px solid rgba(252,137,2,.25); padding-top:12px; margin-top:6px; }

/* === STEP 5: Cart === */
.d2q-cart-category { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--d2q-muted); margin:16px 0 6px; }
.d2q-cart-category:first-child { margin-top:0; }
.d2q-cart-item { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; padding:12px 0; border-bottom:1px solid var(--d2q-border); }
.d2q-cart-item:last-child { border-bottom:0; }
.d2q-cart-name  { font-weight:700; font-size:14px; }
.d2q-cart-meta  { font-size:12px; color:var(--d2q-muted); margin-top:3px; }
.d2q-cart-price { font-weight:700; font-size:15px; white-space:nowrap; flex-shrink:0; }

/* === Form === */
.d2q-label { display:block; margin:14px 0 6px; font-size:13px; font-weight:700; color:#374151; }
.d2q-label:first-child { margin-top:0; }
.d2q-input,.d2q-select,.d2q-textarea { width:100%; padding:11px 14px; border:1.5px solid var(--d2q-border); border-radius:var(--d2q-radius-sm); background:#fff; color:var(--d2q-text); font-size:15px; transition:border-color var(--d2q-transition),box-shadow var(--d2q-transition); appearance:none; -webkit-appearance:none; }
.d2q-input:focus,.d2q-select:focus,.d2q-textarea:focus { outline:none; border-color:var(--d2q-orange); box-shadow:0 0 0 3px var(--d2q-orange-soft); }
.d2q-input--error { border-color:var(--d2q-error)!important; }
.d2q-error-msg { font-size:12px; color:var(--d2q-error); margin-top:4px; display:none; }
.d2q-error-msg--show { display:block; }

/* === Buttons === */
.d2q-btn { display:inline-flex; align-items:center; gap:6px; border:none; border-radius:var(--d2q-radius-sm); padding:11px 20px; font-size:14px; font-weight:700; cursor:pointer; white-space:nowrap; transition:background var(--d2q-transition),transform .1s; text-decoration:none; }
.d2q-btn:active { transform:scale(.98); }
.d2q-btn--primary { background:var(--d2q-orange); color:#fff; }
.d2q-btn--primary:hover { background:var(--d2q-orange-h); }
.d2q-btn--dark    { background:var(--d2q-dark); color:#fff; }
.d2q-btn--dark:hover  { background:#111; }
.d2q-btn--ghost   { background:#f3f4f6; color:var(--d2q-dark); border:1.5px solid var(--d2q-border); }
.d2q-btn--ghost:hover { background:#e5e7eb; }
.d2q-btn--large   { padding:14px 28px; font-size:15px; }
.d2q-btn--loading { opacity:.7; pointer-events:none; cursor:not-allowed; }

/* === Layout === */
.d2q-nav { display:flex; justify-content:space-between; align-items:center; margin-top:20px; gap:12px; }
.d2q-nav--end { justify-content:flex-end; }
.d2q-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.d2q-grid-2  { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.d2q-status { min-height:22px; margin-top:12px; font-size:14px; }
.d2q-status--success { color:var(--d2q-success); font-weight:600; }
.d2q-status--error   { color:var(--d2q-error);   font-weight:600; }
.d2q-empty { text-align:center; padding:28px 16px; color:var(--d2q-muted); font-size:14px; }
.d2-quote-link-button { display:inline-flex; align-items:center; gap:8px; padding:13px 24px; border-radius:var(--d2q-radius-sm); background:var(--d2q-orange); color:#fff; text-decoration:none; font-weight:700; font-size:15px; transition:background var(--d2q-transition); }
.d2-quote-link-button:hover { background:var(--d2q-orange-h); }

/* === Large input variant (step 6) === */
.d2q-input--lg {
  padding: 15px 18px;
  font-size: 16px;
  min-height: 54px;
}

/* === Disclaimer block === */
.d2q-disclaimer {
  margin-top: 20px;
  padding: 14px 18px;
  background: #f8f9fa;
  border-left: 4px solid #e5e7eb;
  border-radius: 4px;
  font-size: 12px;
  color: var(--d2q-muted);
  line-height: 1.6;
}
.d2q-disclaimer strong { color: var(--d2q-dark); }

/* === Responsive === */
@media (max-width:680px) {
  .d2q-area-grid { grid-template-columns:1fr; }
  .d2q-grid-2    { grid-template-columns:1fr; }
  .d2q-step-label { display:none; }
  .d2q-trial-top { flex-wrap:wrap; }
  .d2q-trial-right { min-width:0; flex-direction:row; }
}
@media (max-width:480px) {
  .d2-quote-isolated-wrap { padding:14px 12px 32px; }
  .d2q-card  { padding:18px 16px; }
  .d2q-logo  { font-size:26px; }
  .d2q-header h1 { font-size:20px; }
  .d2q-actions { flex-direction:column; }
  .d2q-btn   { width:100%; justify-content:center; }
  .d2q-pkg-row { flex-wrap:wrap; }
  .d2q-pkg-price { width:100%; text-align:left; }
}
