.estimate-page {
  background: #f2efe6;
  color: #064c3f;
}


/* =========================================================
   HERO
========================================================= */

.estimate-hero {
  position: relative;

  padding: 0 4% 80px;

  overflow: hidden;

  background: #f2efe6;
}

.estimate-hero-inner {
  position: relative;
  z-index: 2;

  max-width: 1680px;

  margin: 0 auto;
}

.estimate-hero-word {
  position: absolute;

  top: 60px;
  left: -1%;

  color: rgba(6, 76, 63, 0.035);

  font-size: clamp(180px, 26vw, 430px);
  font-weight: 700;

  line-height: 0.8;
  letter-spacing: -0.08em;

  pointer-events: none;
  user-select: none;
}


/* TOP */

.estimate-hero-top {
  height: 90px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  border-bottom: 1px solid rgba(6, 76, 63, 0.18);

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 0.22em;
}


/* GRID */

.estimate-hero-grid {
  display: grid;

  grid-template-columns: 1.25fr 0.75fr;

  gap: 100px;

  padding: 80px 0 90px;
}


/* HEADING */

.estimate-eyebrow {
  display: block;

  margin-bottom: 24px;

  color: #e66137;

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 0.2em;
}

.estimate-hero-heading h1 {
  margin: 0;

  color: #064c3f;

  font-size: clamp(58px, 6.5vw, 110px);
  font-weight: 400;

  line-height: 0.92;
  letter-spacing: -0.055em;
}

.estimate-hero-heading h1 em {
  display: block;

  margin-top: 10px;

  color: #e66137;

  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-style: italic;
}


/* COPY */

.estimate-hero-copy {
  max-width: 480px;

  padding-top: 60px;
}

.estimate-hero-copy>p {
  margin: 0;

  color: rgba(6, 76, 63, 0.68);

  font-size: 15px;
  line-height: 1.75;
}

.estimate-hero-note {
  display: flex;
  align-items: center;

  gap: 20px;

  margin-top: 45px;
  padding-top: 25px;

  border-top: 1px solid rgba(6, 76, 63, 0.18);
}

.estimate-hero-note span {
  color: #e66137;

  font-size: 54px;
  font-weight: 500;

  line-height: 1;
}

.estimate-hero-note p {
  margin: 0;

  color: #064c3f;

  font-size: 8px;
  font-weight: 600;

  line-height: 1.6;
  letter-spacing: 0.17em;
}


/* BOTTOM */

.estimate-hero-bottom {
  display: flex;
  justify-content: space-between;

  padding-top: 22px;

  border-top: 1px solid rgba(6, 76, 63, 0.18);
}

.estimate-hero-bottom span {
  color: rgba(6, 76, 63, 0.48);

  font-size: 8px;
  font-weight: 600;

  letter-spacing: 0.16em;
}


/* =========================================================
   FORM SECTION
========================================================= */

.estimate-form-section {
  padding: 110px 4% 130px;

  background: #064c3f;
}

.estimate-form-shell {
  max-width: 1680px;

  margin: 0 auto;

  display: grid;

  grid-template-columns: minmax(0, 1fr) 340px;

  gap: 80px;

  align-items: start;
}


/* =========================================================
   FORM
========================================================= */

.estimate-form {
  min-width: 0;
}


/* =========================================================
   STEP
========================================================= */

.estimate-step {
  padding: 0 0 85px;

  margin-bottom: 85px;

  border-bottom: 1px solid rgba(244, 240, 230, 0.18);
}

.estimate-step-head {
  display: grid;

  grid-template-columns: 80px 1fr;

  gap: 30px;

  margin-bottom: 50px;
}

.estimate-step-number {
  color: #e66137;

  font-size: 11px;
  font-weight: 600;

  letter-spacing: 0.15em;
}

.estimate-step-label {
  display: block;

  margin-bottom: 15px;

  color: rgba(244, 240, 230, 0.48);

  font-size: 8px;
  font-weight: 600;

  letter-spacing: 0.2em;
}

