/* Стили страницы /quote/ (Get a Free Quote). Общий костяк (.page/.section-title/
   .svc-desc/toolbar/.bc) — canonical в shared.css, здесь только своё:
   двухколоночная сетка формы, сама форма, состояние "спасибо", подборка
   недавних проектов внизу. */

.qgrid{display:grid;grid-template-columns:60fr 40fr;gap:48px;align-items:start;margin-top:32px}
@media(max-width:860px){.qgrid{grid-template-columns:1fr}}

/* ── Форма — карточка того же языка, что .svc-card (bg-card/border/var(--r)),
   не переиспользую сам класс напрямую, т.к. внутренний padding/gap другие. */
.qform-card{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--r);padding:28px 26px}
.qform-context{margin-bottom:18px}
.qform-errors{background:color-mix(in srgb,var(--accent) 8%,transparent);border:1px solid var(--accent-dim);border-radius:var(--r);padding:12px 16px;margin-bottom:18px;color:var(--accent-deep);font-size:13.5px}
.qform-errors p+p{margin-top:4px}

.qform-label{display:block;font-family:var(--display);font-size:13px;font-weight:700;color:var(--ink);margin:16px 0 6px}
.qform-card form>.qform-label:first-of-type{margin-top:0}
/* .qform-field — произведено от .search-wrap input (тот же border-color/
   font-family), но не таблетка (border-radius:99px) — это поля формы во всю
   ширину, а не поисковая пилюля, полное скругление на них смотрелось бы
   странно; используем тот же радиус, что и у карточек (var(--r)). */
.qform-field{width:100%;padding:11px 14px;border:1px solid var(--line-2);border-radius:var(--r);font-size:14px;font-family:var(--body);color:var(--ink);background:var(--bg-main);transition:.15s}
.qform-field:focus{outline:none;border-color:var(--accent)}
textarea.qform-field{resize:vertical;min-height:110px;font-family:var(--body)}

/* Ошибка конкретного поля (находка №31 SEO/UX-аудита) — рядом с самим
   полем, не только общим списком сверху формы. */
.qform-field.is-invalid{border-color:var(--accent-deep)}
.qform-field-error{display:block;margin-top:6px;font-size:12.5px;color:var(--accent-deep)}
.qform-submit{margin-top:20px;border:none;font-family:inherit;display:inline-block}

.qform-turnstile{margin-top:16px}

/* Honeypot — реальным людям не видно и не фокусируется табом (сам инпут уже
   tabindex="-1" в разметке), но остаётся в DOM и доступен ботам, которые
   заполняют форму программно, не рендеря CSS. */
.qform-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.qform-sent{text-align:center;padding:48px 26px}
.qform-sent h3{font-family:var(--display);font-size:22px;font-weight:700;margin-bottom:10px}
.qform-sent p{color:var(--ink-dim);font-size:14px;margin-bottom:18px}

/* ── Правая колонка — "What happens next" шаги (.why-card, см.
   includes/why_card.php) просто стопкой, свой gap вместо .why-grid (там
   3-колоночная сетка, тут одна колонка уже). */
.qside{display:flex;flex-direction:column;gap:16px}

/* ── Recent Work — full-width строка ПОД сеткой формы+шагов (не в узкой
   .qside — карточка .card рассчитана на широкую грид-колонку вроде
   .proj-grid, в узкой боковой колонке она выглядела бы тесно). Тот же
   3-колоночный грид, что .proj-grid в project-collection.css. */
.qside-h{font-family:var(--display);font-size:20px;font-weight:700;margin:48px 0 20px}
.qside-projects{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:980px){.qside-projects{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.qside-projects{grid-template-columns:1fr}}