/* =============================================
   QUSAI LAW - LUXURY REDESIGN
   Inspired by lihi_backup reference site
   Warm Dark + Gold/Beige palette
   ============================================= */

/* ---- Color System (from reference) ---- */
:root {
    --gold: #b38b4d;
    --gold-light: #c9a96c;
    --gold-beige: #E8D4BC;
    --gold-cream: #FFF5EA;
    --dark: #1a1a1a;
    --dark-mid: #3E3E3E;
    --text-dark: #2C2C2C;
    --text-body: #444;
    --text-brown: #866741;
    --white: #FFFFFF;
    --radius-section: 33px 33px 0 0;
    --radius-card: 15px;
    --radius-btn: 6px;
    --ease: cubic-bezier(0.25, 0.8, 0.25, 1);
    --shadow-card: 0 4px 6px rgba(0,0,0,0.04), 0 10px 25px rgba(0,0,0,0.07);
    --shadow-card-hover: 0 8px 15px rgba(0,0,0,0.06), 0 20px 45px rgba(0,0,0,0.1);
    --btn-gradient: linear-gradient(239deg, #e8d4bc 0%, #FFF5EA 100%);
    --btn-gradient-hover: linear-gradient(180deg, #E8D4BC 0%, #FFFFFF 100%);
}

/* ---- Animations ---- */
@keyframes floating {
    from { transform: translate(0, 0px); }
    50% { transform: translate(0, 10px); }
    to { transform: translate(0, -0px); }
}

@keyframes fadeSlideUp {
    from { opacity: 0; transform: translateY(25px); }
    to { opacity: 1; transform: translateY(0); }
}


/* ===========================================
   PART 1: HEADER - Warm Dark
   =========================================== */

/* Header background: warm dark (not navy) */
.elementor-84 .elementor-element.elementor-element-9439a36:not(.elementor-motion-effects-element-type-background),
.elementor-84 .elementor-element.elementor-element-9439a36 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    background: linear-gradient(245deg, var(--dark-mid) 0%, var(--dark) 100%) !important;
    background-image: linear-gradient(245deg, var(--dark-mid) 0%, var(--dark) 100%) !important;
}

/* Header border + shadow */
.elementor-84 .elementor-element.elementor-element-9439a36 {
    border-color: rgba(179, 139, 77, 0.2) !important;
    border-bottom: 1px solid rgba(179, 139, 77, 0.2) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

/* Nav items */
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu .elementor-item {
    font-weight: 400;
    font-size: 15px;
    letter-spacing: 0.3px;
    transition: color 0.3s ease;
}

/* Nav hover: warm beige */
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--main .elementor-item:hover,
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--main .elementor-item.elementor-item-active,
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--main .elementor-item.highlighted,
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--main .elementor-item:focus {
    color: var(--gold-beige) !important;
    fill: var(--gold-beige) !important;
}

/* Nav underline: gold */
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after {
    background-color: var(--gold-beige) !important;
}

.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--main .elementor-item.elementor-item-active {
    color: var(--gold-beige) !important;
}

.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item.elementor-item-active:before,
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item.elementor-item-active:after {
    background-color: var(--gold-beige) !important;
}

/* Nav divider */
.elementor-84 .elementor-element.elementor-element-1c148b5 {
    --e-nav-menu-divider-color: rgba(232, 212, 188, 0.2);
}

/* Dropdown: warm dark */
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--dropdown {
    background-color: rgba(26, 26, 26, 0.96) !important;
    border-color: rgba(179, 139, 77, 0.15) !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}

.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--dropdown a:hover,
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--dropdown a:focus,
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--dropdown a.elementor-item-active,
.elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--dropdown a.highlighted {
    background-color: rgba(179, 139, 77, 0.1) !important;
}

/* CTA Button: cream/beige gradient with BLACK text (from reference!) */
.elementor-84 .elementor-element.elementor-element-24b229c .elementor-button {
    background: var(--btn-gradient) !important;
    background-image: var(--btn-gradient) !important;
    background-color: transparent !important;
    color: #000 !important;
    fill: #000 !important;
    font-weight: 700;
    font-size: 16px;
    border: none !important;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
    border-radius: var(--radius-btn);
    padding: 12px 26px;
    transition: all 0.3s var(--ease);
}

.elementor-84 .elementor-element.elementor-element-24b229c .elementor-button:hover {
    background: var(--btn-gradient-hover) !important;
    background-image: var(--btn-gradient-hover) !important;
    color: var(--text-brown) !important;
    fill: var(--text-brown) !important;
    box-shadow: 0 4px 15px rgba(179, 139, 77, 0.3);
    transform: translateY(-1px);
}

/* Logo glow: warm gold */
.elementor-84 .elementor-element.elementor-element-5cc681d img {
    filter: drop-shadow(0 0 10px rgba(232, 212, 188, 0.35)) drop-shadow(0 0 25px rgba(179, 139, 77, 0.15));
}


/* ===========================================
   PART 2: HERO - Dark Warm Overlay
   =========================================== */

/* Hero overlay: warm dark gradient (from reference) */
.elementor-47 .elementor-element.elementor-element-50321dd::before,
.elementor-47 .elementor-element.elementor-element-50321dd > .elementor-background-slideshow::before,
.elementor-47 .elementor-element.elementor-element-50321dd > .e-con-inner > .elementor-background-slideshow::before {
    background-image: linear-gradient(203deg, #3E3E3E 0%, #000000 100%) !important;
    opacity: 0.72 !important;
}

/* Hero heading: let existing gold gradient text effect work (post-47 CSS) */
.elementor-47 .elementor-element.elementor-element-14e875d .elementor-heading-title {
    font-weight: 700;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.3);
}

/* Hero subtitle: visible, warm, readable */
.elementor-47 .elementor-element.elementor-element-984cedd {
    font-size: 19px !important;
    font-weight: 300;
    line-height: 34px !important;
    letter-spacing: 0.2px;
    color: rgba(255, 255, 255, 0.88) !important;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.25);
}

/* Hero logo entrance */
.elementor-47 .elementor-element.elementor-element-afead10 {
    animation: fadeSlideUp 0.8s var(--ease) both;
    animation-delay: 0.1s;
}

/* Hero heading entrance */
.elementor-47 .elementor-element.elementor-element-14e875d {
    animation: fadeSlideUp 0.8s var(--ease) both;
    animation-delay: 0.3s;
}

/* Hero subtitle entrance */
.elementor-47 .elementor-element.elementor-element-984cedd {
    animation: fadeSlideUp 0.8s var(--ease) both;
    animation-delay: 0.5s;
}

/* Hero buttons container entrance */
.elementor-47 .elementor-element.elementor-element-2d0b9ce {
    animation: fadeSlideUp 0.8s var(--ease) both;
    animation-delay: 0.7s;
}

/* Hero CTA buttons: cream/beige gradient with dark text (from reference!) */
.elementor-47 .elementor-element.elementor-element-45d1c43 .elementor-button,
.elementor-47 .elementor-element.elementor-element-341096e .elementor-button,
.elementor-47 .elementor-element.elementor-element-a005145 .elementor-button {
    background: var(--btn-gradient) !important;
    background-image: var(--btn-gradient) !important;
    background-color: transparent !important;
    color: #000 !important;
    fill: #000 !important;
    border: none !important;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
    border-radius: var(--radius-btn);
    font-weight: 700;
    transition: all 0.3s var(--ease);
}

.elementor-47 .elementor-element.elementor-element-45d1c43 .elementor-button:hover,
.elementor-47 .elementor-element.elementor-element-45d1c43 .elementor-button:focus,
.elementor-47 .elementor-element.elementor-element-341096e .elementor-button:hover,
.elementor-47 .elementor-element.elementor-element-341096e .elementor-button:focus,
.elementor-47 .elementor-element.elementor-element-a005145 .elementor-button:hover,
.elementor-47 .elementor-element.elementor-element-a005145 .elementor-button:focus {
    background: var(--btn-gradient-hover) !important;
    background-image: var(--btn-gradient-hover) !important;
    color: var(--text-brown) !important;
    fill: var(--text-brown) !important;
    box-shadow: 0 4px 15px rgba(179, 139, 77, 0.3);
    transform: translateY(-2px);
}

.elementor-47 .elementor-element.elementor-element-45d1c43 .elementor-button:hover svg,
.elementor-47 .elementor-element.elementor-element-341096e .elementor-button:hover svg,
.elementor-47 .elementor-element.elementor-element-a005145 .elementor-button:hover svg {
    fill: var(--text-brown) !important;
}

/* Phone button: warm gold */
.elementor-47 .elementor-element.elementor-element-57493b2 .elementor-button {
    background: linear-gradient(135deg, var(--gold) 0%, var(--text-brown) 100%) !important;
    color: #fff !important;
    box-shadow: 0 4px 15px rgba(179, 139, 77, 0.35);
    border-radius: var(--radius-btn);
}

.elementor-47 .elementor-element.elementor-element-57493b2 .elementor-button:hover {
    background: linear-gradient(135deg, var(--gold-light) 0%, var(--gold) 100%) !important;
    box-shadow: 0 6px 20px rgba(179, 139, 77, 0.45);
    transform: translateY(-2px);
}


/* ===========================================
   PART 3: CONTENT SECTIONS - Rounded Corners
   =========================================== */

/* White content sections: rounded top corners like reference */
.elementor-47 .elementor-element.elementor-element-2f752fb,
.elementor-47 .elementor-element.elementor-element-edd4ce2,
.elementor-47 .elementor-element.elementor-element-fc38845 {
    border-radius: var(--radius-section) !important;
    overflow: hidden;
}

/* Section containers on dark bg: rounded top */
.elementor-47 .elementor-element.elementor-element-1acddcc {
    border-radius: var(--radius-section) !important;
    padding: 6% !important;
}


/* ===========================================
   PART 4: SPECIALTY CARDS - Warm Beige
   =========================================== */

/* Cards: warm beige top border */
.elementor-47 .elementor-element.elementor-element-2202088,
.elementor-47 .elementor-element.elementor-element-79a8bd2,
.elementor-47 .elementor-element.elementor-element-951cf93,
.elementor-47 .elementor-element.elementor-element-cd3e3da {
    border-top: 3px solid var(--gold-beige) !important;
    box-shadow: var(--shadow-card);
    transition: all 0.4s var(--ease);
}

/* Card hover: warm lift */
.elementor-47 .elementor-element.elementor-element-2202088:hover,
.elementor-47 .elementor-element.elementor-element-79a8bd2:hover,
.elementor-47 .elementor-element.elementor-element-951cf93:hover,
.elementor-47 .elementor-element.elementor-element-cd3e3da:hover {
    border-top-color: var(--gold) !important;
    box-shadow: var(--shadow-card-hover) !important;
    transform: translateY(-6px);
}

/* Card titles: dark warm */
.elementor-47 .elementor-element.elementor-element-04b01ae .elementor-image-box-title,
.elementor-47 .elementor-element.elementor-element-fcf0b34 .elementor-image-box-title,
.elementor-47 .elementor-element.elementor-element-5ec25c5 .elementor-image-box-title,
.elementor-47 .elementor-element.elementor-element-e5eabb9 .elementor-image-box-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--text-dark);
}

