.contact { padding: 76px var(--gutter) 64px; }
.contact-grid { max-width: var(--content-width); grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(40px, 6vw, 88px); }
.contact-info { position: sticky; top: 124px; gap: 26px; }
.contact-info .page-title { font-size: clamp(34px, 3.7vw, 51px); line-height: 1.25; }
.contact-info .contact-sub { font-size: 16px; line-height: 1.75; }
.contact-links { font-family: var(--font-body); gap: 4px; font-size: 17px; }
.contact-links a { min-height: 40px; display: flex; align-items: center; }
.contact-links a:first-child { font-size: 23px; letter-spacing: -.03em; }
.contact-links > span { margin-top: 10px; font-size: 12px; }
.contact-steps { max-width: 390px; margin: 0; padding-top: 24px; gap: 18px; }
.contact-steps li { font-size: 14px; line-height: 1.65; }
.contact-form { min-width: 0; padding: clamp(24px, 3vw, 40px); border-radius: 24px; border-color: #ffffff1c; background: #17130f; gap: 24px; }
.form-heading { margin-bottom: 0; }
.form-eyebrow { color: var(--orange); font: 10px var(--font-mono); letter-spacing: .13em; text-transform: uppercase; }
.form-heading h2 { font-family: var(--font-display); font-size: clamp(22px, 2vw, 27px); letter-spacing: -.04em; line-height: 1.4; margin: 12px 0 10px; font-weight: 500; }
.form-heading p { color: var(--text-dim); font-size: 14px; margin: 0; line-height: 1.7; }
.form-field { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.form-field label { font-size: 13px; color: var(--text-soft); line-height: 1.5; }
.form-field label > span[aria-hidden] { color: var(--orange); }
.form-input { border-radius: 10px; min-height: 50px; padding: 13px 15px; font-size: 16px; border-color: #ffffff26; background: #100d0b; }
.form-input::placeholder { color: #9d9388; font-size: 14px; }
.form-input:focus { border-color: #ff9d6b; }
.form-input:user-invalid { border-color: #ff937b; }
textarea.form-input { min-height: 120px; line-height: 1.65; }
.form-group { min-width: 0; }
.form-group legend { font: 13px var(--font-body); letter-spacing: 0; text-transform: none; color: var(--text-soft); margin-bottom: 12px; }
.chips { gap: 8px; }
.chip { position: relative; }
.chip > span { min-height: 44px; padding: 10px 13px; font: 12px/1.5 var(--font-body); letter-spacing: 0; border-color: #ffffff26; color: var(--text-soft); border-radius: 9px; }
.chip input:checked + span { background: #3c2114; border-color: #ff8d54; color: #ffc3a2; }
.chip input:focus-visible + span { outline: 2px solid #ff995e; outline-offset: 3px; }
.form-details { border-block: 1px solid var(--border); padding-block: 4px; }
.form-details summary { cursor: pointer; font-size: 13px; color: var(--text-soft); padding: 15px 0; line-height: 1.6; }
.form-details summary::marker { color: var(--orange); }
.form-details summary .optional { margin-left: 8px; font-size: 11px; color: var(--text-dim); }
.form-details-body { display: flex; flex-direction: column; gap: 24px; padding-block: 12px 20px; }
.contact-form .btn-submit { border-radius: 999px; gap: 0; min-height: 54px; font-size: 15px; margin: 0; }
.form-note { text-align: left; margin: -10px 0 0; font-size: 12px; color: var(--text-dim); line-height: 1.75; }
.form-preview { padding: 22px; border-radius: 14px; border: 1px solid #a66a46; background: #21170f; scroll-margin-top: 116px; }
.form-preview h3 { margin: 0 0 10px; font-size: 20px; line-height: 1.4; }
.form-preview p { font-size: 13px; line-height: 1.7; color: var(--text-soft); margin: 0 0 16px; }
.form-preview textarea { font-size: 13px; min-height: 200px; }
.draft-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
.draft-actions button { background: transparent; cursor: pointer; }
.form-status { margin: 0; font-size: 13px; color: #e8c4a5; line-height: 1.65; }
.form-status:empty { display: none; }
.faq-section { max-width: 840px; padding: 48px var(--gutter) 100px; }
.faq-title { text-align: left; font-size: 28px; line-height: 1.4; letter-spacing: -.035em; }
.faq-item { border-radius: 14px; }
.faq-q { font-size: 16px; line-height: 1.5; padding: 22px; }
.faq-a:not([hidden]) { display: block; }
.faq-a { padding: 0 22px 22px; line-height: 1.8; }
@media (max-width: 1024px) {
  .contact-grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 32px; }
  .contact-form .form-row { grid-template-columns: 1fr; }
  .contact-info .page-title { font-size: 37px; }
}
@media (max-width: 800px) {
  .contact { padding-top: 48px; }
  .contact-grid { grid-template-columns: 1fr; max-width: 660px; gap: 36px; }
  .contact-info { position: static; }
  .contact-info .page-title { max-width: 560px; font-size: clamp(31px, 6vw, 46px); }
  .contact-steps { max-width: none; gap: 14px; }
  .contact-form .form-row { grid-template-columns: 1fr 1fr; }
  .faq-section { max-width: 700px; }
}
@media (max-width: 480px) {
  .contact { padding-top: 38px; }
  .contact-info { gap: 22px; }
  .contact-form { padding: 24px 20px; gap: 22px; border-radius: 20px; }
  .contact-form .form-row { grid-template-columns: 1fr; gap: 18px; }
  .form-details summary .optional { display: block; margin: 4px 0 0 15px; }
  .form-preview { padding: 18px; }
  .draft-actions { flex-direction: column; }
  .faq-q { padding: 20px; font-size: 15px; gap: 16px; }
  .faq-a { padding: 0 20px 20px; }
}

/* Přímý kontakt, odeslání přes API, potvrzení (10/2026) */
.contact-direct { display: flex; flex-direction: column; gap: 12px; }
.contact-direct-label { margin: 0; font-size: 14px; color: var(--text-soft); }
.contact-direct-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.contact-direct-actions .btn { gap: 10px; min-height: 50px; padding: 0 20px; font-size: 15px; }
.contact-call svg { color: var(--orange); }
.contact-wa-btn { background: #25d366; color: #0d0b09; border: 1px solid #25d366; }
.contact-wa-btn:hover { background: #3ddc78; border-color: #3ddc78; }
.contact-mail { color: var(--orange); font-size: 18px; letter-spacing: -.02em; width: fit-content; margin-top: 6px; }
.contact-response { font-size: 12px; color: var(--text-dim); }
.form-note a { color: var(--text-soft); text-decoration: underline; text-underline-offset: 3px; }
.form-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.contact-form { position: relative; }
.btn-submit[aria-busy="true"] { opacity: .7; cursor: progress; }
.form-success { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; align-self: start; }
.form-success[hidden] { display: none; }
.form-success:target { display: flex; }
.contact-grid:has(#form-success:target) #contact-form { display: none; }
.form-success h2 { font-family: var(--font-display); font-weight: 500; font-size: clamp(24px, 2.4vw, 32px); letter-spacing: -.04em; line-height: 1.3; margin: 0; }
.form-success p { margin: 0; color: var(--text-soft); line-height: 1.7; }
.form-success-mark { color: var(--orange); font-size: 34px; line-height: 1; }
.form-success-direct { margin-top: 8px !important; font-size: 14px; }
@media (max-width: 480px) { .contact-direct-actions .btn { width: 100%; justify-content: center; } }
.form-project { margin: -6px 0 0; padding: 10px 14px; border-radius: 10px; border: 1px solid #a66a46; background: #21170f; font-size: 13px; color: var(--text-soft); }
.form-project[hidden] { display: none; }
.form-project strong { color: var(--orange); font-weight: 600; }
