/* =============================================================================
   LUCRE CONDOMINIOS — SERVICES SECTION PREMIUM ENHANCEMENT
   Palette: Silver/Gray — Text: Centered
   ============================================================================= */

/* --------------------------------------------------------------------------
   1. GRID LAYOUT — equal-height cards side by side
   -------------------------------------------------------------------------- */

.sc_icons_accent .sc_icons_columns_wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    align-items: stretch;
}

.sc_icons_accent .trx_addons_column-1_4 {
    display: flex;
    flex-direction: column;
}

/* --------------------------------------------------------------------------
   2. CARD BASE — glassmorphism dark card with gold accent border
   -------------------------------------------------------------------------- */

.sc_icons_accent .sc_icons_item {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0 12px 24px;
    padding: 40px 32px 36px;
    background: linear-gradient(160deg, rgba(40, 44, 48, 0.95) 0%, rgba(28, 32, 36, 0.98) 100%);
    border: 1px solid rgba(160, 165, 170, 0.22);
    border-radius: 4px;
    box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(180, 185, 190, 0.10);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    overflow: hidden;
    transition: transform 0.38s cubic-bezier(0.23, 1, 0.32, 1),
        box-shadow 0.38s cubic-bezier(0.23, 1, 0.32, 1),
        border-color 0.38s ease;
    cursor: default;
}

/* Animated gold top-border accent */
.sc_icons_accent .sc_icons_item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent 0%, #8a9199 35%, #c5cacf 55%, #8a9199 80%, transparent 100%);
    opacity: 0.65;
    transition: opacity 0.38s ease, height 0.38s ease;
}

/* Subtle radial glow in the top-left corner */
.sc_icons_accent .sc_icons_item::after {
    content: '';
    position: absolute;
    top: -60px;
    left: -60px;
    width: 180px;
    height: 180px;
    background: radial-gradient(circle, rgba(160, 170, 180, 0.12) 0%, transparent 70%);
    pointer-events: none;
    transition: opacity 0.5s ease;
    opacity: 0;
}

/* --------------------------------------------------------------------------
   3. HOVER STATE
   -------------------------------------------------------------------------- */

.sc_icons_accent .sc_icons_item:hover {
    transform: translateY(-6px);
    border-color: rgba(160, 165, 170, 0.50);
    box-shadow:
        0 16px 48px rgba(0, 0, 0, 0.55),
        0 0 0 1px rgba(160, 165, 170, 0.15),
        inset 0 1px 0 rgba(180, 185, 190, 0.20);
}

.sc_icons_accent .sc_icons_item:hover::before {
    opacity: 1;
    height: 4px;
}

.sc_icons_accent .sc_icons_item:hover::after {
    opacity: 1;
}

/* --------------------------------------------------------------------------
   4. ICON — circular gold ring with size & animation
   -------------------------------------------------------------------------- */

.sc_icons_accent .sc_icons_icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    margin: 0 auto 28px;
    background: rgba(150, 160, 170, 0.08);
    border: 1.5px solid rgba(150, 160, 170, 0.30);
    border-radius: 50%;
    transition: background 0.35s ease, border-color 0.35s ease, transform 0.35s cubic-bezier(0.23, 1, 0.32, 1);
    flex-shrink: 0;
}

.sc_icons_accent .sc_icons_item:hover .sc_icons_icon {
    background: rgba(150, 160, 170, 0.16);
    border-color: rgba(160, 168, 178, 0.60);
    transform: scale(1.08) rotate(5deg);
}

/* Icon glyph sizing */
.sc_icons_accent .sc_icons_icon>span,
.sc_icons_accent .sc_icons_icon::before {
    font-size: 32px !important;
    line-height: 1 !important;
    color: #a0a8b0 !important;
    transition: color 0.3s ease, transform 0.35s ease;
}

.sc_icons_accent .sc_icons_item:hover .sc_icons_icon>span,
.sc_icons_accent .sc_icons_item:hover .sc_icons_icon::before {
    color: #c8cdd2 !important;
}