/* Card descriptions */
.elementor-47 .elementor-element.elementor-element-04b01ae .elementor-image-box-description,
.elementor-47 .elementor-element.elementor-element-fcf0b34 .elementor-image-box-description,
.elementor-47 .elementor-element.elementor-element-5ec25c5 .elementor-image-box-description,
.elementor-47 .elementor-element.elementor-element-e5eabb9 .elementor-image-box-description {
    font-weight: 300;
    font-size: 15px;
    line-height: 1.75;
    color: var(--text-body);
}


/* ===========================================
   PART 5: ABOUT SECTION - Warm Editorial
   =========================================== */

/* About heading: warm dark */
.elementor-47 .elementor-element.elementor-element-719f9a2 .elementor-heading-title {
    color: var(--text-dark) !important;
    -webkit-text-fill-color: var(--text-dark) !important;
}

/* About text: editorial, light weight, spacious */
.elementor-47 .elementor-element.elementor-element-c11d35d {
    font-weight: 300;
    font-size: 19px;
    line-height: 34px;
    color: var(--text-body);
}

/* Dividers: warm beige (from reference) */
.elementor-47 .elementor-element.elementor-element-585278a {
    --divider-color: var(--gold-beige);
}

.elementor-47 .elementor-element.elementor-element-585278a.elementor-view-stacked .elementor-icon {
    background-color: var(--gold-beige);
}

