/* About page (o-nas) */
.dm-page--about{ padding: 24px 0 44px; }
.dm-about-wrap{ max-width: 1200px; margin: 0 auto; padding: 0 18px; }

.dm-about-hero{ margin-bottom: 18px; }
.dm-about-hero__top{ display:flex; align-items:flex-start; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.dm-about-hero__title{ font-size: 44px; line-height: 1.06; margin: 0 0 10px; color: rgba(242,245,255,.95); letter-spacing:.2px; }
.dm-about-hero__lead{ margin: 0 0 14px; color: rgba(242,245,255,.82); font-size: 15px; line-height: 1.45; max-width: 780px; }

.dm-about-hero__actions{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.dm-about-chips{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-top: 10px; }
.dm-chip{
  display:inline-flex; align-items:center; gap:8px;
  padding: 10px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(242,245,255,.9);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  font-size: 13px;
}

.dm-glass-card{
  border-radius: 22px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 12px 26px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.10);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  padding: 18px 18px;
}

.dm-about-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.dm-about-col{ display:flex; flex-direction:column; gap: 16px; }

.dm-about-card__title{
  margin: 0 0 10px;
  font-size: 22px;
  line-height: 1.18;
  color: rgba(242,245,255,.95);
  letter-spacing:.2px;
}
.dm-about-card p{ margin: 0 0 10px; color: rgba(242,245,255,.82); line-height: 1.5; }
.dm-about-card p:last-child{ margin-bottom: 0; }

.dm-about-list, .dm-about-steps{ margin: 0; padding-left: 18px; color: rgba(242,245,255,.82); }
.dm-about-list li, .dm-about-steps li{ margin: 8px 0; line-height: 1.45; }
.dm-about-note{ margin-top: 10px; color: rgba(242,245,255,.72); font-size: 13px; }
.dm-about-phone{ margin-top: 8px; }

@media (max-width: 980px){
  .dm-about-grid{ grid-template-columns: 1fr; }
  .dm-about-hero__title{ font-size: 36px; }
}
@media (max-width: 520px){
  .dm-page--about{ padding: 18px 0 34px; }
  .dm-about-hero__title{ font-size: 30px; }
  .dm-about-hero__actions{ width:100%; }
  .dm-about-hero__actions .dm-btn{ width:100%; justify-content:center; }
}