.estimate-step-head h2 {
  margin: 0;

  color: #f4f0e6;

  font-size: clamp(38px, 4vw, 66px);
  font-weight: 400;

  line-height: 0.98;
  letter-spacing: -0.04em;
}

.estimate-step-head h2 em {
  color: #e66137;

  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
}

.estimate-step-intro {
  max-width: 560px;

  margin: 22px 0 0;

  color: rgba(244, 240, 230, 0.58);

  font-size: 13px;
  line-height: 1.7;
}


/* =========================================================
   FIELDS
========================================================= */

.estimate-fields {
  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 35px 40px;

  padding-left: 110px;
}

.estimate-field {
  min-width: 0;
}

.estimate-field-full {
  grid-column: 1 / -1;
}

.estimate-field label {
  display: block;

  margin-bottom: 12px;

  color: rgba(244, 240, 230, 0.48);

  font-size: 8px;
  font-weight: 600;

  letter-spacing: 0.17em;
}


/* INPUTS */

.estimate-field input,
.estimate-field select,
.estimate-field textarea {
  width: 100%;

  box-sizing: border-box;

  padding: 16px 0;

  border: 0;
  border-bottom: 1px solid rgba(244, 240, 230, 0.3);
  border-radius: 0;

  outline: none;

  background: transparent;

  color: #f4f0e6;

  font-family: inherit;
  font-size: 15px;

  transition: border-color 0.3s ease;
}

.estimate-field input::placeholder,
.estimate-field textarea::placeholder {
  color: rgba(244, 240, 230, 0.28);
}

.estimate-field input:focus,
.estimate-field select:focus,
.estimate-field textarea:focus {
  border-color: #e66137;
}

.estimate-field textarea {
  resize: vertical;

  line-height: 1.6;
}


/* SELECT */

.estimate-field select {
  cursor: pointer;

  appearance: auto;
}

.estimate-field select option {
  background: #064c3f;

  color: #f4f0e6;
}


/* DATE ICON */

.estimate-field input[type="date"] {
  color-scheme: dark;
}


/* NOTE */

.estimate-field-note {
  margin: 30px 0 0 110px;

  color: rgba(244, 240, 230, 0.42);

  font-size: 11px;
  line-height: 1.6;
}


/* =========================================================
   PRODUCT SELECTOR
========================================================= */

.estimate-products {
  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 12px;

  padding-left: 110px;
}

.estimate-product-option {
  position: relative;

  cursor: pointer;
}

.estimate-product-option input {
  position: absolute;

  opacity: 0;

  pointer-events: none;
}


/* CARD */

.estimate-product-card {
  position: relative;

  min-height: 135px;

  padding: 22px;

  display: flex;
  flex-direction: column;

  border: 1px solid rgba(244, 240, 230, 0.18);

  transition:
    background 0.3s ease,
    border-color 0.3s ease,
    transform 0.3s ease;
}

.estimate-product-option:hover .estimate-product-card {
  border-color: rgba(244, 240, 230, 0.42);

  transform: translateY(-3px);
}

.estimate-product-index {
  margin-bottom: 24px;

  color: #e66137;

  font-size: 8px;
  font-weight: 600;

  letter-spacing: 0.15em;
}

.estimate-product-card strong {
  color: #f4f0e6;

  font-size: 19px;
  font-weight: 400;
}

.estimate-product-card small {
  margin-top: 8px;

  color: rgba(244, 240, 230, 0.42);

  font-size: 7px;
  font-weight: 600;

  line-height: 1.5;
  letter-spacing: 0.13em;
}

.estimate-product-check {
  position: absolute;

  top: 16px;
  right: 16px;

  display: flex;
  align-items: center;
  justify-content: center;

  width: 24px;
  height: 24px;

  border: 1px solid rgba(244, 240, 230, 0.2);
  border-radius: 50%;

  color: transparent;

  font-size: 10px;

  transition:
    background 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease;
}