.elementor-47 .elementor-element.elementor-element-585278a.elementor-view-framed .elementor-icon,
.elementor-47 .elementor-element.elementor-element-585278a.elementor-view-default .elementor-icon {
    color: var(--gold-beige);
    border-color: var(--gold-beige);
}

.elementor-47 .elementor-element.elementor-element-585278a.elementor-view-default .elementor-icon svg {
    fill: var(--gold-beige);
}

/* Lawyer photo: grayscale to color on hover + rounded (from reference!) */
.elementor-47 .elementor-element.elementor-element-e7bc500 img,
.elementor-47 .elementor-element.elementor-element-dcb8615 img {
    border-radius: var(--radius-card) !important;
    filter: brightness(100%) contrast(100%) saturate(0%) !important;
    transition: all 0.5s var(--ease);
    border: none !important;
}

.elementor-47 .elementor-element.elementor-element-e7bc500 img:hover,
.elementor-47 .elementor-element.elementor-element-dcb8615 img:hover {
    filter: brightness(100%) contrast(100%) saturate(100%) !important;
}

/* "Read more" button: cream/beige */
.elementor-47 .elementor-element.elementor-element-64ce8fe .elementor-button {
    background: var(--btn-gradient) !important;
    background-image: var(--btn-gradient) !important;
    background-color: transparent !important;
    color: #000 !important;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2);
    border-radius: var(--radius-btn);
    transition: all 0.3s var(--ease);
}

