/* =====================================================================
   Shaurya Dev Group — Calculator & quote-form styles
   ===================================================================== */
.sdg-calc, .sdg-quote { width: min(1120px, 100%); margin-inline: auto; }
.sdg-calc__head, .sdg-quote__head { text-align:center; margin-bottom: 34px; }
.sdg-calc__title { font-size: clamp(1.6rem, 3.5vw, 2.4rem); }
.sdg-calc__sub { color: var(--sdg-muted); max-width: 560px; margin: 6px auto 0; }

.sdg-calc__grid { display:grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.sdg-calc__grid--single { grid-template-columns: 1fr; max-width: 720px; margin-inline:auto; }
.sdg-calc__panel { background:#fff; border-radius: var(--sdg-radius); padding: 30px; box-shadow: var(--sdg-shadow); border:1px solid var(--sdg-line); }
.sdg-calc__panel h4 { font-family:'Cinzel'; color: var(--sdg-maroon); margin-bottom: 18px; }
.sdg-calc__panel--dark { background: var(--sdg-maroon-grad); color:#f4e6c8; border:none; position:relative; overflow:hidden; }
.sdg-calc__panel--dark::before { content:""; position:absolute; inset:0; background: radial-gradient(circle at 90% 10%, rgba(212,175,55,.3), transparent 55%); }
.sdg-calc__panel--dark > * { position: relative; z-index:2; }
.sdg-calc__panel--dark h4 { color:#fff; }

.sdg-label { display:block; font-weight:600; font-size: 14px; color: var(--sdg-dark); margin: 16px 0 6px; }
.sdg-calc__panel--dark .sdg-label { color:#f4e6c8; }
.sdg-bill-value { font-family:'Cinzel'; font-size: 1.8rem; font-weight:700; color: var(--sdg-maroon); margin-bottom: 8px; }

.sdg-range { -webkit-appearance:none; appearance:none; width:100%; height: 8px; border-radius: 999px; background: linear-gradient(90deg, var(--sdg-gold) 0%, var(--sdg-gold) 40%, #ecdfc6 40%); outline:none; }
.sdg-range::-webkit-slider-thumb { -webkit-appearance:none; width: 24px; height:24px; border-radius:50%; background: var(--sdg-maroon-grad); border: 3px solid var(--sdg-gold); cursor:pointer; box-shadow: 0 4px 10px rgba(0,0,0,.25); }
.sdg-range::-moz-range-thumb { width: 24px; height:24px; border-radius:50%; background: var(--sdg-maroon); border: 3px solid var(--sdg-gold); cursor:pointer; }
.sdg-range-scale { display:flex; justify-content: space-between; font-size: 12px; color: var(--sdg-muted); margin-top: 6px; }

.sdg-reco { display:grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin: 24px 0; }
.sdg-reco--4 { grid-template-columns: repeat(4,1fr); }
.sdg-reco__item { background: var(--sdg-cream); border-radius: 14px; padding: 16px 10px; text-align:center; border-bottom: 3px solid var(--sdg-gold); }
.sdg-reco__item span { display:block; font-family:'Cinzel'; font-weight:700; font-size: 1.25rem; color: var(--sdg-maroon); }
.sdg-reco__item small { color: var(--sdg-muted); font-size: 12px; }

.sdg-big { font-family:'Cinzel'; font-size: 2.8rem; font-weight:800; color: var(--sdg-gold-soft); line-height:1; }
.sdg-big-label { color:#f4e6c8; margin-bottom: 20px; letter-spacing:.04em; }
.sdg-split { display:grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 18px; }
.sdg-split div { background: rgba(255,255,255,.1); border-radius: 12px; padding: 12px; font-size: 13.5px; }
.sdg-split strong { display:block; font-family:'Cinzel'; font-size: 1.15rem; color:#fff; margin-top: 4px; }
.sdg-savings-row { display:grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 18px; }
.sdg-savings-row span { font-family:'Cinzel'; font-size: 1.5rem; font-weight:700; color:#fff; display:block; }
.sdg-savings-row small { color:#f4e6c8; font-size: 12.5px; }
.sdg-total25 { border-top: 1px dashed rgba(255,255,255,.3); padding-top: 14px; font-size: 14px; display:flex; justify-content: space-between; align-items:center; }
.sdg-total25 strong { font-family:'Cinzel'; font-size: 1.2rem; color: var(--sdg-gold-soft); }
.sdg-calc__panel--dark .sdg-btn { margin-top: 20px; width:100%; justify-content:center; }
.sdg-savings-calc .sdg-calc__panel .sdg-btn { margin-top: 8px; }

/* ---------- Quote form ---------- */
.sdg-quote__form { max-width: 620px; margin-inline:auto; background:#fff; border-radius: var(--sdg-radius); padding: 32px; box-shadow: var(--sdg-shadow); border-top: 5px solid transparent; border-image: var(--sdg-gold-grad) 1; }
.sdg-steps { display:flex; justify-content: space-between; margin-bottom: 26px; counter-reset: step; }
.sdg-steps span { flex:1; text-align:center; font-size: 13px; color: var(--sdg-muted); font-weight:600; padding-bottom: 10px; border-bottom: 3px solid var(--sdg-line); }
.sdg-steps span.is-active { color: var(--sdg-maroon); border-color: var(--sdg-gold); }
.sdg-step { display:none; animation: sdg-fade .4s ease; }
.sdg-step.is-active { display:block; }
@keyframes sdg-fade { from{opacity:0; transform: translateY(10px);} to{opacity:1;transform:none;} }
.sdg-input, .sdg-select { width:100%; padding: 13px 16px; border:2px solid var(--sdg-line); border-radius: 12px; font-family:'Jost'; font-size: 15px; margin-bottom: 6px; background:#fff; transition: border-color .25s ease; }
.sdg-input:focus, .sdg-select:focus { outline:none; border-color: var(--sdg-gold); }
.sdg-toggle { display:flex; gap: 10px; margin-bottom: 8px; }
.sdg-toggle button { flex:1; padding: 12px; border-radius: 12px; border:2px solid var(--sdg-line); background:#fff; font-weight:600; cursor:pointer; transition: .25s; font-family:'Jost'; }
.sdg-toggle button.is-active { background: var(--sdg-maroon-grad); color:#fff; border-color: var(--sdg-maroon); }
.sdg-estimate { background: var(--sdg-cream); border-radius: 12px; padding: 14px; text-align:center; margin: 14px 0; font-size: 14.5px; }
.sdg-estimate strong { color: var(--sdg-maroon); font-family:'Cinzel'; }
.sdg-step-nav { display:flex; gap: 12px; margin-top: 8px; }
.sdg-step-nav .sdg-btn { flex:1; justify-content:center; }
.sdg-step .sdg-btn--gold { width:100%; justify-content:center; margin-top: 8px; }
.sdg-quote__done { text-align:center; padding: 20px; }
.sdg-quote__done h3 { color: var(--sdg-maroon); }
.sdg-check { width: 70px; height:70px; border-radius:50%; background: var(--sdg-gold-grad); color:#3a2400; font-size: 2rem; display:flex; align-items:center; justify-content:center; margin: 0 auto 16px; }
.sdg-form-error { color: #b3261e; font-size: 14px; margin-top: 8px; text-align:center; }

@media (max-width: 760px) {
	.sdg-calc__grid { grid-template-columns: 1fr; }
	.sdg-reco--4 { grid-template-columns: repeat(2,1fr); }
}