/* ==========================================================================
   Business — הצעת מחיר
   ========================================================================== */
.fgroup { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 700; min-width: 0; }
.fld { display: block; width: 100%; min-height: 50px; padding: 0 12px; background: var(--surface); border: var(--bw-strong) solid var(--ink); font-size: 16px; font-weight: 400; border-radius: 0; }
textarea.fld { padding: 10px 12px; min-height: 96px; resize: vertical; }
.fld.is-bad { border-color: var(--err); }
.ltr-in { direction: ltr; text-align: left; }
.fgroup .error { font-weight: 600; }

.bhero__in { padding-block: 40px 0; display: flex; flex-direction: column; gap: 24px; }
.bhero__copy { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.bhero h1 { font-size: clamp(56px, 16vw, 112px); line-height: .94; letter-spacing: -.055em; }
.bhero .lead { max-width: 520px; }
.bhero .btn--lg { min-height: 60px; }
.bhero__pile { position: relative; height: 280px; margin-inline: calc(var(--gutter) * -1); overflow: hidden; }
.bhero__pile .art { position: absolute; width: 46%; }
.bhero__pile .p1 { inset-inline-end: 4%; top: 6%; }
.bhero__pile .p2 { inset-inline-end: 30%; top: 34%; }
.bhero__pile .p3 { inset-inline-start: 24%; top: 4%; }
.bhero__pile .p4 { inset-inline-start: -2%; top: 36%; }

.container.section h2, .quote h2 { font-size: clamp(32px, 7vw, 48px); line-height: 1.08; }
.bgrid { display: grid; margin-top: 28px; border-top: var(--bw) solid var(--ink); border-inline-start: var(--bw) solid var(--ink); }
.bgrid > div { background: var(--surface); padding: 22px 20px; display: flex; flex-direction: column; gap: 8px; border-inline-end: var(--bw) solid var(--ink); border-bottom: var(--bw) solid var(--ink); }
.bgrid > div > span:first-child { font-size: 13px; font-weight: 800; color: var(--ink-2); }
.bgrid strong { font-size: 22px; }
.bgrid > div > span:last-child { font-size: 15px; line-height: 1.6; color: var(--ink-2); }

.quote__art { inset-inline-end: 0; top: 0; width: 60%; height: 100%; object-fit: cover; opacity: .12; }
.quote__in { padding-block: 40px 56px; display: grid; gap: 28px; align-items: start; }
.quote__l { display: flex; flex-direction: column; gap: 14px; }
.qform { background: var(--surface); border: var(--bw) solid var(--ink); padding: 20px 16px; display: flex; flex-direction: column; gap: 18px; }
.qform__2, .qform__3 { display: grid; gap: 14px; }
.qlines { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.qlines legend { font-size: 14px; font-weight: 700; margin-bottom: 8px; padding: 0; }
.qline { display: grid; grid-template-columns: 1fr 120px 44px; gap: 8px; align-items: center; margin-bottom: 8px; }
.qline label { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.qline .fld { min-height: 46px; }
.qline__x { width: 44px; height: 46px; border: 1px solid var(--line); font-size: 18px; }
.qline__x:hover { background: var(--ink); color: #fff; }
.qlines .link-underline { align-self: flex-start; font-size: 14px; }
.qform .btn--lg { min-height: 60px; }
.qdone { background: var(--accent); border: var(--bw) solid var(--ink); padding: 28px 20px; display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.qdone > strong { font-size: 40px; letter-spacing: -.03em; }
.qdone[hidden], .qform[hidden] { display: none; }

@media (min-width: 768px) {
  .bhero__in { padding-block: 64px 0; }
  .bgrid { grid-template-columns: 1fr 1fr; }
  .qform { padding: 28px; }
  .qform__2 { grid-template-columns: 1fr 1fr; }
  .qform__3 { grid-template-columns: repeat(3, 1fr); }
  .qline { grid-template-columns: 1fr 160px 44px; }
  .bhero__pile { height: 360px; }
}
@media (min-width: 1024px) {
  .segmented { grid-template-columns: repeat(4, 1fr) !important; }
  .bhero__in { display: grid; grid-template-columns: repeat(12, 1fr); gap: 32px; padding-block: 80px 80px; align-items: center; }
  .bhero__copy { grid-column: span 6; }
  .bhero__pile { grid-column: 7 / span 6; height: 520px; margin: 0; overflow: visible; }
  .bhero__pile .art { width: 50%; }
  .bgrid { grid-template-columns: repeat(4, 1fr); }
  .bgrid > div { padding: 28px; min-height: 220px; }
  .quote__in { grid-template-columns: repeat(12, 1fr); gap: 48px; padding-block: 80px; }
  .quote__l { grid-column: span 5; position: sticky; top: 24px; }
  .qform, .qdone { grid-column: 7 / span 6; }
}