/* Contact (/contact/) — Contact-Desktop 1440, Contact-Mobile 390 and the two Done comps.
   Form controls (.field .lbl .in .check .consent .small .err .send) come from site.css. */

/* top section: intro + materials left, form card right */
.c-top{padding:96px 0 128px}
.c-grid{display:grid;grid-template-columns:440px minmax(0,1fr);grid-template-rows:auto 1fr;grid-template-areas:"intro card" "mat card";column-gap:96px;row-gap:56px;align-items:start}
.c-intro{grid-area:intro;gap:20px;padding-top:8px}
.c-h1{font-size:56px;line-height:1.2;font-weight:700;letter-spacing:-0.02em}
.c-lead{font-size:19px;line-height:1.65;color:var(--muted)}
.c-mat{grid-area:mat;gap:20px}
.c-card{grid-area:card}

/* materials (rule list) */
.c-mat__h{font-size:20px;line-height:1.4;font-weight:700}
.c-mat__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;row-gap:20px}
.c-mat__list li{border-top:1px solid var(--line);padding-top:16px;display:flex;flex-direction:column;gap:4px;min-width:0}
.c-mat__list strong{font-size:18px;line-height:1.4}
.c-mat__list span{font-size:15px;line-height:1.6;color:var(--muted)}

/* white card shared by the form and the done state */
.c-card{background:var(--surface);border-radius:var(--radius-card);padding:48px;display:flex;flex-direction:column;gap:28px;min-width:0}
.c-card[hidden]{display:none}
.c-card__head{gap:8px}
.c-card__h{font-size:28px;line-height:1.3;font-weight:700;letter-spacing:-0.02em}
.c-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px;row-gap:24px}
.c-fs{border:0;margin:0;padding:0}
.c-legend{padding:0;margin-bottom:8px}
.c-consent{padding-top:4px}

/* segmented control built on radio inputs (arrow keys move between options natively) */
.c-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;border-radius:var(--pill);background:var(--bg);min-width:0}
.c-seg label{position:relative;height:44px;border-radius:var(--pill);display:flex;align-items:center;justify-content:center;padding:0 6px;font-size:15px;font-weight:600;color:var(--muted);white-space:nowrap;cursor:pointer;transition:background-color 160ms var(--ease),box-shadow 160ms var(--ease),color 160ms var(--ease)}
.c-seg label:hover{color:var(--ink)}
.c-seg input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.c-seg label:has(input:checked){background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(17,24,42,0.12)}
.c-seg label:has(input:focus-visible){outline:3px solid var(--accent);outline-offset:2px}

/* done card */
.c-done__steps{gap:10px}
.c-steps4{grid-template-columns:repeat(4,minmax(0,1fr))}
.c-done__labels{display:grid;gap:8px;font-size:15px;font-weight:600;color:var(--muted-2)}
.c-done__labels li{min-width:0}
.c-done__labels li[aria-current]{font-weight:700;color:var(--ink)}
.c-done__head{gap:10px}
.c-done__h{font-size:32px;line-height:1.3;font-weight:700;letter-spacing:-0.02em}
.c-done__h:focus{outline:none}
.c-done__h:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.c-done__reply{font-size:18px;line-height:1.6;color:var(--muted)}
.c-sum{margin:0}
.c-sum__row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:14px 0;border-top:1px solid var(--line-3);font-size:16px}
.c-sum__row:last-child{border-bottom:1px solid var(--line-3)}
.c-sum dt{flex:none;color:var(--muted-2)}
.c-sum dd{margin:0;min-width:0;font-weight:600;text-align:right}

/* FAQ on white */
.c-faq{padding:120px 0}
.c-faq__grid{display:grid;grid-template-columns:440px minmax(0,1fr);column-gap:96px;align-items:start}
.c-faq__h{font-size:40px;line-height:1.25;font-weight:700;letter-spacing:-0.02em}
.c-faq__list details{border-top:1px solid var(--line)}
.c-faq__list details:last-child{border-bottom:1px solid var(--line)}
.c-faq__list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:44px;padding:18px 0;font-size:20px;line-height:1.4;font-weight:600}
.c-faq__list summary::-webkit-details-marker{display:none}
.c-faq__list summary:hover{color:var(--accent-ink)}
.c-faq__list summary svg{flex:none;color:var(--ink);transition:transform 200ms var(--ease)}
.c-faq__list details[open] summary svg{transform:rotate(45deg)}
.c-faq__list p{padding:0 0 22px;font-size:17px;line-height:1.65;color:var(--muted)}

/* 1024–1279: keep two columns, narrower left */
@media (max-width:1279px){
  .c-grid{grid-template-columns:minmax(0,1fr) minmax(0,560px);column-gap:48px}
  .c-faq__grid{grid-template-columns:minmax(0,1fr) minmax(0,560px);column-gap:48px}
}

/* 720–1023: one column (intro, form, materials), materials stay in two columns */
@media (max-width:1023px){
  .c-top{padding:64px 0 104px}
  .c-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-template-areas:"intro" "card" "mat";row-gap:40px}
  .c-intro{padding-top:0;gap:16px;max-width:640px}
  .c-h1{font-size:48px}
  .c-lead{font-size:18px}
  .c-mat{padding-top:16px}
  .c-faq{padding:104px 0}
  .c-faq__grid{grid-template-columns:minmax(0,1fr);row-gap:32px}
  .c-faq__h{font-size:36px}
}

/* ≤719: Contact-Mobile */
@media (max-width:719px){
  .c-top{padding:40px 0 72px}
  .c-grid{row-gap:28px}
  .c-intro{gap:14px}
  .c-h1{font-size:32px;line-height:1.25}
  .c-lead{font-size:16px}
  .c-mat{padding-top:24px}
  .c-mat__list{display:flex;flex-direction:column;gap:16px}
  .c-card{padding:28px 20px;gap:24px}
  .c-card__h{font-size:24px}
  .c-two{grid-template-columns:minmax(0,1fr);row-gap:20px}
  .c-done__labels{font-size:13px}
  .c-done__h{font-size:26px}
  .c-done__reply{font-size:16px}
  .c-sum__row{font-size:15px}
  .c-faq{padding:72px 0}
  .c-faq__grid{row-gap:24px}
  .c-faq__h{font-size:28px;line-height:1.3}
  .c-faq__list summary{font-size:18px}
  .c-faq__list p{font-size:15px}
}
@media (max-width:359px){
  .c-seg label{font-size:13px;padding:0 2px}
}

@media (prefers-reduced-motion:reduce){
  .c-faq__list summary svg,.c-seg label{transition:none}
}