/* ════════════════════════════════════════════════════════════
   PREMIUM.CSS — A+ Boutique Imobiliária
   Estilos exclusivos para:
   [1] Section Premium na Home (bp-premium)
   [2] Página Imóveis Premium (page-premium)
   [3] Badge Premium nos cards
   [4] Nav link Premium (np-nav-premium)
   Paleta: navy #06465E · gold #C9A96E · off-white #F9F6F1
════════════════════════════════════════════════════════════ */

/* ── Variáveis Premium ─────────────────────────────────────── */
:root {
    --pm-gold      : #C9A96E;
    --pm-gold-light: #EFE3C9;
    --pm-gold-dark : #A6854F;
    --pm-navy      : #06465E;
    --pm-offwhite  : #F9F6F1;
    --pm-white     : #FFFFFF;
    --pm-muted     : #6B7280;
    --pm-border    : rgba(201,169,110,0.20);
    --pm-shadow    : 0 12px 40px rgba(6,70,94,0.10);
    --pm-ease      : cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ════════════════════════════════════════════════════════════
   [1] NAV LINK PREMIUM
════════════════════════════════════════════════════════════ */
.np-nav-premium {
    color: var(--pm-gold) !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px;
    transition: opacity 0.2s ease;
}
.np-nav-premium:hover { opacity: 0.75; }

/* ════════════════════════════════════════════════════════════
   [2] SECTION PREMIUM NA HOME (bp-premium)
════════════════════════════════════════════════════════════ */
.bp-premium {
    padding        : 96px 40px 80px;
    background     : var(--pm-offwhite);
    position       : relative;
    overflow       : hidden;
}

/* Detalhe decorativo dourado no topo */
.bp-premium::before {
    content   : '';
    position  : absolute;
    top       : 0; left: 50%;
    transform : translateX(-50%);
    width     : 60px; height: 2px;
    background: var(--pm-gold);
    border-radius: 2px;
}

.bp-premium-header {
    text-align    : center;
    margin-bottom : 56px;
}

.bp-section-label--gold {
    color          : var(--pm-gold);
    font-family    : var(--np-sans, 'Lato', sans-serif);
    font-size      : 11px;
    font-weight    : 700;
    letter-spacing : 2.5px;
    text-transform : uppercase;
    display        : block;
    margin-bottom  : 14px;
}

.bp-premium-header .bp-section-title em {
    font-style : italic;
    color      : var(--pm-gold);
}

.bp-premium-sub {
    font-family : var(--np-sans, 'Lato', sans-serif);
    font-size   : 16px;
    color       : var(--pm-muted);
    max-width   : 500px;
    margin      : 12px auto 0;
    line-height : 1.6;
}

/* ── Grid 4 cards ───────────────────────────────────────────── */
.bp-premium-grid {
    display              : grid;
    grid-template-columns: repeat(4, 1fr);
    gap                  : 24px;
    max-width            : 1280px;
    margin               : 0 auto;
}

/* ── Card Premium Imersivo (pmc) ─────────────────────────── */
.pmc {
    position       : relative;
    border-radius  : 18px;
    overflow       : hidden;
    cursor         : pointer;
    background     : #0a3040;
    transition     : transform 0.4s var(--pm-ease),
                     box-shadow 0.4s var(--pm-ease);
    box-shadow     : 0 4px 24px rgba(0,0,0,0.15);
}
.pmc:hover {
    transform  : translateY(-8px);
    box-shadow : 0 24px 64px rgba(0,0,0,0.30),
                 0 0 0 1px rgba(201,169,110,0.40);
}

/* Linha dourada animada no hover */
.pmc::after {
    content    : '';
    position   : absolute;
    bottom     : 0; left: 0; right: 0;
    height     : 2px;
    background : linear-gradient(90deg, transparent, #C9A96E, transparent);
    opacity    : 0;
    transition : opacity 0.35s ease;
}
.pmc:hover::after { opacity: 1; }

/* Imagem imersiva */
.pmc-img {
    position           : relative;
    height             : 360px;
    background-size    : cover;
    background-position: center;
    transition         : transform 0.6s var(--pm-ease);
    overflow           : hidden;
}
.pmc:hover .pmc-img { transform: scale(1.05); }

/* Overlay gradiente duplo — escuro no topo e na base */
.pmc-overlay {
    position   : absolute;
    inset      : 0;
    background : linear-gradient(
        180deg,
        rgba(6,70,94,0.55) 0%,
        rgba(6,70,94,0.05) 35%,
        rgba(6,70,94,0.05) 50%,
        rgba(6,70,94,0.75) 75%,
        rgba(6,70,94,0.95) 100%
    );
    transition : opacity 0.35s ease;
}
.pmc:hover .pmc-overlay { opacity: 0.85; }

/* Topo: badge + seta */
.pmc-top {
    position       : absolute;
    top            : 16px;
    left           : 16px;
    right          : 16px;
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    z-index        : 2;
}
.pmc-badge {
    background    : rgba(201,169,110,0.92);
    backdrop-filter: blur(6px);
    color         : #fff;
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 10px;
    font-weight   : 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    padding       : 5px 12px;
    border-radius : 20px;
}
.pmc-arrow {
    width          : 34px;
    height         : 34px;
    border-radius  : 50%;
    background     : rgba(255,255,255,0.12);
    backdrop-filter: blur(6px);
    display        : flex;
    align-items    : center;
    justify-content: center;
    color          : #fff;
    font-size      : 15px;
    border         : 1px solid rgba(255,255,255,0.20);
    transition     : background 0.25s ease, border-color 0.25s ease;
}
.pmc:hover .pmc-arrow {
    background   : rgba(201,169,110,0.85);
    border-color : transparent;
}

/* Info sobre a imagem */
.pmc-info {
    position : absolute;
    bottom   : 20px;
    left     : 22px;
    right    : 22px;
    z-index  : 2;
    color    : #fff;
}
.pmc-bairro {
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 10px;
    font-weight   : 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color         : #C9A96E;
    margin-bottom : 6px;
}
.pmc-title {
    font-family  : var(--np-serif, 'Playfair Display', serif);
    font-size    : clamp(18px, 2.2vw, 26px);
    font-weight  : 500;
    line-height  : 1.2;
    margin-bottom: 12px;
    text-shadow  : 0 2px 8px rgba(0,0,0,0.3);
}
.pmc-specs {
    display  : flex;
    flex-wrap: wrap;
    gap      : 10px;
}
.pmc-spec {
    display    : flex;
    align-items: center;
    gap        : 5px;
    font-family: var(--np-sans, 'Lato', sans-serif);
    font-size  : 12px;
    color      : rgba(255,255,255,0.75);
}
.pmc-spec i { color: #C9A96E; font-size: 13px; }

/* Rodapé fora da imagem */
.pmc-footer {
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    padding        : 16px 22px;
    background     : #fff;
    border-top     : 2px solid rgba(201,169,110,0.20);
    position       : relative;
    z-index        : 2;
    gap            : 8px;
}
.pmc-valor {
    font-family : var(--np-serif, 'Playfair Display', serif);
    font-size   : 17px;
    font-weight : 600;
    color       : var(--pm-navy);
    white-space : nowrap;
}
.pmc-cta {
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 11px;
    font-weight   : 700;
    letter-spacing: 0.3px;
    color         : #C9A96E;
    white-space   : nowrap;
    margin-left   : auto;
    transition    : color 0.2s ease;
}
.pmc:hover .pmc-cta { color: #A6854F; }

/* Botão WhatsApp no rodapé */
.pmc-wpp {
    width          : 32px;
    height         : 32px;
    border-radius  : 50%;
    background     : #25D366;
    color          : #fff;
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-size      : 15px;
    text-decoration: none;
    flex-shrink    : 0;
    box-shadow     : 0 2px 8px rgba(37,211,102,0.30);
    transition     : transform 0.2s ease;
}
.pmc-wpp:hover { transform: scale(1.12); }

/* ── Grid ajustado ───────────────────────────────────────── */
.pm-grid {
    display              : grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap                  : 28px !important;
    max-width            : 1280px;
    margin               : 0 auto;
}

/* Skeleton atualizado */
.bp-premium-skeleton {
    height        : 420px;
    border-radius : 18px;
    background    : linear-gradient(90deg, #ede8e0 25%, #f5f0e8 50%, #ede8e0 75%);
    background-size: 200% 100%;
    animation     : pm-shimmer 1.6s infinite;
}

/* Responsivo */
@media (max-width: 1100px) {
    .pm-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .pmc-img { height: 300px; }
}
@media (max-width: 640px) {
    .pm-grid { grid-template-columns: 1fr !important; }
    .pmc-img { height: 260px; }
    .pmc-title { font-size: 20px; }
}

/* ── Seção de credibilidade ───────────────────────────────── */
.pm-credibilidade {
    background  : var(--pm-navy);
    padding     : 80px 40px;
    text-align  : center;
    color       : #fff;
}
.pm-cred-title {
    font-family : var(--np-serif, 'Playfair Display', serif);
    font-size   : clamp(24px, 3vw, 36px);
    font-weight : 400;
    margin-bottom: 12px;
}
.pm-cred-title em { color: var(--pm-gold); font-style: italic; }
.pm-cred-sub {
    font-size   : 15px;
    color       : rgba(255,255,255,0.65);
    max-width   : 500px;
    margin      : 0 auto 56px;
    line-height : 1.7;
}
.pm-cred-grid {
    display              : grid;
    grid-template-columns: repeat(3, 1fr);
    gap                  : 32px;
    max-width            : 900px;
    margin               : 0 auto;
}
.pm-cred-item i {
    font-size    : 28px;
    color        : var(--pm-gold);
    margin-bottom: 12px;
    display      : block;
}
.pm-cred-item h4 {
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 14px;
    font-weight   : 700;
    letter-spacing: 0.5px;
    margin-bottom : 6px;
}
.pm-cred-item p {
    font-size  : 13px;
    color      : rgba(255,255,255,0.55);
    line-height: 1.6;
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVO
════════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
    .bp-premium-grid { grid-template-columns: repeat(2, 1fr); }
    .pm-grid         { grid-template-columns: repeat(2, 1fr); }
    .pm-cred-grid    { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
    .bp-premium      { padding: 64px 20px 56px; }
    .bp-premium-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
    .pm-hero         { padding: 100px 20px 60px; }
    .pm-filtros      { padding: 16px 20px; top: 68px; }
    .pm-filtros-inner{ gap: 8px; }
    .pm-grid-section { padding: 40px 20px 80px; }
    .pm-grid         { grid-template-columns: 1fr; gap: 20px; }
    .pm-credibilidade{ padding: 60px 20px; }
    .pm-cred-grid    { grid-template-columns: 1fr; gap: 28px; }
    .bp-pm-img       { height: 180px; }
}

@media (max-width: 480px) {
    .bp-premium-grid { grid-template-columns: 1fr; }
    .bp-pm-img       { height: 200px; }
}

/* ════════════════════════════════════════════════════════════
   [3] PÁGINA IMÓVEIS PREMIUM — Hero, Filtros, Grid
════════════════════════════════════════════════════════════ */

/* ── Hero ─────────────────────────────────────────────────── */
.pm-hero {
    padding    : 140px 40px 80px;
    background : var(--pm-offwhite, #F9F6F1);
    text-align : center;
    position   : relative;
}
.pm-hero::after {
    content   : '';
    position  : absolute;
    bottom    : 0; left: 50%;
    transform : translateX(-50%);
    width     : 60px; height: 2px;
    background: var(--pm-gold, #C9A96E);
}
.pm-hero-label {
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 11px;
    font-weight   : 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color         : var(--pm-gold, #C9A96E);
    display       : block;
    margin-bottom : 16px;
}
.pm-hero-title {
    font-family : var(--np-serif, 'Playfair Display', serif);
    font-size   : clamp(40px, 5vw, 68px);
    font-weight : 400;
    color       : var(--pm-navy, #06465E);
    line-height : 1.1;
    margin-bottom: 20px;
}
.pm-hero-title em {
    font-style : italic;
    color      : var(--pm-gold, #C9A96E);
}
.pm-hero-desc {
    font-family : var(--np-sans, 'Lato', sans-serif);
    font-size   : 17px;
    color       : var(--pm-muted, #6B7280);
    max-width   : 560px;
    margin      : 0 auto;
    line-height : 1.7;
}
.pm-hero-count {
    display       : inline-block;
    margin-top    : 28px;
    padding       : 8px 20px;
    border        : 1px solid rgba(201,169,110,0.25);
    border-radius : 30px;
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 13px;
    color         : var(--pm-muted, #6B7280);
}
.pm-hero-count strong { color: var(--pm-gold, #C9A96E); }

/* ── Filtros ──────────────────────────────────────────────── */
.pm-filtros {
    background   : #fff;
    border-bottom: 1px solid rgba(201,169,110,0.20);
    padding      : 20px 40px;
    position     : sticky;
    top          : 72px;
    z-index      : 50;
    box-shadow   : 0 4px 20px rgba(6,70,94,0.06);
}
.pm-filtros-inner {
    max-width      : 1280px;
    margin         : 0 auto;
    display        : flex;
    align-items    : center;
    gap            : 12px;
    flex-wrap      : wrap;
}
.pm-filtro-label {
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 12px;
    font-weight   : 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color         : var(--pm-navy, #06465E);
    margin-right  : 4px;
}
.pm-filtro-select {
    height       : 40px;
    padding      : 0 32px 0 14px;
    border       : 1px solid rgba(201,169,110,0.25);
    border-radius: 8px;
    background   : #fff;
    font-family  : var(--np-sans, 'Lato', sans-serif);
    font-size    : 13px;
    color        : var(--pm-navy, #06465E);
    cursor       : pointer;
    outline      : none;
    appearance   : none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%2306465E' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E");
    background-repeat  : no-repeat;
    background-position: right 12px center;
    transition   : border-color 0.2s ease;
}
.pm-filtro-select:focus { border-color: #C9A96E; }
.pm-filtro-btn-clear {
    height        : 40px;
    padding       : 0 20px;
    border        : 1px solid rgba(201,169,110,0.25);
    border-radius : 8px;
    background    : transparent;
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 12px;
    color         : var(--pm-muted, #6B7280);
    cursor        : pointer;
    transition    : all 0.2s ease;
    margin-left   : auto;
}
.pm-filtro-btn-clear:hover {
    border-color : #C9A96E;
    color        : #C9A96E;
}

/* ── Grid section ─────────────────────────────────────────── */
.pm-grid-section {
    padding    : 64px 40px 100px;
    background : #F9F6F1;
    min-height : 60vh;
}

/* Estado vazio */
.pm-empty {
    grid-column : 1 / -1;
    text-align  : center;
    padding     : 80px 0;
    color       : var(--pm-muted, #6B7280);
}
.pm-empty i { font-size: 48px; opacity: 0.3; margin-bottom: 16px; display: block; }

/* Load more */
.pm-load-more { grid-column: 1 / -1; text-align: center; margin-top: 40px; }
.pm-btn-more {
    display       : inline-flex;
    align-items   : center;
    gap           : 8px;
    height        : 52px;
    padding       : 0 36px;
    border        : 2px solid #C9A96E;
    border-radius : 8px;
    background    : transparent;
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 14px;
    font-weight   : 700;
    color         : #C9A96E;
    cursor        : pointer;
    transition    : all 0.25s ease;
}
.pm-btn-more:hover { background: #C9A96E; color: #fff; }
.pm-btn-more:disabled { opacity: 0.4; cursor: not-allowed; }

/* ════════════════════════════════════════════════════════════
   VARIAÇÃO DARK — Seção Premium na Home
   Fundo: #06465E (navy) · Detalhes: #C9A96E (gold) · Texto: #F9F6F1
════════════════════════════════════════════════════════════ */

.bp-premium--dark {
    background : #06465E;
}
.bp-premium--dark::before {
    background : #C9A96E;
}
.bp-premium--dark .bp-section-label--gold {
    color : #C9A96E;
}
.bp-premium--dark .bp-section-title {
    color      : #F9F6F1;
    font-size  : clamp(48px, 5.5vw, 80px);
    font-weight: 400;
    line-height: 1.05;
    letter-spacing: -0.5px;
}
.bp-premium--dark .bp-section-title em {
    color : #C9A96E;
}
.bp-premium--dark .bp-premium-sub {
    color : rgba(249,246,241,0.65);
}

/* Skeleton dark */
.bp-premium--dark .bp-premium-skeleton {
    background    : linear-gradient(90deg, rgba(255,255,255,0.06) 25%, rgba(255,255,255,0.12) 50%, rgba(255,255,255,0.06) 75%);
    background-size: 200% 100%;
    animation     : pm-shimmer 1.6s infinite;
}

/* Card dark */
.bp-premium-card--dark {
    background   : rgba(255,255,255,0.05);
    border-color : rgba(201,169,110,0.20);
    backdrop-filter: blur(8px);
}
.bp-premium-card--dark:hover {
    background   : rgba(255,255,255,0.09);
    border-color : #C9A96E;
    box-shadow   : 0 16px 48px rgba(0,0,0,0.35);
}
.bp-premium-card--dark .bp-pm-bairro {
    color : #C9A96E;
}
.bp-premium-card--dark .bp-pm-title {
    color : #F9F6F1;
}
.bp-premium-card--dark .bp-pm-spec {
    color : rgba(249,246,241,0.55);
}
.bp-premium-card--dark .bp-pm-spec i {
    color : #C9A96E;
}
.bp-premium-card--dark .bp-pm-footer {
    border-top-color : rgba(201,169,110,0.20);
}
.bp-premium-card--dark .bp-pm-valor {
    color : #F9F6F1;
}
.bp-premium-card--dark .bp-pm-cta {
    color : #C9A96E;
}

/* Footer da seção dark — centralizado */
.bp-premium--dark .bp-premium-footer {
    text-align : center;
    margin-top : 48px;
}

/* Botão CTA dark */
.bp-btn-premium-dark {
    display       : inline-flex;
    align-items   : center;
    gap           : 8px;
    height        : 52px;
    padding       : 0 36px;
    border        : 2px solid #C9A96E;
    border-radius : 8px;
    background    : transparent;
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 13px;
    font-weight   : 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color         : #C9A96E;
    text-decoration: none;
    transition    : all 0.25s ease;
}
.bp-btn-premium-dark:hover {
    background : #C9A96E;
    color      : #06465E;
}

/* ════════════════════════════════════════════════════════════
   CARD LUXO — Seção Premium na Home
   Estilo imersivo inspirado nos cards de Lançamentos
════════════════════════════════════════════════════════════ */
.bp-pm-card-lux {
    position       : relative;
    display        : flex;
    flex-direction : column;
    border-radius  : 16px;
    overflow       : hidden;
    text-decoration: none;
    color          : inherit;
    background     : rgba(255,255,255,0.04);
    border         : 1px solid rgba(201,169,110,0.15);
    transition     : transform 0.35s var(--pm-ease),
                     box-shadow 0.35s var(--pm-ease),
                     border-color 0.3s ease;
    cursor         : pointer;
}
.bp-pm-card-lux:hover {
    transform    : translateY(-6px);
    box-shadow   : 0 20px 60px rgba(0,0,0,0.4);
    border-color : rgba(201,169,110,0.5);
}

/* Imagem imersiva — ocupa topo do card */
.bp-pm-lux-img {
    position           : relative;
    height             : 280px;
    background-size    : cover;
    background-position: center;
    transition         : transform 0.5s var(--pm-ease);
}
.bp-pm-card-lux:hover .bp-pm-lux-img {
    transform: scale(1.04);
}

/* Overlay gradiente escuro */
.bp-pm-lux-overlay {
    position   : absolute;
    inset      : 0;
    background : linear-gradient(
        to bottom,
        rgba(6,70,94,0.10) 0%,
        rgba(6,70,94,0.55) 60%,
        rgba(6,70,94,0.90) 100%
    );
}

/* Seta ↗ */
.bp-pm-lux-arrow {
    position   : absolute;
    top        : 16px;
    right      : 16px;
    width      : 36px;
    height     : 36px;
    border-radius: 50%;
    background : rgba(255,255,255,0.15);
    backdrop-filter: blur(6px);
    display    : flex;
    align-items: center;
    justify-content: center;
    font-size  : 16px;
    color      : #fff;
    transition : background 0.25s ease;
}
.bp-pm-card-lux:hover .bp-pm-lux-arrow {
    background: rgba(201,169,110,0.80);
}

/* Badge Premium */
.bp-pm-lux-badge {
    position      : absolute;
    top           : 16px;
    left          : 16px;
    background    : rgba(201,169,110,0.90);
    backdrop-filter: blur(4px);
    color         : #fff;
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 10px;
    font-weight   : 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding       : 4px 10px;
    border-radius : 20px;
}

/* Info sobre a imagem */
.bp-pm-lux-info {
    position : absolute;
    bottom   : 16px;
    left     : 20px;
    right    : 20px;
    color    : #fff;
}
.bp-pm-lux-bairro {
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 10px;
    font-weight   : 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color         : #C9A96E;
    margin-bottom : 4px;
}
.bp-pm-lux-title {
    font-family : var(--np-serif, 'Playfair Display', serif);
    font-size   : 20px;
    font-weight : 500;
    line-height : 1.2;
    margin-bottom: 10px;
}
.bp-pm-lux-specs {
    list-style : none;
    margin     : 0;
    padding    : 0;
    display    : flex;
    gap        : 12px;
    flex-wrap  : wrap;
}
.bp-pm-lux-specs li {
    display    : flex;
    align-items: center;
    gap        : 5px;
    font-family: var(--np-sans, 'Lato', sans-serif);
    font-size  : 12px;
    color      : rgba(255,255,255,0.80);
}
.bp-pm-lux-specs li i { color: #C9A96E; }

/* Rodapé do card */
.bp-pm-lux-footer {
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    padding        : 16px 20px;
    border-top     : 1px solid rgba(201,169,110,0.20);
}
.bp-pm-lux-valor {
    font-family : var(--np-serif, 'Playfair Display', serif);
    font-size   : 16px;
    font-weight : 600;
    color       : #F9F6F1;
}
.bp-pm-lux-cta {
    font-family   : var(--np-sans, 'Lato', sans-serif);
    font-size     : 11px;
    font-weight   : 700;
    letter-spacing: 0.3px;
    color         : #C9A96E;
    transition    : opacity 0.2s ease;
}
.bp-pm-card-lux:hover .bp-pm-lux-cta { opacity: 0.75; }

/* Responsivo */
@media (max-width: 768px) {
    .bp-pm-lux-img   { height: 220px; }
    .bp-pm-lux-title { font-size: 17px; }
}
@media (max-width: 480px) {
    .bp-pm-lux-img   { height: 200px; }
}