/* FontAwesome icons inside sc_icons — silver/gray theme color */
.sc_icons_accent .sc_icons_icon .fas,
.sc_icons_accent .sc_icons_icon .fa,
.sc_icons_accent .sc_icons_icon .far,
.sc_icons_accent .sc_icons_icon .fab {
    font-size: 30px !important;
    line-height: 1 !important;
    color: #a0a8b0 !important;
    transition: color 0.3s ease, transform 0.35s ease;
    display: block;
}

/* Hover: icons brighten to light silver */
.sc_icons_accent .sc_icons_item:hover .sc_icons_icon .fas,
.sc_icons_accent .sc_icons_item:hover .sc_icons_icon .fa,
.sc_icons_accent .sc_icons_item:hover .sc_icons_icon .far,
.sc_icons_accent .sc_icons_item:hover .sc_icons_icon .fab {
    color: #c8cdd2 !important;
    transform: scale(1.06);
}

/* -----------------------------------------------------------------------
   CSS FALLBACK — override any residual fontello icons that may remain
   in case Elementor cache hasn't been fully flushed yet.
   Forces them to render invisibly so the ::before content takes over.
   ----------------------------------------------------------------------- */

/* Fontello icon-parking → swap via CSS ::before */
.sc_icons_accent .sc_icons_icon.icon-parking>span::before,
.sc_icons_accent .sc_icons_icon .icon-parking::before {
    font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Pro', FontAwesome !important;
    font-weight: 900 !important;
    content: '\f1ad' !important;
    /* fa-building */
    color: #c9a84c !important;
    font-size: 30px !important;
}

/* Fontello icon-modem → fa-file-invoice-dollar */
.sc_icons_accent .sc_icons_icon.icon-modem>span::before,
.sc_icons_accent .sc_icons_icon .icon-modem::before {
    font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Pro', FontAwesome !important;
    font-weight: 900 !important;
    content: '\f571' !important;
    /* fa-file-invoice-dollar */
    color: #c9a84c !important;
    font-size: 30px !important;
}

/* Fontello icon-ironing → fa-user-tie */
.sc_icons_accent .sc_icons_icon.icon-ironing>span::before,
.sc_icons_accent .sc_icons_icon .icon-ironing::before {
    font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Pro', FontAwesome !important;
    font-weight: 900 !important;
    content: '\f508' !important;
    /* fa-user-tie */
    color: #c9a84c !important;
    font-size: 30px !important;
}

/* FA fa-balance-scale → fa-gavel */
.sc_icons_accent .sc_icons_icon.fa-balance-scale>span::before,
.sc_icons_accent .sc_icons_icon .fa-balance-scale::before {
    content: '\f0e3' !important;
    /* fa-gavel */
    color: #c9a84c !important;
    font-size: 30px !important;
}



/* --------------------------------------------------------------------------
   5. CARD TITLE
   -------------------------------------------------------------------------- */

.sc_icons_accent .sc_icons_item_title {
    font-family: 'Playfair Display', 'Georgia', serif;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: #d0d4d8 !important;
    margin: 0 0 20px !important;
    padding-bottom: 16px !important;
    border-bottom: 1px solid rgba(160, 165, 170, 0.20) !important;
    line-height: 1.4 !important;
    text-align: center !important;
    transition: color 0.3s ease !important;
}

.sc_icons_accent .sc_icons_item:hover .sc_icons_item_title {
    color: #e8ecf0 !important;
    border-bottom-color: rgba(160, 165, 170, 0.40) !important;
}

/* Title span wrapper */
.sc_icons_accent .sc_icons_item_title span {
    display: block;
}

/* --------------------------------------------------------------------------
   6. DESCRIPTION PANEL — hidden by default, revealed on hover (accordion)
      But given these cards have large text, we cap height & add scroll feel
   -------------------------------------------------------------------------- */

.sc_icons_accent .sc_icons_item_description {
    flex: 1;
    overflow: hidden;
    position: relative;
    text-align: center;
}

.sc_icons_accent .sc_icons_item_description p {
    font-size: 14px !important;
    line-height: 1.75 !important;
    color: rgba(200, 205, 210, 0.85) !important;
    margin: 0 !important;
}

