/* ══════════════════════════════════════
   МЕДИАЦЕНТР — стилизация под концепт
   ══════════════════════════════════════ */

/* Обложка — тёмный фон-заглушка + округление */
.t-feed .t-feed__col-img-wrap {
  aspect-ratio: 16 / 10 !important;
  background: linear-gradient(135deg, #262d44 0%, #1A2033 100%) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  margin-bottom: 24px !important;
}
.t-feed .t-feed__col-img-wrap .t-img {
  aspect-ratio: 16 / 10 !important;
  object-fit: cover !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

/* Тег — teal */
.t-feed .t-feed__col-tag {
  color: #00A1AF !important;
  font-size: 12px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}

/* Дата */
.t-feed .t-feed__col-date {
  color: #888 !important;
  font-size: 12px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}

/* Заголовок карточки */
.t-feed .t-feed__col-title {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: #1A2033 !important;
  line-height: 1.35 !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* Описание — скрываем (в концепте не отображается) */
.t-feed .t-feed__col-descr {
  display: none !important;
}

/* Hover-эффект на карточку */
.t-feed .t-feed__col {
  transition: transform 0.3s ease !important;
}
.t-feed .t-feed__col:hover {
  transform: translateY(-4px) !important;
}

/* ================================================
   MOBILE RESPONSIVE FIX — T396 zero-block overflow
   Fixes all custom dp- blocks on the main page
   for iPhone and other mobile viewports (≤768px)
   ================================================ */
@media (max-width: 1024px) {

  /* Reset Tilda T396 canvas elements to fill viewport */
  #rec2310435621 .t396__elem,
  #rec2296051061 .t396__elem,
  #rec2296197721 .t396__elem,
  #rec2291200371 .t396__elem,
  #rec2296260531 .t396__elem,
  #rec2299221521 .t396__elem,
  #rec2266793931 .t396__elem:has(> .tn-atom__html) {
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Reset HTML atom containers */
  #rec2310435621 .tn-atom__html,
  #rec2296051061 .tn-atom__html,
  #rec2296197721 .tn-atom__html,
  #rec2291200371 .tn-atom__html,
  #rec2296260531 .tn-atom__html,
  #rec2299221521 .tn-atom__html,
  #rec2266793931 .tn-atom__html {
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
  }

  /* Reset dp-hero's absolute positioning */
  #dp-hero {
    left: 0 !important;
    transform: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Reset inner block widths */
  #dp-principles,
  #dp-about,
  #dp-team,
  #dp-cases,
  #dp-ai,
  .dp-practices-wrap {
    width: 100% !important;
    box-sizing: border-box !important;
  }

}

/* ================================================
   MOBILE RESPONSIVE FIX — Арбитражное направление
   Fixes T396 zero-block overflow on /arbitrazh page
   ================================================ */
@media (max-width: 1024px) {

  #rec2310730001 .t396__elem,
  #rec2310731821 .t396__elem,
  #rec2310731751 .t396__elem,
  #rec2310731741 .t396__elem {
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    box-sizing: border-box !important;
  }

  #rec2310730001 .tn-atom__html,
  #rec2310731821 .tn-atom__html,
  #rec2310731751 .tn-atom__html,
  #rec2310731741 .tn-atom__html {
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
  }

  #dp-arb-hero,
  #dp-arb-why,
  #rec2310731821 .services,
  #rec2310731751 .process {
    width: 100% !important;
    box-sizing: border-box !important;
  }

}


/* ================================================
   MOBILE RESPONSIVE FIX — Гражданское направление
   Fixes T396 zero-block overflow on /grazdanskie
   Uses position:relative + height:auto to reflow
   content that was clipped by artboard overflow:hidden
   ================================================ */
@media (max-width: 1024px) {

  /* Artboard: auto-size so content isn't clipped */
  #rec2311514931 .t396__artboard,
  #rec2311521081 .t396__artboard,
  #rec2311533151 .t396__artboard,
  #rec2311525551 .t396__artboard,
  #rec2311560071 .t396__artboard,
  #rec2311562031 .t396__artboard {
    height: auto !important;
    overflow: visible !important;
  }

  /* Elem: relative positioning so each section pushes the next one down */
  #rec2311514931 .t396__elem,
  #rec2311521081 .t396__elem,
  #rec2311533151 .t396__elem,
  #rec2311525551 .t396__elem,
  #rec2311560071 .t396__elem,
  #rec2311562031 .t396__elem {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    left: auto !important;
    top: auto !important;
    box-sizing: border-box !important;
    display: block !important;
    table-layout: fixed !important;
  }

  /* Atom: full width */
  #rec2311514931 .tn-atom__html,
  #rec2311521081 .tn-atom__html,
  #rec2311533151 .tn-atom__html,
  #rec2311525551 .tn-atom__html,
  #rec2311560071 .tn-atom__html,
  #rec2311562031 .tn-atom__html {
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
  }

  /* Inner blocks: full width */
  #dp-grz-hero,
  #dp-grz-situations,
  #dp-grz-intro,
  #dp-grz-areas,
  #dp-grz-finder,
  #dp-grz-process {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

}

