/* Dproperty phone layout rebuild v2: aggressive overrides for the static prototype. */
html, body { max-width: 100%; overflow-x: hidden; }
* { box-sizing: border-box; }

@media (max-width: 820px) {
  @media (pointer: fine) { *, *::before, *::after { cursor: auto !important; } }
  body { overflow-x: hidden !important; }
  #root { overflow-x: hidden !important; }

  /* General rhythm */
  section { overflow-x: hidden !important; }
  [style*="max-width: 1200px"] { padding-left: 20px !important; padding-right: 20px !important; }
  [style*="padding: 0px 52px"], [style*="padding: 0 52px"] { padding-left: 20px !important; padding-right: 20px !important; }
  [style*="padding: 80px 52px"] { padding: 48px 20px !important; }
  [style*="padding: 100px 0px 80px"], [style*="padding: 100px 0 80px"] { padding-top: 64px !important; padding-bottom: 48px !important; }
  [style*="padding: 80px 0px"], [style*="padding: 80px 0"] { padding-top: 54px !important; padding-bottom: 54px !important; }
  [style*="padding: 60px 0px"], [style*="padding: 60px 0"] { padding-top: 44px !important; padding-bottom: 32px !important; }

  /* Typography */
  h1, [style*="font-size: clamp(36px"], [style*="font-size: clamp(32px"] {
    font-size: clamp(40px, 15vw, 58px) !important;
    line-height: .96 !important;
  }
  h2, [style*="font-size: clamp(24px"], [style*="font-size: clamp(22px"] {
    font-size: clamp(28px, 9vw, 40px) !important;
    line-height: 1.08 !important;
  }
  p { max-width: 100% !important; }

  /* Layout: all desktop grids become phone stacks unless explicitly fixed by JS. */
  [style*="grid-template-columns: repeat(4"],
  [style*="grid-template-columns: repeat(3"],
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns: 1.4fr 1fr"],
  [style*="grid-template-columns: 1.2fr 1fr"],
  [style*="grid-template-columns: 2fr 1fr"],
  [style*="grid-template-columns: 2fr 1fr 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  /* Hero art should not fight the copy. */
  [style*="position: absolute"][style*="width: 48%"] {
    width: 125% !important;
    right: -58% !important;
    opacity: .12 !important;
    pointer-events: none !important;
  }
  [style*="max-width: 52%"] { max-width: 100% !important; }

  /* Cards */
  [style*="min-height: 360px"] { min-height: 250px !important; }
  [style*="min-height: 168px"] { min-height: 150px !important; }
  [style*="padding: 36px 28px"], [style*="padding: 36px 28px 32px"] { padding: 26px 20px !important; }
  [style*="padding: 48px 44px"], [style*="padding: 48px 44px 52px"] { padding: 30px 20px 34px !important; }
  [style*="padding: 24px 22px"] { padding: 20px 18px !important; }

  /* Buttons */
  .btn-primary, .btn-ghost {
    width: 100% !important;
    justify-content: center !important;
    padding: 15px 18px !important;
    font-size: 8px !important;
    letter-spacing: .14em !important;
  }

  /* Header */
  header[style] {
    height: 60px !important;
    padding: 0 18px !important;
  }
  header + div, [style*="padding-top: 66px"] { padding-top: 60px !important; }
  [style*="margin-top: 66px"] { margin-top: 60px !important; }
  header [style*="gap: 28px"] { gap: 14px !important; }

  /* Footer */
  .site-footer {
    padding: 34px 20px !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 22px !important;
  }
  .site-footer > div:nth-child(2) {
    width: 100% !important;
    flex-wrap: wrap !important;
    gap: 12px 18px !important;
  }

  /* Images / galleries */
  image-slot {
    width: 100% !important;
    min-height: 220px !important;
    height: 220px !important;
  }
  [style*="grid-template-rows: 232px 232px"] {
    grid-template-rows: none !important;
  }
  svg { max-width: 100% !important; height: auto !important; }

  /* Tables/distribution: scroll instead of crushed text */
  [style*="grid-template-columns: 1.6fr 1.4fr 1fr 0.8fr 1.2fr"] {
    grid-template-columns: 145px 135px 82px 64px 115px !important;
    min-width: 560px !important;
  }

  /* Language widget */
  .dp-lang-switcher { right: 12px !important; bottom: 12px !important; transform: scale(.92); transform-origin: bottom right; }
}

@media (max-width: 430px) {
  [style*="max-width: 1200px"] { padding-left: 16px !important; padding-right: 16px !important; }
  [style*="padding: 0px 52px"], [style*="padding: 0 52px"] { padding-left: 16px !important; padding-right: 16px !important; }
  h1, [style*="font-size: clamp(36px"], [style*="font-size: clamp(32px"] { font-size: clamp(38px, 14vw, 54px) !important; }
  h2, [style*="font-size: clamp(24px"], [style*="font-size: clamp(22px"] { font-size: clamp(26px, 8vw, 36px) !important; }
}