.elementor-47 .elementor-element.elementor-element-64ce8fe .elementor-button:hover {
    background: var(--btn-gradient-hover) !important;
    background-image: var(--btn-gradient-hover) !important;
    color: var(--text-brown) !important;
    box-shadow: 0 4px 15px rgba(179, 139, 77, 0.3);
    transform: translateY(-2px);
}

/* "About us" button */
.elementor-47 .elementor-element.elementor-element-612eabc .elementor-button {
    background: var(--btn-gradient) !important;
    background-image: var(--btn-gradient) !important;
    background-color: transparent !important;
    color: #000 !important;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2);
    border-radius: var(--radius-btn);
    transition: all 0.3s var(--ease);
}

.elementor-47 .elementor-element.elementor-element-612eabc .elementor-button:hover {
    background: var(--btn-gradient-hover) !important;
    background-image: var(--btn-gradient-hover) !important;
    color: var(--text-brown) !important;
}


/* ===========================================
   PART 6: SPECIALTIES IMAGES - Grayscale to Color
   =========================================== */

/* All specialty images + about images: grayscale + rounded (from reference!) */
.elementor-47 .elementor-element.elementor-element-c0c4ab6 img,
.elementor-47 .elementor-element.elementor-element-7a5bb01 img,
.elementor-47 .elementor-element.elementor-element-3047197 img,
.elementor-47 .elementor-element.elementor-element-c88aac5 img {
    border-radius: var(--radius-card) !important;
    filter: brightness(100%) contrast(100%) saturate(0%) blur(0px) !important;
    transition: filter 0.5s var(--ease);
}

.elementor-47 .elementor-element.elementor-element-c0c4ab6 img:hover,
.elementor-47 .elementor-element.elementor-element-7a5bb01 img:hover,
.elementor-47 .elementor-element.elementor-element-3047197 img:hover,
.elementor-47 .elementor-element.elementor-element-c88aac5 img:hover {
    filter: brightness(100%) contrast(100%) saturate(100%) blur(0px) !important;
}

