/*
 * AYUR Elementor visual layer
 * Presentation only: preserves existing content and widgets.
 */

:root {
    --ayur-luxury-green: #003f32;
    --ayur-luxury-cream: #f4eee5;
    --ayur-luxury-accent: #b8735f;
}

/* Existing Elementor headings */
body:not(.elementor-editor-active) .ayur-main .elementor-widget-heading h1,
body:not(.elementor-editor-active) .ayur-main .elementor-widget-heading h2,
body:not(.elementor-editor-active) .ayur-main .elementor-widget-heading h3 {
    font-family: "Cormorant Garamond", Georgia, serif;
    font-weight: 500;
    line-height: 1.15;
}

/* Text and links */
body:not(.elementor-editor-active) .ayur-main .elementor-widget-text-editor {
    line-height: 1.75;
}

body:not(.elementor-editor-active) .ayur-main .elementor-widget-text-editor a {
    text-underline-offset: 3px;
}

/* Elementor buttons */
body:not(.elementor-editor-active) .ayur-main .elementor-button {
    border-radius: 999px;
    transition: background-color .2s ease, transform .2s ease;
}

body:not(.elementor-editor-active) .ayur-main .elementor-button:hover {
    transform: translateY(-2px);
}

/* Form controls */
body:not(.elementor-editor-active) .ayur-main input,
body:not(.elementor-editor-active) .ayur-main select,
body:not(.elementor-editor-active) .ayur-main textarea {
    max-width: 100%;
}

/* =========================================
   AYUR – Service page visual refinements
   Existing Elementor content is unchanged.
   ========================================= */

/* Laser Hair Removal page title section */
body.page-id-13284 .ayur-main .elementor-element-9905216 {
    padding-top: 105px;
    padding-bottom: 105px;
}

body.page-id-13284 .ayur-main .elementor-element-655e183 h1,
body.page-id-13284 .ayur-main .elementor-element-655e183 h2 {
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(44px, 5vw, 72px);
    font-weight: 500;
    line-height: 1.08;
    letter-spacing: -.025em;
    color: #003f32;
}

/* Services Category sidebar */
body.page-id-13284 .ayur-main .elementor-element-548ef8a {
    border-radius: 24px;
}

body.page-id-13284 .ayur-main .elementor-element-8754541 h2,
body.page-id-13284 .ayur-main .elementor-element-8754541 h3 {
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 34px;
    font-weight: 500;
    color: #003f32;
}

/* Existing category links */
body.page-id-13284 .ayur-main .elementor-element-548ef8a a {
    transition: background-color .2s ease, color .2s ease;
}

body.page-id-13284 .ayur-main .elementor-element-548ef8a a:hover {
    color: #b8735f;
}

/* Mobile spacing */
@media (max-width: 767px) {
    body.page-id-13284 .ayur-main .elementor-element-9905216 {
        padding-top: 65px;
        padding-bottom: 65px;
    }

    body.page-id-13284 .ayur-main .elementor-element-655e183 h1,
    body.page-id-13284 .ayur-main .elementor-element-655e183 h2 {
        font-size: 42px;
    }
}

/*
 * Hide legacy Elementor header containers on the
 * Laser Hair Removal page.
 *
 * The original Elementor widgets and content remain
 * intact and editable.
 */
body.page-id-13284:not(.elementor-editor-active)
.ayur-main .elementor-element-32a6292,

body.page-id-13284:not(.elementor-editor-active)
.ayur-main .elementor-element-a87b3c8 {
    display: none !important;
}

/* ==========================================
   AYUR UNIVERSAL SERVICE PAGE DESIGN
   Applies to existing Elementor page content.
   No content or widget changes.
   ========================================== */

/* Service pages sharing the sidebar layout */
body:is(
    .page-id-13284,
    .page-id-3761,
    .page-id-3753,
    .page-id-3751
):not(.elementor-editor-active) .ayur-main {

    --service-green: #003f32;
    --service-cream: #f5f0e8;
    --service-accent: #b8735f;
}

