/* Quote form styles for B2B landing pages (A1/A2/A3/A5/A6/A7).
   Extracted verbatim from styles.css (.quote, .button, .field-wide rules)
   so sub-pages do not need the full homepage stylesheet, whose global
   rules would shift existing article styling. Values match styles.css :root.
   Loaded after b2b-page.css on pages that embed the homepage quote form. */
:root {
  --ink: #0d0d0c;
  --ivory: #f4efe7;
  --bronze: #b77b4d;
  --bronze-light: #d7a06f;
  --white: #fff;
  --serif: Georgia, "Times New Roman", serif;
}

.button { min-height: 58px; display: inline-flex; align-items: center; justify-content: center; gap: 18px; padding: 14px 34px; border: 1px solid transparent; border-radius: 6px; font-weight: 500; cursor: pointer; transition: transform .2s ease, background .2s ease, color .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-solid { background: var(--bronze); color: var(--white); }
.button-outline { background: transparent; border-color: var(--bronze); color: var(--ivory); }

.quote { background: #121313; color: var(--ivory); }
.quote-shell { display: grid; grid-template-columns: minmax(300px,.78fr) minmax(620px,1.45fr); gap: 58px; padding: 56px max(54px, calc((100vw - 1320px)/2)) 36px; }
.quote-intro { display: flex; flex-direction: column; min-width: 0; }
.quote h2 { max-width: 360px; margin: 0; font-family: var(--serif); font-size: clamp(48px,4vw,64px); font-weight: 400; line-height: 1.05; letter-spacing: -.035em; }
.quote h2::after { content: ""; display: block; width: 88px; height: 1px; margin: 26px 0 0; background: var(--bronze); }
.contact-options { display: grid; gap: 0; margin: 4px 0 26px; border-top: 1px solid #765c47; }
.contact-options a, .contact-options address { display: grid; gap: 5px; padding: 14px 0; border-bottom: 1px solid #3d352e; color: var(--ivory); font-style: normal; }
.contact-options span { color: var(--bronze-light); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.contact-options strong { font-size: 13px; font-weight: 400; line-height: 1.55; overflow-wrap: anywhere; }
.contact-options a:hover strong { color: var(--bronze-light); }
.quote-visual { margin: auto 0 0; max-width: 360px; overflow: hidden; }
.quote-visual img { width: 100%; height: 100%; object-fit: cover; }
.quote-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 24px; align-content: start; }
.quote-form label { display: flex; flex-direction: column; gap: 7px; color: #e9e0d4; font-size: 11px; letter-spacing: .05em; text-transform: uppercase; }
.quote-form input, .quote-form select, .quote-form textarea { width: 100%; border: 1px solid #765c47; border-radius: 0; background: transparent; color: var(--ivory); padding: 13px 14px; outline: none; text-transform: none; }
.quote-form input:focus, .quote-form select:focus, .quote-form textarea:focus { border-color: var(--bronze-light); }
.quote-form option { color: var(--ink); }
.field-wide { grid-column: 1/-1; }
.quote-form .button { border-radius: 0; font-size: 18px; }
.quote-result { grid-column: 2; padding: 24px; border: 1px solid #765c47; }
.quote-result h3 { margin: 0; font-family: var(--serif); font-size: 28px; font-weight: 400; }
.quote-result pre { white-space: pre-wrap; color: #d8cabd; }
.quote-result-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.quote-result-actions .button { min-height: 48px; padding: 11px 14px; font-size: 13px; text-align: center; }

@media (max-width: 900px) {
  .button { width: 100%; min-height: 52px; }
  .quote-shell { display: flex; flex-direction: column; gap: 44px; padding: 72px 16px 44px; }
  .quote h2 { font-size: 48px; }
  .quote-visual { max-width: 100%; }
  .quote-form { grid-template-columns: 1fr; }
  .field-wide { grid-column: 1; }
  .quote-result { grid-column: 1; }
  .quote-result-actions { grid-template-columns: 1fr; }
}

@media (min-width: 761px) and (max-width: 900px) {
  .button { min-height: 48px; font-size: 13px; }
}