/* Specialty buttons: cream/beige gradient */
.elementor-47 .elementor-element.elementor-element-af13c31 .elementor-button,
.elementor-47 .elementor-element.elementor-element-a64e20c .elementor-button,
.elementor-47 .elementor-element.elementor-element-3e2f862 .elementor-button,
.elementor-47 .elementor-element.elementor-element-6516a21 .elementor-button {
    background: var(--btn-gradient) !important;
    background-image: var(--btn-gradient) !important;
    background-color: transparent !important;
    color: #000 !important;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2);
    border-radius: var(--radius-btn);
    transition: all 0.3s var(--ease);
}

.elementor-47 .elementor-element.elementor-element-af13c31 .elementor-button:hover,
.elementor-47 .elementor-element.elementor-element-a64e20c .elementor-button:hover,
.elementor-47 .elementor-element.elementor-element-3e2f862 .elementor-button:hover,
.elementor-47 .elementor-element.elementor-element-6516a21 .elementor-button:hover {
    background: var(--btn-gradient-hover) !important;
    background-image: var(--btn-gradient-hover) !important;
    color: var(--text-brown) !important;
    transform: translateY(-2px);
}


/* ===========================================
   PART 7: PROCESS STEPS + FAQ
   =========================================== */

/* Process icon box containers: warm glass */
.elementor-widget-icon-box .elementor-widget-container {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(232, 212, 188, 0.12);
    border-radius: 16px;
    padding: 28px;
    transition: all 0.4s var(--ease);
}

