.curtain-calc { max-width: 900px; margin: 0 auto; font-family: inherit; }
.cc-steps { display: flex; gap: 10px; margin-bottom: 20px; }
.cc-step { border: 0; padding: 12px 14px; border-radius: 999px; cursor: pointer; opacity: .6; }
.cc-step.is-active { opacity: 1; font-weight: 700; }
.cc-step span { margin-left: 8px; background: rgba(0,0,0,.08); border-radius: 999px; padding: 2px 8px; }

.cc-panel { display: none; border: 1px solid rgba(0,0,0,.12); border-radius: 14px; padding: 20px; }
.cc-panel.is-active { display: block; }

.cc-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.cc-btn .cc-btn-secondary  { background: #000000; border: 1px solid rgba(0,0,0,.22); }
#curtainCalcWrap {
  display: none;
  margin-top: 16px;
}

@media (max-width: 700px) { .cc-row { grid-template-columns: 1fr; } }

.cc-field label { display:block; margin-bottom: 8px; font-weight: 600; }
.cc-field input, .cc-field select { width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid rgba(0,0,0,.18); }
.cc-field small { display:block; margin-top: 8px; opacity: .75; }

.cc-actions { display:flex; gap: 12px; margin-top: 18px; }
.cc-btn { padding: 12px 16px; border-radius: 999px; border: 0; cursor:pointer; }
.cc-btn-secondary { background: #000000; border: 1px solid rgba(0,0,0,.22); }

.cc-summary { margin-bottom: 14px; }
.cc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 700px) { .cc-grid { grid-template-columns: 1fr; } }

.cc-qty { display:flex; align-items:center; gap: 10px; margin: 16px 0; }
.cc-qty button { width: unset; height: unset; border-radius: 999px; border: 1px solid rgba(0,0,0,.2); background: #000000; cursor:pointer; }

.cc-total { display:flex; justify-content: space-between; align-items:center; padding: 14px; border-radius: 12px; border: 1px solid rgba(0,0,0,.12); }
.cc-total-label { font-weight: 700; }
.cc-total-value { font-size: 22px; font-weight: 800; }

.cc-note { margin-top: 10px; color: #b00020; }