/* Home Enviro Estimate Generator styles (2026-10-02). Shared by both calculators. */
@font-face {
  font-family: 'HE Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url('/fonts/estimate/archivo-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'HE Archivo';
  font-style: italic;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url('/fonts/estimate/archivo-italic-latin.woff2') format('woff2');
}

/* ------------------------------------------------ calculator form section */
#mic-calculator-root .he-est-customer {
  margin-top: 34px;
  padding: 18px;
  border: 1px solid #c9dbef;
  border-radius: 16px;
  background: #f2f7fd;
}
#mic-calculator-root .mic-independent-prv .he-est-customer { margin-top: 26px; }
#mic-calculator-root .he-est-customer-heading {
  margin: -18px -18px 14px;
  padding: 14px 18px;
  border-radius: 16px 16px 0 0;
  background: #0c274e;
  color: #fff;
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
#mic-calculator-root .he-est-customer-note { margin: 0 0 14px; color: #44546a; font-size: .92rem; line-height: 1.5; }
#mic-calculator-root .he-est-fields {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}
#mic-calculator-root .he-est-field { display: grid; gap: 5px; grid-column: span 3; min-width: 0; }
#mic-calculator-root .he-est-field--wide { grid-column: span 6; }
#mic-calculator-root .he-est-field--short { grid-column: span 1; }
#mic-calculator-root .he-est-field:has(input[name="city"]) { grid-column: span 4; }
#mic-calculator-root .he-est-field:has(input[name="phone"]) { grid-column: span 6; }
#mic-calculator-root .he-est-field label { font-size: .8rem; font-weight: 750; color: #173a6a; }
#mic-calculator-root .he-est-field input {
  width: 100%;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid #b9c9dc;
  border-radius: 10px;
  background: #fff;
  color: #15243a;
  font-size: 16px;
}
#mic-calculator-root .he-est-field input[aria-invalid="true"] { border-color: #b3261e; box-shadow: 0 0 0 2px rgba(179, 38, 30, .15); }
#mic-calculator-root .he-est-field input:focus-visible { outline: 3px solid rgba(47, 111, 178, .28); outline-offset: 2px; }
#mic-calculator-root .he-est-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
#mic-calculator-root .he-est-status { min-height: 0; margin: 12px 0 0; font-size: .9rem; line-height: 1.5; color: #173a6a; }
#mic-calculator-root .he-est-status:empty { display: none; }
#mic-calculator-root .he-est-status[data-type="error"] { color: #9b1c14; font-weight: 650; }
#mic-calculator-root .he-est-status[data-type="ok"] { color: #1f6b47; font-weight: 650; }
#mic-calculator-root .he-est-actions { margin-top: 14px; }
#mic-calculator-root .he-est-outputs { margin-top: 14px; padding-top: 14px; border-top: 1px solid #c9dbef; }
#mic-calculator-root .he-est-outputs[hidden] { display: none; }
#mic-calculator-root .he-est-ready { margin: 0 0 10px; font-size: .95rem; color: #0c274e; }
#mic-calculator-root .he-est-output-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }

.he-est-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid #173a6a;
  border-radius: 12px;
  background: #fff;
  color: #0c274e;
  font: inherit;
  font-weight: 750;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
  transition: background .15s ease, transform .15s ease;
}
.he-est-btn:hover { background: #eaf3ff; }
.he-est-btn:focus-visible { outline: 3px solid rgba(47, 111, 178, .35); outline-offset: 2px; }
.he-est-btn:disabled { opacity: .6; cursor: progress; }
.he-est-btn--primary { width: 100%; border-color: #0c274e; background: #0c274e; color: #fff; font-size: 1.02rem; }
.he-est-btn--primary:hover { background: #173a6a; }

@media (max-width: 520px) {
  #mic-calculator-root .he-est-fields { grid-template-columns: 1fr; }
  #mic-calculator-root .he-est-field,
  #mic-calculator-root .he-est-field--wide,
  #mic-calculator-root .he-est-field--short,
  #mic-calculator-root .he-est-field:has(input[name="city"]),
  #mic-calculator-root .he-est-field:has(input[name="phone"]) { grid-column: 1 / -1; }
  #mic-calculator-root .he-est-output-buttons { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------- preview modal */
.he-est-modal-open, .he-est-modal-open body { overflow: hidden; }
.he-est-modal {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  flex-direction: column;
  background: #08162d;
}
.he-est-modal-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  background: #0c274e;
  color: #fff;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
}
.he-est-modal-title { min-width: 0; overflow-wrap: anywhere; line-height: 1.3; }
.he-est-modal-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.he-est-modal-actions .he-est-btn { min-height: 40px; padding: 0 12px; font-size: .9rem; }
.he-est-modal-scroll { flex: 1; overflow: auto; padding: 16px 12px 40px; -webkit-overflow-scrolling: touch; }
.he-est-modal-pages { position: relative; margin: 0 auto; }
.he-est-modal-pages > .he-doc-set { position: absolute; left: 0; top: 0; transform: scale(var(--he-scale, 1)); transform-origin: 0 0; }
.he-est-modal-pages .he-doc-page { box-shadow: 0 12px 40px rgba(0, 0, 0, .35); }
.he-est-modal-pages .he-doc-page + .he-doc-page { margin-top: 18px; }
@media (max-width: 600px) {
  .he-est-modal-bar strong { width: 100%; }
  .he-est-modal-title { font-size: .92rem; }
  .he-est-modal-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
}

/* Off-screen render stage (used for PDF, PNG, and print layout) */
.he-doc-stage, .he-doc-set, .he-doc-page, .he-doc-page * { max-width: none !important; }
.he-doc-stage, .he-doc-set, .he-doc-page { min-width: 0; }
.he-doc-set { width: 816px; }
.he-doc-page img, .he-doc-page svg { max-width: none !important; }
.he-doc-stage { position: absolute; left: -20000px; top: 0; width: 816px; pointer-events: none; }

/* ============================================================ DOCUMENT */
.he-doc-page {
  --he-navy: #0b2d63;
  --he-blue: #1d4f9c;
  --he-bright: #2563b9;
  --he-green: #3e9a3a;
  --he-sky: #eaf2fb;
  --he-sky-2: #f3f8fd;
  --he-line: #c4d6ec;
  --he-mint: #e1f0e2;
  --he-ink: #1b2533;
  position: relative;
  box-sizing: border-box;
  width: 816px;
  height: 1056px;
  padding: 16px 30px 12px;
  overflow: hidden;
  background: #fff;
  color: var(--he-ink);
  font-family: 'HE Archivo', 'Archivo', Arial, Helvetica, sans-serif;
  font-size: 12px;
  line-height: 1.25;
  text-align: left;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.he-doc-page *, .he-doc-page *::before, .he-doc-page *::after { box-sizing: border-box; }
.he-doc-page h3, .he-doc-page h4, .he-doc-page p, .he-doc-page ul, .he-doc-page li { margin: 0; padding: 0; max-width: none; font-family: inherit; line-height: inherit; text-transform: none; }
.he-doc-page h3, .he-doc-page h4 { line-height: 1.2; }
.he-doc-body { display: flex; flex-direction: column; height: 100%; overflow: hidden; }
.he-doc-body > * { flex: 0 0 auto; }
.he-doc-body > * + * { margin-top: 6px; }
.he-doc-body > [data-group] + [data-group] { margin-top: 0; }
.he-doc-body > [data-group].is-first:not(:first-child) { margin-top: 6px; }

/* Header */
.he-doc-header {
  display: grid;
  grid-template-columns: 112px 1fr 108px;
  align-items: center;
  gap: 14px;
  padding-bottom: 6px;
  border-bottom: 2px solid var(--he-blue);
}
.he-doc-logo { display: block; width: 110px; height: 110px; border-radius: 50%; object-fit: cover; }
.he-doc-brand { text-align: center; color: var(--he-navy); }
.he-doc-company { font-size: 40px; font-weight: 900; font-stretch: 92%; line-height: .98; letter-spacing: -.5px; white-space: nowrap; }
.he-doc-home { color: var(--he-navy); }
.he-doc-enviro { color: var(--he-bright); }
.he-doc-llc { color: var(--he-navy); font-size: 27px; }
.he-doc-tagline { margin-top: 2px; font-size: 17px; font-weight: 800; letter-spacing: .1px; white-space: nowrap; }
.he-doc-license, .he-doc-contact { font-size: 15.5px; font-weight: 400; color: var(--he-bright); line-height: 1.18; white-space: nowrap; }
.he-doc-pipe { display: inline-block; margin: 0 14px; color: var(--he-navy); }
.he-doc-motto { margin-top: 4px; font-size: 11px; font-weight: 700; letter-spacing: 4.2px; color: var(--he-navy); white-space: nowrap; }
.he-doc-motto span { margin: 0 14px; color: var(--he-green); letter-spacing: 0; }
.he-doc-slogan {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 14px;
  border-left: 2px solid var(--he-blue);
  color: var(--he-blue);
  font-size: 21px;
  font-style: italic;
  font-weight: 400;
  line-height: 1.12;
}
.he-doc-nowrap { white-space: nowrap; }
.he-doc-slogan sup { font-size: 12px; vertical-align: super; line-height: 0; }

/* Title bar */
.he-doc-titlebar {
  padding: 7px 14px 6px;
  border-radius: 6px;
  background: var(--he-navy);
  color: #fff;
  font-size: 25px;
  font-weight: 900;
  font-stretch: 95%;
  line-height: 1.1;
  text-align: center;
  letter-spacing: .2px;
}

/* Estimate info row */
.he-doc-inforow { display: grid; grid-template-columns: 1fr 1.18fr; gap: 10px; }
.he-doc-idbox, .he-doc-propbox { border-radius: 6px; background: var(--he-sky); }
.he-doc-idbox { display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 6px 14px; font-size: 14px; }
.he-doc-idlabel { display: inline-block; min-width: 82px; font-weight: 800; color: #111; }
.he-doc-idbox strong { font-weight: 800; font-size: 14.5px; color: #111; }
.he-doc-propbox { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 5px 14px; }
.he-doc-proplabel { font-size: 12.5px; font-weight: 700; color: var(--he-blue); letter-spacing: .2px; }
.he-doc-propvalue { margin-top: 0; font-size: 16.5px; font-weight: 800; color: var(--he-navy); line-height: 1.15; overflow-wrap: anywhere; }
.he-doc-propdetail { margin-top: 1px; font-size: 10.5px; color: #34465e; }
.he-doc-propicon svg { display: block; width: 44px; height: 38px; }

/* Customer */
.he-doc-customer { padding: 6px 14px 8px; border: 1px solid var(--he-line); border-radius: 6px; background: var(--he-sky); }
.he-doc-customer h3 { margin-bottom: 4px; font-size: 14.5px; font-weight: 800; color: var(--he-navy); letter-spacing: .2px; }
.he-doc-cgrid { display: grid; grid-template-columns: 1.15fr 1fr .8fr; column-gap: 12px; row-gap: 4px; }
.he-doc-cf { min-width: 0; font-size: 12.5px; color: #222; }
.he-doc-cf--half { display: flex; align-items: center; gap: 10px; }
.he-doc-cf--half:first-child { grid-column: 1 / 2; }
.he-doc-cf--half:nth-child(2) { grid-column: 2 / 4; }
.he-doc-cf--half > span { flex: 0 0 auto; }
.he-doc-cf--half .he-doc-cv { flex: 1; }
.he-doc-cf--stack > span { display: block; margin-bottom: 2px; font-size: 11.5px; }
.he-doc-cv {
  min-height: 22px;
  padding: 3px 10px;
  border: 1px solid #c3d2e4;
  border-radius: 4px;
  background: #fff;
  font-size: 13px;
  color: #111;
  overflow-wrap: anywhere;
}

/* Tables */
.he-doc-thead, .he-doc-trow {
  display: grid;
  grid-template-columns: 1fr 128px;
  border-left: 1px solid var(--he-line);
  border-right: 1px solid var(--he-line);
}
.he-doc-thead { border-top: 1px solid var(--he-line); border-radius: 6px 6px 0 0; background: var(--he-mint); }
.he-doc-thead > span { padding: 4px 14px 3px; font-size: 14px; font-weight: 800; color: #0f1d33; letter-spacing: .1px; }
.he-doc-thead .he-doc-pricehead { border-left: 1px solid var(--he-line); text-align: center; font-size: 12px; align-self: stretch; display: flex; align-items: center; justify-content: center; }
.he-doc-trow { border-top: 1px solid #dbe5f1; background: #fff; }
.he-doc-trow.is-last { border-bottom: 1px solid var(--he-line); border-radius: 0 0 6px 6px; }
.he-doc-tlabel { display: flex; align-items: center; flex-wrap: wrap; gap: 0 8px; padding: 3px 14px; font-size: 12.5px; color: #1b2533; min-width: 0; overflow-wrap: anywhere; }
.he-doc-tprice { display: flex; align-items: center; justify-content: flex-end; padding: 3px 14px; border-left: 1px solid var(--he-line); font-size: 12.5px; color: #111; white-space: nowrap; }
.he-doc-trow--strong .he-doc-tprice { font-weight: 800; font-size: 13px; }
.he-doc-dash { color: #445; }
.he-doc-note { flex-basis: 100%; font-size: 9.5px; color: #4b5d74; line-height: 1.2; }
.he-doc-box { width: 14px; height: 14px; flex: 0 0 14px; margin-right: 4px; }
.he-doc-trow--group { background: var(--he-sky-2); }
.he-doc-trow--group .he-doc-tlabel { font-weight: 800; color: var(--he-navy); font-size: 13px; }
.he-doc-trow--indent .he-doc-tlabel { padding-left: 30px; flex-wrap: nowrap; }
.he-doc-trow--indent .he-doc-note { flex-basis: auto; margin-left: auto; padding-left: 10px; white-space: nowrap; }
.he-doc-savings { display: grid; grid-template-columns: 1fr 128px; border: 1px solid #b9dcc0; border-radius: 6px; background: #f1f8f2; }
.he-doc-savings .he-doc-tlabel { color: #1d4a2c; }
.he-doc-savings .he-doc-tprice { border-left-color: #b9dcc0; font-weight: 800; color: #1f6b47; }
.he-doc-trow--included { display: block; padding: 0 8px 6px; border-top: 0; }
.he-doc-included { padding: 5px 12px 6px; border-radius: 5px; background: var(--he-sky); }
.he-doc-included h4 { margin-bottom: 3px; font-size: 11.5px; font-weight: 800; color: var(--he-blue); letter-spacing: .2px; }
.he-doc-included ul { list-style: none; display: grid; grid-template-columns: 1fr; row-gap: 1px; column-gap: 18px; }
.he-doc-included ul.he-doc-two { grid-template-columns: 1fr 1fr; grid-auto-flow: column; grid-template-rows: repeat(4, auto); }
.he-doc-included li { display: flex; align-items: center; gap: 7px; font-size: 11.5px; color: #2a3646; }
.he-doc-check { width: 13px; height: 13px; flex: 0 0 13px; }

/* PRV minimum */
.he-doc-minbox { padding: 7px 14px 8px; border: 1px solid var(--he-line); border-left: 5px solid var(--he-green); border-radius: 6px; background: var(--he-sky-2); }
.he-doc-minbox h4 { margin-bottom: 3px; font-size: 13px; font-weight: 800; color: var(--he-navy); }
.he-doc-minbox p { font-size: 11.5px; line-height: 1.38; color: #2a3646; }

/* Total */
.he-doc-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 18px 3px;
  border-radius: 6px;
  background: var(--he-navy);
  color: #fff;
}
.he-doc-total span { font-size: 23px; font-weight: 900; font-stretch: 95%; letter-spacing: .2px; }
.he-doc-total strong { font-size: 27px; font-weight: 900; }

/* Notes row */
.he-doc-notes { display: grid; grid-template-columns: 1fr 1fr 104px; gap: 8px; align-items: stretch; }
.he-doc-important, .he-doc-turnaround { padding: 5px 11px 6px; border-radius: 6px; background: var(--he-sky); }
.he-doc-turnaround { background: #eef3fa; }
.he-doc-important h4, .he-doc-turnaround h4 { margin-bottom: 2px; font-size: 12px; font-weight: 800; color: var(--he-blue); }
.he-doc-turnaround h4 { color: var(--he-navy); }
.he-doc-important p, .he-doc-turnaround p { font-size: 10px; line-height: 1.3; color: #2a3646; }
.he-doc-qr { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 4px 2px; border-left: 1px solid var(--he-line); }
.he-doc-qr img { display: block; width: 86px; height: 86px; image-rendering: pixelated; }
.he-doc-qr span { font-size: 10px; font-weight: 800; line-height: 1.15; color: var(--he-blue); text-align: center; }

/* Foot: record bar, credentials, footer */
.he-doc-foot { margin-top: auto !important; padding-top: 6px; }
.he-doc-record { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 4px 12px; border-radius: 5px; background: var(--he-sky); }
.he-doc-record svg { width: 26px; height: 18px; flex: 0 0 26px; }
.he-doc-record p { white-space: nowrap; font-size: 11px; font-stretch: 90%; color: var(--he-blue); }
.he-doc-record strong { font-weight: 800; color: var(--he-navy); }
.he-doc-creds { display: grid; grid-template-columns: 1.05fr 1.15fr .9fr 1.1fr; gap: 6px; align-items: center; padding: 6px 4px 5px; }
.he-doc-creds > div { display: flex; align-items: center; gap: 9px; }
.he-doc-creds svg { width: 32px; height: 35px; flex: 0 0 32px; }
.he-doc-creds p { font-size: 11.5px; line-height: 1.2; color: var(--he-blue); }
.he-doc-creds strong { color: var(--he-navy); font-weight: 800; }
.he-doc-footer { padding-top: 4px; border-top: 2px solid var(--he-blue); text-align: center; }
.he-doc-footline { font-size: 14.5px; font-weight: 800; color: var(--he-navy); }
.he-doc-footline .he-doc-pipe { margin: 0 16px; font-weight: 400; }
.he-doc-serving { display: flex; align-items: center; gap: 12px; margin-top: 1px; font-size: 12px; font-style: italic; color: var(--he-blue); }
.he-doc-serving::before, .he-doc-serving::after { content: ''; flex: 1; height: 1px; background: var(--he-line); }

/* Service-specific policy (continuation pages) */
.he-doc-poltitle { display: flex; align-items: center; gap: 12px; margin-top: 10px !important; }
.he-doc-poltitle span { padding: 4px 12px 3px; border-radius: 6px; background: var(--he-sky); color: var(--he-navy); font-size: 19px; font-weight: 900; font-stretch: 95%; letter-spacing: .1px; white-space: nowrap; }
.he-doc-poltitle::after { content: ''; flex: 1; height: 2px; background: var(--he-blue); }
.he-doc-polcols { display: grid; grid-template-columns: 1fr 1fr; column-gap: 0; }
.he-doc-polcol { min-width: 0; padding-right: 16px; }
.he-doc-polcol--right { padding: 0 0 0 16px; border-left: 1px solid var(--he-line); }
.he-doc-polsub { margin: 2px 0 4px; color: var(--he-navy); font-size: 13.5px; font-weight: 800; letter-spacing: .2px; }
.he-doc-polsec { break-inside: avoid; }
.he-doc-polsec + .he-doc-polsec { margin-top: 9px; }
.he-doc-page .he-doc-polsec h5 { margin: 0 0 2px; padding: 0; color: #1a3f9b; font-family: inherit; font-size: 14px; font-weight: 800; line-height: 1.2; max-width: none; }
.he-doc-page .he-doc-polsec p { margin: 0; font-size: 11.2px; line-height: 1.4; color: #2a3646; }
.he-doc-page .he-doc-polsec p + p, .he-doc-page .he-doc-polsec ul + p { margin-top: 4px; }
.he-doc-page .he-doc-polsec ul { margin: 2px 0 0; padding: 0 0 0 16px; list-style: disc; }
.he-doc-page .he-doc-polsec li { margin: 0; padding: 0; font-size: 11.2px; line-height: 1.36; color: #2a3646; }
.he-doc-page .he-doc-polsec li::marker { color: var(--he-blue); }

/* Continuation page */
.he-doc-cont { display: flex; align-items: center; gap: 12px; padding-bottom: 8px; border-bottom: 2px solid var(--he-blue); color: var(--he-navy); }
.he-doc-logo-sm { width: 46px; height: 46px; border-radius: 50%; }
.he-doc-cont strong { display: block; font-size: 18px; font-weight: 900; }
.he-doc-cont span { font-size: 12px; font-weight: 700; color: var(--he-blue); letter-spacing: .3px; }
.he-doc-thead--cont > span:first-child::after { content: ' (continued)'; font-weight: 600; font-size: 12px; color: #4b5d74; }
.he-doc-pagenum { position: absolute; right: 30px; bottom: 5px; font-size: 9.5px; font-weight: 600; color: #4b5d74; }

/* ------------------------------------------------------------- printing */
#he-est-print-root { display: none; }
@media print {
  @page { size: letter portrait; margin: 0; }
  html.he-est-printing, html.he-est-printing body { margin: 0 !important; padding: 0 !important; background: #fff !important; }
  html.he-est-printing body > *:not(#he-est-print-root) { display: none !important; }
  html.he-est-printing #he-est-print-root { display: block !important; }
  html.he-est-printing #he-est-print-root .he-doc-set { position: static; transform: none; }
  html.he-est-printing #he-est-print-root .he-doc-page { box-shadow: none; margin: 0; break-after: page; page-break-after: always; }
  html.he-est-printing #he-est-print-root .he-doc-page:last-child { break-after: auto; page-break-after: auto; }
}

/* Preview My Estimate (2026-10-04): secondary button above Create, preview-only flag on the document. */
.he-est-btn--draft { width: 100%; margin-bottom: 10px; border-color: #2f6fb2; background: #eaf3ff; color: #0c274e; font-size: 1.02rem; }
.he-est-btn--draft:hover { background: #dbeafc; }
.he-est-btn--draft[hidden] { display: none; }
.he-doc-previewflag { margin-top: 3px; color: #b3261e; font-size: 11px; font-weight: 900; letter-spacing: .5px; }
.he-doc-cont .he-doc-previewflag { margin: 0 0 0 8px; color: #b3261e; font-size: 11px; }
.he-est-draft-scroll { background: #e9eef5; }