.elementor-widget-icon-box:hover .elementor-widget-container {
    background: rgba(232, 212, 188, 0.06);
    border-color: rgba(232, 212, 188, 0.25);
    transform: translateY(-4px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

/* Icon: warm beige */
.elementor-widget-icon-box .elementor-icon svg {
    transition: fill 0.3s ease;
}

.elementor-widget-icon-box:hover .elementor-icon svg {
    fill: var(--gold-beige) !important;
}

/* Icon box title */
.elementor-widget-icon-box .elementor-icon-box-title span {
    font-weight: 700;
    transition: color 0.3s ease;
}

.elementor-widget-icon-box:hover .elementor-icon-box-title span {
    color: var(--gold-beige) !important;
}

/* Icon box description */
.elementor-widget-icon-box .elementor-icon-box-description {
    font-weight: 300;
    line-height: 1.75;
}

/* FAQ Accordion */
.e-n-accordion {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(232, 212, 188, 0.1);
    border-radius: 16px;
    overflow: hidden;
}

.e-n-accordion-item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    transition: all 0.3s ease;
}

.e-n-accordion-item:last-child {
    border-bottom: none;
}

.e-n-accordion-item-title {
    padding: 20px 24px;
    transition: background 0.3s ease;
}

.e-n-accordion-item-title:hover {
    background: rgba(232, 212, 188, 0.05);
}

.e-n-accordion-item-title-text {
    font-weight: 600;
    font-size: 17px;
}

/* Open state: gold-beige right border (RTL) */
.e-n-accordion-item[open] {
    border-right: 3px solid var(--gold-beige);
    background: rgba(232, 212, 188, 0.03);
}

.e-n-accordion-item[open] > .e-n-accordion-item-title {
    background: rgba(232, 212, 188, 0.06);
    border-bottom: 1px solid rgba(232, 212, 188, 0.1);
}

/* Accordion icon: warm gold */
.e-n-accordion-item-title-icon svg {
    fill: var(--gold-beige);
    transition: transform 0.3s ease;
}

.e-n-accordion-item[open] .e-n-accordion-item-title-icon svg {
    fill: var(--gold);
}

/* Answer content */
.e-n-accordion-item [role="region"] {
    padding: 4px 24px 20px;
}

.e-n-accordion-item [role="region"] .elementor-widget-text-editor {
    line-height: 1.85;
    font-weight: 300;
    color: rgba(255, 255, 255, 0.78);
}


/* ===========================================
   PART 8: FOOTER - Warm Premium
   =========================================== */

/* Footer form heading */
.elementor-93 .elementor-element.elementor-element-dc73e90 .elementor-heading-title {
    font-size: 26px;
    line-height: 1.4em;
    color: var(--text-dark);
    font-weight: 700;
}

/* Form inputs: warm glass */
.elementor-93 .elementor-field-textual {
    background: rgba(232, 212, 188, 0.04) !important;
    border: 1.5px solid rgba(179, 139, 77, 0.15) !important;
    border-radius: 10px !important;
    padding: 14px 18px !important;
    font-family: "Assistant", sans-serif;
    transition: all 0.3s var(--ease);
}

.elementor-93 .elementor-field-textual:focus {
    border-color: var(--gold-beige) !important;
    box-shadow: 0 0 0 4px rgba(232, 212, 188, 0.12) !important;
    background: #fff !important;
    outline: none;
}

/* Footer submit: cream/beige gradient (from reference!) */
.elementor-93 .elementor-field-type-submit .elementor-button {
    background: var(--btn-gradient) !important;
    background-image: var(--btn-gradient) !important;
    background-color: transparent !important;
    color: #000 !important;
    font-weight: 700;
    font-size: 17px;
    border: none !important;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    padding: 14px 32px;
    transition: all 0.3s var(--ease);
}

.elementor-93 .elementor-field-type-submit .elementor-button:hover {
    background: var(--btn-gradient-hover) !important;
    background-image: var(--btn-gradient-hover) !important;
    color: var(--text-brown) !important;
    box-shadow: 0 4px 15px rgba(179, 139, 77, 0.3);
    transform: translateY(-2px);
}

/* Footer bottom: warm border */
.elementor-93 .elementor-element.elementor-element-5ff68fc {
    border-top: 2px solid var(--gold-beige);
}

/* Footer "ניווט מהיר": warm beige */
.elementor-93 .elementor-element.elementor-element-e480b22 .elementor-heading-title {
    color: var(--gold-beige) !important;
    font-weight: 600;
    letter-spacing: 0.5px;
}

/* Footer nav links: warm hover */
.elementor-location-footer .elementor-nav-menu--main .elementor-item:hover {
    color: var(--gold-beige) !important;
}

/* Footer divider */
.elementor-93 .elementor-element.elementor-element-1ae6ce7 {
    --divider-color: rgba(232, 212, 188, 0.35);
}

/* Footer icons: warm gold */
.elementor-location-footer .elementor-icon-list-icon svg {
    fill: var(--gold-beige);
}

.elementor-location-footer .elementor-icon-list-item:hover .elementor-icon-list-text {
    color: var(--gold-beige) !important;
}

/* Footer phone buttons: cream/beige */
.elementor-93 .elementor-element.elementor-element-8f4030a .elementor-button {
    background: var(--btn-gradient) !important;
    background-image: var(--btn-gradient) !important;
    background-color: transparent !important;
    color: #000 !important;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2);
    border: none !important;
    border-radius: var(--radius-btn);
    transition: all 0.3s var(--ease);
}

.elementor-93 .elementor-element.elementor-element-8f4030a .elementor-button:hover,
.elementor-93 .elementor-element.elementor-element-8f4030a .elementor-button:focus {
    background: var(--btn-gradient-hover) !important;
    background-image: var(--btn-gradient-hover) !important;
    color: var(--text-brown) !important;
    box-shadow: 0 4px 15px rgba(179, 139, 77, 0.3);
}

.elementor-93 .elementor-element.elementor-element-8f4030a .elementor-button:hover svg {
    fill: var(--text-brown) !important;
}

.elementor-93 .elementor-element.elementor-element-cc9edb9 .elementor-button {
    background: var(--btn-gradient) !important;
    background-image: var(--btn-gradient) !important;
    background-color: transparent !important;
    color: #000 !important;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2);
}


/* ===========================================
   PART 9: GLOBAL STYLES
   =========================================== */

/* ---- Inner Pages ---- */

/* Inner page hero: warm dark overlay */
[data-elementor-type="wp-page"]:not(.elementor-47) > .e-con.e-parent:first-child::before {
    background-image: linear-gradient(203deg, #3E3E3E 0%, #000000 100%) !important;
}

/* Inner page headings: dark warm */
[data-elementor-type="wp-page"] .elementor-heading-title {
    color: var(--text-dark);
}

/* White text on dark backgrounds */
.e-con[data-settings*="slideshow"] .elementor-heading-title,
.e-con[data-settings*="gradient"] .elementor-heading-title {
    color: #FFFFFF;
}

/* Inner page hero buttons: cream/beige */
[data-elementor-type="wp-page"] .e-con.e-parent:first-child .elementor-button:hover {
    background: var(--btn-gradient-hover) !important;
    color: var(--text-brown) !important;
    box-shadow: 0 4px 15px rgba(179, 139, 77, 0.3);
}

[data-elementor-type="wp-page"] .e-con.e-parent:first-child .elementor-button:hover svg {
    fill: var(--text-brown) !important;
}

/* All dividers: warm beige */
.elementor-widget-divider .elementor-divider__element svg {
    fill: var(--gold-beige);
}

/* Button transitions */
[data-elementor-type="wp-page"] .elementor-widget-button .elementor-button {
    transition: all 0.3s var(--ease);
    border-radius: var(--radius-btn);
}

/* ---- All Forms ---- */
.elementor-form .elementor-field-textual {
    border: 1.5px solid rgba(179, 139, 77, 0.15) !important;
    border-radius: 10px !important;
    font-family: "Assistant", sans-serif !important;
    padding: 12px 16px !important;
    transition: all 0.3s var(--ease) !important;
    background: rgba(255, 255, 255, 0.95) !important;
}

.elementor-form .elementor-field-textual:focus {
    border-color: var(--gold-beige) !important;
    box-shadow: 0 0 0 4px rgba(232, 212, 188, 0.12) !important;
    outline: none !important;
}

.elementor-form .elementor-field-type-submit .elementor-button {
    background: var(--btn-gradient) !important;
    background-image: var(--btn-gradient) !important;
    color: #000 !important;
    font-weight: 700 !important;
    border: none !important;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2) !important;
    border-radius: 10px !important;
    transition: all 0.3s var(--ease) !important;
}

.elementor-form .elementor-field-type-submit .elementor-button:hover {
    background: var(--btn-gradient-hover) !important;
    background-image: var(--btn-gradient-hover) !important;
    color: var(--text-brown) !important;
    box-shadow: 0 4px 15px rgba(179, 139, 77, 0.3) !important;
    transform: translateY(-2px);
}

/* ---- Image treatment: grayscale + rounded ---- */
.elementor-widget-image img {
    transition: filter 0.5s var(--ease), transform 0.5s var(--ease);
}

/* ---- Post Cards ---- */
.elementor-posts--skin-cards .elementor-post__card {
    transition: all 0.4s var(--ease);
    border-radius: var(--radius-card);
    overflow: hidden;
}

.elementor-posts--skin-cards .elementor-post__card:hover {
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-4px);
}

