/* Contact page — Figma "04 · Холбоо барих" */
.page-hero{background:var(--bg-page);padding:80px var(--gutter);display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.page-hero h1{font-weight:600;font-size:52px;line-height:60px;color:var(--text-primary)}
.page-hero p{font-size:18px;line-height:28px;color:var(--text-secondary);max-width:780px}

.info-section{padding:72px var(--gutter)}
.info-cards{max-width:1272px;margin:0 auto;display:flex;gap:24px;align-items:stretch}
.info-card{flex:1 1 0;min-width:0;background:var(--surface);border:1px solid var(--line-site);border-radius:20px;padding:28px;display:flex;gap:16px;align-items:center}
.icon-tile{width:52px;height:52px;border-radius:14px;background:var(--accent-bg-mist);display:flex;align-items:center;justify-content:center;flex:none}
.icon-tile img{width:24px;height:24px}
.info-text{display:flex;flex-direction:column;gap:4px;font-weight:500;min-width:0}
.info-text .label{font-size:14px;line-height:20px;color:#5b7584}
.info-text .value{font-size:18px;line-height:26px;color:var(--text-primary);overflow-wrap:anywhere}
.info-text a:hover{color:var(--accent)}

.faq{display:flex;flex-direction:column;gap:48px}
.faq-head{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.faq-head .lead{font-size:17px}
.chip-mist{background:var(--accent-bg-mist);color:var(--text-accent)}
.faq-list{max-width:1272px;width:100%;margin:0 auto;background:var(--surface);border:1px solid var(--line-site);border-radius:24px}
.faq-row{display:flex;gap:48px;padding:32px;line-height:26px}
.faq-row+.faq-row{border-top:1px solid var(--line-site)}
.faq-row h3{flex:none;width:340px;font-weight:600;font-size:18px;line-height:26px;color:var(--text-primary)}
.faq-row p{flex:1 1 0;min-width:0;font-size:16px;line-height:26px;color:var(--text-secondary)}

.cta-wrap{padding:80px var(--gutter)}
.cta{max-width:1272px;margin:0 auto;background:var(--panel-inverse);border-radius:32px;padding:72px 64px;display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.cta .h2{color:#fff}
.cta p{font-size:18px;line-height:28px;color:var(--muted-inverse)}
.cta .badges{padding-top:8px}

@media (max-width:1100px){
  .info-cards{flex-wrap:wrap}
  .info-card{flex:1 1 280px}
  .faq-row{gap:32px}
  .faq-row h3{width:240px}
}
@media (max-width:900px){
  .page-hero{padding:40px 16px;gap:16px}
  .page-hero h1{font-size:34px;line-height:42px}
  .page-hero p{font-size:16px;line-height:26px}
  .info-section{padding:40px 16px}
  .info-cards{flex-direction:column;gap:16px}
  .info-card{flex:none;width:100%;padding:20px}
  .info-text .value{font-size:16px;line-height:24px}
  .faq{gap:32px}
  .faq-head .lead{font-size:16px}
  .faq-row{flex-direction:column;gap:10px;padding:20px}
  .faq-row h3{width:auto;font-size:17px}
  .cta-wrap{padding:40px 16px}
  .cta{padding:40px 24px;border-radius:28px}
  .cta p{font-size:16px;line-height:26px}
}