/* SELECTED */

.estimate-product-option input:checked+.estimate-product-card {
  background: #f4f0e6;

  border-color: #f4f0e6;
}

.estimate-product-option input:checked+.estimate-product-card strong {
  color: #064c3f;
}

.estimate-product-option input:checked+.estimate-product-card small {
  color: rgba(6, 76, 63, 0.55);
}

.estimate-product-option input:checked+.estimate-product-card .estimate-product-check {
  background: #e66137;

  border-color: #e66137;

  color: #fff;
}


/* HELP CARD */

.estimate-product-help .estimate-product-card {
  border-color: rgba(230, 97, 55, 0.65);
}


/* =========================================================
   SIDE PANEL
========================================================= */

.estimate-side-panel {
  position: sticky;

  top: 110px;

  padding: 38px;

  background: #f2efe6;

  color: #064c3f;
}

.estimate-side-label {
  display: block;

  margin-bottom: 30px;

  color: #e66137;

  font-size: 8px;
  font-weight: 600;

  letter-spacing: 0.2em;
}

.estimate-side-panel h3 {
  margin: 0 0 25px;

  color: #064c3f;

  font-size: 32px;
  font-weight: 400;

  line-height: 1.05;
  letter-spacing: -0.03em;
}

.estimate-side-panel>p {
  margin: 0;

  color: rgba(6, 76, 63, 0.65);

  font-size: 12px;
  line-height: 1.7;
}


/* SIDE LIST */

.estimate-side-list {
  margin-top: 35px;

  border-top: 1px solid rgba(6, 76, 63, 0.18);
}

.estimate-side-list>div {
  display: grid;

  grid-template-columns: 35px 1fr;

  gap: 15px;

  padding: 18px 0;

  border-bottom: 1px solid rgba(6, 76, 63, 0.18);
}

.estimate-side-list span {
  color: #e66137;

  font-size: 8px;
  font-weight: 600;
}

.estimate-side-list p {
  margin: 0;

  color: rgba(6, 76, 63, 0.72);

  font-size: 11px;
  line-height: 1.55;
}


/* CONTACT */

.estimate-side-contact {
  margin-top: 35px;
}

.estimate-side-contact>span {
  display: block;

  margin-bottom: 14px;

  color: rgba(6, 76, 63, 0.42);

  font-size: 7px;
  font-weight: 600;

  letter-spacing: 0.18em;
}

.estimate-side-contact strong {
  display: block;

  margin-bottom: 8px;

  color: #064c3f;

  font-size: 15px;
  font-weight: 500;
}

.estimate-side-contact a {
  color: #064c3f;

  font-size: 11px;

  text-decoration: none;

  overflow-wrap: anywhere;
}


/* =========================================================
   SUBMIT
========================================================= */

.estimate-submit {
  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 70px;

  padding: 10px 0 20px 110px;
}

.estimate-submit-copy>span {
  display: block;

  margin-bottom: 18px;

  color: #e66137;

  font-size: 8px;
  font-weight: 600;

  letter-spacing: 0.2em;
}

.estimate-submit-copy h2 {
  margin: 0;

  color: #f4f0e6;

  font-size: clamp(38px, 4vw, 62px);
  font-weight: 400;

  line-height: 1;
  letter-spacing: -0.04em;
}

.estimate-submit-copy h2 em {
  color: #e66137;

  font-family: Georgia, serif;
  font-weight: 400;
}

.estimate-submit-copy p {
  max-width: 450px;

  margin: 25px 0 0;

  color: rgba(244, 240, 230, 0.52);

  font-size: 12px;
  line-height: 1.7;
}


/* BUTTONS */

.estimate-submit-actions {
  display: flex;
  flex-direction: column;

  gap: 12px;
}

.estimate-send {
  width: 100%;

  padding: 20px 22px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  border: 1px solid rgba(244, 240, 230, 0.28);

  cursor: pointer;

  font-family: inherit;
  text-align: left;

  transition:
    background 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease;
}

