#InteriorEstimator {
  font-family: inherit;
  color: var(--ie-ink);
}

#InteriorEstimator * {
  box-sizing: border-box;
}

.ie__launcher-wrap {
  max-width: 760px;
  margin: 0 auto;
  padding: 56px 24px;
  text-align: center;
  background: var(--ie-bg);
}

.ie__eyebrow,
.ie__kicker {
  color: var(--ie-accent);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.ie__heading {
  margin: 10px 0 12px;
  font-size: clamp(28px, 4vw, 46px);
  line-height: 1.1;
}

.ie__description {
  font-size: 16px;
  line-height: 1.6;
  opacity: 0.75;
}

.ie__description p {
  margin: 0;
}

.ie__launch,
.ie__next {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  border: 0;
  border-radius: 0;
  padding: 0.6rem 1.6rem;
  background: #933b2e;
  color: #ffffff;
  font-family: "Erstoria", Georgia, serif;
  font-size: 18px;
  font-weight: 100;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.2s, filter 0.2s;
  width: max-content;
}

.ie__launcher-wrap .ie__launch {
  margin-top: 26px;
}

.ie__launch:hover,
.ie__next:hover {
  filter: brightness(0.92);
  transform: translateY(-1px);
}

.ie__modal[hidden],
.ie__step[hidden] {
  display: none;
}

.ie__modal {
  position: fixed;
  z-index: 99999;
  inset: 0;
  justify-content: center;
  align-items: center;
}

.ie__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(16, 18, 16, 0.68);
  backdrop-filter: blur(5px);
}

.ie__dialog {
  position: relative;
  display: flex;
  flex-direction: column;
  width: min(920px, 100%);
  height: 100%;
  max-height: 100vh;
  margin: auto;
  background: #ffffff;
  overflow: hidden;
  border-radius: 0 !important;
  animation: ie-in 0.28s ease-out;
}