/* The inline strong heading inside description */
.sc_icons_accent .sc_icons_item_description p>strong {
    display: block;
    font-size: 13px !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    color: #c9a84c !important;
    margin-bottom: 14px !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid rgba(185, 155, 90, 0.2) !important;
}

/* --------------------------------------------------------------------------
   7. ALIGNMENT — center icon, left-align body text
   -------------------------------------------------------------------------- */

.sc_icons_accent .sc_icons_item_details {
    text-align: center;
}

/* Keep icon centered */
.sc_icons_accent.sc_align_center .sc_icons_columns_wrap {
    justify-content: center;
}

/* --------------------------------------------------------------------------
   8. SECTION WRAPPER — subtle separator lines between columns
   -------------------------------------------------------------------------- */

.sc_icons_accent .trx_addons_column-1_4:not(:last-child) .sc_icons_item {
    /* Right side shading on desktop */
    box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(185, 155, 90, 0.12);
}

/* --------------------------------------------------------------------------
   9. ENTRANCE ANIMATION — staggered fade-up on page load
   -------------------------------------------------------------------------- */

@keyframes lucre-card-in {
    from {
        opacity: 0;
        transform: translateY(28px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.sc_icons_accent .trx_addons_column-1_4:nth-child(1) .sc_icons_item {
    animation: lucre-card-in 0.65s cubic-bezier(0.23, 1, 0.32, 1) 0.05s both;
}

.sc_icons_accent .trx_addons_column-1_4:nth-child(2) .sc_icons_item {
    animation: lucre-card-in 0.65s cubic-bezier(0.23, 1, 0.32, 1) 0.15s both;
}

.sc_icons_accent .trx_addons_column-1_4:nth-child(3) .sc_icons_item {
    animation: lucre-card-in 0.65s cubic-bezier(0.23, 1, 0.32, 1) 0.25s both;
}

.sc_icons_accent .trx_addons_column-1_4:nth-child(4) .sc_icons_item {
    animation: lucre-card-in 0.65s cubic-bezier(0.23, 1, 0.32, 1) 0.35s both;
}

/* --------------------------------------------------------------------------
   10. RESPONSIVE — 2-col on tablet, 1-col on mobile
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
    .sc_icons_accent .sc_icons_item {
        margin: 0 8px 20px;
        padding: 32px 24px 28px;
    }
}

@media (max-width: 767px) {
    .sc_icons_accent .sc_icons_columns_wrap {
        flex-direction: column;
    }

    .sc_icons_accent .trx_addons_column-1_4,
    .sc_icons_accent .trx_addons_column-1_2-tablet {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    .sc_icons_accent .sc_icons_item {
        margin: 0 0 16px;
        padding: 28px 20px 24px;
    }

    .sc_icons_accent .sc_icons_icon {
        width: 64px;
        height: 64px;
        margin-bottom: 20px;
    }

    .sc_icons_accent .sc_icons_icon>span,
    .sc_icons_accent .sc_icons_icon::before {
        font-size: 26px !important;
    }

    .sc_icons_accent .sc_icons_item_title {
        font-size: 13px !important;
    }

    .sc_icons_accent .sc_icons_item_description p {
        font-size: 13px !important;
        line-height: 1.65 !important;
    }

    /* Cancel stagger animations on mobile for performance */
    .sc_icons_accent .trx_addons_column-1_4 .sc_icons_item,
    .sc_icons_accent .trx_addons_column-1_3 .sc_icons_item {
        animation: lucre-card-in 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s both;
    }
}

/* =============================================================================
   11. 3-COLUMN LAYOUT — .lucre-services-custom (override section)
   ============================================================================= */

.lucre-services-custom .sc_icons_columns_wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    align-items: stretch;
    justify-content: center;
}

.sc_icons_accent .trx_addons_column-1_3 {
    display: flex;
    flex-direction: column;
    flex: 0 0 33.333%;
    max-width: 33.333%;
    box-sizing: border-box;
}

/* Stagger animations for 3-card layout */
.sc_icons_accent .trx_addons_column-1_3:nth-child(1) .sc_icons_item {
    animation: lucre-card-in 0.65s cubic-bezier(0.23, 1, 0.32, 1) 0.05s both;
}

.sc_icons_accent .trx_addons_column-1_3:nth-child(2) .sc_icons_item {
    animation: lucre-card-in 0.65s cubic-bezier(0.23, 1, 0.32, 1) 0.18s both;
}

.sc_icons_accent .trx_addons_column-1_3:nth-child(3) .sc_icons_item {
    animation: lucre-card-in 0.65s cubic-bezier(0.23, 1, 0.32, 1) 0.31s both;
}

/* =============================================================================
   12. SERVICE SUBTITLE — description lead line
   ============================================================================= */

.lucre-service-subtitle {
    font-size: 13px !important;
    line-height: 1.6 !important;
    color: rgba(190, 195, 200, 0.75) !important;
    font-style: italic !important;
    margin: 0 0 16px !important;
    padding-bottom: 14px !important;
    border-bottom: 1px solid rgba(160, 165, 170, 0.15) !important;
    text-align: center !important;
}

/* =============================================================================
   13. SERVICE LIST — premium styled bullet points
   ============================================================================= */

.lucre-service-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.lucre-service-list li {
    position: relative;
    font-size: 13.5px !important;
    line-height: 1.6 !important;
    color: rgba(195, 200, 205, 0.85) !important;
    padding: 6px 0 6px 20px !important;
    border-bottom: 1px solid rgba(160, 165, 170, 0.10) !important;
    transition: color 0.25s ease, padding-left 0.25s ease;
}

.lucre-service-list li:last-child {
    border-bottom: none !important;
}

/* Gray dash bullet */
.lucre-service-list li::before {
    content: '—';
    position: absolute;
    left: 0;
    top: 6px;
    color: #8a9199;
    font-size: 11px;
    line-height: 1.6;
    font-weight: 700;
    transition: color 0.25s ease;
}

/* Hover: list items slide right, bullet brightens */
.sc_icons_accent .sc_icons_item:hover .lucre-service-list li {
    color: rgba(220, 225, 230, 0.95) !important;
    padding-left: 24px !important;
}

.sc_icons_accent .sc_icons_item:hover .lucre-service-list li::before {
    color: #b0b8c0;
}

/* =============================================================================
   14. RESPONSIVE — 3-col adjustments
   ============================================================================= */

@media (max-width: 1024px) {
    .sc_icons_accent .trx_addons_column-1_3 {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

@media (max-width: 767px) {
    .sc_icons_accent .trx_addons_column-1_3 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .sc_icons_accent .trx_addons_column-1_3 .sc_icons_item {
        animation: lucre-card-in 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s both;
    }

    .lucre-service-list li {
        font-size: 13px !important;
    }
}

/* =============================================================================
   15. LOGO — tamanho aumentado
   ============================================================================= */

.sc_layouts_logo.sc_layouts_logo_default img.logo_image,
.sc_layouts_logo img.logo_image {
    width: 250px !important;
    height: auto !important;
    max-width: 250px !important;
}

@media (max-width: 1024px) {
    .sc_layouts_logo img.logo_image {
        width: 200px !important;
        max-width: 200px !important;
    }
}

@media (max-width: 767px) {
    .sc_layouts_logo img.logo_image {
        width: 160px !important;
        max-width: 160px !important;
    }
}

/* =============================================================================
   16. CONTACT/NEWSLETTER SECTION — corrigir fundo branco
   ============================================================================= */

/* Alveja a coluna que contém o widget 9efa3b4 (Contact Us / Subscribe) */
.elementor-element-9efa3b4,
.elementor-element-0f09534,
.elementor-element-5c0af5f,
.elementor-widget-wrap:has(.elementor-element-9efa3b4),
.elementor-column:has(.elementor-element-9efa3b4),
.elementor-section:has(.elementor-element-9efa3b4) {
    background-color: transparent !important;
    background-image: none !important;
}

/* Garante que o container pai também seja escuro */
.elementor-widget-wrap.elementor-element-populated:has(.elementor-element-9efa3b4) {
    background: #1c2224 !important;
}