/* MOBILE OVERFLOW FIX — iPhone 375px — zero-blocks */
@media (max-width: 1024px) {
  .t396__elem:has([id^="dp-bank"]),
  .t396__elem:has([id^="dp-ugol"]),
  .t396__elem:has([id^="dp-biz"]) {
    width: 100% !important;
    left: 0 !important;
  }
  .tn-atom:has([id^="dp-bank"]),
  .tn-atom:has([id^="dp-ugol"]),
  .tn-atom:has([id^="dp-biz"]) {
    width: 100% !important;
  }
}

/* OVERFLOW FIX v2 — attribute selector, no :has() needed */
@media (max-width: 1024px) {
  .t396__elem[style*="width: 1200px"] {
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
  }
  .tn-atom[style*="width: 1200px"] {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Bankrotstvo hero — mobile layout */
@media (max-width: 640px) {
  html #dp-bank-hero { padding: 60px 0 0 !important; }
  html #dp-bank-hero .con { padding: 0 20px !important; }
  html #dp-bank-hero h1 { font-size: 44px !important; line-height: 1.05 !important; }
  html #dp-bank-hero div[style*="justify-content:space-between"] { flex-direction: column !important; align-items: flex-start !important; gap: 16px !important; margin-bottom: 40px !important; }
  html #dp-bank-hero div[style*="grid-template-columns:4px 1fr"] { gap: 20px !important; }
  html #dp-bank-hero div[style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; margin-left: 0 !important; gap: 32px !important; padding: 40px 0 52px !important; }
}

/* Bankrotstvo stages — mobile layout */
@media (max-width: 640px) {
  html #dp-bank-stages { padding: 64px 0 !important; }
  html #dp-bank-stages .con { padding: 0 20px !important; }
  html #dp-bank-stages .timeline { grid-template-columns: 1fr 1fr !important; gap: 20px !important; }
  html #dp-bank-stages .timeline::before { display: none !important; }
}
@media (max-width: 480px) {
  html #dp-bank-stages .timeline { grid-template-columns: 1fr !important; gap: 24px !important; }
  html #dp-bank-stages .tl-item { flex-direction: row !important; align-items: flex-start !important; text-align: left !important; padding: 0 !important; gap: 16px !important; }
  html #dp-bank-stages .tl-num { flex-shrink: 0 !important; margin-bottom: 0 !important; }
  html #dp-bank-stages .tl-item h3 { font-size: 13px !important; margin-bottom: 6px !important; }
}
bank-hero div[style*="grid-template-columns:4px 1fr"] { gap: 20px !important; }
  html #dp-bank-hero div[style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; margin-left: 0 !important; gap: 32px !important; padding: 40px 0 52px !important; }
}

/* Bankrotstvo stages — 1 column on mobile */
@media (max-width: 640px) {
  html #dp-bank-stages { padding: 64px 0 !important; }
  html #dp-bank-stages .con { padding: 0 20px !important; }
  html #dp-bank-stages .timeline { grid-template-columns: 1fr 1fr !important; gap: 20px !important; }
  html #dp-bank-stages .timeline::before { display: none !important; }
}
@media (max-width: 480px) {
  html #dp-bank-stages .timeline { grid-template-columns: 1fr !important; gap: 24px !important; }
  html #dp-bank-stages .tl-item { flex-direction: row !important; align-items: flex-start !important; text-align: left !important; padding: 0 !important; gap: 16px !important; }
  html #dp-bank-stages .tl-num { flex-shrink: 0 !important; margin-bottom: 0 !important; }
  html #dp-bank-stages .tl-item h3 { font-size: 13px !important; margin-bottom: 6px !important; }
}
/* Bankrotstvo why — 1 column on mobile */
@media (max-width: 640px) {
  #dp-bank-why div[style*="repeat(2,1fr)"] { grid-template-columns: 1fr !important; }
  #dp-bank-why .why-card { padding: 32px 24px !important; }
}

/* Soprovozdenie comparison — stack on mobile */
@media (max-width: 640px) {
  #dp-biz-comparison .cmp-wrap { overflow-x: auto !important; }
  #dp-biz-comparison table.cmp { font-size: 12px !important; }
  #dp-biz-comparison table.cmp td,
  #dp-biz-comparison table.cmp th { padding: 10px 12px !important; }
  #dp-biz-comparison .comparison-header { grid-template-columns: 1fr !important; }
}

/* Bankrotstvo types — 1 column on mobile */
@media (max-width: 640px) {
  #dp-bank-types div[style*="repeat(3,1fr)"] { grid-template-columns: 1fr !important; }
  #dp-bank-types { padding: 64px 0 !important; }
}

/* Bankrotstvo grounds — 1 column on mobile */
@media (max-width: 1024px) {
  #dp-bank-grounds div[style*="1fr 1fr"] { grid-template-columns: 1fr !important; }
  #dp-bank-grounds { padding: 64px 0 !important; }
}

/* ============================================================
   MAIN PAGE HERO — PADDING FIX
   The reset rule "#dp-hero *{padding:0}" has specificity (1,0,0)
   and overrides ".dp-hero-wrap{padding:0 32px}" at (0,1,0).
   Using "#dp-hero .dp-hero-wrap" (1,1,0) to win the cascade.
   ============================================================ */
#dp-hero .dp-hero-wrap {
  padding: 0 32px !important;
}
@media (max-width: 640px) {
  #dp-hero .dp-hero-wrap {
    padding: 0 20px !important;
  }
}