@keyframes ie-in {
  from {
    opacity: 0;
    transform: translateY(22px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.ie__topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 22px 32px;
  border-bottom: 1px solid #ebebe7;
}

.ie__brand {
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.ie__close {
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: #f2f2ee;
  color: #222222;
  font-size: 29px;
  line-height: 1;
  cursor: pointer;
}

.ie__progress-area {
  padding: 16px 32px 0;
}

.ie__progress-meta {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 700;
  color: #777777;
}

.ie__progress-track {
  height: 4px;
  margin-top: 9px;
  background: #ecece7;
  border-radius: 20px;
  overflow: hidden;
}

.ie__progress-track span {
  display: block;
  width: 20%;
  height: 100%;
  background: var(--ie-accent);
  transition: width 0.3s ease;
}

.ie__body {
  flex: 1;
  overflow: auto;
}

.ie__steps {
  width: min(650px, 100%);
  margin: 0 auto;
  padding: 55px 32px;
}

.ie__step {
  animation: ie-step 0.24s ease-out;
}

@keyframes ie-step {
  from {
    opacity: 0;
    transform: translateX(12px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.ie__step h2 {
  margin: 9px 0 10px;
  font-size: clamp(27px, 4vw, 40px);
  line-height: 1.15;
  letter-spacing: -0.03em;
}

.ie__intro {
  margin: 0 0 30px;
  color: #656565;
  line-height: 1.55;
}

.ie__choice-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.ie__bhk-grid {
  grid-template-columns: repeat(3, 1fr);
}

.ie__choice,
.ie__package {
  border: 1px solid #dddeda;
  border-radius: 0 !important;
  background: #ffffff;
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: border 0.18s, background 0.18s, transform 0.18s;
}

.ie__choice {
  min-height: 102px;
  padding: 18px;
}

.ie__choice:hover,
.ie__package:hover {
  transform: translateY(-2px);
  border-color: #aaaaaa;
}

.ie__choice.is-selected,
.ie__package.is-selected {
  border: 2px solid var(--ie-accent);
  background: color-mix(in srgb, var(--ie-accent) 6%, white);
}

.ie__choice strong,
.ie__package strong {
  display: block;
  font-size: 16px;
}

.ie__choice small,
.ie__package small,
.ie__counter-row small {
  display: block;
  margin-top: 6px;
  color: #747474;
  font-size: 12px;
  line-height: 1.35;
}

.ie__counters {
  border-top: 1px solid #e6e6e1;
}

.ie__counter-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 17px 0;
  border-bottom: 1px solid #e6e6e1;
}

.ie__counter-row strong {
  font-size: 16px;
}

.ie__counter {
  display: grid;
  grid-template-columns: 36px 40px 36px;
  align-items: center;
  text-align: center;
}

.ie__counter button {
  height: 36px;
  border: 1px solid #d9d9d5;
  border-radius: 50%;
  background: #ffffff;
  font-size: 21px;
  line-height: 1;
  cursor: pointer;
}

.ie__counter output {
  font-weight: 700;
}

.ie__packages {
  display: grid;
  gap: 12px;
}

.ie__package {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px;
}

.ie__package b {
  display: none !important;
  font-size: 13px;
  white-space: nowrap;
  color: var(--ie-accent);
}

.ie__form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.ie__form label {
  font-size: 13px;
  font-weight: 700;
}

.ie__form input {
  display: block;
  width: 100%;
  margin-top: 7px;
  padding: 13px 0;
  border: 0;
  border-bottom: 1px solid #bbbbbb;
  background: transparent;
  color: inherit;
  font: inherit;
  outline: none;
}

.ie__form input:focus {
  border-color: var(--ie-accent);
  border-bottom-width: 2px;
}

.ie__form-error {
  grid-column: 1 / -1;
  margin: 0;
  color: #c1272d;
  font-size: 13px;
}

.ie__footer {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 32px;
  border-top: 1px solid #ebebe7;
  background: #ffffff;
}

.ie__back {
  border: 0;
  background: transparent;
  color: #333333;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.ie__back[disabled] {
  visibility: hidden;
}

.ie__result {
  text-align: center;
}

.ie__result-check {
  display: grid;
  place-items: center;
  width: 45px;
  height: 45px;
  margin: 0 auto 18px;
  border-radius: 50%;
  background: #e4f0e5;
  color: #31743c;
  font-weight: bold;
  font-size: 25px;
}

.ie__result h2 {
  margin-bottom: 8px;
}

.ie__result > p {
  margin: 0;
  color: #666666;
}

.ie__estimate {
  margin: 10px 0 3px;
  color: var(--ie-accent);
  font-size: clamp(40px, 8vw, 64px);
  font-weight: 800;
  letter-spacing: -0.05em;
}

.ie__range {
  font-size: 13px;
}

.ie__summary {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 28px 0 20px;
}

.ie__summary span {
  padding: 8px 12px;
  border-radius: 99px;
  background: #f1f1ed;
  font-size: 12px;
  font-weight: 700;
}

.ie__disclaimer {
  max-width: 490px;
  margin: 0 auto !important;
  font-size: 12px;
  line-height: 1.5;
}

.ie__result-actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 26px;
}

.ie__secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 13px 20px;
  border: 1px solid #1c1c1c;
  border-radius: 999px;
  color: #1c1c1c;
  font-weight: 700;
  text-decoration: none;
}

@media (min-width: 721px) {
  .ie__dialog {
    height: min(760px, 94vh);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.24);
  }
}

@media (max-width: 720px) {
  .ie__topbar {
    padding: 17px 20px;
  }

  .ie__progress-area {
    padding: 14px 20px 0;
  }

  .ie__steps {
    padding: 35px 20px;
  }

  .ie__footer {
    padding: 14px 20px;
  }

  .ie__bhk-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .ie__choice {
    min-height: 88px;
    padding: 15px;
  }

  .ie__form {
    grid-template-columns: 1fr;
  }

  .ie__package {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }

  .ie__result-actions {
    flex-direction: column;
  }

  .ie__result-actions > * {
    width: 100%;
  }
}

@media (max-width: 360px) {
  .ie__choice-grid {
    grid-template-columns: 1fr;
  }

  .ie__bhk-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}