@font-face { font-family: "Open Sans"; src: url("/fonts/open-sans-400.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Open Sans"; src: url("/fonts/open-sans-500.ttf") format("truetype"); font-style: normal; font-weight: 500; font-display: swap; }
@font-face { font-family: "Open Sans"; src: url("/fonts/open-sans-600.ttf") format("truetype"); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: "Open Sans"; src: url("/fonts/open-sans-700.ttf") format("truetype"); font-style: normal; font-weight: 700; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url("/fonts/playfair-display-500.ttf") format("truetype"); font-style: normal; font-weight: 500; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url("/fonts/playfair-display-600.ttf") format("truetype"); font-style: normal; font-weight: 600; font-display: swap; }

:root {
  --brand: #254139;
  --brand-button: #29463e;
  --brand-deep: #173129;
  --canvas: #f7f7f4;
  --surface: #ffffff;
  --surface-muted: #eef1ee;
  --border: #d3dad6;
  --text: #1b1b1b;
  --muted: #5f6a66;
  --success: #246b45;
  --success-bg: #edf7f1;
  --review: #765012;
  --review-bg: #fff7e8;
  --error: #8a2e2e;
  --error-bg: #fff1f0;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--canvas); color: var(--text); font-family: "Open Sans", Arial, sans-serif; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }

.demo-banner { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 42px; padding: 8px 20px; background: #765012; color: #fffaf0; font-size: 12px; text-align: center; }
.demo-banner strong { letter-spacing: .12em; }
.demo-banner span { opacity: .9; }

.site-header { background: var(--surface); border-bottom: 1px solid var(--border); }
.header-inner { display: flex; align-items: center; justify-content: space-between; min-height: 82px; max-width: 1240px; margin: 0 auto; padding: 12px 36px; }
.brand { display: flex; align-items: center; gap: 16px; color: var(--muted); text-decoration: none; }
.brand img { display: block; width: 132px; height: 56px; object-fit: contain; object-position: left center; }
.brand span { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
nav { display: flex; align-items: center; gap: 26px; }
.calculator-tabs { display: flex; align-items: center; gap: 26px; }
nav a { color: var(--brand); font-size: 12px; font-weight: 700; text-decoration: none; }
nav a.active { border-bottom: 2px solid var(--brand); padding-bottom: 4px; }
nav .phone { border-left: 1px solid var(--border); padding-left: 26px; }

.quote-mode-navigation { display: flex; justify-content: center; padding: 12px 24px; border-bottom: 1px solid var(--border); background: #eef1ee; }
.quote-mode-navigation .calculator-tabs { gap: 8px; padding: 4px; border: 1px solid var(--border); border-radius: 999px; background: #fff; }
.quote-mode-navigation .calculator-tabs a { min-height: 36px; padding: 9px 18px; border: 0; border-radius: 999px; color: var(--brand); font-size: 10px; font-weight: 700; text-decoration: none; }
.quote-mode-navigation .calculator-tabs a.active { padding-bottom: 9px; background: var(--brand); color: #fff; }

.quote-experience { background: radial-gradient(circle at 12% 15%, rgba(37,65,57,.06), transparent 26%), var(--canvas); }
.experience-inner { display: grid; grid-template-columns: minmax(0,.88fr) minmax(470px,1.12fr); gap: clamp(34px,4.5vw,62px); max-width: 1240px; margin: 0 auto; padding: 40px 36px 54px; }
.brand-story { display: flex; flex-direction: column; min-width: 0; padding-top: 22px; }
.eyebrow, .quote-card-heading p { margin: 0 0 12px; color: var(--brand); font-size: 11px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
h1, h2 { font-family: "Playfair Display", Georgia, serif; font-weight: 500; }
h1 { max-width: 560px; margin: 0 0 22px; color: var(--brand-deep); font-size: clamp(46px,5vw,66px); letter-spacing: -.035em; line-height: 1.01; }
.lede { max-width: 520px; margin: 0 0 26px; color: var(--muted); font-size: 16px; line-height: 1.65; }
.proof-list { display: grid; gap: 11px; margin: 0 0 30px; padding: 0; list-style: none; }
.proof-list li { display: flex; align-items: center; gap: 10px; color: var(--brand); font-size: 12px; font-weight: 700; }
.proof-list span { display: grid; place-items: center; flex: 0 0 21px; width: 21px; height: 21px; border-radius: 50%; background: var(--brand); color: white; font-size: 12px; }
.jobsite-photo { position: relative; min-height: 208px; margin: auto 0 0; overflow: hidden; background: var(--brand); }
.jobsite-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.jobsite-photo::after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, rgba(23,49,41,.82), rgba(23,49,41,.06)); }
.jobsite-photo figcaption { position: absolute; bottom: 18px; left: 20px; z-index: 1; color: white; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.quote-material-visual { position: relative; min-height: 210px; margin-top: auto; padding: 24px; overflow: hidden; background: var(--brand-deep); color: white; }
.quote-material-visual > span, .quote-material-visual > strong { position: relative; z-index: 2; display: block; }
.quote-material-visual > span { color: #a9bcb2; font-size: 9px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.quote-material-visual > strong { margin-top: 7px; font-family: "Playfair Display", Georgia, serif; font-size: 27px; font-weight: 500; }
.quote-material-visual > div { position: absolute; inset: 55px 0 0; }
.quote-material-visual i { position: absolute; bottom: -35px; width: 145px; height: 145px; border: 1px solid rgba(255,255,255,.16); border-radius: 46% 54% 51% 49%; background: rgba(255,255,255,.04); transform: rotate(35deg); }
.quote-material-visual i:nth-child(1) { left: -12px; }
.quote-material-visual i:nth-child(2) { left: 28%; bottom: -56px; width: 185px; height: 185px; transform: rotate(65deg); }
.quote-material-visual i:nth-child(3) { right: 10%; bottom: -22px; width: 120px; height: 120px; }
.quote-material-visual i:nth-child(4) { right: -35px; bottom: -70px; width: 190px; height: 190px; }

.quote-card { align-self: start; overflow: hidden; background: var(--surface); border: 1px solid var(--border); box-shadow: 0 22px 64px rgba(23,49,41,.14); }
.quote-card-heading { padding: 20px 30px 18px; background: var(--brand); color: white; }
.quote-card-heading p { margin-bottom: 7px; color: rgba(255,255,255,.72); }
.quote-card-heading h2 { margin: 0; font-size: 31px; line-height: 1.12; }
.workflow-steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; margin: 0; padding: 0; background: var(--border); list-style: none; }
.workflow-steps li { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 45px; padding: 8px 5px; background: var(--surface-muted); color: var(--muted); font-size: 9px; font-weight: 700; text-transform: uppercase; }
.workflow-steps span { color: var(--brand); }
.workflow-steps li.current { background: #dfe9e4; color: var(--brand-deep); box-shadow: inset 0 -3px 0 var(--brand); }
.workflow-steps li.complete { background: #edf5f0; color: var(--success); }
.workflow-steps li.complete span { font-size: 0; }
.workflow-steps li.complete span::after { content: "✓"; font-size: 12px; }

form { display: grid; gap: 0; padding: 6px 30px 24px; }
.form-section { min-width: 0; margin: 0; padding: 16px 0; border: 0; border-bottom: 1px solid var(--border); }
.form-section legend { display: none; }
label, .access-label { display: block; margin: 0 0 6px; font-size: 12px; font-weight: 700; }
input, select, textarea { width: 100%; min-height: 44px; padding: 0 12px; border: 1px solid #b8c3bd; border-radius: 5px; outline: none; background: white; color: var(--text); }
input[type="date"] { display: block; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
textarea { padding-top: 10px; padding-bottom: 10px; }
input:focus, select:focus, textarea:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(37,65,57,.14); }
input:disabled, select:disabled { background: #f2f3f0; color: #737b77; }
.quantity-control { display: grid; grid-template-columns: minmax(110px,.6fr) minmax(170px,1fr); gap: 10px; }
.field-help { margin: 5px 0 0; color: var(--muted); font-size: 10px; line-height: 1.45; }
.material-description { margin-top: 8px; padding: 10px 12px; border-left: 3px solid #9aaea4; background: #f3f6f4; }
.material-short-description, .material-common-uses { margin: 0; color: var(--text); font-size: 10px; line-height: 1.5; }
.material-common-uses { margin-top: 4px; color: var(--muted); }
.material-common-uses strong { color: var(--brand-deep); }
.material-details { margin-top: 6px; }
.material-details > summary { width: max-content; color: var(--brand); font-size: 10px; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.material-details > summary:focus-visible { outline: 3px solid #8fb0a5; outline-offset: 2px; }
.material-details-body { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border); color: var(--muted); font-size: 9px; line-height: 1.5; }
.material-details-body strong { color: var(--brand-deep); }
.material-details-body ul { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 5px 0 7px; padding-left: 16px; }
.material-details-body p { margin: 5px 0 0; }
.material-specification-notice { padding-left: 8px; border-left: 2px solid #a67220; color: var(--review); }
.material-confirmation-note { font-weight: 600; }
.truckload-type { margin-top: 12px; padding: 12px; background: var(--surface-muted); border: 1px solid var(--border); }
.truckload-type[hidden] { display: none; }
.quantity-access[hidden], .quote-card[hidden] { display: none; }
.truckload-type .access-label { margin: 0 0 9px; }
.truckload-type-options { display: grid; grid-template-columns: repeat(2,1fr); gap: 7px; }
.truckload-type-options label { display: grid; grid-template-columns: 17px 1fr; gap: 8px; align-items: start; min-height: 66px; margin: 0; padding: 11px; border: 1px solid var(--border); background: white; cursor: pointer; }
.truckload-type-options label:has(input:checked) { border: 2px solid var(--brand); padding: 10px; background: #eef4f1; }
.truckload-type-options input { width: 16px; min-height: 16px; height: 16px; margin: 2px 0 0; padding: 0; accent-color: var(--brand); box-shadow: none; }
.truckload-type-options strong, .truckload-type-options small { display: block; }
.truckload-type-options strong { font-size: 11px; line-height: 1.3; }
.truckload-type-options small { margin-top: 3px; color: var(--muted); font-size: 9px; line-height: 1.35; }
.date-status { min-height: 0; margin: 7px 0 0; color: var(--review); font-size: 11px; font-weight: 600; line-height: 1.45; }
.date-status:empty { display: none; }
.date-status.error { color: var(--error); }
.text-button, .secondary-path { width: auto; min-height: auto; margin: 8px 0 0; padding: 0; border: 0; background: none; color: var(--brand); font-size: 11px; font-weight: 700; text-align: left; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.delivery-section { min-width: 0; border-bottom: 0; }
.access-label { margin-top: 16px; }
.access-options { display: grid; gap: 6px; }
.access-option { display: grid; grid-template-columns: 18px 1fr auto; gap: 9px; align-items: start; min-height: 55px; margin: 0; padding: 10px 12px; border: 1px solid var(--border); background: white; cursor: pointer; }
.access-option.selected { border: 2px solid var(--brand); background: #eef4f1; padding: 9px 11px; }
.access-option input { width: 17px; min-height: 17px; height: 17px; margin: 2px 0 0; padding: 0; accent-color: var(--brand); box-shadow: none; }
.access-option strong { display: block; margin-bottom: 2px; font-size: 12px; }
.access-option small { display: block; color: var(--muted); font-size: 10px; line-height: 1.4; }
.access-option b { color: var(--brand); font-size: 9px; line-height: 1.4; text-align: right; }
.location-label { margin-top: 18px; }
.location-options { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.condition-option { display: grid; grid-template-columns: 18px 1fr; gap: 10px; align-items: start; margin: 0; padding: 12px 13px; border: 1px solid var(--border); background: white; cursor: pointer; }
.condition-option input, .preference-options input { width: 17px; min-height: 17px; height: 17px; margin: 2px 0 0; padding: 0; accent-color: var(--brand); box-shadow: none; }
.condition-option strong, .condition-option small { display: block; }
.condition-option strong { font-size: 11px; }
.condition-option small { margin-top: 2px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.equipment-preference { margin-top: 14px; padding: 14px; border-left: 3px solid var(--brand); background: #eef4f1; }
.preference-options { display: grid; gap: 8px; }
.preference-options label { display: flex; gap: 9px; align-items: center; margin: 0; font-size: 11px; cursor: pointer; }
.primary-button, .state-button { width: 100%; min-height: 54px; padding: 0 28px; border: 0; border-radius: 999px; background: var(--brand-button); color: white; font-size: 14px; font-weight: 700; letter-spacing: .03em; cursor: pointer; }
.production-call-button { display: grid; place-items: center; text-decoration: none; }
.primary-button:hover, .state-button:hover { background: var(--brand-deep); }
.primary-button:focus-visible, .state-button:focus-visible, .text-button:focus-visible, .secondary-path:focus-visible, nav a:focus-visible { outline: 3px solid #8fb0a5; outline-offset: 3px; }
.address-control { position: relative; min-width: 0; scroll-margin-block: 110px 180px; }
.address-control input, gmp-place-autocomplete.bosk-address-autocomplete { min-width: 0; max-width: 100%; }
.address-control input:not(:focus) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
gmp-place-autocomplete.bosk-address-autocomplete { display: block; width: 100%; margin: 0; overflow: hidden; color-scheme: light; text-overflow: ellipsis; white-space: nowrap; }
gmp-place-autocomplete.bosk-address-autocomplete:focus-within { position: relative; z-index: 25; overflow: visible; white-space: normal; }
.primary-button:disabled { cursor: wait; opacity: .72; }
.secondary-path { justify-self: center; margin-top: 14px; text-align: center; }

.quote-status:empty { display: none; }
.quote-status { margin: 0 30px 30px; }
.loading-state, .result-card, .review-card, .notice-card { padding: 24px; border: 1px solid var(--border); }
.loading-state { background: var(--surface-muted); text-align: center; }
.loading-state .spinner { width: 34px; height: 34px; margin: 0 auto 14px; border: 3px solid #c8d1cc; border-top-color: var(--brand); border-radius: 50%; animation: spin .8s linear infinite; }
.loading-state strong { display: block; color: var(--brand-deep); font-family: "Playfair Display", Georgia, serif; font-size: 22px; font-weight: 500; }
.loading-state p { margin: 7px 0 16px; color: var(--muted); font-size: 11px; }
.progress-track { height: 5px; overflow: hidden; background: #d9dfdb; }
.progress-bar { width: 62%; height: 100%; background: var(--brand); animation: progress 1.1s ease-in-out infinite alternate; }

.result-card { padding: 0; overflow: hidden; background: white; }
.result-card:focus, .review-card:focus { outline: none; }
.quote-review-head { padding: 26px; background: var(--brand-deep); color: white; }
.quote-review-head .result-eyebrow { margin: 0 0 6px; color: rgba(255,255,255,.72); font-size: 10px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.quote-number { margin: 0 0 18px; color: #dce7e1; font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.quote-validity { margin: 12px 0 0; color: rgba(255,255,255,.78); font-size: 10px; }
.quote-review-section-title { margin: 4px 0 10px; color: var(--brand-deep); font-family: "Playfair Display", Georgia, serif; font-size: 21px; font-weight: 500; }
.quote-review-details { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); margin: 0 0 20px; border-top: 1px solid var(--border); }
.quote-review-detail { min-width: 0; padding: 12px 0; border-bottom: 1px solid var(--border); }
.quote-review-detail:nth-child(odd) { padding-right: 14px; }
.quote-review-detail:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--border); }
.quote-review-detail dt { margin: 0 0 3px; color: var(--muted); font-size: 9px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.quote-review-detail dd { margin: 0; color: var(--text); font-size: 11px; font-weight: 700; line-height: 1.45; overflow-wrap: anywhere; }
.stale-quote-notice { margin: 0 0 18px; padding: 11px 13px; border-left: 4px solid #a67220; background: var(--review-bg); color: var(--review); font-size: 11px; font-weight: 700; line-height: 1.45; }
.quote-is-stale .quote-review-head, .quote-is-stale .result-body > :not(.stale-quote-notice):not(.quote-actions) { opacity: .64; }
.quote-is-stale [data-action="schedule"] { cursor: not-allowed; opacity: .55; }
.quote-disclaimer { margin: 18px 0 0; color: var(--muted); font-size: 9px; line-height: 1.55; }
.quote-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 18px; }
.quote-actions .state-button { grid-column: 1 / -1; }
.quote-secondary-action { display: grid; place-items: center; min-height: 44px; padding: 8px 12px; border: 1px solid var(--brand); border-radius: 999px; background: white; color: var(--brand); font-size: 10px; font-weight: 700; line-height: 1.35; text-align: center; text-decoration: none; cursor: pointer; }
.quote-actions .change-button { grid-column: 1 / -1; margin-top: 3px; }
.scheduling-requested-status { margin-top: 16px; padding: 16px; border: 1px solid rgba(19,74,58,.28); border-radius: 10px; background: #f1f7f4; }
.scheduling-requested-status .result-eyebrow { margin-bottom: 5px; color: var(--forest); }
.scheduling-requested-status p { margin-top: 0; }
.quote-secondary-action:hover { background: #edf4f0; }
.quote-secondary-action:focus-visible { outline: 3px solid #8fb0a5; outline-offset: 2px; }
.result-head { padding: 26px 26px 24px; background: var(--brand-deep); color: white; }
.result-head .result-eyebrow { margin: 0 0 8px; color: rgba(255,255,255,.72); font-size: 10px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.result-price { margin: 0 0 5px; font-family: "Playfair Display", Georgia, serif; font-size: clamp(44px,6vw,58px); line-height: 1; }
.result-per-load { margin: 0; color: rgba(255,255,255,.78); font-size: 11px; }
.result-delivered-per-ton { margin: 7px 0 0; color: #fff; font-size: 13px; font-weight: 700; line-height: 1.35; }
.result-distance { margin: 10px 0 0; color: rgba(255,255,255,.72); font-size: 10px; }
.result-distance strong { color: white; font-weight: 700; }
.result-body { padding: 24px 26px 26px; }
.included { display: flex; align-items: center; gap: 9px; margin: 0 0 20px; color: var(--success); font-size: 12px; font-weight: 700; }
.included span { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--success); color: white; }
.estimate-notices { display: grid; gap: 7px; margin: -5px 0 20px; padding: 0; list-style: none; }
.estimate-notices li { padding: 10px 12px; border-left: 3px solid #a67220; background: var(--review-bg); color: var(--review); font-size: 10px; font-weight: 600; line-height: 1.45; }
.jobsite-review-notice { margin: -5px 0 20px; padding: 10px 12px; border-left: 3px solid #a67220; background: var(--review-bg); color: var(--review); font-size: 10px; font-weight: 600; line-height: 1.45; }
.result-summary { display: grid; grid-template-columns: repeat(2,1fr); margin-bottom: 20px; border-top: 1px solid var(--border); }
.quantity-planning-note { grid-column: 1 / -1; margin: 10px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.result-item { min-width: 0; padding: 14px 0; border-bottom: 1px solid var(--border); }
.result-item:nth-child(odd) { padding-right: 14px; }
.result-item:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--border); }
.result-item span { display: block; margin-bottom: 3px; color: var(--muted); font-size: 9px; text-transform: uppercase; }
.result-item strong { display: block; overflow-wrap: anywhere; font-size: 12px; }
.result-item dt { margin: 0 0 3px; color: var(--muted); font-size: 9px; text-transform: uppercase; }
.result-item dd { margin: 0; overflow-wrap: anywhere; font-size: 12px; font-weight: 700; }
.testing-mode-notice { display: grid; gap: 2px; margin: 2px 0 10px; padding: 10px 12px; border: 1px solid #b6a36d; border-left: 4px solid #806d35; background: #f8f5e9; color: var(--brand-deep); }
.testing-mode-notice strong { font-size: 10px; letter-spacing: .08em; }
.testing-mode-notice span { color: var(--text); font-size: 9px; line-height: 1.45; }
.pricing-disclosure { margin: 2px 0 20px; border: 1px solid var(--border); background: #fafbf9; }
.pricing-disclosure > summary { position: relative; padding: 14px 42px 14px 15px; color: var(--brand-deep); font-size: 11px; font-weight: 700; cursor: pointer; list-style: none; }
.pricing-disclosure > summary::-webkit-details-marker { display: none; }
.pricing-disclosure > summary::after { position: absolute; top: 50%; right: 15px; content: "+"; font-size: 20px; font-weight: 400; transform: translateY(-50%); }
.pricing-disclosure[open] > summary::after { content: "−"; }
.pricing-disclosure > summary:focus-visible { outline: 3px solid #8fb0a5; outline-offset: 2px; }
.pricing-disclosure-panel { padding: 0 15px 16px; border-top: 1px solid var(--border); }
.supplier-pricing-status { display: grid; gap: 3px; margin: 15px 0 2px; padding: 12px; border: 1px solid #aac0b8; background: #f2f7f4; color: var(--text); font-size: 9px; line-height: 1.4; }
.supplier-pricing-status strong { color: var(--brand-deep); font-size: 11px; }
.supplier-pricing-status small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.calculation-section { padding: 16px 0 4px; border-bottom: 1px solid var(--border); }
.calculation-section:last-of-type { border-bottom: 0; }
.calculation-section h4 { margin: 0 0 8px; color: var(--brand-deep); font-family: "Open Sans", Arial, sans-serif; font-size: 11px; line-height: 1.4; }
.calculation-section dl { margin: 0; }
.calculation-row { display: grid; grid-template-columns: minmax(145px, .85fr) minmax(0, 1.15fr); gap: 12px; padding: 5px 0; font-size: 9px; line-height: 1.45; }
.calculation-row dt { color: var(--muted); }
.calculation-row dt[title] { text-decoration: underline dotted; text-underline-offset: 2px; cursor: help; }
.calculation-row dd { min-width: 0; margin: 0; color: var(--text); font-weight: 600; overflow-wrap: anywhere; text-align: right; }
.final-calculation-row { border-bottom: 1px solid #e6e9e5; }
.final-calculation-total { margin-top: 4px; padding: 9px 0; border-top: 2px solid var(--brand); border-bottom: 2px solid var(--brand); }
.final-calculation-total dt, .final-calculation-total dd { color: var(--brand-deep); font-size: 11px; font-weight: 800; }
.copy-calculation-button { margin-top: 15px; padding: 9px 12px; border: 1px solid var(--brand); background: white; color: var(--brand); font-size: 10px; font-weight: 700; cursor: pointer; }
.copy-calculation-button:hover { background: var(--brand); color: white; }
.copy-calculation-button:focus-visible { outline: 3px solid #8fb0a5; outline-offset: 2px; }
.copy-calculation-status { display: block; min-height: 16px; margin-top: 6px; color: var(--muted); font-size: 9px; }
.state-button { min-height: 50px; }
.start-new-quote-button { margin-top: 14px; }
.change-button { display: block; margin: 12px auto 0; border: 0; background: none; color: var(--brand); font-size: 11px; font-weight: 700; text-decoration: underline; cursor: pointer; }
.approval-note { margin: 15px 0 0; color: var(--muted); font-size: 10px; line-height: 1.55; text-align: center; }

.review-card { border-top: 5px solid #a67220; background: white; }
.review-icon { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 16px; border-radius: 50%; background: var(--review-bg); color: var(--review); font-size: 22px; font-weight: 700; }
.review-card .state-eyebrow { margin: 0 0 6px; color: var(--review); font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.testing-review-reason { padding: 9px 11px; border-left: 3px solid #806d35; background: #f8f5e9; color: var(--brand-deep); font-size: 9px; font-weight: 700; line-height: 1.45; }
.review-card h3 { margin: 0 0 9px; color: var(--brand-deep); font-family: "Playfair Display", Georgia, serif; font-size: 29px; font-weight: 500; }
.review-card > p { margin: 0 0 18px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.review-summary { margin-bottom: 19px; padding: 13px 15px; border-left: 4px solid #a67220; background: var(--review-bg); font-size: 11px; line-height: 1.5; }
.review-summary strong { display: block; margin-bottom: 4px; color: var(--review); }
.notice-card { background: var(--surface-muted); color: var(--brand-deep); font-size: 12px; line-height: 1.55; }
.notice-card strong { display: block; margin-bottom: 4px; }

.how-it-works { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; max-width: 1168px; margin: 0 auto; padding: 0 36px 64px; }
.how-it-works > div { padding: 24px; background: white; border: 1px solid var(--border); }
.how-it-works span { color: var(--brand); font-size: 10px; font-weight: 700; }
.how-it-works strong { display: block; margin: 8px 0 6px; color: var(--brand-deep); font-family: "Playfair Display", Georgia, serif; font-size: 20px; }
.how-it-works p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 26px max(36px,calc((100vw - 1168px)/2)); background: var(--brand-deep); color: #dce5e0; }
footer img { width: 105px; height: 48px; object-fit: contain; filter: brightness(0) invert(1); }
footer p { margin: 0; color: #aab9b1; font-size: 11px; }
footer a { color: white; font-size: 12px; font-weight: 700; text-decoration: none; }

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes progress { from { transform: translateX(-30%); } to { transform: translateX(65%); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

@media (max-width: 940px) {
  .experience-inner { grid-template-columns: 1fr; max-width: 720px; }
  .brand-story { text-align: center; }
  .brand-story h1, .brand-story .lede { margin-left: auto; margin-right: auto; }
  .proof-list { justify-items: center; }
  .jobsite-photo { min-height: 230px; }
  .quote-card { grid-row: 1; }
  .brand-story { grid-row: 2; padding-top: 0; }
  .how-it-works { grid-template-columns: 1fr; max-width: 720px; }
}

@media (max-width: 680px) {
  .demo-banner { display: block; padding: 8px 14px; }
  .demo-banner span { display: block; margin-top: 3px; }
  .header-inner { min-height: 70px; padding: 8px 16px; }
  .brand { gap: 8px; }
  .brand img { width: 106px; height: 50px; }
  .header-inner { flex-direction: column; align-items: stretch; gap: 7px; }
  .brand span { display: none; }
  .brand img { width: 106px; height: 45px; }
  nav { justify-content: space-between; gap: 12px; width: 100%; }
  .calculator-tabs { flex: 1; justify-content: space-between; gap: 10px; }
  nav a { font-size: 10px; }
  nav .phone { border: 0; padding: 0 0 0 8px; font-size: 10px; white-space: nowrap; }
  .quote-mode-navigation { padding: 9px 12px; }
  .quote-mode-navigation .calculator-tabs { width: min(100%,390px); }
  .quote-mode-navigation .calculator-tabs a { flex: 1; padding-inline: 10px; text-align: center; }
  .experience-inner { padding: 14px 14px 42px; }
  .quote-card-heading { padding: 20px 20px 18px; }
  .quote-card-heading h2 { font-size: 27px; }
  .workflow-steps li { min-height: 41px; font-size: 8px; }
  form { padding: 5px 20px 20px; }
  .form-section { padding: 14px 0; }
  .quantity-control { grid-template-columns: minmax(90px,.55fr) minmax(145px,1fr); }
  .truckload-type-options { grid-template-columns: 1fr; }
  .truckload-type-options label { min-height: 56px; }
  .access-option { grid-template-columns: 18px 1fr; min-height: 59px; }
  .access-option b { grid-column: 2; margin-top: -4px; text-align: left; }
  .location-options { grid-template-columns: 1fr; }
  .quote-status { margin: 0 20px 24px; }
  .brand-story { padding: 18px 3px 0; }
  h1 { font-size: 40px; }
  .jobsite-photo { min-height: 190px; }
  .how-it-works { padding: 0 14px 42px; }
  footer { display: grid; justify-items: center; padding: 26px 18px; text-align: center; }
}

@media (max-width: 430px) {
  .result-summary { grid-template-columns: 1fr; }
  .result-item:nth-child(odd), .result-item:nth-child(even) { padding: 13px 0; border-left: 0; }
  .workflow-steps li { flex-direction: column; gap: 1px; }
}

.material-combobox { position: relative; }
.material-combobox input[role="combobox"] { padding-right: 38px; background-image: linear-gradient(45deg,transparent 50%,var(--brand) 50%),linear-gradient(135deg,var(--brand) 50%,transparent 50%); background-position: calc(100% - 18px) 19px,calc(100% - 13px) 19px; background-size: 5px 5px,5px 5px; background-repeat: no-repeat; }
.material-options { position: absolute; top: calc(100% + 4px); right: 0; left: 0; z-index: 20; max-height: 300px; overflow-y: auto; padding: 5px 0; border: 1px solid #aebbb4; border-radius: 6px; background: white; box-shadow: 0 12px 30px rgba(23,49,41,.18); }
.material-option-group > strong { display: block; padding: 7px 12px 4px; color: var(--muted); font-size: 9px; letter-spacing: .09em; text-transform: uppercase; }
.material-option-group button { display: block; width: 100%; min-height: 34px; padding: 7px 12px; border: 0; background: white; color: var(--text); font-size: 11px; text-align: left; cursor: pointer; }
.material-option-group button:hover, .material-option-group button:focus-visible, .material-option-group button[aria-selected="true"] { background: #edf4f0; color: var(--brand-deep); outline: none; }
.pickup-yard-options button strong, .pickup-yard-options button span { display: block; }
.pickup-yard-options > button { display: block; width: 100%; min-height: 42px; padding: 8px 12px; border: 0; border-top: 1px solid var(--border); background: #f7faf8; text-align: left; cursor: pointer; }
.pickup-yard-options > button:hover, .pickup-yard-options > button:focus-visible { background: #edf4f0; outline: none; }
.pickup-yard-options button strong { color: var(--brand-deep); font-size: 11px; }
.pickup-yard-options button span { margin-top: 2px; color: var(--muted); font-size: 9px; line-height: 1.35; }
.pickup-yard-request-toggle { margin-top: 7px; text-align: left; }
.pickup-yard-confirmation { margin: 8px 0 0; padding: 9px 11px; border-left: 3px solid var(--brand); background: #edf4f0; color: var(--brand-deep); font-size: 10px; }
.pickup-yard-confirmation strong, .pickup-yard-confirmation span { display: block; }
.pickup-yard-confirmation span { margin-top: 2px; color: var(--muted); line-height: 1.4; }
.material-empty { margin: 0; padding: 12px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.material-actions { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 4px; }
.quantity-calculator { margin-top: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 7px; background: var(--surface-muted); }
.inline-actions { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.small-button { border: 0; border-radius: 6px; background: var(--brand); color: white; padding: 10px 13px; font: inherit; font-size: 11px; font-weight: 700; cursor: pointer; }
.request-chip { margin: 8px 0 0; padding: 9px 11px; border-left: 4px solid #a67220; background: var(--review-bg); font-size: 10px; line-height: 1.4; }
.request-chip strong { color: var(--review); }
.request-chip span { color: var(--muted); }
.request-chip button { margin: 5px 0 0; padding: 0; border: 0; background: none; color: var(--brand); font-size: 10px; font-weight: 700; text-decoration: underline; cursor: pointer; }
.calculator-toggle { margin-top: 10px; }
.quantity-calculator h3 { margin: 0; color: var(--brand-deep); font-size: 15px; }
.quantity-calculator > p { margin: 5px 0 12px; color: var(--muted); font-size: 10px; }
.dimension-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.dimension-grid label > div { display: grid; grid-template-columns: 1fr auto; }
.dimension-grid input, .dimension-grid select { min-width: 0; border-radius: 0; }
.dimension-grid input { border-radius: 6px 0 0 6px; }
.dimension-grid select { width: 58px; border-left: 0; border-radius: 0 6px 6px 0; }
.calculator-options { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin: 10px 0; }
.calculator-result { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 10px; margin-top: 11px; color: var(--brand); font-size: 11px; }
.calculator-result span { flex-basis: 100%; color: var(--muted); font-size: 10px; }
.location-conditions { margin-top: 11px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: #fafbf9; }
.location-conditions summary { display: flex; justify-content: space-between; gap: 15px; padding: 9px 2px; cursor: pointer; font-size: 11px; font-weight: 700; }
.location-conditions summary b { color: var(--brand-light); font-size: 10px; }
.location-conditions > p { margin: 0; padding: 0 2px 7px; color: var(--muted); font-size: 9px; }
.location-conditions .location-options { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 18px; padding: 0 2px 9px; }
.location-conditions .location-options label { display: flex; align-items: center; gap: 7px; min-height: 25px; margin: 0; padding: 2px 0; background: transparent; cursor: pointer; font-size: 10px; font-weight: 500; text-align: left; }
.location-conditions input { flex: 0 0 16px; width: 16px; height: 16px; min-height: 16px; margin: 0; padding: 0; accent-color: var(--brand); box-shadow: none; }
.estimate-review { margin: 12px 0; padding: 12px; border-left: 4px solid #a67220; background: var(--review-bg); color: var(--brand-deep); font-size: 11px; }
.estimate-review p { margin: 4px 0 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.service-separation { display: grid; gap: 3px; padding: 12px 30px; border-bottom: 1px solid var(--border); background: #edf4f0; color: var(--brand-deep); font-size: 10px; }
.service-separation span { color: var(--muted); }
.hauling-card form { padding-top: 2px; }
.hauling-card .form-section label:not(:first-of-type) { margin-top: 11px; }
.hauling-service-panel[hidden] { display: none; }
.service-note { margin: 0 0 13px; padding: 10px 12px; border-left: 3px solid var(--brand); background: #edf4f0; color: var(--brand-deep); font-size: 10px; line-height: 1.5; }
.inline-choice { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 7px; }
.inline-choice label { display: flex; align-items: center; gap: 8px; margin: 0 !important; padding: 9px 10px; border: 1px solid var(--border); background: white; font-size: 10px; cursor: pointer; }
.inline-choice input { width: 16px; height: 16px; margin: 0; }
.hauling-card textarea { width: 100%; resize: vertical; }
.jobsite-intelligence { margin-top: 10px; border: 1px solid #cbd8d2; border-left: 3px solid var(--brand); border-radius: 4px; background: #f3f7f5; }
.jobsite-intelligence summary { padding: 10px 12px; color: var(--brand-deep); font-size: 10px; font-weight: 700; line-height: 1.4; cursor: pointer; }
.jobsite-intelligence summary small { color: var(--muted); font-weight: 500; }
.jobsite-intelligence-fields { padding: 1px 12px 12px; border-top: 1px solid #cbd8d2; }
.jobsite-intelligence-fields label { margin-top: 10px !important; }
.jobsite-intelligence-fields textarea { width: 100%; resize: vertical; }
.coordinate-status { min-height: 0; margin: 5px 0 0; color: var(--success); font-size: 9px; font-weight: 600; line-height: 1.45; }
.coordinate-status:empty { display: none; }
.coordinate-status.error { color: var(--error); }
.hauling-card label small { color: var(--muted); font-weight: 400; }
.result-financials { display: grid; gap: 7px; margin: 0 0 15px; padding: 12px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.result-financials div { display: flex; justify-content: space-between; gap: 18px; color: var(--muted); font-size: 11px; }
.result-financials strong { color: var(--text); }
.result-financials .financial-total { padding-top: 7px; border-top: 1px solid var(--border); color: var(--brand-deep); font-weight: 700; }
.estimate-breakdown { margin: 10px 0 15px; padding: 11px 13px; background: var(--surface-muted); }
.estimate-breakdown div { display: flex; justify-content: space-between; gap: 16px; padding: 5px 0; font-size: 10px; }
.breakdown-button { width: auto; margin: 0 0 12px; padding: 0; border: 0; background: none; color: var(--brand); font-size: 10px; font-weight: 700; text-decoration: underline; cursor: pointer; }
.breakdown-request-modal form { display: grid; }
.scheduling-request-modal form { display: grid; padding: 0 24px 24px; }
.scheduling-request-modal form > label { margin-top: 12px; }
.scheduling-request-modal form .modal-actions { margin: 10px 0 0; padding-bottom: 0; }
.scheduling-request-modal .modal-actions .primary-button { width: 100%; }
.scheduling-request-modal .modal-actions .text-button { flex: 0 0 auto; }
.scheduling-quote-context { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); min-width: 0; gap: 9px; padding: 12px; border: 1px solid var(--border); background: var(--surface-muted); }
.scheduling-quote-context label { grid-row: 1; margin: 0; color: var(--muted); font-size: 9px; text-transform: uppercase; }
.scheduling-quote-context input { min-height: 38px; background: white; font-size: 10px; }
.scheduling-request-status { min-height: 18px; margin: 10px 0 0; color: var(--brand-deep); font-size: 10px; font-weight: 600; line-height: 1.5; }
.scheduling-request-status.error { color: var(--error); }
.pickup-yard-modal form { display: grid; padding: 0 24px 24px; }
.pickup-yard-modal form > label { margin-top: 12px; }
.pickup-yard-modal form .modal-actions, .pickup-yard-modal form .modal-error { margin-right: 0; margin-left: 0; }
.breakdown-request-modal .modal-actions { margin-top: 16px; }
.breakdown-confirmation { margin: 12px 0 16px; padding: 12px 14px; border: 1px solid #b8d3c5; background: #edf4f0; color: var(--brand-deep); }
.breakdown-confirmation strong { display: block; margin-bottom: 4px; }
.breakdown-confirmation p { margin: 0; font-size: 10px; line-height: 1.5; }
.daily-rate-card { margin: 12px 0; padding: 11px 13px; border-left: 3px solid var(--brand); background: #edf4f0; }
.daily-rate-card strong { display: block; color: var(--brand-deep); font-size: 13px; }
.daily-rate-card span { color: var(--muted); font-size: 9px; line-height: 1.4; }

.sourcing-modal { width: min(520px,calc(100vw - 28px)); max-width: calc(100vw - 28px); max-height: calc(100vh - 32px); padding: 0; overflow-x: hidden; overflow-y: auto; border: 1px solid var(--border); border-radius: 8px; background: white; color: var(--text); box-shadow: 0 24px 70px rgba(9,30,24,.3); }
.sourcing-modal::backdrop { background: rgba(10,28,23,.58); }
.modal-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 22px 24px 18px; background: var(--brand); color: white; }
.modal-heading p { margin: 0 0 3px; color: rgba(255,255,255,.72); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.modal-heading h2 { margin: 0; font-size: 24px; }
.modal-close { width: 34px; height: 34px; border: 0; background: transparent; color: white; font-size: 28px; line-height: 1; cursor: pointer; }
.modal-intro { margin: 20px 24px; color: var(--muted); font-size: 11px; line-height: 1.55; }
.sourcing-modal > label, .modal-error, .modal-actions { margin-right: 24px; margin-left: 24px; }
.sourcing-modal > input { width: calc(100% - 48px); margin-right: 24px; margin-left: 24px; }
.sourcing-modal > label { margin-top: 15px; margin-bottom: 7px; }
.sourcing-modal label small { color: var(--muted); font-weight: 400; }
.modal-error { min-height: 16px; margin-top: 7px; margin-bottom: 0; color: var(--error); font-size: 10px; }
.modal-actions { display: flex; align-items: center; gap: 18px; padding: 8px 0 24px; }
.modal-actions .primary-button { width: auto; min-height: 44px; padding: 0 28px; }
.modal-actions .text-button { margin: 0; }

@media (max-width: 620px) {
  .dimension-grid, .calculator-options, .location-conditions .location-options { grid-template-columns: 1fr; }
  .material-actions { align-items: flex-start; flex-direction: column; }
  .primary-button.is-ready { position: sticky; bottom: 10px; z-index: 12; box-shadow: 0 8px 24px rgba(23,49,41,.28); }
  .material-options { max-height: 250px; }
  .testing-mode-notice { padding: 9px 10px; }
  .pricing-disclosure > summary { padding: 13px 38px 13px 12px; }
  .pricing-disclosure-panel { padding: 0 12px 14px; }
  .supplier-pricing-status { padding: 10px; }
  .calculation-row { grid-template-columns: 1fr; gap: 2px; padding: 7px 0; }
  .calculation-row dd { text-align: left; }
  .final-calculation-total { padding: 9px 0; }
  .copy-calculation-button { width: 100%; min-height: 44px; }
  .address-control { scroll-margin-block: 90px 44vh; }
  gmp-place-autocomplete.bosk-address-autocomplete { min-height: 46px; font-size: 16px; }
  .quote-review-details, .quote-actions, .scheduling-quote-context { grid-template-columns: 1fr; }
  .quote-review-detail:nth-child(odd), .quote-review-detail:nth-child(even) { padding: 12px 0; border-left: 0; }
  .quote-actions .state-button, .quote-actions .change-button { grid-column: 1; }
  .quote-secondary-action { min-height: 48px; }
  .scheduling-quote-context label { grid-row: auto; }
  .scheduling-request-modal .modal-actions { align-items: stretch; flex-direction: column; }
  .scheduling-request-modal .modal-actions .text-button { text-align: center; }
}
.revision-review-shell {
  max-width: 860px;
  margin: 0 auto;
  padding: clamp(1rem, 4vw, 3rem);
}

.revision-review-card {
  display: grid;
  gap: 1.25rem;
}

.revision-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  padding: 1rem;
  background: #f4f5f2;
  border-radius: 12px;
}

.revision-summary p {
  display: grid;
  gap: .2rem;
  margin: 0;
}

.revision-diff {
  display: grid;
  grid-template-columns: minmax(10rem, .6fr) 1fr;
  gap: .65rem 1rem;
  margin: 0;
}

.revision-diff dt {
  font-weight: 700;
}

.revision-diff dd {
  margin: 0;
}

.revision-diff del {
  color: #6e736e;
}

.revision-diff ins {
  color: #123f33;
  font-weight: 700;
  text-decoration: none;
}

.revision-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}

@media (max-width: 640px) {
  .revision-summary,
  .revision-diff {
    grid-template-columns: 1fr;
  }
}