/* Sprint 01 — service front door. Additive only. Reuses the tokens and
   components in site.css / sections.css / form.css; no new colours, fonts
   or imagery. */

/* 04 — owner problems (reuses .grades/.grade on cream) */
.problems { margin-top: 80px; }

/* 05 — method */
.method { margin-top: 64px; max-width: 760px; display: flex; flex-direction: column; gap: 24px; }
.method__p { font-size: 20px; line-height: 32px; color: var(--cream); }
.method__p--muted { font-size: 17px; line-height: 28px; color: var(--muted); }

/* 05b — single offer + aside */
.offers--single { grid-template-columns: minmax(0, 680px) minmax(0, 420px); justify-content: start; }
.offer--aside { background: transparent; }
.offer__title--sm { font-size: 22px; line-height: 30px; }
.offer__list li { align-items: flex-start; }
.offer__list li::before { margin-top: 8px; }
@media (max-width: 1100px) { .offers--single { grid-template-columns: 1fr; } }

/* Business Check page — builds on form.css */
.check__aside { position: static; }
.check__block { display: flex; flex-direction: column; gap: 12px; }
.check__label { font-size: 11px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; color: var(--muted); }
.check__text { font-size: 15px; line-height: 24px; color: var(--soft-2); }
.check__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.check__list li { display: flex; gap: 12px; font-size: 14px; line-height: 22px; color: var(--soft-2); }
.check__list li::before { content: ""; width: 5px; height: 5px; margin-top: 9px; background: var(--muted); flex: none; }
.check__price b { font-size: 28px; font-weight: 300; color: var(--cream); }
.check__price small { display: block; font-size: 13px; line-height: 20px; color: var(--muted); margin-top: 4px; }

label.field__label { cursor: pointer; }
.field__hint { font-size: 13px; line-height: 20px; color: var(--soft-2); }
.field__error { display: none; font-size: 13px; line-height: 20px; color: #d4a843; }
.field.invalid .field__error { display: block; }
.safety { font-size: 13px; line-height: 20px; color: var(--soft-2); border-left: 2px solid var(--line-2); padding-left: 14px; }
.consent { font-size: 13px; line-height: 20px; color: var(--soft-2); max-width: 560px; }
.consent a { text-decoration: underline; text-underline-offset: 3px; color: var(--cream); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
#f-phone-wrap[hidden] { display: none; }

/* Keyboard focus must be visible everywhere (form.css removes the default). */
.line:focus-visible, .area:focus-visible, .btn--send:focus-visible, .btn:focus-visible,
a:focus-visible, .opt:focus-visible, .chip:focus-visible, .nav__burger:focus-visible {
  outline: 2px solid #d4a843; outline-offset: 3px;
}
.btn--send[aria-busy="true"] { opacity: .5; pointer-events: none; }
.err[role="alert"] { line-height: 20px; }

/* Pre-existing defect found in acceptance testing (also on the live site):
   the About photo is served at a fixed 380px on small screens and overflowed
   a 360px viewport by 29px, causing horizontal scroll. */
@media (max-width: 1100px) {
  .about { grid-template-columns: minmax(0, 1fr); }
  .about__col, .about__img { min-width: 0; }
  .about__img { max-width: min(380px, 100%); }
}

/* [hidden] must win over component display rules (form.css sets .success to
   display:flex, which made the "received" box visible before any submission —
   the same defect exists on the live start-project page). */
.success[hidden], #formwrap[hidden], #err[hidden], #fallback[hidden] { display: none !important; }

/* Single-offer card: opt out of the 6-row subgrid alignment used by the
   old 3-card layout; the card and its aside have different row structures. */
.offers--single { grid-template-rows: none; }
.offers--single .offer { display: flex; flex-direction: column; gap: 32px; grid-row: auto; grid-template-rows: none; }
.offers--single .offer > * { margin-bottom: 0; }
.offers--single .offer .offer__foot { margin-top: auto; }

/* Sprint 01.1 — claim-safety hotfix: figures removed, sections simplified */
.thesis--solo { grid-template-columns: minmax(0, 720px); }
.case__panel--plain { height: 96px; }
.status { background: var(--bg-2); border: 1px solid var(--line); border-radius: 2px; padding: 32px; display: flex; flex-direction: column; gap: 22px; }
.status__head { display: flex; justify-content: space-between; font-size: 11px; font-weight: 600; letter-spacing: 1.5px; color: var(--cream); }
.status__head span { color: var(--muted); font-weight: 500; }
.status__row { display: flex; flex-direction: column; gap: 4px; padding-top: 16px; border-top: 1px solid var(--line); }
.status__row span { font-size: 10px; font-weight: 600; letter-spacing: 1.5px; color: var(--muted); }
.status__row b { font-size: 15px; line-height: 23px; font-weight: 400; color: var(--cream); }
.leistung { margin-top: 56px; max-width: 720px; display: flex; flex-direction: column; gap: 32px; }
.leistung__p { font-size: 18px; line-height: 28px; color: var(--muted-dark); }
.leistung__btns { display: flex; gap: 32px; align-items: center; flex-wrap: wrap; }