/* Existing category sidebar */
body:is(
    .page-id-13284,
    .page-id-3761,
    .page-id-3753,
    .page-id-3751
) .ayur-main .sticky-column {
    border-radius: 24px;
}

/* Sidebar headings */
.ayur-main .sticky-column .elementor-widget-heading h2,
.ayur-main .sticky-column .elementor-widget-heading h3 {
    font-family: "Cormorant Garamond", Georgia, serif;
    font-weight: 500;
    color: #003f32;
}

/* Existing sidebar links */
.ayur-main .sticky-column a {
    transition: color .2s ease, background-color .2s ease;
}

/* Main treatment images */
.ayur-main .elementor-widget-image img {
    max-width: 100%;
    height: auto;
}

/* Existing accordion styling */
.ayur-main .elementor-widget-nested-accordion {
    --n-accordion-title-font-size: 17px;
    --n-accordion-title-color: #003f32;
}

/* Mobile adjustments */
@media (max-width: 767px) {
    .ayur-main .sticky-column {
        position: relative;
        top: auto;
    }
}


/* ==========================================
   AYUR PREMIUM SERVICE PAGE PRESENTATION
   ========================================== */

/* Shared service-page title banners */
body:is(
    .page-id-13284,
    .page-id-3761,
    .page-id-3755,
    .page-id-3753,
    .page-id-3751
):not(.elementor-editor-active)
.ayur-main > .elementor > .e-con:first-child {
    padding-top: 100px;
    padding-bottom: 100px;
}

/* Banner titles */
body:is(
    .page-id-13284,
    .page-id-3761,
    .page-id-3755,
    .page-id-3753,
    .page-id-3751
):not(.elementor-editor-active)
.ayur-main > .elementor > .e-con:first-child
.elementor-heading-title {
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(44px, 5vw, 72px);
    font-weight: 500;
    letter-spacing: -.025em;
    line-height: 1.1;
    color: #003f32;
}

/* Sidebar presentation */
.ayur-main .sticky-column {
    overflow: hidden;
    border: 1px solid rgba(0, 63, 50, .08);
    box-shadow: 0 12px 35px rgba(0, 63, 50, .05);
}

/* Sidebar navigation hover treatment */
.ayur-main .sticky-column .elementor-widget-heading a:hover {
    color: #b8735f;
}

/* Treatment images */
.ayur-main .elementor-widget-image img {
    border-radius: 12px;
}

/* Refined accordion appearance */
.ayur-main .elementor-widget-nested-accordion
.e-n-accordion-item-title {
    border-radius: 8px;
    transition: background-color .2s ease;
}

/* Mobile banner spacing */
@media (max-width: 767px) {
    body:is(
        .page-id-13284,
        .page-id-3761,
        .page-id-3755,
        .page-id-3753,
        .page-id-3751
    ):not(.elementor-editor-active)
    .ayur-main > .elementor > .e-con:first-child {
        padding-top: 65px;
        padding-bottom: 65px;
    }
}

/* AYUR service page layout refinement */

/* Four existing sidebar-based service pages */
body:is(
    .page-id-13284,
    .page-id-3761,
    .page-id-3753,
    .page-id-3751
):not(.elementor-editor-active)
.ayur-main > .elementor > .e-con:nth-child(2) {
    padding-top: 55px;
    padding-bottom: 90px;
}

/* Subtle treatment image presentation */
body:is(
    .page-id-13284,
    .page-id-3761,
    .page-id-3753,
    .page-id-3751
) .ayur-main .elementor-widget-image img {
    border-radius: 18px;
}

/* More refined service headings */
body:is(
    .page-id-13284,
    .page-id-3761,
    .page-id-3753,
    .page-id-3751
) .ayur-main .elementor-widget-heading h2 {
    letter-spacing: -.015em;
}

/* Responsive treatment section */
@media (max-width: 767px) {
    body:is(
        .page-id-13284,
        .page-id-3761,
        .page-id-3753,
        .page-id-3751
    ):not(.elementor-editor-active)
    .ayur-main > .elementor > .e-con:nth-child(2) {
        padding-top: 30px;
        padding-bottom: 55px;
    }
}