.estimate-send>span:first-child {
  display: flex;
  flex-direction: column;

  gap: 5px;
}

.estimate-send small {
  font-size: 7px;
  font-weight: 600;

  letter-spacing: 0.17em;
}

.estimate-send strong {
  font-size: 18px;
  font-weight: 500;
}

.estimate-send-arrow {
  font-size: 20px;

  transition: transform 0.3s ease;
}

.estimate-send:hover .estimate-send-arrow {
  transform: translate(4px, -4px);
}


/* WHATSAPP */

.estimate-send-whatsapp {
  background: #f4f0e6;

  color: #064c3f;
}

.estimate-send-whatsapp:hover {
  background: #e66137;

  border-color: #e66137;

  color: #fff;
}


/* EMAIL */

.estimate-send-email {
  background: transparent;

  color: #f4f0e6;
}

.estimate-send-email:hover {
  background: #f4f0e6;

  color: #064c3f;
}


/* ERROR */

.estimate-error {
  min-height: 18px;

  margin: 8px 0 0;

  color: #ff9c7c;

  font-size: 11px;
  line-height: 1.5;
}


/* =========================================================
   DISCLAIMER
========================================================= */

.estimate-disclaimer {
  padding: 55px 4%;

  background: #e66137;

  color: #f4f0e6;
}

.estimate-disclaimer-inner {
  max-width: 1680px;

  margin: 0 auto;

  display: grid;

  grid-template-columns: 200px 1fr;

  gap: 60px;
}

.estimate-disclaimer span {
  font-size: 8px;
  font-weight: 600;

  letter-spacing: 0.2em;
}

.estimate-disclaimer p {
  max-width: 850px;

  margin: 0;

  font-size: 12px;
  line-height: 1.7;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {

  .estimate-hero-grid {
    grid-template-columns: 1fr;

    gap: 20px;
  }

  .estimate-hero-copy {
    padding-top: 20px;
  }

  .estimate-form-shell {
    grid-template-columns: 1fr;
  }

  .estimate-side-panel {
    position: static;
  }

  .estimate-products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 650px) {

  .estimate-hero {
    padding: 0 20px 55px;
  }

  .estimate-hero-top {
    height: 70px;
  }

  .estimate-hero-grid {
    padding: 55px 0;
  }

  .estimate-hero-heading h1 {
    font-size: 50px;
  }

  .estimate-hero-bottom {
    flex-wrap: wrap;

    gap: 14px 25px;
  }


  /* FORM */

  .estimate-form-section {
    padding: 75px 20px 85px;
  }

  .estimate-form-shell {
    gap: 60px;
  }

  .estimate-step {
    margin-bottom: 60px;
    padding-bottom: 60px;
  }

  .estimate-step-head {
    grid-template-columns: 1fr;

    gap: 15px;

    margin-bottom: 35px;
  }

  .estimate-step-head h2 {
    font-size: 40px;
  }

  .estimate-fields,
  .estimate-products {
    padding-left: 0;
  }

  .estimate-fields {
    grid-template-columns: 1fr;
  }

  .estimate-field-full {
    grid-column: auto;
  }

  .estimate-products {
    grid-template-columns: 1fr;
  }

  .estimate-product-card {
    min-height: 110px;
  }

  .estimate-field-note {
    margin-left: 0;
  }


  /* SUBMIT */

  .estimate-submit {
    grid-template-columns: 1fr;

    gap: 40px;

    padding-left: 0;
  }


  /* SIDE */

  .estimate-side-panel {
    padding: 28px 24px;
  }


  /* DISCLAIMER */

  .estimate-disclaimer {
    padding: 45px 20px;
  }

  .estimate-disclaimer-inner {
    grid-template-columns: 1fr;

    gap: 20px;
  }

}


/* =========================================================

html,body{overflow-x:hidden;}