/* =====================================================================
   page: estimate.html  (loaded after base.css; base.css tokens only)
   The form IS the page. Phones: intro + Call/Text -> form -> talk block.
   1024+: intro and talk stacked left (5 cols), form right (6 cols).
   Then "what happens next": three plain sentences in one column.
   ===================================================================== */

/* 1. intro + form */
.es-band{padding-block:var(--s6) var(--s8)}
.es-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s6) 24px}
.es-intro h1{font-size:clamp(2.5rem,1.7rem + 3.4vw,3.9rem)}
.es-intro .lead{margin-top:var(--s4)}
.es-intro__btns{margin-top:var(--s5)}
.es-intro__photos{margin-top:var(--s4);max-width:44ch}
.es-talk .talk{margin-top:var(--s2)}
@media (max-width:599px){
  .es-intro__btns{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:var(--s3)}
  .es-intro__btns .btn{padding-inline:12px}
}
@media (max-width:399px){ .es-intro__btns{grid-template-columns:minmax(0,1fr)} }  /* 360: "Call (616) 299-8335" won't fit half a row */
@media (min-width:1024px){
  .es-band{padding-block:var(--s8) var(--s9)}
  .es-grid{grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto 1fr;row-gap:var(--s7)}
  .es-intro{grid-column:1 / span 5;grid-row:1}
  .es-talk{grid-column:1 / span 5;grid-row:2;align-self:start}
  .es-form{grid-column:7 / span 6;grid-row:1 / span 2;align-self:start}
  .es-intro__photos{margin-top:var(--s5)}
}

/* 2. what happens next: a plain ruled list, no numbers */
.es-next__head{margin-bottom:var(--s5)}
.es-list{list-style:none;margin:0;padding:0;border-top:var(--border);max-width:46rem}
.es-list li{padding-block:var(--s4);border-bottom:var(--hair);font-size:var(--t-lead);line-height:1.45;color:var(--ink)}
.es-next__act{margin-top:var(--s6)}

/* 2b. how pricing works: three plain rows under the next steps (no dollar amounts, by design) */
.es-price{margin-top:var(--s7);max-width:46rem}
.es-price__k{margin-bottom:var(--s3)}
.es-price__dl{margin:0;border-top:var(--border)}
.es-price__dl > div{display:grid;gap:2px;padding-block:var(--s3);border-bottom:var(--hair)}
.es-price__dl dt{font-weight:700;color:var(--ink)}
.es-price__dl dd{margin:0;color:var(--ink-2)}
@media (min-width:600px){ .es-price__dl > div{grid-template-columns:12rem minmax(0,1fr);gap:var(--s4);align-items:baseline} }