/*
Theme Name: Gratz & Gratz Divi Child
Theme URI: https://gratzandgratz.com/
Description: Child theme for the Gratz & Gratz website, built on Divi.
Author: Gibens Creative Group
Author URI: https://gibenscreativegroup.com/
Template: Divi
Version: 1.0.0
*/

/* 
Custom CSS for Gratz & Gratz can be added below.
This child theme inherits all styling and functionality from Divi.
*/

/* ==========================================================================
   Decorative Ampersand Backgrounds
   ========================================================================== */

/* Prevent horizontal scrolling */
html,
body,
#page-container,
#et-main-area,
#main-content,
.et_builder_inner_content {
    max-width: 100%;
    overflow-x: hidden !important;
}

/* Shared section setup */
.hero-section,
.about-the-firm-section,
.practice-areas-section {
    position: relative;
    overflow: hidden !important;
}

/* Keep content above decorative ampersands */
.hero-section .et_pb_row,
.about-the-firm-section .et_pb_row,
.practice-areas-section .et_pb_row {
    position: relative;
    z-index: 10;
}

/* Hero Section Ampersand */
.hero-section::after {
    content: "";
    position: absolute;
    width: 1300px;
    height: 1300px;
    right: -600px;
    top: -100px;
    background-image: url("https://dev.gratzandgratz.com/wp-content/uploads/2026/06/lightGold_Ampersand_01.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.3;
    z-index: 0;
    pointer-events: none;
}

/* Hero Section Ampersand for Michael and Margaret */
.hero-section-michael-margaret::after {
    content: "";
    position: absolute;
    width: 800px;
    height: 800px;
    right: -450px;
    top: 200px;
    background-image: url("https://dev.gratzandgratz.com/wp-content/uploads/2026/06/lightGold_Ampersand_01.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.3;
    z-index: 0;
    pointer-events: none;
	display: none;
}

/* About the Firm Section Ampersand */
.about-the-firm-section::before {
    content: "";
    position: absolute;
    width: 1200px;
    height: 1200px;
    left: -700px;
    top: -425px;
    background-image: url("https://dev.gratzandgratz.com/wp-content/uploads/2026/06/offWhite_Ampersand_01.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 1;
    z-index: 0;
    pointer-events: none;
}

/* Practice Areas Section Ampersand */
.practice-areas-section::before {
    content: "";
    position: absolute;
    width: 1050px;
    height: 1050px;
    left: -500px;
    top: -450px;
    background-image: url("https://dev.gratzandgratz.com/wp-content/uploads/2026/06/offWhite_Ampersand_01.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 1;
    z-index: 0;
    pointer-events: none;
}

/* Tablet */
@media (max-width: 980px) {
    .hero-section::after {
        width: 1000px;
        height: 1000px;
        right: -500px;
        top: -100px;
        opacity: 0.3;
    }

    .about-the-firm-section::before,
    .practice-areas-section::before {
        display: none;
    }
}

@media (max-width: 980px) {
    .hero-section-michael-margaret::after {
        width: 1000px;
        height: 1000px;
        right: -500px;
        top: 500px;
        opacity: 0.3;
		display: none;
    }

    .about-the-firm-section::before,
    .practice-areas-section::before {
        display: none;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .hero-section-michael-margaret::after,
    .about-the-firm-section::before,
    .practice-areas-section::before {
        display: none;
    }
}

@media (max-width: 767px) {
    .hero-section::after,
    .about-the-firm-section::before,
    .practice-areas-section::before {
        display: none;
    }
}


/* Swap logo when Divi fixed header activates */
#main-header.et-fixed-header #logo {
    content: url("https://dev.gratzandgratz.com/wp-content/uploads/2026/06/gAndGLogo.png");
}

/* ==========================================================================
   BUTTONS
   ========================================================================== */

.et_pb_button {

    display: inline-block;

    transition:
        background-color .35s ease,
        color .35s ease,
        border-color .35s ease,
        transform .35s ease,
        box-shadow .35s ease;

}

.et_pb_button:hover {

    transform: translateY(-1px);

    box-shadow:
        0 8px 18px rgba(12,33,56,.10);

}

/* ==========================================================================
   BUTTONS
   ========================================================================== */

.et_pb_button {

    display: inline-block;

    transition:
        background-color .35s ease,
        color .35s ease,
        border-color .35s ease,
        transform .35s ease,
        box-shadow .35s ease;

}

.et_pb_button:hover {

    transform: translateY(-1px);

    box-shadow:
        0 8px 18px rgba(12,33,56,.10);

}

.hero-button-row .et_pb_column {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
}

.hero-button-row .et_pb_button_module_wrapper {
    margin-bottom: 0 !important;
    width: auto;
}

/*================================================
  Elegant Navigation Hover - Gratz & Gratz
================================================*/

#top-menu-nav #top-menu > li > a {
    position: relative;
    display: inline-block;
    color: #faf8f4;
    transition: color .35s ease;
}

/* Gold accent line above the text */
#top-menu-nav #top-menu > li > a::before {
    content: "";
    position: absolute;

    left: 0;
    top: -10px;

    width: 16px;
    height: 1.5px;

    background-color: #c2a75a;

    opacity: 0;
    transform: translateY(4px);

    transition:
      opacity .4s ease,
      transform .4s cubic-bezier(.25,.46,.45,.94);
}

/* Hover + Active text */
#top-menu-nav #top-menu > li:hover > a,
#top-menu-nav #top-menu > li.current-menu-item > a,
#top-menu-nav #top-menu > li.current-menu-ancestor > a {
    color: #c2a75a !important;
}

/* Show gold line */
#top-menu-nav #top-menu > li:hover > a::before,
#top-menu-nav #top-menu > li.current-menu-item > a::before,
#top-menu-nav #top-menu > li.current-menu-ancestor > a::before {
    opacity: 1;
    transform: translateY(0);
}

/* Preserve Divi dropdown arrow */
#top-menu .menu-item-has-children > a:first-child::after {
    color: inherit;
}

/*================================================
  Dropdown Menu Hover
================================================*/

/* Default dropdown links */
#top-menu li li a {
    transition: color .3s ease;
}

/* Hover */
#top-menu li li a:hover {
    color: #c2a75a !important;
}

/* Active page within dropdown */
#top-menu li li.current-menu-item > a,
#top-menu li li.current-menu-ancestor > a {
    color: #c2a75a !important;
}

/* ==========================================
   Mobile Menu Icon
   ========================================== */

.mobile_menu_bar:before {
    color: #c2a75a !important;
}

.et-fixed-header .mobile_menu_bar:before {
    color: #c2a75a !important;
}

.et_mobile_menu {
    background-color: #0c2138 !important;
    border-top: none !important;
}

.et_mobile_menu li a {
    color: #faf8f4 !important;
    transition: color .3s ease;
    opacity: 1 !important;
}

/* Hover */
.et_mobile_menu li a:hover {
    color: #c2a75a !important;
    background-color: transparent !important;
    opacity: 1 !important;
}

/* Current Page */
.et_mobile_menu .current-menu-item > a,
.et_mobile_menu .current-menu-ancestor > a {
    color: #c2a75a !important;
}

/* Make all mobile menu items the same font weight */
.et_mobile_menu li a {
    font-weight: 600 !important;
}