/* =========================================================
   B&B SANDHU LAW - HOMEPAGE RESPONSIVE
   Targets only the custom section classes (home-banner,
   banner-bottom, about-us, our-team, our-portfolio,
   contact-form, bbs-footer ...) so rearranging or adding
   modules does not break anything.
========================================================= */


/* =========================================================
   TABLET  (max-width: 980px)
========================================================= */

@media (max-width: 980px) {

    /* ---------- HERO ---------- */
    body .home-banner .et_pb_slide_content h1 {
        font-size: 46px !important;
        line-height: 1.15em !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body .home-banner .et_pb_slide_content h2 {
        font-size: 18px !important;
    }

    /* hero layout: tall, left aligned, full width text */
    body .home-banner,
    body .home-banner .et_pb_slider,
    body .home-banner .et_pb_slides,
    body .home-banner .et_pb_slide {
        min-height: 540px !important;
    }

    body .home-banner .et_pb_slide {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body .home-banner .et_pb_container {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 0 !important;
    }

    body .home-banner .et_pb_slide_description {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        min-height: 540px !important;
        justify-content: center !important;
        row-gap: 0 !important;
        padding: 110px 24px 60px !important;
        text-align: left !important;
    }

    body .home-banner .et_pb_slide,
    body .home-banner .et_pb_slide_content,
    body .home-banner .et_pb_slide_title,
    body .home-banner .et_pb_button_wrapper {
        text-align: left !important;
    }

    body .home-banner .et_pb_slide_content,
    body .home-banner .et_pb_slide_content h1 {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body .home-banner .et_pb_slide_title,
    body .home-banner .et_pb_slide_title a {
        margin: 0 0 14px !important;
        padding: 0 !important;
        width: auto !important;
        letter-spacing: 1px;
    }

    body .home-banner .et_pb_slide_content {
        padding: 0 !important;
        margin: 0 !important;
    }

    body .home-banner .et_pb_slide_content h1 {
        padding-bottom: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    body .home-banner .et_pb_slide_content h1:last-child {
        display: none !important;
    }

    body .home-banner .et_pb_button_wrapper {
        margin-top: 26px !important;
        padding: 0 !important;
    }

    /* arrows overlap the text on small screens; dots remain */
    body .home-banner .et-pb-slider-arrows {
        display: none !important;
    }

    /* mobile hamburger: visible on the header (opens the side drawer) */
    body .menu-left .et_mobile_nav_menu .mobile_menu_bar:before {
        color: #d3a651 !important;
        font-size: 32px !important;
    }

    /* ---------- BANNER BOTTOM ---------- */
    body .banner-bottom .et_pb_column {
        padding: 20px 15px !important;
    }

    /* ---------- ABOUT US ---------- */
    body .about-us > .et_pb_row {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
    }

    body .about-us .abt-left,
    body .about-us .abt-right {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    body .about-us .abt-left {
        padding: 50px 30px 0 30px !important;
    }

    body .about-us .abt-inner {
        width: 100% !important;
    }

    /* signature row: signature on the left, name + title on the right */
    body .about-us .abt-left .et_pb_row_nested:has(img[src*="signature"]) {
        flex-wrap: nowrap !important;
        align-items: center !important;
        column-gap: 20px !important;
        row-gap: 0 !important;
    }

    body .about-us .abt-left .et_pb_row_nested:has(img[src*="signature"]) > .et_pb_column:first-child {
        width: 165px !important;
        max-width: 165px !important;
        flex: 0 0 165px !important;
    }

    body .about-us .abt-left .et_pb_row_nested:has(img[src*="signature"]) > .et_pb_column:last-child {
        width: auto !important;
        max-width: none !important;
        flex: 1 1 auto !important;
    }

    body .about-us .abt-left .et_pb_row_nested:has(img[src*="signature"]) img {
        width: 100% !important;
        height: auto !important;
    }

    body .about-us .abt-left .et_pb_row_nested:has(img[src*="signature"]) h3 {
        font-size: 20px !important;
        line-height: 1.2em !important;
        padding-bottom: 4px !important;
    }

    body .about-us .abt-right {
        min-height: 380px;
    }

    /* photo: keep proportions, full width */
    body .about-us .abt-right .et_pb_image:not(:has(img[src*="your-rights"])) img {
        width: 100% !important;
        height: auto !important;
    }

    /* "Your Rights. Our Commitment." graphic: stay inside the photo */
    body .about-us .abt-right .et_pb_image:has(img[src*="your-rights"]) {
        top: auto !important;
        bottom: 0 !important;
        left: 0 !important;
        right: auto !important;
        width: auto !important;
        height: auto !important;
    }

    body .about-us .abt-right .et_pb_image:has(img[src*="your-rights"]) .et_pb_image_wrap {
        width: auto !important;
        height: auto !important;
    }

    body .about-us .abt-right .et_pb_image:has(img[src*="your-rights"]) img {
        width: 58vw !important;
        max-width: 250px !important;
        height: auto !important;
    }

    /* ---------- LAWYER PHOTO (centered) ---------- */
    body .et_pb_column:has(> .et_pb_image img[src*="png-img-2"]) {
        align-items: center !important;
        justify-content: center !important;
    }

    body .et_pb_image:has(img[src*="png-img-2"]) {
        margin-left: 0 !important;
        margin-right: 0 !important;
        align-self: center !important;
    }

    body .et_pb_image:has(img[src*="png-img-2"]) img {
        margin: 0 auto !important;
    }

    /* ---------- SERVICES + TESTIMONIALS ---------- */
    body .services-row {
        flex-wrap: wrap !important;
    }

    body .services-row .et_pb_column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    /* ---------- FOOTER ---------- */
    body .bbs-footer .et_pb_row {
        flex-wrap: wrap !important;
        row-gap: 30px;
    }

    body .bbs-footer .logo-col,
    body .bbs-footer .gallery {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    /* footer menus: show the links as a list instead of the hidden hamburger */
    body .bbs-footer .links .et_pb_menu__wrap,
    body .bbs-footer .practise-area .et_pb_menu__wrap {
        width: 100% !important;
        display: block !important;
    }

    body .bbs-footer .links .et_pb_menu__menu,
    body .bbs-footer .practise-area .et_pb_menu__menu {
        display: block !important;
        width: 100% !important;
        height: auto !important;
    }

    body .bbs-footer .links .et_mobile_nav_menu,
    body .bbs-footer .practise-area .et_mobile_nav_menu {
        display: none !important;
    }

    body .bbs-footer .links .et-menu-nav,
    body .bbs-footer .practise-area .et-menu-nav {
        width: 100% !important;
    }

    body .bbs-footer .links ul.et-menu,
    body .bbs-footer .practise-area ul.et-menu {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        width: 100% !important;
    }

    body .bbs-footer .links ul.et-menu li,
    body .bbs-footer .practise-area ul.et-menu li {
        width: 100% !important;
        margin: 0 !important;
    }

    /* footer headings: smaller */
    body .bbs-footer .links .et_pb_module_header,
    body .bbs-footer .practise-area .et_pb_module_header,
    body .bbs-footer .gallery .et_pb_module_header {
        font-size: 18px !important;
        line-height: 1.3em !important;
        padding-bottom: 6px !important;
    }

    body .bbs-footer .links,
    body .bbs-footer .practise-area {
        width: calc(50% - 15px) !important;
        max-width: calc(50% - 15px) !important;
        flex: 0 0 calc(50% - 15px) !important;
    }
}


/* =========================================================
   MOBILE  (max-width: 767px)
========================================================= */

@media (max-width: 767px) {

    /* ---------- HERO ---------- */
    /* sizes matched to the reference banner (375px wide) */
    body .home-banner .et_pb_slide_content h1 {
        font-size: 25px !important;
        line-height: 33px !important;
        font-weight: 600 !important;
    }

    body .home-banner .et_pb_slide_title,
    body .home-banner .et_pb_slide_title a {
        font-size: 16px !important;
        line-height: 32px !important;
        letter-spacing: 1px !important;
        font-weight: 400 !important;
        margin-bottom: 9px !important;
    }

    body .home-banner .et_pb_button_wrapper {
        margin-top: 40px !important;
    }

    html body .home-banner .et_pb_slide.et_pb_slide .et_pb_slide_description .et_pb_button_wrapper a.et_pb_button.et_pb_more_button,
    html body .home-banner .et_pb_slide.et_pb_slide .et_pb_slide_description .et_pb_button_wrapper a.et_pb_button.et_pb_more_button:hover {
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 25px !important;
        height: 45px !important;
        min-height: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    body .home-banner .et_pb_slide_description {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    /* ---------- BANNER BOTTOM ---------- */
    body .banner-bottom {
        padding-top: 30px !important;
        padding-bottom: 30px !important;
    }

    body .banner-bottom .et_pb_row {
        row-gap: 18px !important;
    }

    body .banner-bottom .et_pb_column {
        padding: 14px 15px !important;
        row-gap: 0 !important;
    }

    body .banner-bottom .et_pb_blurb,
    body .banner-bottom .et_pb_blurb_content {
        gap: 16px !important;
    }

    body .banner-bottom .et_pb_column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    /* ---------- ABOUT US ---------- */
    body .about-us .abt-left {
        padding: 40px 20px 0 20px !important;
    }

    body .about-us .abt-right {
        min-height: 300px;
    }

    /* "Call to ask any question" + phone number */
    body .about-us .call-text p {
        flex-wrap: wrap !important;
        row-gap: 2px !important;
        column-gap: 6px !important;
        align-items: baseline !important;
    }

    body .about-us .call-text p a {
        flex: 0 0 100%;
        margin-left: 0 !important;
        padding-left: 0 !important;
        font-size: 28px !important;
        line-height: 1.2em !important;
        white-space: nowrap;
    }

    /* ---------- 15px LEFT / RIGHT GUTTER ON EVERY SECTION ROW ----------
       (about-us handles its own 15px padding inside abt-left) */
    body .et-l--post .et_pb_section:not(.home-banner):not(.about-us) > .et_pb_row,
    body .bbs-footer > .et_pb_row,
    body .et-l--footer .et_pb_section > .et_pb_row,
    body .services-row,
    body .et_pb_row:has(> .et_pb_column .testimonials) {
        width: calc(100% - 30px) !important;
        max-width: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* ---------- TESTIMONIALS ---------- */
    body .testimonials {
        padding: 25px 20px !important;
    }

    body .testimonials .et_pb_group {
        row-gap: 14px !important;
    }

    body .testimonials .et_pb_row_nested {
        row-gap: 10px !important;
    }

    body .testimonials .et_pb_row_nested .et_pb_column {
        row-gap: 0 !important;
    }

    /* ---------- OUR PORTFOLIO: tighter section spacing ---------- */
    body .our-team {
        margin-bottom: 0 !important;
    }

    body .our-portfolio {
        padding-top: 40px !important;
        row-gap: 28px !important;
    }

    /* ---------- OUR PORTFOLIO CARDS: space under description ---------- */
    body .our-portfolio .grid-item-inner .desciption-text,
    body .our-portfolio .grid-item-inner:hover .desciption-text {
        padding-bottom: 28px !important;
        transform: none !important;
    }

    body .our-portfolio .grid-item-inner .title-text,
    body .our-portfolio .grid-item-inner:hover .title-text {
        transform: translateY(-98px) !important;
    }

    /* ---------- CONTACT: address / phone / email spacing ---------- */
    body .contact-form .et_pb_row:has(> .et_pb_column > .et_pb_blurb),
    body .contact-form .et_pb_column:has(> .et_pb_blurb) {
        row-gap: 14px !important;
    }

    body .contact-form .et_pb_blurb {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    /* ---------- CONTACT FORM: each field on its own line ---------- */
    body .contact-form .et_pb_contact_form {
        display: block !important;
    }

    body .contact-form .et_pb_contact_field {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        margin: 0 0 30px 0 !important;
        padding: 0 !important;
        flex: 0 0 100% !important;
    }

    /* contact section rows: 15px from each screen edge */
    body .contact-form.et_pb_section > .et_pb_row {
        width: calc(100% - 30px) !important;
        max-width: none !important;
    }

    body .contact-form .et_pb_contact_field input,
    body .contact-form .et_pb_contact_field textarea {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* ---------- HEADINGS ---------- */
    body .white-title h2,
    body .center-title h2 {
        font-size: 26px !important;
        line-height: 1.25em !important;
    }

    /* ---------- OUR TEAM ---------- */
    body .our-team .et_pb_column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    /* ---------- OUR PORTFOLIO ---------- */
    body .our-portfolio .grid-item-inner {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    /* ---------- FOOTER ---------- */
    body .bbs-footer .links,
    body .bbs-footer .practise-area {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    body .bbs-footer .gallery .et_pb_gallery_items {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 8px !important;
    }

    body .bbs-footer .gallery .et_pb_gallery_item {
        width: 100% !important;
        margin: 0 !important;
        height: auto !important;
    }
}


/* =========================================================
   SMALL MOBILE  (max-width: 479px)
========================================================= */

@media (max-width: 479px) {

    body .about-us .abt-left {
        padding: 30px 15px 0 15px !important;
    }
}


/* =========================================================
   SERVICE INNER PAGE  (banner from About page + sidebar / content)
   Classes: service-detail, svc-sidebar, svc-main, svc-menu,
   svc-side-title, svc-contact, svc-ci-*, svc-hero, svc-title,
   svc-subtitle, svc-intro, svc-check, svc-approach, svc-why,
   svc-cta-title, svc-btn
========================================================= */

body .service-detail {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

body .service-detail > .et_pb_row {
    align-items: flex-start !important;
    column-gap: 45px !important;
    max-width: 1460px !important; /* same row width as the other pages */
}

/* ---------- sidebar ---------- */
body .service-detail .svc-sidebar {
    row-gap: 18px !important;
}

body .service-detail .svc-side-title {
    position: relative;
    padding-bottom: 14px !important;
    margin-top: 12px !important;
}

body .service-detail .svc-side-title:first-child {
    margin-top: 0 !important;
}

body .service-detail .svc-side-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 3px;
    background: var(--gcid-secondary-color, #d3a651);
}

/* services list (Divi Menu module shown as a vertical list) */
body .service-detail .svc-menu {
    background: transparent !important;
    padding: 0 !important;
}

body .service-detail .svc-menu .et_pb_menu__wrap,
body .service-detail .svc-menu .et_pb_menu__menu,
body .service-detail .svc-menu .et-menu-nav {
    display: block !important;
    width: 100% !important;
}

body .service-detail .svc-menu .et_mobile_nav_menu {
    display: none !important;
}

body .service-detail .svc-menu ul.et-menu {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    gap: 8px;
}

body .service-detail .svc-menu ul.et-menu > li {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(0, 0, 0, .1);
    background: #fff;
    transition: background .25s ease, border-color .25s ease;
}

body .service-detail .svc-menu ul.et-menu > li > a {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px !important;
    font-weight: 600;
    transition: color .25s ease, padding-left .25s ease;
}

body .service-detail .svc-menu ul.et-menu > li > a::after {
    content: "";
    width: 7px;
    height: 7px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
    flex: 0 0 auto;
}

body .service-detail .svc-menu ul.et-menu > li:hover,
body .service-detail .svc-menu ul.et-menu > li.current-menu-item {
    background: linear-gradient(90deg, #d3a651, #b98a3a);
    border-color: transparent;
}

body .service-detail .svc-menu ul.et-menu > li:hover > a,
body .service-detail .svc-menu ul.et-menu > li.current-menu-item > a {
    color: #fff !important;
}

/* contact items with icons */
body .service-detail .svc-contact {
    position: relative;
    padding-left: 42px !important;
    min-height: 32px;
}

body .service-detail .svc-contact::before {
    content: "";
    position: absolute;
    left: 0;
    top: 2px;
    width: 26px;
    height: 26px;
    background-color: var(--gcid-secondary-color, #d3a651);
    -webkit-mask: center / contain no-repeat;
    mask: center / contain no-repeat;
}

body .service-detail .svc-ci-address::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/></svg>");
}

body .service-detail .svc-ci-phone::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.6 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.6 3.6a1 1 0 0 1-.25 1z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.6 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.6 3.6a1 1 0 0 1-.25 1z'/></svg>");
}

body .service-detail .svc-ci-email::before {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5-8-5V6l8 5 8-5z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5-8-5V6l8 5 8-5z'/></svg>");
}

/* ---------- main content ---------- */
body .service-detail .svc-main {
    row-gap: 18px !important;
}

body .service-detail .svc-hero,
body .service-detail .svc-hero img {
    width: 100% !important;
}

body .service-detail .svc-hero img {
    display: block;
    height: auto !important;
    max-height: 420px;
    object-fit: cover;
}

body .service-detail .svc-check ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 30px;
}

body .service-detail .svc-check li {
    position: relative;
    padding-left: 30px !important;
    margin: 0 !important;
}

body .service-detail .svc-check li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: .35em;
    width: 12px;
    height: 7px;
    border-left: 2px solid var(--gcid-secondary-color, #d3a651);
    border-bottom: 2px solid var(--gcid-secondary-color, #d3a651);
    transform: rotate(-45deg);
}

body .service-detail .svc-why {
    padding: 18px 22px !important;
    border-left: 3px solid var(--gcid-secondary-color, #d3a651);
    background: rgba(0, 0, 0, .03);
}

body .service-detail .svc-cta-title {
    margin-top: 12px !important;
}

/* ---------- tablet / mobile ---------- */
@media (max-width: 980px) {

    body .service-detail {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }

    body .service-detail > .et_pb_row {
        flex-wrap: wrap !important;
        row-gap: 40px !important;
    }

    body .service-detail .svc-main    { order: 1; }
    body .service-detail .svc-sidebar { order: 2; }

    body .service-detail .svc-sidebar,
    body .service-detail .svc-main {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}

@media (max-width: 767px) {

    body .service-detail .svc-check ul {
        grid-template-columns: 1fr;
    }

    body .service-detail .svc-hero img {
        max-height: 260px;
    }
}

/* ---------- "Our Approach" blocks: icons ---------- */
body .service-detail .svc-why .et_pb_main_blurb_image {
    margin-right: 18px !important;
    flex: 0 0 auto;
}

body .service-detail .svc-why .et_pb_main_blurb_image .et-pb-icon {
    font-size: 34px !important;
    line-height: 1 !important;
    color: var(--gcid-secondary-color, #d3a651) !important;
}

/* "Our Approach" blocks: content starts at the left edge, full width */
body .service-detail .svc-why .et_pb_blurb_content {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* ---------- sidebar "Book a Consultation" box ---------- */
body .service-detail .svc-book-box {
    background: var(--gcid-primary-color, #0f261f) !important;
    padding: 32px 28px !important;
    row-gap: 16px !important;
    margin-top: 12px;
}

body .service-detail .svc-book-box .svc-side-title {
    margin-top: 0 !important;
}

body .service-detail .svc-book-box .svc-side-title .et_pb_module_header,
body .service-detail .svc-book-box .svc-side-text,
body .service-detail .svc-book-box .svc-side-text p {
    color: #fff !important;
}

/* services list: link fills the row so the arrow sits on the right edge */
body .service-detail .svc-menu ul.et-menu > li > a {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* footer LINKS menu: no dropdown under Services */
body .bbs-footer .links .sub-menu,
body .bbs-footer .links ul.et-menu li ul {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}


/* =========================================================
   ABOUT US + SERVICE PAGES  -  RESPONSIVE
   (shared inner banner, about sections, values, CTA)
========================================================= */

/* ---------- tablet + mobile ---------- */
@media (max-width: 980px) {

    /* inner banner (About + service pages) */
    body .inner-banner {
        padding-top: 170px !important;
        padding-bottom: 90px !important;
    }

    body .inner-banner > .et_pb_row .et_pb_column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    /* about: text section */
    body .about-page-abt {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    body .about-page-abt > .et_pb_row {
        flex-wrap: wrap !important;
    }

    body .about-page-abt > .et_pb_row > .et_pb_column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    /* about: "Our Focus" cards (section right after about-page-abt) */
    body .about-page-abt + .et_pb_section > .et_pb_row > .et_pb_column {
        padding: 30px 24px !important;
    }

    /* about: our values / CTA */
    body .our-values {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    body .our-values + .et_pb_section {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }
}

/* ---------- tablet only: keep a comfortable side margin ---------- */
@media (min-width: 768px) and (max-width: 980px) {

    body .inner-banner > .et_pb_row,
    body .service-detail > .et_pb_row,
    body .about-page-abt > .et_pb_row,
    body .our-values > .et_pb_row,
    body .our-values + .et_pb_section > .et_pb_row,
    body .about-page-abt + .et_pb_section > .et_pb_row {
        width: calc(100% - 60px) !important;
        max-width: none !important;
    }
}

/* ---------- mobile ---------- */
@media (max-width: 767px) {

    body .inner-banner {
        padding-top: 130px !important;
        padding-bottom: 60px !important;
    }

    body .inner-banner h1,
    body .inner-banner .et_pb_module_header {
        font-size: 30px !important;
        line-height: 1.2em !important;
    }

    /* "Our Focus" cards: stack, even padding */
    body .about-page-abt + .et_pb_section > .et_pb_row {
        flex-wrap: wrap !important;
        row-gap: 0 !important;
    }

    body .about-page-abt + .et_pb_section > .et_pb_row > .et_pb_column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding: 30px 20px !important;
    }

    /* values: one card per line */
    body .our-values > .et_pb_row {
        flex-wrap: wrap !important;
        row-gap: 16px !important;
    }

    body .our-values > .et_pb_row > .et_pb_column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    /* CTA: text then button, stacked */
    body .our-values + .et_pb_section > .et_pb_row {
        flex-wrap: wrap !important;
        row-gap: 20px !important;
    }

    body .our-values + .et_pb_section > .et_pb_row > .et_pb_column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}

/* ---------- ABOUT: lawyer photo stays visible on tablet + mobile ---------- */
@media (max-width: 980px) {

    body .about-page-abt > .et_pb_row > .et_pb_column:last-child {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-top: 30px !important;
        margin-left: 0 !important;
    }

    body .about-page-abt > .et_pb_row > .et_pb_column:last-child .et_pb_image,
    body .about-page-abt > .et_pb_row > .et_pb_column:last-child .et_pb_image_wrap {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body .about-page-abt > .et_pb_row > .et_pb_column:last-child img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
    }
}

/* ---------- ABOUT: our values - icons overhang the card top, leave room ---------- */
@media (max-width: 767px) {

    body .our-values > .et_pb_row + .et_pb_row {
        row-gap: 60px !important;
        margin-top: 45px !important;
    }
}

/* photo column is a background image: give it a height when stacked */
@media (max-width: 980px) {
    body .about-page-abt > .et_pb_row > .et_pb_column:last-child {
        min-height: 560px !important;
        background-size: cover !important;
        background-position: center top !important;
    }
}

@media (max-width: 767px) {
    body .about-page-abt > .et_pb_row > .et_pb_column:last-child {
        min-height: 420px !important;
    }
}

/* ABOUT "Our Focus" cards: description text uses the full card width */
@media (max-width: 980px) {
    body .about-page-abt + .et_pb_section .et_pb_column .et_pb_text,
    body .about-page-abt + .et_pb_section .et_pb_column .et_pb_text .et_pb_text_inner {
        width: 100% !important;
        max-width: 100% !important;
    }
}


/* =========================================================
   CONTACT PAGE  (banner from About page + info | standalone form)
   Classes: contact-page, cp-info, cp-title, cp-intro, cp-item,
   cp-form-col, cp-form-title, cp-form
========================================================= */

body .contact-page {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

body .contact-page > .et_pb_row {
    align-items: flex-start !important;
    column-gap: 60px !important;
    max-width: 1460px !important;
}

/* ---------- left: info ---------- */
body .contact-page .cp-info {
    row-gap: 20px !important;
}

body .contact-page .cp-item {
    padding: 18px 22px !important;
    border-left: 3px solid var(--gcid-secondary-color, #d3a651);
    background: rgba(0, 0, 0, .03);
}

body .contact-page .cp-item .et_pb_blurb_content {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

body .contact-page .cp-item .et_pb_main_blurb_image {
    margin-right: 18px !important;
    flex: 0 0 auto;
}

body .contact-page .cp-item .et_pb_main_blurb_image .et-pb-icon {
    font-size: 30px !important;
    line-height: 1 !important;
    color: var(--gcid-secondary-color, #d3a651) !important;
}

/* ---------- right: standalone form card ---------- */
body .contact-page .cp-form-col {
    padding: 40px !important;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0 10px 35px rgba(0, 0, 0, .08);
    row-gap: 20px !important;
}

body .contact-page .cp-form .et_pb_contact_field {
    margin-bottom: 18px !important;
}

body .contact-page .cp-form input:not([type="submit"]),
body .contact-page .cp-form textarea {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 12px 18px !important;
    border: 1px solid rgba(0, 0, 0, .12) !important;
    background: #f6f6f6 !important;
    color: #333 !important;
    border-radius: 0 !important;
}

body .contact-page .cp-form textarea {
    min-height: 140px;
}

body .contact-page .cp-form input:focus,
body .contact-page .cp-form textarea:focus {
    border-color: var(--gcid-secondary-color, #d3a651) !important;
    outline: none;
}

/* ---------- tablet / mobile ---------- */
@media (max-width: 980px) {

    body .contact-page {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }

    body .contact-page > .et_pb_row {
        flex-wrap: wrap !important;
        row-gap: 40px !important;
    }

    body .contact-page .cp-info,
    body .contact-page .cp-form-col {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}

@media (min-width: 768px) and (max-width: 980px) {

    body .contact-page > .et_pb_row {
        width: calc(100% - 60px) !important;
        max-width: none !important;
    }
}

@media (max-width: 767px) {

    body .contact-page .cp-form-col {
        padding: 24px 18px !important;
    }
}

/* ---------- CONTACT: map section (own section under the form) ---------- */
body .contact-map-section {
    padding: 0 !important;
}

body .contact-map-section > .et_pb_row {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
}

body .contact-map-section .cp-map,
body .contact-map-section .cp-map .et_pb_map {
    width: 100% !important;
    height: 460px !important;
}

@media (max-width: 767px) {
    body .contact-map-section .cp-map,
    body .contact-map-section .cp-map .et_pb_map {
        height: 320px !important;
    }
}

body .contact-map-section .cp-map .et_pb_map_pin {
    display: none !important;
}

body .contact-map-section .cp-map .et_pb_map {
    flex-shrink: 0;
}

/* contact map: Google Maps embed (iframe) */
body .contact-map-section .cp-map,
body .contact-map-section .cp-map .et_code_snippet_wrapper,
body .contact-map-section .cp-map .et_pb_code_inner {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

body .contact-map-section .cp-map iframe {
    display: block;
    width: 100% !important;
    height: 460px !important;
    border: 0 !important;
}

@media (max-width: 767px) {
    body .contact-map-section .cp-map iframe {
        height: 320px !important;
    }
}

/* ---------- CONTACT: phone refinements ---------- */
@media (max-width: 767px) {

    body .contact-page .cp-title .et_pb_module_header,
    body .contact-page .cp-form-title .et_pb_module_header {
        line-height: 1.25em !important;
    }

    body .contact-page .cp-info {
        row-gap: 14px !important;
    }

    body .contact-page .cp-item {
        padding: 14px 16px !important;
    }

    body .contact-page .cp-item .et_pb_main_blurb_image {
        margin-right: 14px !important;
    }

    body .contact-page .cp-item .et_pb_main_blurb_image .et-pb-icon {
        font-size: 26px !important;
    }

    /* submit: full width, easy to tap */
    body .contact-page .cp-form .et_contact_bottom_container {
        width: 100% !important;
        float: none !important;
        margin: 0 !important;
        display: block !important;
    }

    body .contact-page .cp-form .et_pb_contact_submit {
        display: block !important;
        width: 100% !important;
        height: 48px !important;
        margin: 0 !important;
        text-align: center;
    }
}

/* ---------- CONTACT: tablet refinements ---------- */
@media (min-width: 768px) and (max-width: 980px) {

    body .contact-page .cp-form-col {
        padding: 32px !important;
    }

    body .contact-map-section .cp-map iframe {
        height: 400px !important;
    }
}


/* =========================================================
   SERVICES PAGE  -  RESPONSIVE
   (section class "services", rows "services-row", CTA = next section)
========================================================= */

/* ---------- tablet: 6 cards in a 2-column grid ---------- */
@media (min-width: 768px) and (max-width: 980px) {

    body .et_pb_section.services {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        column-gap: 24px;
        row-gap: 24px;
        padding-left: 30px !important;
        padding-right: 30px !important;
        align-items: stretch;
    }

    body .et_pb_section.services > .et_pb_row:not(.services-row) {
        grid-column: 1 / -1;
        width: 100% !important;
        max-width: none !important;
    }

    /* the two card rows dissolve so all six cards share one grid */
    body .et_pb_section.services > .services-row {
        display: contents !important;
    }

    body .et_pb_section.services > .services-row > .et_pb_column {
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        flex: none !important;
    }

    /* CTA under the cards: same 30px side margin as other pages */
    body .et_pb_section.services + .et_pb_section > .et_pb_row {
        width: calc(100% - 60px) !important;
        max-width: none !important;
    }
}

/* ---------- mobile: tighter gaps between cards ---------- */
@media (max-width: 767px) {

    body .et_pb_section.services {
        row-gap: 24px !important;
    }

    body .et_pb_section.services > .services-row {
        row-gap: 20px !important;
    }

    body .et_pb_section.services + .et_pb_section {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }
}


/* =========================================================
   INNER BANNER  -  desktop height (About, Services, service pages, Contact)
   tablet / mobile keep their own smaller values above
========================================================= */
@media (min-width: 981px) {
    body .inner-banner {
        padding-top: 240px !important;
        padding-bottom: 170px !important;
    }
}

/* contact details: phone + email links keep the text look, gold on hover */
body .contact-page .cp-item a,
body .service-detail .svc-contact a {
    color: inherit !important;
    text-decoration: none;
    transition: color .25s ease;
}

body .contact-page .cp-item a:hover,
body .service-detail .svc-contact a:hover {
    color: var(--gcid-secondary-color, #d3a651) !important;
}


/* =========================================================
   BUTTON HOVER FIXES
========================================================= */

/* contact form submit: same hover as the other site buttons (dark green, white text) */
body .contact-page .cp-form .et_pb_contact_submit:hover,
body .contact-page .cp-form .et_pb_contact_submit:focus {
    background-color: var(--gcid-primary-color, #022414) !important;
    color: #fff !important;
    border-color: transparent !important;
}

/* button inside the dark "Book a Consultation" box: hover turns light so it never blends in */
body .service-detail .svc-book-box .et_pb_button:hover,
body .service-detail .svc-book-box .et_pb_button:focus {
    background-color: #fff !important;
    color: var(--gcid-primary-color, #022414) !important;
}

/* "Book a Consultation" box: more room between the text and the button */
body .service-detail .svc-book-box .et_pb_button_module_wrapper {
    margin-top: 12px !important;
}


/* =========================================================
   BUTTON HOVER EFFECT  (smooth colour change + lift + shadow)
========================================================= */

body .service-detail .svc-book-box .et_pb_button,
body .service-detail .svc-btn .et_pb_button,
body .contact-page .cp-form .et_pb_contact_submit {
    transition: background-color .3s ease, color .3s ease, transform .3s ease, box-shadow .3s ease !important;
}

/* Book a Consultation box: white button, dark text, lifts up */
body .service-detail .svc-book-box .et_pb_button:hover,
body .service-detail .svc-book-box .et_pb_button:focus {
    background-color: #fff !important;
    color: var(--gcid-primary-color, #022414) !important;
    transform: translateY(-3px);
    box-shadow: 0 10px 22px rgba(0, 0, 0, .35);
}

/* other page buttons: dark green, lifts up */
body .service-detail .svc-btn .et_pb_button:hover,
body .contact-page .cp-form .et_pb_contact_submit:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 22px rgba(2, 36, 20, .28);
}

/* no motion for people who ask for reduced motion */
@media (prefers-reduced-motion: reduce) {
    body .service-detail .svc-book-box .et_pb_button:hover,
    body .service-detail .svc-btn .et_pb_button:hover,
    body .contact-page .cp-form .et_pb_contact_submit:hover {
        transform: none;
    }
}

/* footer LINKS menu: no dropdown caret next to "Services" */
body .bbs-footer .links ul.et-menu li.menu-item-has-children > a::after,
body .bbs-footer .links ul.et-menu li > a::after {
    display: none !important;
    content: none !important;
}


/* =========================================================
   HEADER SERVICES DROPDOWN  -  redesigned
   (menu inside .main-menu > .menu-left; desktop dropdown only)
========================================================= */

body .main-menu .menu-left ul.et-menu ul.sub-menu {
    min-width: 270px !important;
    width: 270px !important;
    padding: 10px 0 !important;
    background: linear-gradient(160deg, #04301c 0%, #022414 60%, #011a0e 100%) !important;
    border-top: 3px solid var(--gcid-secondary-color, #d3a651) !important;
    border-radius: 0 0 8px 8px !important;
    box-shadow: 0 22px 50px rgba(0, 0, 0, .35), 0 2px 0 rgba(255, 255, 255, .03) inset !important;
    transform: translateY(14px);
    transition: opacity .3s ease, visibility .3s ease, transform .3s ease !important;
}

/* open state (hover on desktop, tap on touch) */
body .main-menu .menu-left ul.et-menu li:hover > ul.sub-menu,
body .main-menu .menu-left ul.et-menu li.et-hover > ul.sub-menu {
    transform: translateY(0);
}

/* small pointer above the dropdown */
body .main-menu .menu-left ul.et-menu ul.sub-menu::before {
    content: "" !important;
    position: absolute;
    top: -9px;
    left: 34px;
    width: 14px;
    height: 14px;
    background: var(--gcid-secondary-color, #d3a651);
    transform: rotate(45deg);
    border-radius: 2px;
    z-index: -1;
}

/* items */
body .main-menu .menu-left ul.et-menu ul.sub-menu li {
    width: 100% !important;
    border-bottom: 1px solid rgba(255, 255, 255, .07);
}

body .main-menu .menu-left ul.et-menu ul.sub-menu li:last-child {
    border-bottom: 0;
}

body .main-menu .menu-left ul.et-menu ul.sub-menu li a {
    position: relative;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    width: 100% !important;
    padding: 14px 24px 14px 28px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    letter-spacing: .01em;
    color: rgba(255, 255, 255, .92) !important;
    background: transparent !important;
    transition: color .25s ease, background-color .25s ease, padding-left .25s ease !important;
}

/* gold bar on the left */
body .main-menu .menu-left ul.et-menu ul.sub-menu li a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--gcid-secondary-color, #d3a651);
    transform: scaleY(0);
    transform-origin: center;
    transition: transform .25s ease;
}

/* small arrow on the right */
body .main-menu .menu-left ul.et-menu ul.sub-menu li a::after {
    content: "";
    width: 7px;
    height: 7px;
    border-top: 2px solid var(--gcid-secondary-color, #d3a651);
    border-right: 2px solid var(--gcid-secondary-color, #d3a651);
    transform: rotate(45deg) translateX(-6px);
    opacity: 0;
    transition: opacity .25s ease, transform .25s ease;
}

/* hover + current page */
body .main-menu .menu-left ul.et-menu ul.sub-menu li a:hover,
body .main-menu .menu-left ul.et-menu ul.sub-menu li.current-menu-item > a {
    color: var(--gcid-secondary-color, #d3a651) !important;
    background: rgba(211, 166, 81, .12) !important;
    padding-left: 34px !important;
}

body .main-menu .menu-left ul.et-menu ul.sub-menu li a:hover::before,
body .main-menu .menu-left ul.et-menu ul.sub-menu li.current-menu-item > a::before {
    transform: scaleY(1);
}

body .main-menu .menu-left ul.et-menu ul.sub-menu li a:hover::after,
body .main-menu .menu-left ul.et-menu ul.sub-menu li.current-menu-item > a::after {
    opacity: 1;
    transform: rotate(45deg) translateX(0);
}

@media (prefers-reduced-motion: reduce) {
    body .main-menu .menu-left ul.et-menu ul.sub-menu,
    body .main-menu .menu-left ul.et-menu ul.sub-menu li a,
    body .main-menu .menu-left ul.et-menu ul.sub-menu li a::before,
    body .main-menu .menu-left ul.et-menu ul.sub-menu li a::after {
        transition: none !important;
        transform: none;
    }
}


/* sidebar headings: same tapered gold divider as the homepage (.h-gap) */
body .service-detail .svc-side-title::after {
    width: 47px;
    height: 4px;
    background-color: transparent;
    background-image:
        linear-gradient(#d5aa6d, #d5aa6d),
        linear-gradient(#d5aa6d, #d5aa6d),
        linear-gradient(#d5aa6d, #d5aa6d),
        linear-gradient(#d5aa6d, #d5aa6d);
    background-repeat: no-repeat;
    background-position: center 0, center 1px, center 2px, center 3px;
    background-size: 47px 1px, 45px 1px, 43px 1px, 41px 1px;
}


/* =========================================================
   HOMEPAGE-STYLE DIVIDER (CSS only) under inner-page headings
   4 gold lines: 47 / 45 / 43 / 41 px  (same shape as .h-gap)
========================================================= */
body .service-detail .svc-title,
body .service-detail .svc-subtitle,
body .service-detail .svc-cta-title,
body .contact-page .cp-title,
body .contact-page .cp-form-title {
    position: relative;
    padding-bottom: 16px !important;
}

body .service-detail .svc-title::after,
body .service-detail .svc-subtitle::after,
body .service-detail .svc-cta-title::after,
body .contact-page .cp-title::after,
body .contact-page .cp-form-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 47px;
    height: 4px;
    background-color: transparent;
    background-image:
        linear-gradient(#d5aa6d, #d5aa6d),
        linear-gradient(#d5aa6d, #d5aa6d),
        linear-gradient(#d5aa6d, #d5aa6d),
        linear-gradient(#d5aa6d, #d5aa6d);
    background-repeat: no-repeat;
    background-position: center 0, center 1px, center 2px, center 3px;
    background-size: 47px 1px, 45px 1px, 43px 1px, 41px 1px;
}


/* =========================================================
   SEARCH RESULTS PAGE  (search.php)
   Classes: sr-page, sr-banner, sr-body, sr-wrap, sr-form,
   sr-count, sr-list, sr-card*, sr-empty, sr-suggest
========================================================= */

/* ---------- banner (padding comes from the shared .inner-banner rules) ---------- */
body .sr-banner {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

body .sr-banner::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(2, 36, 20, .72) 0%, rgba(2, 36, 20, .25) 70%, rgba(2, 36, 20, 0) 100%);
}

body .sr-banner-inner {
    position: relative;
    width: 80%;
    max-width: 1460px;
    margin: 0 auto;
}

body .sr-banner h1,
body .sr-banner p {
    color: #fff !important;
    margin: 0;
}

body .sr-banner p {
    margin-top: 10px;
}

/* ---------- results ---------- */
body .sr-body {
    padding: 80px 0;
}

body .sr-wrap {
    width: 80%;
    max-width: 1460px;
    margin: 0 auto;
}

/* search again */
body .sr-form {
    display: flex;
    gap: 0;
    max-width: 720px;
    margin-bottom: 40px;
    box-shadow: 0 8px 28px rgba(0, 0, 0, .08);
}

body .sr-form input[type="search"] {
    flex: 1 1 auto;
    min-width: 0;
    padding: 15px 22px !important;
    border: 1px solid rgba(0, 0, 0, .12) !important;
    border-right: 0 !important;
    background: #fff !important;
    border-radius: 0 !important;
    outline: none;
}

body .sr-form input[type="search"]:focus {
    border-color: var(--gcid-secondary-color, #d3a651) !important;
}

body .sr-form button {
    flex: 0 0 auto;
    padding: 0 32px;
    border: 0;
    background: var(--gcid-secondary-color, #d3a651);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .3s ease;
}

body .sr-form button:hover {
    background: var(--gcid-primary-color, #022414);
}

body .sr-count {
    margin: 0 0 24px !important;
}

/* result cards */
body .sr-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px;
}

body .sr-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 32px 34px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .08);
    border-left: 3px solid var(--gcid-secondary-color, #d3a651);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .06);
    transition: transform .3s ease, box-shadow .3s ease;
}

body .sr-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, .12);
}

body .sr-card-label {
    font-size: 12px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--gcid-secondary-color, #d3a651);
}

body .sr-card-title {
    position: relative;
    margin: 0 !important;
    padding-bottom: 16px !important;
}

body .sr-card-title a {
    color: inherit;
    text-decoration: none;
    transition: color .25s ease;
}

body .sr-card-title a:hover {
    color: var(--gcid-secondary-color, #d3a651);
}

/* same tapered gold divider as the homepage (CSS only) */
body .sr-card-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 47px;
    height: 4px;
    background-image:
        linear-gradient(#d5aa6d, #d5aa6d),
        linear-gradient(#d5aa6d, #d5aa6d),
        linear-gradient(#d5aa6d, #d5aa6d),
        linear-gradient(#d5aa6d, #d5aa6d);
    background-repeat: no-repeat;
    background-position: center 0, center 1px, center 2px, center 3px;
    background-size: 47px 1px, 45px 1px, 43px 1px, 41px 1px;
}

body .sr-card-text {
    margin: 0 !important;
    flex: 1 1 auto;
}

body .sr-card-link {
    position: relative;
    padding-right: 26px;
    font-weight: 600;
    color: var(--gcid-secondary-color, #d3a651);
    text-decoration: none;
    transition: color .25s ease, padding-right .25s ease;
}

body .sr-card-link::after {
    content: "";
    position: absolute;
    right: 4px;
    top: 50%;
    width: 7px;
    height: 7px;
    margin-top: -4px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
    transition: right .25s ease;
}

body .sr-card-link:hover {
    color: var(--gcid-primary-color, #022414);
    padding-right: 32px;
}

body .sr-card-link:hover::after {
    right: 0;
}

/* pagination */
body .sr-wrap .navigation.pagination {
    margin-top: 50px;
}

body .sr-wrap .nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

body .sr-wrap .page-numbers {
    min-width: 44px;
    height: 44px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(0, 0, 0, .12);
    text-decoration: none;
    transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

body .sr-wrap a.page-numbers:hover,
body .sr-wrap .page-numbers.current {
    background: var(--gcid-secondary-color, #d3a651);
    border-color: var(--gcid-secondary-color, #d3a651);
    color: #fff;
}

/* no results */
body .sr-empty {
    max-width: 720px;
}

body .sr-suggest {
    list-style: none;
    margin: 20px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

body .sr-suggest a {
    display: inline-block;
    padding: 10px 18px;
    border: 1px solid rgba(0, 0, 0, .12);
    text-decoration: none;
    transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

body .sr-suggest a:hover {
    background: var(--gcid-secondary-color, #d3a651);
    border-color: var(--gcid-secondary-color, #d3a651);
    color: #fff;
}

/* ---------- tablet ---------- */
@media (max-width: 980px) {
    body .sr-body { padding: 50px 0; }
    body .sr-list { grid-template-columns: 1fr; }
}

@media (min-width: 768px) and (max-width: 980px) {
    body .sr-wrap,
    body .sr-banner-inner {
        width: calc(100% - 60px);
        max-width: none;
    }
}

/* ---------- phone ---------- */
@media (max-width: 767px) {
    body .sr-wrap,
    body .sr-banner-inner {
        width: calc(100% - 30px);
        max-width: none;
    }

    body .sr-form { margin-bottom: 30px; }
    body .sr-form button { padding: 0 20px; }
    body .sr-card { padding: 24px 20px; }
}

@media (prefers-reduced-motion: reduce) {
    body .sr-card,
    body .sr-card:hover { transition: none; transform: none; }
}


/* footer links (LINKS + PRACTICE AREAS): Muli instead of Poppins */
body .bbs-footer .links ul.et-menu li a,
body .bbs-footer .practise-area ul.et-menu li a {
    font-family: "Muli", sans-serif !important;
}

/* (stronger selector so it beats the footer menu rule) */
body .et-l--footer .bbs-footer .links ul.et-menu.nav.downwards > li > a,
body .et-l--footer .bbs-footer .practise-area ul.et-menu.nav.downwards > li > a {
    font-family: "Muli", sans-serif !important;
}


/* =========================================================
   HEADER  -  full width bar on phones (no left offset)
========================================================= */
@media (max-width: 767px) {

    body .main-menu .menu-right {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body .main-menu .menu-left {
        width: 100% !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    body .main-menu .menu-left .et_pb_menu__logo-wrap {
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
}

/* header bar touches the top edge on phones */
@media (max-width: 767px) {

    body .main-menu {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    body .main-menu .menu-right,
    body .main-menu .menu-left {
        min-height: 80px;
    }
}

/* phones: header sits at the very top (desktop keeps its 30px gap) */
@media (max-width: 767px) {
    body .et-l--header {
        top: 0 !important;
    }
}

/* phones: logo + menu button vertically centred in the 80px bar */
@media (max-width: 767px) {
    body .main-menu .menu-left .et_pb_menu,
    body .main-menu .menu-left .et_pb_menu_inner_container {
        min-height: 80px;
        align-items: center !important;
    }

    body .main-menu .menu-left .et_pb_menu__logo-wrap,
    body .main-menu .menu-left .et_pb_menu__wrap {
        align-self: center;
    }
}


/* =========================================================
   TESTIMONIALS (phones): letter circle + name on one line, smaller circle
========================================================= */
@media (max-width: 767px) {

    body .testimonials .author {
        flex-wrap: nowrap !important;
        align-items: center !important;
        column-gap: 14px !important;
        row-gap: 0 !important;
    }

    body .testimonials .author > .et_pb_column {
        width: auto !important;
        max-width: none !important;
        min-height: 0 !important;
    }

    body .testimonials .author > .et_pb_column:first-child {
        flex: 0 0 auto !important;
    }

    body .testimonials .author > .et_pb_column:last-child {
        flex: 1 1 auto !important;
        min-width: 0;
    }

    /* the circle */
    body .testimonials .author .et_pb_heading {
        width: 52px !important;
        height: 52px !important;
        min-width: 52px !important;
        justify-content: center;
        align-items: center;
    }

    body .testimonials .author .et_pb_heading .et_pb_module_header {
        font-size: 20px !important;
        line-height: 1 !important;
        padding: 0 !important;
        text-align: center;
    }
}


/* homepage number counters (05+, 532+ ...): smaller gap between the stacked boxes on phones */
@media (max-width: 767px) {
    body .et_pb_row:has(> .et_pb_column .et_pb_number_counter) {
        row-gap: 16px !important;
    }
}


/* homepage contact (phones): more space between the heading and the address line */
@media (max-width: 767px) {
    body .contact-form .et_pb_row:has(> .et_pb_column > .et_pb_blurb) > .et_pb_column:first-child > .et_pb_blurb:first-child {
        margin-top: 26px !important;
    }
}

/* (corrected target: the address sits in the row's 2nd column) */
@media (max-width: 767px) {
    body .contact-form .et_pb_row:has(> .et_pb_column > .et_pb_blurb) > .et_pb_column:nth-child(2) {
        margin-top: 26px !important;
    }
}


/* ABOUT "Our Values" (phones): less space between the heading divider and the first card icon */
@media (max-width: 767px) {
    body .our-values {
        row-gap: 30px !important;
    }

    body .our-values > .et_pb_row + .et_pb_row {
        margin-top: 25px !important;
    }
}


/* =========================================================
   INNER BANNERS  -  no gap under the title (About, Services, service pages, Contact)
========================================================= */
body .inner-banner .et_pb_heading {
    margin-bottom: 0 !important;
}

body .inner-banner .et_pb_heading .et_pb_module_header {
    padding-bottom: 6px !important;
}


/* footer contact lines (phone, email, address): same colour as the footer links (#a9aaa7) */
body .bbs-footer .logo-col .et_pb_blurb .et_pb_blurb_description,
body .bbs-footer .logo-col .et_pb_blurb .et_pb_blurb_description p,
body .bbs-footer .logo-col .et_pb_blurb .et_pb_blurb_description a {
    color: #a9aaa7 !important;
}

/* =====================================================================
   HOME "Our Portfolio" cards: no overlap, description on hover (desktop)
   image fills the card; title + description flow together at the bottom
   ===================================================================== */
body .our-portfolio .grid-item-inner.bbs-pf-card,
body .our-portfolio .et_pb_column.grid-item-inner {
    position: relative !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    aspect-ratio: 414 / 450;
}
body .our-portfolio .grid-item-inner > .et_pb_image {
    position: absolute !important;
    top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
}
body .our-portfolio .grid-item-inner > .et_pb_image .et_pb_image_wrap,
body .our-portfolio .grid-item-inner > .et_pb_image img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
body .our-portfolio .grid-item-inner .title-text,
body .our-portfolio .grid-item-inner:hover .title-text {
    position: relative !important;
    left: auto !important; right: auto !important; bottom: auto !important;
    transform: none !important;
    z-index: 2 !important;
    flex: 0 0 auto !important;
}
body .our-portfolio .grid-item-inner .title-text .item-holder {
    position: relative !important;
    bottom: auto !important;
}
body .our-portfolio .grid-item-inner .desciption-text,
body .our-portfolio .grid-item-inner:hover .desciption-text {
    position: relative !important;
    left: auto !important; right: auto !important; bottom: auto !important;
    transform: none !important;
    z-index: 2 !important;
    flex: 0 0 auto !important;
    padding: 0 36px 28px !important;
}
@media screen and (max-width: 1400px) {
    body .our-portfolio .grid-item-inner .desciption-text,
    body .our-portfolio .grid-item-inner:hover .desciption-text { padding-left: 30px !important; padding-right: 30px !important; }
}
/* tablet + mobile: always show the description */
@media screen and (max-width: 980px) {
    body .our-portfolio .grid-item-inner .desciption-text {
        opacity: 1 !important; visibility: visible !important; max-height: none !important;
    }
}
/* desktop: description appears on hover only */
@media screen and (min-width: 981px) {
    body .our-portfolio .grid-item-inner .desciption-text {
        opacity: 0 !important; visibility: hidden !important;
        max-height: 0 !important; overflow: hidden !important;
        padding-bottom: 0 !important;
        transition: opacity .35s ease, max-height .45s ease, padding .45s ease, visibility .35s !important;
    }
    body .our-portfolio .grid-item-inner:hover .desciption-text {
        opacity: 1 !important; visibility: visible !important;
        max-height: 240px !important;
        padding-bottom: 28px !important;
    }
}
/* portfolio cards: no flex gap between title and description (keeps all 5 cards identical) */
body .our-portfolio .et_pb_column.grid-item-inner {
    row-gap: 0 !important;
    gap: 0 !important;
}
/* portfolio cards (desktop): compact hover text so title + description always fit inside the card */
@media screen and (min-width: 981px) {
    body .our-portfolio .grid-item-inner .item-holder {
        padding-top: 14px !important;
        padding-bottom: 18px !important;
    }
    body .our-portfolio .grid-item-inner .item-gap {
        margin: 8px 0 !important;
    }
    body .our-portfolio .grid-item-inner .desciption-text p {
        font-size: 15px !important;
        line-height: 1.4 !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    body .our-portfolio .grid-item-inner:hover .desciption-text {
        padding-bottom: 20px !important;
    }
}