.elementor-posts--skin-cards .elementor-post__read-more {
    color: var(--gold);
    font-weight: 600;
    transition: color 0.3s ease;
}

.elementor-posts--skin-cards .elementor-post__read-more:hover {
    color: var(--text-brown);
}

.elementor-post__title a {
    color: var(--text-dark);
    transition: color 0.3s ease;
}

.elementor-post__title a:hover {
    color: var(--gold);
}

/* ---- Calculators ---- */
.calc-field input:focus,
.calc-field select:focus {
    border-color: var(--gold-beige) !important;
    box-shadow: 0 0 0 3px rgba(232, 212, 188, 0.2) !important;
}

.calc-btn {
    border-radius: var(--radius-btn) !important;
    transition: all 0.3s var(--ease) !important;
}

.calc-btn:hover {
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
    transform: translateY(-2px) !important;
}

/* ---- Content typography ---- */
[data-elementor-type="wp-page"] .elementor-widget-text-editor ul,
[data-elementor-type="wp-page"] .elementor-widget-text-editor ol {
    padding-right: 1.2em;
    line-height: 1.85;
}

[data-elementor-type="wp-page"] .elementor-widget-text-editor li {
    margin-bottom: 0.5em;
}

[data-elementor-type="wp-page"] .elementor-widget-text-editor h2 {
    color: var(--text-dark);
    font-weight: 700;
    margin-top: 1.5em;
    margin-bottom: 0.5em;
}

