/* Luxury House V5.12 | iPhone typography and consistent property navigation
   Mobile-only. Keeps all admin-driven theme colors and desktop styling intact. */
@media only screen and (max-width: 800px) {
  /* Always use the same editorial number face for area AND price.
     Safari otherwise may keep the UA bold <b> face after shorthand cascade. */
  body[data-cms-page="pronat"] .lh-card-numbers .lh-card-area,
  body[data-cms-page="pronat"] .lh-card-numbers .lh-card-price b,
  body[data-cms-page="prona"] .lh-v56-detail .lh-v56-big strong {
    font-family: var(--font-heading, "Playfair Display"), Georgia, serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-synthesis: none !important;
    font-kerning: normal;
    font-variant-numeric: lining-nums;
    letter-spacing: -.065em !important;
    line-height: 1.05 !important;
  }
  body[data-cms-page="pronat"] .lh-card-numbers .lh-card-price b {
    display: inline-block;
    font-size: clamp(46px, 13vw, 70px) !important;
    color: var(--ink, #242624);
  }
  body[data-cms-page="pronat"] .lh-card-numbers .lh-card-price span {
    font-family: var(--font-body, "DM Sans"), Arial, sans-serif !important;
    font-weight: 400 !important;
    font-size: 17px !important;
    letter-spacing: 0 !important;
    color: var(--gold, #b08a55) !important;
    vertical-align: baseline;
  }

  /* The properties templates use a legacy header. Make it match the
     compact warm-stone header used by the editorial homepage. */
  body[data-cms-page="pronat"] .lh-top,
  body[data-cms-page="prona"] .lh-top {
    min-height: 30px !important;
    height: 30px !important;
    padding: 0 5.2% !important;
    background: #e5e0d7 !important;
    border-bottom: 1px solid rgba(36,38,36,.09);
    color: var(--ink, #242624) !important;
    font-size: 9px !important;
    letter-spacing: .13em !important;
    text-align: left !important;
    justify-content: flex-start !important;
  }
  body[data-cms-page="pronat"] .lh-top span:last-child,
  body[data-cms-page="prona"] .lh-top span:last-child { display: none !important; }
  body[data-cms-page="pronat"] .lh-top span:first-child,
  body[data-cms-page="prona"] .lh-top span:first-child { display: block !important; }

  body[data-cms-page="pronat"] .lh-header,
  body[data-cms-page="prona"] .lh-header {
    height: 84px !important;
    min-height: 84px !important;
    background: var(--sand, #d8d3c9) !important;
    border-bottom: 1px solid rgba(36,38,36,.1) !important;
    padding: 0 5.2% !important;
    gap: 11px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    position: relative;
    z-index: 40;
  }
  body[data-cms-page="pronat"] .lh-header .lh-logo,
  body[data-cms-page="prona"] .lh-header .lh-logo {
    display: flex !important;
    flex: 0 1 146px !important;
    width: 146px !important;
    min-width: 0 !important;
    height: 80px !important;
    align-items: center !important;
    margin-right: auto !important;
    overflow: hidden;
  }
  body[data-cms-page="pronat"] .lh-header .lh-logo img,
  body[data-cms-page="prona"] .lh-header .lh-logo img {
    width: 139px !important;
    max-width: 100% !important;
    max-height: 76px !important;
    height: auto !important;
    object-fit: contain !important;
    filter: none !important;
  }
  body[data-cms-page="pronat"] .lh-header .lh-header-cta,
  body[data-cms-page="prona"] .lh-header .lh-header-cta {
    display: inline-flex !important;
    order: 2;
    justify-content: center;
    align-items: center;
    flex: 0 0 auto;
    gap: 9px;
    height: 44px;
    padding: 0 13px !important;
    color: #fff !important;
    background: var(--ink, #242624) !important;
    font-size: 0 !important;
    white-space: nowrap !important;
    line-height: 1;
    text-decoration: none;
  }
  body[data-cms-page="pronat"] .lh-header .lh-header-cta::before,
  body[data-cms-page="prona"] .lh-header .lh-header-cta::before {
    content: "KONTAKT";
    display: inline-block;
    color: #fff;
    font: 600 9px/1 var(--font-body, "DM Sans"), sans-serif;
    letter-spacing: .08em;
  }
  body[data-cms-page="pronat"] .lh-header .lh-header-cta::after,
  body[data-cms-page="prona"] .lh-header .lh-header-cta::after {
    content: "";
    display: inline-block;
    width: 17px;
    height: 17px;
    background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18 18 6M7 6h11v11'/%3E%3C/svg%3E");
  }
  body[data-cms-page="pronat"] .lh-header .lh-nav-toggle,
  body[data-cms-page="prona"] .lh-header .lh-nav-toggle {
    display: grid !important;
    order: 3;
    place-items: center;
    flex: 0 0 38px;
    width: 38px;
    height: 44px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    cursor: pointer;
  }
  body[data-cms-page="pronat"] .lh-header .lh-nav-toggle::before,
  body[data-cms-page="prona"] .lh-header .lh-nav-toggle::before {
    content: "";
    display: block;
    width: 24px;
    height: 2px;
    background: var(--ink, #242624);
    box-shadow: 0 -7px 0 var(--ink, #242624), 0 7px 0 var(--ink, #242624);
    border-radius: 1px;
  }
  body[data-cms-page="pronat"] .lh-header .lh-nav,
  body[data-cms-page="prona"] .lh-header .lh-nav {
    order: 4;
    background: var(--cream, #f0ede7);
  }
  body[data-cms-page="pronat"] .lh-header .lh-nav a,
  body[data-cms-page="prona"] .lh-header .lh-nav a {
    color: var(--ink, #242624) !important;
    -webkit-text-fill-color: var(--ink, #242624);
  }
}
@media only screen and (max-width: 360px) {
  body[data-cms-page="pronat"] .lh-header .lh-logo,
  body[data-cms-page="prona"] .lh-header .lh-logo { flex-basis: 122px !important; width: 122px !important; }
  body[data-cms-page="pronat"] .lh-header .lh-logo img,
  body[data-cms-page="prona"] .lh-header .lh-logo img { width: 118px !important; }
  body[data-cms-page="pronat"] .lh-header .lh-header-cta,
  body[data-cms-page="prona"] .lh-header .lh-header-cta { padding: 0 10px !important; gap: 5px; }
  body[data-cms-page="pronat"] .lh-header .lh-nav-toggle,
  body[data-cms-page="prona"] .lh-header .lh-nav-toggle { flex-basis: 34px; width: 34px; }
}