[data-elementor-type="wp-page"] .elementor-widget-text-editor h3 {
    color: var(--text-dark);
    font-weight: 600;
    margin-top: 1.2em;
    margin-bottom: 0.4em;
}

[data-elementor-type="wp-page"] .elementor-widget-text-editor p {
    line-height: 1.8;
    color: var(--text-body);
}

/* ---- Links: warm animated underline ---- */
.elementor-widget-text-editor a {
    color: var(--gold);
    text-decoration: none;
    background-image: linear-gradient(var(--gold-beige), var(--gold-beige));
    background-position: 100% 100%;
    background-repeat: no-repeat;
    background-size: 0% 2px;
    transition: background-size 0.3s ease, color 0.3s ease;
    padding-bottom: 2px;
}

.elementor-widget-text-editor a:hover {
    color: var(--text-brown);
    background-size: 100% 2px;
    background-position: 0% 100%;
}

/* ---- Selection ---- */
::selection {
    background-color: rgba(232, 212, 188, 0.3);
    color: var(--text-dark);
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Scrollbar: dark + warm gold */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: var(--dark);
}

::-webkit-scrollbar-thumb {
    background: rgba(179, 139, 77, 0.5);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--gold);
}

/* Focus ring: warm gold */
a:focus-visible,
button:focus-visible,
input:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--gold-beige);
    outline-offset: 3px;
}

/* Font rendering */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/* ===========================================
   PART 10: RESPONSIVE
   =========================================== */

@media (max-width: 1024px) {
    .elementor-widget-icon-box .elementor-widget-container {
        padding: 20px;
    }

    .elementor-47 .elementor-element.elementor-element-1acddcc {
        padding: 5% !important;
    }
}

@media (max-width: 767px) {
    /* Hero subtitle mobile */
    .elementor-47 .elementor-element.elementor-element-984cedd {
        font-size: 15px !important;
        line-height: 26px !important;
    }

    /* Mobile nav touch targets */
    .elementor-84 .elementor-element.elementor-element-1c148b5 .elementor-nav-menu--dropdown a {
        padding: 14px 20px;
    }

    /* Mobile CTA */
    .elementor-84 .elementor-element.elementor-element-24b229c .elementor-button {
        font-size: 14px;
        padding: 10px 18px;
    }

    /* Mobile footer heading */
    .elementor-93 .elementor-element.elementor-element-dc73e90 .elementor-heading-title {
        font-size: 20px;
        line-height: 1.5em;
    }

    /* Disable entrance animations on mobile */
    .elementor-47 .elementor-element.elementor-element-14e875d,
    .elementor-47 .elementor-element.elementor-element-984cedd,
    .elementor-47 .elementor-element.elementor-element-2d0b9ce,
    .elementor-47 .elementor-element.elementor-element-afead10 {
        animation: none !important;
        opacity: 1 !important;
    }

    /* Mobile icon boxes */
    .elementor-widget-icon-box .elementor-widget-container {
        padding: 18px;
        border-radius: 12px;
    }

    /* Mobile sections rounded */
    .elementor-47 .elementor-element.elementor-element-2f752fb,
    .elementor-47 .elementor-element.elementor-element-edd4ce2,
    .elementor-47 .elementor-element.elementor-element-fc38845 {
        border-radius: 20px 20px 0 0 !important;
    }

    /* No hover transforms on mobile */
    .elementor-posts--skin-cards .elementor-post__card:hover {
        transform: none;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}
