/*

Theme Name: MishaDort
Description: A lightweight, modern WordPress block theme built natively with Gutenberg for bakeries, pastry shops, and confectionery creators.
Author: MishaDort
Version: 2.0.0
Requires at least: 6.5
Tested up to: 6.7

Requires PHP: 7.4

License: GPLv2 or later

Text Domain: mishadort

*/



/* ==========================================================================

   1. Gutenberg FSE Block Wrapper Reset

   ========================================================================== */

*, *::before, *::after {

    box-sizing: border-box;

}



/* ==========================================================================
   Task #385: Prevent Frontend Horizontal Overflow
   Date: 2026-09-13
   Rationale: cws_main.css:179 specifies body { overflow-x: hidden; }, but html
   retained overflow-x: visible. When child rows expand to the viewport width
   with negative gutter margins (-15px), document.documentElement can produce
   a horizontal scrollbar. Adding overflow-x: clip prevents horizontal scrolling
   without affecting sticky positioning or vertical scrolling.
   ========================================================================== */
html, body {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    overflow-x: clip;
}



.wp-site-blocks,

.mishadort-page-main,

.entry-content,

.wp-block-post-content {

    width: 100% !important;

    max-width: 100% !important;

    margin: 0 !important;

    padding: 0 !important;

}



/* ==========================================================================

   2. Header & Navigation Structure

   ========================================================================== */

#site_header,

.mishadort-site-header {

    position: relative;

    z-index: 99;

    width: 100%;

}



.mishadort-top-bar {

    background-color: #272b31;

    color: #ffffff;

    width: 100%;

    position: relative;

    z-index: 60;

}



.mishadort-top-bar-inner {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 20px;

    height: 40px;

    display: flex;

    justify-content: space-between;

    align-items: center;

    box-sizing: border-box;

}



.top-bar-left {

    display: flex;

    align-items: center;

    gap: 25px;

}



.top-bar-left .top-info {

    display: inline-flex;

    align-items: center;

    gap: 8px;

    font-family: 'Comfortaa', cursive, sans-serif;

    font-size: 13px;

    font-weight: 500;

    color: rgba(255, 255, 255, 0.85);

}



.top-bar-left .top-info i {

    color: #5fcac7;

    font-size: 14px;

}



.top-bar-right {

    display: flex;

    align-items: center;

}



.top-socials {

    display: flex;

    align-items: center;

    gap: 12px;

}



.top-socials a {

    color: rgba(255, 255, 255, 0.85);

    font-size: 13px;

    width: 26px;

    height: 26px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    text-decoration: none;

    transition: color 0.3s ease, transform 0.2s ease;

}



.top-socials a:hover {

    color: #5fcac7;

    transform: translateY(-2px);

}



@media (max-width: 767px) {

    .mishadort-top-bar {

        display: none;

    }

}



.header_nav_part {

    display: flex;

    align-items: center;

    justify-content: space-between;

    max-width: 1200px;

    margin: 0 auto;

    padding: 10px 20px;

}



.menu-left-part,

.menu-right-part {

    flex: 1 1 50% !important;

}



.menu-left-part .main_menu {

    display: flex;

    justify-content: flex-end;

    align-items: center;

    gap: 25px;

    flex-wrap: nowrap !important;

    list-style: none;

    margin: 0;

    padding: 0;

}



.menu-right-part .main_menu {

    display: flex;

    justify-content: flex-start;

    align-items: center;

    gap: 25px;

    flex-wrap: nowrap !important;

    list-style: none;

    margin: 0;

    padding: 0;

}



.header_logo {

    flex: 0 0 185px;

    text-align: center;

    margin: 0 20px;

}



.header_logo_img {

    max-height: 100px;

    width: auto;

    display: inline-block;

}



#site_header,

.mishadort-site-header {

    position: relative !important;

    background: #ffffff !important;

    z-index: 999 !important;

    margin: 0 !important;

}



#site_header,

.mishadort-site-header,

#header_wrapper,

.mishadort-header-wrapper {

    display: flow-root !important;

}



#site_header p:empty,

#site_header > p,

.mishadort-site-header p:empty,

.mishadort-site-header > p,

#header_wrapper > p,

#header_wrapper p:empty,

.mishadort-header-wrapper > p,

.mishadort-header-wrapper p:empty,

.mishadort-nav-bar > p,

.mishadort-nav-bar p:empty {

    display: none !important;

    margin: 0 !important;

    padding: 0 !important;

    height: 0 !important;

}



.mishadort-nav-bar {

    position: relative !important;

    z-index: 20 !important;

    background: transparent !important;

}



.menu_wave,
#site_header .menu_wave,
.mishadort-nav-bar .menu_wave {

    position: absolute !important;

    top: 0 !important;

    left: 0 !important;

    right: 0 !important;

    /* No `bottom`, and content-box: the reference sizes this as height:100% of the

       100px header PLUS a 20px padding-bottom, giving a 120px box whose bottom 20px

       hangs below the header - that overhang IS the wave. `bottom: 0` pinned it to

       the header's 100px and a global border-box folded the padding back in, so the

       wave had no overhang to show. (bellaria/css/cws_main.css:2738-2748) */

    box-sizing: content-box !important;

    width: 100% !important;

    height: 100% !important;

    padding-bottom: 20px !important;

    margin-bottom: -20px !important;

    background-color: #ffffff !important;

    -webkit-mask-image: url('assets/images/svg/shape_menu_1.svg') !important;

    -webkit-mask-position: bottom !important;

    -webkit-mask-size: cover !important;

    -webkit-mask-repeat: no-repeat !important;

    mask-image: url('assets/images/svg/shape_menu_1.svg') !important;

    mask-position: bottom !important;

    mask-size: cover !important;

    mask-repeat: no-repeat !important;

    /* Behind the header's own background, as in the reference (z-index: -1).

       At z-index 1 it painted OVER the menu. */

    z-index: -1 !important;

    pointer-events: none !important;

}



/* Centered Desktop Signature Logo */

.desktop-menu-wrapper {

    position: relative !important;

    min-height: 100px;

    display: flex;

    align-items: center;

    justify-content: center;

    z-index: 10 !important;

}



.desktop-menu-wrapper .header_logo.a_center {

    width: 185px !important;

    min-width: 185px !important;

    height: 100px !important;

    position: relative !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    margin: 0 25px !important;

    z-index: 35 !important;

}



.desktop-menu-wrapper .header_logo_link {

    display: block !important;

    position: absolute !important;

    top: 5px !important;

    left: 50% !important;

    transform: translateX(-50%) !important;

    width: 185px !important;

    height: 185px !important;

    z-index: 40 !important;

    filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.12));

    transition: transform 0.3s ease !important;

}



.desktop-menu-wrapper .header_logo_link:hover {

    transform: translateX(-50%) scale(1.04) !important;

}



.desktop-menu-wrapper .header_logo_img {
    max-width: none;
    max-height: none;
    object-fit: contain;
    display: block;
}

.desktop-menu-wrapper .is-default-size .header_logo_img,
.desktop-menu-wrapper .header_logo_img:not([width]) {
    width: 185px;
    height: 185px;
}





/* Sticky Header on Scroll */

/* The sticky bar is always in the document and slides in and out with a

   transform, exactly as the theme does it (`#sticky.stick` in

   assets/css/cws_main.css). It used to be display:none flipped to

   `display: block !important` by a second controller in slider.js - which is why

   it could stay pinned over the whole page after a resize and needed a reload,

   and why it never rendered in a headless capture. `.stick` is the theme's own

   class, set by cws_main.js; `.is-sticky` is kept only so any older markup or

   cached script still resolves. */

#sticky,
#sticky.sticky_header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    /* Solid, not translucent. rgba(...,0.96) plus a backdrop blur read as
       see-through over busy page content and made the bar look like it was
       behind the page rather than above it. */
    background: #ffffff !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
    z-index: 99999;
    padding: 0;
    transform: translateY(-100%);
    transition: transform 0.35s ease;
    /* No will-change: on a position:fixed element Chrome promotes this to its own
       compositing layer and the solid background can drop out on a re-composite -
       which is why the bar came back see-through on the second reveal. */
}

#sticky.stick,
#sticky.sticky_header.stick,
#sticky.sticky_header.is-sticky {
    transform: translateY(0);
}



@keyframes stickySlideDown {

    from {

        transform: translateY(-100%);

        opacity: 0;

    }

    to {

        transform: translateY(0);

        opacity: 1;

    }

}



/* Specificity note: `.site_header.logo_center .bellaria_layout_container` sets

   display:block and out-specifies a bare `.sticky_container`, so the logo and the

   nav stacked (153px tall) instead of sitting side by side (the reference's bar is

   109px). Scoped to #sticky so it wins. */

#sticky .bellaria_layout_container.sticky_container,

.sticky_container {

    display: flex;

    align-items: center;

    justify-content: space-between;

    min-height: 64px;

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 30px;

}



.sticky_logo_link {

    display: flex;

    align-items: center;

}



.sticky_logo_img {

    max-height: 38px;

    width: auto;

    object-fit: contain;

}



.sticky_main_nav .main_menu {

    display: flex;

    list-style: none;

    margin: 0;

    padding: 0;

    /* No gap: spacing now comes from the links' own 15px padding, which is also

       what makes room for the current/hover dot. */

    align-items: center;

}



/* The dot needs the item to be a positioning context. */

.sticky_main_nav .main_menu > .menu-item,
.sticky_main_nav .wp-block-navigation-item {

    position: relative;

}



.sticky_main_nav .main_menu > .menu-item > a,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content,
.sticky_main_nav .wp-block-navigation-item__content {

    font-family: 'Merienda One', cursive !important;

    font-size: 15px !important;

    font-weight: 600 !important;

    color: #4b4342;

    text-decoration: none;

    /* Horizontal padding is NOT optional: the theme draws the current/hover

       marker as an 8px dot on `.main_menu > .menu-item:after` at `left: 0`

       (assets/css/cws_main.css:3015). With `padding: 20px 0` the item was exactly

       as wide as its text, so the dot landed on top of the first letter - the

       "dot obscuring the buttons" report. The main menu uses 15px a side. */

    padding: 20px 15px !important;

    line-height: 36px !important;

    display: inline-block;

    position: relative;

    transition: color 0.3s ease !important;

}



.sticky_main_nav .main_menu > .menu-item > a:hover,
.sticky_main_nav .main_menu > .menu-item.current-menu-item > a,
.sticky_main_nav .main_menu > .menu-item.current-menu-ancestor > a,
.sticky_main_nav .main_menu > .menu-item.current-menu-parent > a,
.sticky_main_nav .main_menu > .menu-item.current_page_item > a,
.sticky_main_nav .main_menu > .menu-item.current_page_ancestor > a,
.sticky_main_nav .main_menu > .menu-item.current_page_parent > a,
.sticky_main_nav .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.sticky_main_nav .wp-block-navigation-item__content:hover,
.sticky_main_nav .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.sticky_main_nav .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content,
.sticky_main_nav .wp-block-navigation-item.current-page-ancestor > .wp-block-navigation-item__content,
.sticky_main_nav .wp-block-navigation-item.current_page_item > .wp-block-navigation-item__content {
    color: #5fcac7 !important;
}



.sticky_main_nav .menu-item {

    position: relative;

}



.main_menu .sub-menu {

    color: #5fcac7 !important;

    /* The centre logo sits at z-index 40 inside the same stacking context

       (.desktop-menu-wrapper, z-index 10), so the dropdown must clear it or

       the logo paints over the open submenu. */

    z-index: 100 !important;

}



.main_menu .sub-menu .menu-item > a {
    color: #4b4342;
    transition: color 0.5s ease;
}

.main_menu .sub-menu .menu-item > a:hover,
.main_menu .sub-menu .menu-item:hover > a,
.main_menu .sub-menu .menu-item.current-menu-item > a,
.main_menu .sub-menu .menu-item.current_page_item > a,
.main_menu .sub-menu .menu-item.current-menu-ancestor > a,
.main_menu .sub-menu .menu-item.current_page_ancestor > a {
    color: #5fcac7;
}



.sticky_main_nav .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background: #ffffff;
    min-width: 200px;
    box-shadow: 1px 2px 10px -1px rgba(0, 0, 0, 0.2);
    border-radius: 15px;
    padding: 15px 0;
    list-style: none;
    margin: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.25s ease;
    z-index: 100;
}

.sticky_main_nav .menu-item:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.sticky_main_nav .sub-menu .menu-item a {
    font-family: 'Comfortaa', cursive, sans-serif;
    font-size: 17px;
    font-weight: 500;
    color: #4b4342;
    padding: 2px 40px 10px;
    display: inline !important;
    line-height: 40px !important;
    text-decoration: none;
    transition: color 0.5s ease;
}

.sticky_main_nav .sub-menu .menu-item a:hover,
.sticky_main_nav .sub-menu .menu-item:hover > a,
.sticky_main_nav .sub-menu .menu-item.current-menu-item > a,
.sticky_main_nav .sub-menu .menu-item.current_page_item > a,
.sticky_main_nav .sub-menu .menu-item.current-menu-ancestor > a,
.sticky_main_nav .sub-menu .menu-item.current_page_ancestor > a {
    color: #5fcac7;
    background: transparent;
}



/* ==========================================================================

   2.5 Hero Slider (Bespoke Clean-Room Engine)

   ========================================================================== */

.mishadort-hero-slider {
    position: relative !important;
    width: 100% !important;
    height: 553px !important;
    overflow: hidden !important;
    background-color: transparent !important;
    -webkit-mask-image: url('assets/images/svg/shape_menu_1.svg') !important;
    -webkit-mask-position: bottom !important;
    -webkit-mask-size: cover !important;
    -webkit-mask-repeat: no-repeat !important;
    mask-image: url('assets/images/svg/shape_menu_1.svg') !important;
    mask-position: bottom !important;
    mask-size: cover !important;
    mask-repeat: no-repeat !important;
    margin-bottom: 0 !important;
    z-index: 2 !important;
}

@media (max-width: 1024px) {
    .mishadort-hero-slider {
        height: 480px !important;
    }
}

@media (max-width: 767px) {
    .mishadort-hero-slider {
        height: 420px !important;
    }
}



.mishadort-slides-wrap {

    display: flex;

    width: 100%;

    height: 100%;

    transition: transform 0.45s cubic-bezier(0.25, 1, 0.5, 1);

    will-change: transform;

}



.mishadort-slide {

    position: relative;

    flex: 0 0 100%;

    width: 100%;

    height: 100%;

    background-size: cover;

    background-position: center 75% !important;

    background-repeat: no-repeat;

    display: flex;

    align-items: center;

    justify-content: center;

    box-sizing: border-box;

}



.mishadort-slide-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(80, 81, 92, 0.15) 0%, rgba(80, 81, 92, 0.15) 80%, rgba(60, 61, 70, 0.28) 100%) !important;
    z-index: 1;
}

.mishadort-slide-inner {
    position: relative;
    z-index: 2;
    max-width: 650px;
    margin: 0 auto;
    padding: 60px 40px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

@media (max-width: 767px) {
    .mishadort-slide-inner {
        padding: 20px 15px 40px !important;
    }
}



.mishadort-slide-frame-bg {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    width: 654px;

    height: 654px;

    pointer-events: none;

    z-index: 1;

}



.mishadort-slide-frame-bg .slide-frame-main {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    object-fit: contain;

}



.mishadort-slide-frame-bg .slide-frame-crown {

    position: absolute;

    top: 35px;

    left: 50%;

    transform: translateX(-50%);

    width: 125px;

    height: auto;

}



.mishadort-slide-frame-bg .slide-frame-left {

    position: absolute;

    top: 50%;

    left: -70px;

    transform: translateY(-50%);

    width: 196px;

    height: auto;

}



.mishadort-slide-frame-bg .slide-frame-right {

    position: absolute;

    top: 50%;

    right: -70px;

    transform: translateY(-50%);

    width: 196px;

    height: auto;

}



.mishadort-slide-content {

    position: relative;

    z-index: 2;

    color: #4b4342;

    text-align: center;

}



.mishadort-slide-title {

    font-family: 'Merienda One', cursive, sans-serif !important;

    font-size: 64px !important;

    line-height: 1.15 !important;

    color: #4b4342 !important;

    margin: 0 0 16px !important;

    text-shadow: none !important;

    animation: fadeInUp 0.8s ease backwards;

}



.mishadort-slide-subtitle {
    font-family: 'Comfortaa', cursive, sans-serif !important;
    font-size: 16px !important;

    line-height: 1.6 !important;

    color: #4b4342 !important;

    max-width: 390px;

    margin: 0 auto 24px !important;

    text-shadow: none !important;

    animation: fadeInUp 0.8s ease 0.15s backwards;

}



.mishadort-slide-btn-wrap {

    margin-top: 10px;

    animation: fadeInUp 0.8s ease 0.3s backwards;

}



.mishadort-slider-dots {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    display: flex;
    gap: 10px;
}

@media (max-width: 767px) {
    .mishadort-slider-dots {
        bottom: 18px;
    }
}



.mishadort-dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.45);

    border: 2px solid #ffffff;

    padding: 0;

    cursor: pointer;

    transition: all 0.3s ease;

    outline: none;

}



.mishadort-dot.active,

.mishadort-dot:hover {

    background: #ff91a4;

    border-color: #ff91a4;

    transform: scale(1.2);

}



.mishadort-nav-arrow {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    z-index: 5;

    width: 48px;

    height: 48px;

    border-radius: 50%;

    background: rgba(0, 0, 0, 0.3);

    border: 2px solid rgba(255, 255, 255, 0.6);

    color: #ffffff;

    font-size: 28px;

    line-height: 42px;

    text-align: center;

    cursor: pointer;

    transition: all 0.3s ease;

    outline: none;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 0;

}



.mishadort-nav-arrow:hover {

    background: #5fcac7;

    border-color: #5fcac7;

    transform: translateY(-50%) scale(1.1);

}



.mishadort-nav-arrow.prev {

    left: 25px;

}



.mishadort-nav-arrow.next {

    right: 25px;

}



.cws-row-cropped {
    position: relative !important;
    z-index: 2 !important;
}



.cws-row-cropped + .vc_row:not(.cws-row-cropped),
.cws-row-cropped + .mishadort-row:not(.cws-row-cropped) {
    position: relative !important;
    z-index: 1 !important;
}









@keyframes fadeInUp {

    from {

        opacity: 0;

        transform: translateY(25px);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}



/* ==========================================================================

   3. Page Title Banner & Alignment

   ========================================================================== */

#page_title_section {

    position: relative;

    z-index: 2;

    /* Reference leaves this transparent so the #header_img_bg photo shows. */

    background: transparent;

    text-align: center;

    width: 100%;

    /* Reference lets the scalloped edges paint outside the section box. */

    overflow: visible;

    padding: 0;

}



#page_title_section #header_img_bg {

    position: absolute;

    z-index: 1;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background-size: cover;

    background-position: center center;

}



#page_title_section #header_img_bg:before {

    content: '';

    position: absolute;

    z-index: 1;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    /* Was solid #5fcac7, which completely hid the banner photo. Reference

       uses a light dark tint over the image instead. */

    background: rgba(39, 43, 49, 0.1);

}



#page_title_section .bellaria_layout_container {

    position: relative;

    z-index: 3;

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 20px;

    text-align: center;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    box-sizing: border-box;

}



#page_title_section .page_title_content,

#page_title_section > div.bellaria_layout_container > div {

    position: relative;

    z-index: 2;

    padding-top: 120px;

    padding-bottom: 120px;

    text-align: center !important;

    margin-left: auto !important;

    margin-right: auto !important;

    width: 100%;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    box-sizing: border-box;

}



#page_title_section h1,

#page_title_section #page_title {

    font-family: 'Merienda One', cursive !important;

    font-size: 51px !important;

    font-weight: 300 !important;

    color: #ffffff !important;

    margin: 0 auto 10px !important;

    text-align: center !important;

    line-height: 1.2 !important;

    display: table !important;

    width: auto !important;

}



#page_title_section .page_desc,

#page_title_section p {

    font-family: 'Comfortaa', cursive, sans-serif !important;

    font-size: 16px !important;

    line-height: 1.6 !important;

    color: rgba(255, 255, 255, 0.9) !important;

    text-align: center !important;

    max-width: 700px;

    margin: 0 auto 12px !important;

    display: block !important;

}



#page_title_section .bread-crumbs {

    font-family: 'Comfortaa', cursive, sans-serif !important;

    font-size: 17px !important;

    color: #ffffff !important;

    text-align: center !important;

    display: table !important;

    margin-left: auto !important;

    margin-right: auto !important;

}



#page_title_section .bread-crumbs a {

    color: #ffffff !important;

    text-decoration: none !important;

    transition: opacity 0.2s ease;

}



#page_title_section .bread-crumbs a:hover {

    opacity: 0.8;

}



#page_title_section .bread-crumbs .delimiter {

    padding: 0 10px;

    color: rgba(255, 255, 255, 0.85);

    font-style: normal;

}



#page_title_section .bread-crumbs .current {

    color: #ffffff !important;

}





/* ==========================================================================

   4. Row Containers & Cropped Wave Layers

   ========================================================================== */

.mishadort-row,

.vc_row {

    position: relative;

    /* Must stay auto (not 100%): WPBakery rows carry -15px side margins and

       are expected to expand 30px beyond their container so nested columns

       land on the same grid as the reference theme. Pinning to 100% makes

       every nesting level 30px narrower, compounding down the tree. */

    width: auto;

}


.vc_row-full-width {
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    border: none !important;
    clear: both;
}

.mishadort-row-inner,

.bellaria_layout_container {

    position: relative;

    z-index: 3;

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 20px;

    box-sizing: border-box;

}



/* Visual Composer Column Grid Framework */

.vc_row,

.mishadort-row,

.mishadort-row-inner {

    display: flex;

    flex-wrap: wrap;

    box-sizing: border-box;

}



/* Only the inner wrapper is pinned to 100%. The rows themselves must stay

   width:auto so their -15px side margins expand them 30px past the

   container, matching the reference grid (see .mishadort-row above). */

.mishadort-row-inner {

    width: 100% !important;

}



.wpb_column,

.vc_column_container,

.vc_column-inner,

.wpb_wrapper {

    width: 100%;

    box-sizing: border-box;

}



.vc_col-sm-3,

.vc_col-md-3,

.vc_col-lg-3,

.vc_col-xs-3 {

    flex: 0 0 25% !important;

    max-width: 25% !important;

    padding: 0 15px !important;

    box-sizing: border-box !important;

}



.vc_col-sm-4,

.vc_col-md-4,

.vc_col-lg-4,

.vc_col-xs-4 {

    flex: 0 0 33.333% !important;

    max-width: 33.333% !important;

    padding: 0 15px !important;

    box-sizing: border-box !important;

}



.vc_col-sm-6,

.vc_col-md-6,

.vc_col-lg-6,

.vc_col-xs-6 {

    flex: 0 0 50% !important;

    max-width: 50% !important;

    padding: 0 15px !important;

    box-sizing: border-box !important;

}



.vc_col-sm-12,

.vc_col-md-12,

.vc_col-lg-12,

.vc_col-xs-12 {

    flex: 0 0 100% !important;

    max-width: 100% !important;

    padding: 0 15px !important;

    box-sizing: border-box !important;

}



/* ==========================================================================

   4.5 Carousel & Services (Authentic Owl Carousel Mechanics)

   ========================================================================== */

.bellaria_sc_carousel {

    position: relative;

    width: 100%;

    margin-bottom: 30px;

}



/* The portfolio carousel section carries no bottom margin in the reference -

   the surrounding row supplies the spacing there. */

.bellaria_sc_carousel.cws_sc_portfolio_carousel {

    margin-bottom: 0;

}



.bellaria_sc_carousel .bellaria_wrapper {

    /* No width and no position: in the generic carousel the .bellaria_wrapper IS

       the Owl track, and both were pinning it to 1170px so the -15px gutters

       below could not widen it to the reference's 1200px. The reference leaves

       this element static. */

}



.bellaria_sc_carousel .owl-carousel {

    position: relative;

    /* The reference gutters the track outward by 15px a side and pads it back on

       each .owl-item (bellaria/css/cws_main.css:4813-4823). `width: 100%` pinned

       the track to its 1170px column, so it measured 1170 against the

       reference's 1200 and every slide was 10px narrow. */

    margin-left: -15px;

    margin-right: -15px;

    -ms-touch-action: pan-y;

}



.bellaria_sc_carousel .owl-wrapper-outer {

    overflow: hidden;

    position: relative;

    width: 100%;

}



.bellaria_sc_carousel .owl-wrapper {

    display: none;

    position: relative;

    -webkit-transform: translate3d(0px, 0px, 0px);

}



.bellaria_sc_carousel .owl-item {

    float: left;

    box-sizing: border-box;

    /* Gutter compensation lives on the slide, as in the reference - not on the

       .item inside it. */

    padding: 0 15px;

}



/* text-align is NOT centred here: the reference leaves carousel items at their

   inherited alignment (measured `start` on the testimonials). Only the services

   module centres itself. */

.bellaria_sc_carousel .owl-item .item,

.bellaria_sc_carousel .owl-item .bellaria_service {

    box-sizing: border-box;

}



.bellaria_sc_carousel .owl-item .bellaria_service {

    text-align: center;

}



/* Scalloped SVG Services Frame & Transitions */

.bellaria_service {

    text-align: center;

}



.bellaria_services_media {

    position: relative;

    z-index: 1;

    width: 200px;

    height: 200px;

    margin: 0 auto 20px;

    display: flex;

    justify-content: center;

    align-items: center;

}



.bellaria_services_frame {

    display: flex;

    justify-content: center;

    align-items: center;

    /* The frame fills its media box and must never carry a size of its own.

       A hardcoded 200x200 drew a 200px ring around a 120px media box whenever

       the shortcode set a custom_width - which is why the photo sat outside its

       circle on Wide Choice and Tradition (/home-dessert/).

       Measured: reference frame 120x120 (= its media); ours was 200x200. */

    width: 100%;

    height: 100%;

}



.bellaria_services_frame svg {

    display: block;

    width: 200px;

    height: 200px;

    stroke-width: 12px;

    fill: transparent;

    stroke: #5fcac7;

    transition: fill 0.4s ease, stroke 0.4s ease;

}



.bellaria_services_frame svg path {

    transition: fill 0.4s ease, stroke 0.4s ease;

}



/* `with_frame` sits on the OUTER .bellaria_service, which is where the theme's

   own CSS expects it (assets/css/cws_main.css:1963,1972). It used to be emitted

   on .bellaria_services_media; when the renderer was corrected to match the

   reference this selector stopped matching and the icons lost their centring.

   Both forms are listed so either markup works. */

.bellaria_service.with_frame .bellaria_services_image,

.bellaria_service.with_frame .bellaria_services_icon,

.bellaria_services_media.with_frame .bellaria_services_image,

.bellaria_services_media.with_frame .bellaria_services_icon {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    z-index: 2;

    display: flex;

    justify-content: center;

    align-items: center;

    pointer-events: none;

}



.bellaria_services_media .bellaria_services_image img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    transition: none;
}

.bellaria_services_title {
    font-family: 'Merienda One', cursive, sans-serif !important;
    /* 30px, measured on the reference. */
    font-size: 30px !important;
    line-height: 1.2 !important;
    margin: 0 0 10px !important;
    text-align: center;
}

.bellaria_services_title a {
    color: #4b4342 !important;
    text-decoration: none !important;
    transition: color 0.3s ease;
}

.bellaria_services_divider {
    text-align: center;
    margin: 0 auto 12px;
}

.bellaria_services_divider img {
    display: inline-block;
    width: 55px;
    height: auto;
}

.bellaria_services_desc {
    font-family: 'Comfortaa', cursive, sans-serif !important;
    /* 17px, measured on the reference. */
    font-size: 17px !important;
    line-height: 29px !important;
    color: #4b4342 !important;
    text-align: center;
}

.bellaria_services_desc p {
    margin-bottom: 0 !important;
    line-height: 29px !important;
}



/* Know Us Better - Small Services Feature Icons (Strictly Static, No Hover Effects) */

.bellaria_service.small {

    text-align: center;

    pointer-events: auto;

}



.bellaria_service.small .bellaria_services_media {

    width: 130px !important;

    height: 130px !important;

    margin: 0 auto 15px !important;

    pointer-events: none !important;

    cursor: default !important;

}



.bellaria_service.small .bellaria_services_frame {

    width: 130px !important;

    height: 130px !important;

    pointer-events: none !important;

}



.bellaria_service.small .bellaria_services_frame svg {

    width: 130px !important;

    height: 130px !important;

    stroke: #ffffff !important;

    fill: transparent !important;

    transition: none !important;

    transform: none !important;

    pointer-events: none !important;

}



.bellaria_service.small:hover .bellaria_services_frame svg,

.bellaria_service.small:hover .bellaria_services_frame {

    fill: transparent !important;

    stroke: #ffffff !important;

    transform: none !important;

}



.bellaria_service.small .bellaria_services_icon {

    pointer-events: none !important;

}



/* NOTE: these `.small` rules were written while the `small` class was never

   emitted, so they sat dormant. Once the renderer started emitting icon_size as

   a class (matching the reference's "small icon_center with_frame") they became

   live and shrank everything. Sizes are deliberately NOT set here any more - the

   theme's own .small styling already produces the reference's numbers

   (icon 60px, title 30px). */

.bellaria_service.small .bellaria_services_icon .icon {

    color: #ffffff !important;

    line-height: 1 !important;

    transition: none !important;

    transform: none !important;

}



.bellaria_service.small:hover .bellaria_services_icon .icon {

    transform: none !important;

    color: #ffffff !important;

}



.bellaria_service.small .bellaria_services_title {

    color: #ffffff !important;

    pointer-events: none !important;

    cursor: default !important;

}



.bellaria_service.small .bellaria_services_title a {

    color: #ffffff !important;

    pointer-events: none !important;

    cursor: default !important;

}



.bellaria_service.small .bellaria_services_desc p,

.bellaria_service.small .bellaria_services_desc span {

    color: #ffffff !important;

}



/* Portfolio / Our Creations Scallop Hover Effect */

.portfolio_item_post {

    position: relative;

    overflow: hidden;

}



.portfolio_item_post .item_content {

    position: relative;

    overflow: hidden;

    border-radius: 10px;

}



.portfolio_item_post .pic img {

    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important;

}



.portfolio_item_post:hover .pic img {

    transform: scale(1.08) !important;

}



.portfolio_item_post .cwsportfolio_content_wrap {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 3;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    opacity: 0;

    transition: opacity 0.4s ease;

    pointer-events: none;

}



.portfolio_item_post:hover .cwsportfolio_content_wrap {

    opacity: 1;

    pointer-events: auto;

}



.portfolio_item_post .hover-effect {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 1;

    display: flex;

    align-items: center;

    justify-content: center;

    transform: scale(0.82);

    opacity: 0;

    transition: transform 0.45s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.4s ease;

    pointer-events: none;

}



.portfolio_item_post:hover .hover-effect {

    transform: scale(1);

    opacity: 1;

}



.portfolio_item_post .hover-effect svg {

    width: 100%;

    height: 100%;

    display: block;

}



.portfolio_item_post .cwsportfolio_post_title {

    position: relative;

    z-index: 4;

    font-family: 'Merienda One', cursive !important;

    font-size: 20px !important;

    color: #4b4342 !important;

    text-align: center;

    padding: 0 15px;

    margin: 0 !important;

    transform: translateY(12px);

    opacity: 0;

    transition: transform 0.45s cubic-bezier(0.25, 1, 0.5, 1) 0.05s, opacity 0.4s ease 0.05s;

}



.portfolio_item_post:hover .cwsportfolio_post_title {

    transform: translateY(0);

    opacity: 1;

}



.portfolio_item_post .cwsportfolio_post_title a {

    color: #4b4342 !important;

    text-decoration: none;

    transition: color 0.3s ease;

}



.portfolio_item_post .cwsportfolio_post_title a:hover {

    color: inherit !important;

}



/* Owl Controls & Dynamic Pagination Dots */

.owl-controls {

    text-align: center;

    margin-top: 0;

    clear: both;

}



.owl-pagination {

    display: inline-flex;

    justify-content: center;

    align-items: center;

    gap: 8px;

}



.owl-pagination .owl-page {

    display: inline-block;

    cursor: pointer;

}



/* The dot IS the .owl-page: the reference paints it with the instance's accent

   (pink here) and distinguishes the active one by opacity, 1 vs 0.6. Its inner

   <span> is completely undecorated - measured border-width 0, background

   transparent, in BOTH the default and active states. Ours drew a 2px teal ring

   over the pink and filled it teal when active, which is why the active dot came

   out the wrong colour. */

.owl-pagination .owl-page span {

    display: block;

    width: 11px;

    height: 11px;

    border-radius: 50%;

    background: transparent;

    border: 0;

    transition: all 0.3s ease;

    box-sizing: border-box;

}



.owl-controls .owl-page:only-child,

.owl-pagination:empty,

.owl-controls:empty {

    display: none !important;

}





.cws-image-bg-wrap,

.cws-row-bg-wrap {

    position: absolute !important;

    top: 0 !important;

    left: 0 !important;

    width: 100% !important;

    height: 100% !important;

    z-index: 1 !important;

    overflow: hidden !important;

    pointer-events: none !important;

}



.cws-image-bg,

.cws-row-bg-bot {

    position: absolute !important;

    top: 0 !important;

    left: 0 !important;

    width: 100% !important;

    height: 100% !important;

    z-index: 1 !important;

    background-size: cover !important;

    background-position: center !important;

    background-repeat: no-repeat !important;
    pointer-events: none !important;
    border-radius: inherit;
    overflow: hidden !important;
}

.cws-overlay-bg,
.cws-row-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 2 !important;
    pointer-events: none !important;
    border-radius: inherit;
}



/* ==========================================================================

   5. Footer 3-Column Layout

   ========================================================================== */

#footer,

.mishadort-footer-wrap {

    position: relative;

    z-index: 2;

    width: 100%;

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

}



.footer-overlay {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: rgba(39, 43, 49, 0.45);

    z-index: 1;

}



#footer_widgets {

    position: relative;

    z-index: 3;

    padding: 80px 0 80px;

}



#footer_widgets_container > p,

#footer_widgets_container > br {

    display: none !important;

}





.footer_main_logo img {

    max-height: 140px;

    width: auto;

    margin: 0 auto;

}



.footer_social_icons {

    display: flex;

    justify-content: center;

    gap: 10px;

    margin-top: 15px;

}



.footer_social_icons .social_circle_btn {

    width: 38px;

    height: 38px;

    border-radius: 50%;

    border: 2px solid #ffffff;

    color: #ffffff;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    font-size: 16px;

    text-decoration: none;

    transition: all 0.3s ease;

}



.footer_social_icons .social_circle_btn:hover {

    background: #ffffff;

    color: #4b4342;

}



.footer-subscribe-form {

    width: 100%;

    max-width: 340px;

    margin: 10px auto 0;

}



.footer-subscribe-form .subscribe-input-wrap {

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 12px;

}



.footer-subscribe-form input[type="email"] {

    width: 100%;

    background: rgba(255, 255, 255, 0.1);

    border: 2px solid rgba(255, 255, 255, 0.25);

    border-radius: 30px;

    padding: 10px 20px;

    color: #ffffff;

    font-size: 14px;

    outline: none;

    text-align: center;

    box-sizing: border-box;

}



.footer-widget .widgettitle,

.footer-col-left .widgettitle,

.footer-col-right .widgettitle {

    font-family: 'Merienda One', cursive;

    font-size: 24px;

    color: #ffffff;

    margin: 0 0 6px;

    font-weight: 400;

}



.footer-divider-mini {

    margin-bottom: 15px;

    text-align: center;

}



.footer-divider-mini img {

    height: 14px;

    display: inline-block;

}



#site_footer {

    position: relative;

    z-index: 3;

    background: rgba(0, 0, 0, 0.45);

    padding: 25px 0;

    font-size: 13px;

    color: #b0b0b0;

    text-align: center;

}



/* ==========================================================================

   6. Micro-Precision Parity Adjustments

   ========================================================================== */

.bellaria_button.alt {

    font-size: 20px !important;

    line-height: 36px !important;

    box-shadow: 0 0 0 3px #ffffff !important;

}



.vc_tta-tabs .vc_tta-tab > a {

    display: block !important;

}



.vc_tta-accordion .vc_tta-panel-title > a {

    display: block !important;

    line-height: 23px !important;

}



.banner_wrapper {

    color: #4b4342;

}



.bellaria_banner .banner_button {

    color: #4b4342;

}



/* Circular Milestone & Pie Chart */

.bellaria_pie_chart,

.bellaria_milestone {

    text-align: center;

    margin-bottom: 30px;

}



.bellaria_pie_inner {

    position: relative;

    width: 140px;

    height: 140px;

    margin: 0 auto 15px;

}



.bellaria_pie_svg {

    width: 100%;

    height: 100%;

    transform: rotate(-90deg);

}



.bellaria_pie_inner .pie_value {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    font-family: 'Merienda One', cursive;

    font-size: 22px;

    font-weight: 700;

}



.bellaria_milestone_title {

    font-family: 'Merienda One', cursive;

    font-size: 18px;

    color: #4b4342;

    margin-top: 10px;

}



/* Mobile Header & Navigation */

#mobile_header {

    display: none;

    position: relative;

    z-index: 99999;

    background: #ffffff;

    padding: 14px 0;

    box-shadow: 0 2px 10px rgba(0,0,0,0.06);

}



@media screen and (max-width: 991px) {

    #site_header,

    .mishadort-site-header {

        display: none !important;

    }



    #mobile_header {

        display: block !important;

    }



    #mobile_header .bellaria_layout_container {

        display: flex !important;

        justify-content: space-between !important;

        align-items: center !important;

        width: calc(100% - 40px) !important;

        max-width: 100% !important;

        margin: 0 auto !important;

        padding: 0 !important;

        box-sizing: border-box !important;

    }



    #mobile_header .header_logo {

        display: flex !important;

        align-items: center !important;

        margin: 0 !important;

        flex: 0 0 auto !important;

    }



    #mobile_header :is(.header_logo_img, .header_logo img) {

        max-height: 44px !important;

        width: auto !important;

        object-fit: contain !important;

        display: block !important;

    }



    #mobile_header .header_wrap_menu {

        display: flex !important;

        align-items: center !important;

    }



    #mobile_header .sandwich_switcher {

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

        width: 44px !important;

        height: 44px !important;

        cursor: pointer !important;

        position: relative !important;

        z-index: 100000 !important;

    }



    #mobile_header .sandwich_switcher .switcher {

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

        width: 100% !important;

        height: 100% !important;

        cursor: pointer !important;

        text-decoration: none !important;

    }



    #mobile_header .sandwich_switcher .ham {

        position: relative !important;

        display: block !important;

        width: 24px !important;

        height: 3px !important;

        background-color: #4b4342 !important;

        border-radius: 2px !important;

        transition: all 0.3s ease !important;

    }



    #mobile_header .sandwich_switcher .ham:before,

    #mobile_header .sandwich_switcher .ham:after {

        content: '' !important;

        position: absolute !important;

        left: 0 !important;

        width: 24px !important;

        height: 3px !important;

        background-color: #4b4342 !important;

        border-radius: 2px !important;

        transition: all 0.3s ease !important;

    }



    #mobile_header .sandwich_switcher .ham:before {

        top: -8px !important;

    }



    #mobile_header .sandwich_switcher .ham:after {

        top: 8px !important;

    }



    #mobile_header.sandwich_active .sandwich_switcher .ham {

        background-color: transparent !important;

    }



    #mobile_header.sandwich_active .sandwich_switcher .ham:before {

        top: 0 !important;

        transform: rotate(-45deg) !important;

    }



    #mobile_header.sandwich_active .sandwich_switcher .ham:after {

        top: 0 !important;

        transform: rotate(45deg) !important;

    }



    #mobile_menu_wrapper {

        position: absolute !important;

        top: 100% !important;

        left: 15px !important;

        right: 15px !important;

        width: calc(100% - 30px) !important;

        margin: 0 !important;

        background: #ffffff !important;

        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15) !important;

        border-radius: 8px !important;

        z-index: 999999 !important;

        max-height: 80vh !important;

        overflow-y: auto !important;

        box-sizing: border-box !important;

        border-top: 2px solid #5fcac7 !important;

    }



    #mobile_menu_wrapper .bellaria_layout_container {

        display: block !important;

        width: 100% !important;

        padding: 10px 20px 15px 20px !important;

        margin: 0 !important;

        box-sizing: border-box !important;

    }



    #mobile_menu {

        list-style: none !important;

        padding: 0 !important;

        margin: 0 !important;

    }



    #mobile_menu .menu-item {

        position: relative !important;

        border-bottom: 1px solid #f0f0f0 !important;

        padding: 10px 0 !important;

        display: block !important;

    }



    #mobile_menu .menu-item:last-child {

        border-bottom: none !important;

    }



    #mobile_menu .menu-item > a,
    #mobile_menu .wp-block-navigation-item__content {

        font-family: 'Merienda One', cursive !important;

        font-size: 17px !important;

        line-height: 32px !important;

        color: #4b4342 !important;

        text-decoration: none !important;

        text-transform: none !important;

        letter-spacing: normal !important;

        display: inline-block !important;

        transition: color 0.2s ease !important;

    }



    #mobile_menu .menu-item > a:hover,
    #mobile_menu .wp-block-navigation-item__content:hover,
    #mobile_menu .menu-item.current-menu-item > a,
    #mobile_menu .menu-item.current_page_item > a,
    #mobile_menu .menu-item.current-menu-ancestor > a,
    #mobile_menu .menu-item.current_page_ancestor > a,
    #mobile_menu .menu-item.current-menu-parent > a,
    #mobile_menu .menu-item.current_page_parent > a,
    #mobile_menu .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
    #mobile_menu .wp-block-navigation-item.current_page_item > .wp-block-navigation-item__content,
    #mobile_menu .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content,
    #mobile_menu .wp-block-navigation-item.current_page_ancestor > .wp-block-navigation-item__content,
    #mobile_menu .wp-block-navigation-item.current-menu-parent > .wp-block-navigation-item__content,
    #mobile_menu .wp-block-navigation-item.current_page_parent > .wp-block-navigation-item__content {
        color: #5fcac7 !important;
    }



    #mobile_menu .menu-item > .pointer,
    #mobile_menu .wp-block-navigation-item > .pointer,
    #mobile_menu .wp-block-navigation-submenu > .pointer {

        position: absolute !important;

        top: 8px !important;

        right: 0 !important;

        width: 36px !important;

        height: 36px !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

        cursor: pointer !important;

        transition: transform 0.3s ease !important;

    }



    #mobile_menu .menu-item > .pointer:after,
    #mobile_menu .wp-block-navigation-item > .pointer:after,
    #mobile_menu .wp-block-navigation-submenu > .pointer:after {

        content: '\f105' !important;

        font-family: 'Font Awesome 5 Free' !important;

        font-weight: 900 !important;

        font-size: 15px !important;

        color: #888888 !important;

    }

    /* Suppress duplicate :before chevron from cws_main.css */
    #mobile_menu .pointer:before,
    #mobile_menu .menu-item > .pointer:before,
    #mobile_menu .wp-block-navigation-item > .pointer:before,
    #mobile_menu .wp-block-navigation-submenu > .pointer:before {
        content: none !important;
        display: none !important;
    }

    /* Suppress desktop flyout label arrow inside mobile menu */
    #mobile_menu .wp-block-navigation-item__label::after,
    #mobile_menu .wp-block-navigation-submenu > .wp-block-navigation-item__content .wp-block-navigation-item__label::after,
    #mobile_header .wp-block-navigation-item__label::after {
        content: none !important;
        display: none !important;
    }



    #mobile_menu .menu-item.active > .pointer,
    #mobile_menu .wp-block-navigation-item.active > .pointer,
    #mobile_menu .wp-block-navigation-submenu.active > .pointer {

        transform: rotate(90deg) !important;

    }



    #mobile_menu .sub-menu,
    #mobile_menu .wp-block-navigation__submenu-container {

        display: none !important;

        visibility: visible !important;

        opacity: 1 !important;

        position: static !important;

        width: 100% !important;

        box-shadow: none !important;

        border: none !important;

        list-style: none !important;

        padding: 4px 0 4px 16px !important;

        margin: 0 !important;

        background: transparent !important;

    }



    #mobile_menu .menu-item.active > .sub-menu,
    #mobile_menu .menu-item.active > .wp-block-navigation__submenu-container,
    #mobile_menu .wp-block-navigation-item.active > .sub-menu,
    #mobile_menu .wp-block-navigation-item.active > .wp-block-navigation__submenu-container,
    #mobile_menu .wp-block-navigation-submenu.active > .sub-menu,
    #mobile_menu .wp-block-navigation-submenu.active > .wp-block-navigation__submenu-container {

        display: block !important;

        visibility: visible !important;

        opacity: 1 !important;

    }



    #mobile_menu .sub-menu,
    #mobile_menu .sub-menu li,
    #mobile_menu .sub-menu .menu-item,
    #mobile_menu .sub-menu .menu-item > a,
    #mobile_menu .sub-menu .wp-block-navigation-item__content,
    #mobile_menu .wp-block-navigation__submenu-container,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        text-align: left !important;
    }

    #mobile_menu .sub-menu .menu-item,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item {
        border-bottom: 1px solid #f7f7f7 !important;
        padding: 6px 0 !important;
        position: relative !important;
    }

    #mobile_menu .sub-menu .menu-item > a,
    #mobile_menu .sub-menu .wp-block-navigation-item__content,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        font-family: 'Comfortaa', cursive, sans-serif !important;
        font-size: 15px !important;
        color: #666666 !important;
        line-height: 26px !important;
        padding: 0 0 0 16px !important;
        display: inline-block !important;
        position: relative !important;
        text-transform: none !important;
        letter-spacing: normal !important;
    }

    #mobile_menu .sub-menu .menu-item > a:before,
    #mobile_menu .sub-menu .wp-block-navigation-item__content:before,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content:before {
        content: '' !important;
        position: absolute !important;
        left: 0 !important;
        top: 50% !important;
        margin-top: -2px !important;
        width: 4px !important;
        height: 4px !important;
        border-radius: 50% !important;
        background-color: #ff91a4 !important;
        background: #ff91a4 !important;
        display: none !important;
    }

    #mobile_menu .sub-menu .menu-item.current-menu-item > a:before,
    #mobile_menu .sub-menu .menu-item.current_page_item > a:before,
    #mobile_menu .sub-menu .menu-item.current-menu-ancestor > a:before,
    #mobile_menu .sub-menu .menu-item.current_page_ancestor > a:before,
    #mobile_menu .sub-menu .menu-item.current-menu-parent > a:before,
    #mobile_menu .sub-menu .menu-item.current_page_parent > a:before,
    #mobile_menu .sub-menu .menu-item:hover > a:before,
    #mobile_menu .sub-menu .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content:before,
    #mobile_menu .sub-menu .wp-block-navigation-item.current_page_item > .wp-block-navigation-item__content:before,
    #mobile_menu .sub-menu .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content:before,
    #mobile_menu .sub-menu .wp-block-navigation-item.current_page_ancestor > .wp-block-navigation-item__content:before,
    #mobile_menu .sub-menu .wp-block-navigation-item:hover > .wp-block-navigation-item__content:before,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content:before,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item.current_page_item > .wp-block-navigation-item__content:before,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content:before,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item.current_page_ancestor > .wp-block-navigation-item__content:before,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item:hover > .wp-block-navigation-item__content:before {
        display: block !important;
    }

    /* Suppress desktop cyan divider on mobile submenu items */
    #mobile_menu .sub-menu .menu-item > a:after,
    #mobile_menu .sub-menu .wp-block-navigation-item__content:after,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content:after,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item:after {
        content: none !important;
        display: none !important;
    }

    #mobile_menu .sub-menu .menu-item > a:hover,
    #mobile_menu .sub-menu .wp-block-navigation-item__content:hover,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
    #mobile_menu .sub-menu .menu-item.current-menu-item > a,
    #mobile_menu .sub-menu .menu-item.current_page_item > a,
    #mobile_menu .sub-menu .menu-item.current-menu-ancestor > a,
    #mobile_menu .sub-menu .menu-item.current_page_ancestor > a,
    #mobile_menu .sub-menu .menu-item.current-menu-parent > a,
    #mobile_menu .sub-menu .menu-item.current_page_parent > a,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
    #mobile_menu .wp-block-navigation__submenu-container .wp-block-navigation-item.current_page_item > .wp-block-navigation-item__content {
        color: #5fcac7 !important;
    }


}



/* Authentic WPBakery filled row column padding */

.vc_row-has-fill .vc_column_container > .vc_column-inner,

.vc_row-has-fill > .mishadort-row-inner > .vc_column_container > .vc_column-inner {

    padding-top: 30px;

}



@media (max-width: 767px) {

    .vc_column_container > .vc_column-inner {

        padding-bottom: 20px;

    }



    .vc_col-sm-3,

    .vc_col-sm-4,

    .vc_col-sm-6,

    .vc_col-sm-12 {

        flex: 0 0 100% !important;

        max-width: 100% !important;

        margin-bottom: 25px !important;

    }

}



/* ==========================================================================

   Progress Bar (Authentic Bellaria Bead Pin & Typography)

   ========================================================================== */

.bellaria_pb {

    position: relative;

    z-index: 1;

    width: 100%;

    margin-bottom: 30px;

}



.bellaria_pb .bellaria_pb_title {

    font-family: 'Comfortaa', cursive, sans-serif !important;

    font-size: 17px !important;

    color: #4b4342 !important;

    margin: 0 0 10px !important;

    line-height: 29px !important;

}



.bellaria_pb_bar {

    display: block;

    position: relative;

    height: 5px;

    background: #e3e3e3;

    border-radius: 8px;

    overflow: visible;

}



.bellaria_pb_progress {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    border-radius: 8px;
    background-color: #ff91a4;
    color: #ff91a4;
    overflow: visible;
}



.bellaria_pb_progress .indicator {

    position: absolute;

    bottom: 15px;

    top: auto;

    right: -25px;

    font-family: 'Merienda One', cursive;

    font-size: 19px;

    font-weight: 400;

    color: #4b4342;

    background: transparent;

    padding: 0;

    line-height: 1;

}



/* The knob at the end of the bar. The reference draws it on the progress

   element itself (cws_main.css .bellaria_pb_progress:before) as a 17px ring

   with a white centre, NOT as a solid dot under the indicator - which is what

   an earlier .indicator:after here was faking, in the wrong place and colour.

   border-color:inherit resolves to the bar's own colour. */

.bellaria_pb_progress:before {

    content: '';

    position: absolute;

    z-index: 0;

    top: -5px;

    right: -12px;

    width: 17px;

    height: 17px;

    border: 5px solid;

    box-sizing: border-box;

    border-radius: 50%;

    border-color: inherit;

    background: #ffffff;

}







/* ==========================================================================

   Know Us Better (3 Icons Static Rest State - No Hover Animations)



   This used to be a blanket `.small *` / `.icon_center *` rule killing transform,

   transition and animation on EVERY descendant. It sat dormant while those

   classes were never emitted; the moment the renderer started emitting them (to

   match the reference's "small icon_center with_frame") it began stripping the

   `translate(-50%, -50%)` that centres the icon inside its scalloped frame - so

   the glyph sat down and to the right of the frame on "Know Us Better" and

   "Magic Processing". Measured: our icon `transform: none` at x=175 against the

   reference's `matrix(1,0,0,1,-30,-31.5)` at x=145.



   The intent - no hover animation on these static icon blocks - is kept, but the

   centring wrappers are excluded so they keep their positioning transform.

/* Services hover states are controlled per instance via data-style by mishadort_cws_sc_services, matching authentic Bellaria. */



/* ==========================================================================

   Footer Layout & Follow Us Social Icons (Authentic Bellaria Parity)

   ========================================================================== */

#footer {

    position: relative;

    z-index: 1;

}



#footer_widgets {

    padding: 70px 0 50px 0 !important;

    position: relative;

    z-index: 2;

}



/* Responsive Footer Widgets Container */

#footer_widgets_container {

    display: flex !important;

    flex-wrap: wrap !important;

    justify-content: space-between !important;

    align-items: center !important;

    list-style: none !important;

    margin: 0 auto !important;

    width: 100% !important;

}



#footer_widgets_container > .widget {

    padding: 0 15px !important;

    box-sizing: border-box !important;

    text-align: center !important;

    margin: 0 !important;

}



/* Desktop (> 980px) */

@media (min-width: 981px) {

    #footer_widgets_container {

        flex-direction: row !important;

        flex-wrap: nowrap !important;

    }

    #footer_widgets_container > .widget {

        flex: 1 1 33.333% !important;

        max-width: 380px !important;

    }

    #footer_widgets_container > .widget:only-child {

        flex: 0 0 100% !important;

        max-width: 100% !important;

    }

    .footer-col-left,
    .footer-col-center,
    .footer-col-right {
        flex: 1 1 33.333% !important;
        max-width: 33.333% !important;
    }

    .footer-col-center {

        flex: 0 0 30% !important;

        max-width: 30% !important;

    }

}



/* Tablet (768px - 980px) */

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

    #footer_widgets_container {

        flex-direction: row !important;

        flex-wrap: wrap !important;

        justify-content: center !important;

        gap: 25px 2% !important;

    }

    #footer_widgets_container > .widget {

        flex: 0 0 48% !important;

        max-width: 48% !important;

        margin-bottom: 20px !important;

    }

    #footer_widgets_container > .widget:only-child,

    #footer_widgets_container > .widget:last-child:nth-child(odd) {

        flex: 0 0 100% !important;

        max-width: 100% !important;

    }

    .footer-col-center {

        order: -1;

        flex: 0 0 100% !important;

        max-width: 100% !important;

        margin-bottom: 20px !important;

    }

}



/* Mobile (< 768px) */

@media (max-width: 767px) {

    #footer_widgets_container {

        flex-direction: column !important;

        flex-wrap: nowrap !important;

        align-items: center !important;

        gap: 30px !important;

    }

    #footer_widgets_container > .widget {

        flex: 0 0 100% !important;

        max-width: 100% !important;

        width: 100% !important;

        text-align: center !important;

        margin: 0 0 25px 0 !important;

        padding: 0 15px !important;

        box-sizing: border-box !important;

    }

    #footer_widgets_container > .widget:last-child {

        margin-bottom: 0 !important;

    }

    .footer-col-left,

    .footer-col-center,

    .footer-col-right {

        flex: 0 0 100% !important;

        max-width: 100% !important;

        width: 100% !important;

    }

    .subscribe-input-wrap {

        flex-direction: column !important;

        width: 100% !important;

    }

    .subscribe-input-wrap input {

        width: 100% !important;

        max-width: 280px !important;

    }

}



#footer_widgets .widgettitle {

    font-family: 'Merienda One', cursive !important;

    font-size: 28px !important;

    line-height: 39px !important;

    color: #ffffff !important;

    text-align: center !important;

    margin: 10px 0 20px 0 !important;

}



#footer_widgets .widgettitle > span {

    font-size: 28px !important;

    color: #ffffff !important;

}



#footer_widgets .widgettitle > svg {

    fill: #ffffff !important;

    max-width: 53px !important;

    max-height: 26px !important;

    display: block !important;

    margin: 10px auto 0 !important;

}



.widget_media_image img {

    display: block !important;

    margin: 0 auto !important;

    max-width: 300px !important;

    height: auto !important;

}



.subscribe-input-wrap {

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    gap: 10px !important;

    flex-wrap: wrap !important;

    margin-top: 15px !important;

}



.subscribe-input-wrap input[type="email"] {

    background: #ffffff !important;

    border: 0 !important;

    border-radius: 25px !important;

    padding: 10px 18px !important;

    font-size: 14px !important;

    color: #4b4342 !important;

    outline: none !important;

    width: 210px !important;

    max-width: 100% !important;

    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;

}



.subscribe-input-wrap input[type="email"]::placeholder {

    color: #888888 !important;

}



.subscribe-input-wrap .bellaria_button {

    margin: 0 !important;

}



.cws_social_icons {

    display: block !important;

    text-align: center !important;

    margin-top: 10px !important;

    /* Five 60px icons plus their gutters need 350px; the container was being

       held to 340 and the last icon wrapped to a second row. */

    white-space: normal !important;

}

.cws_social_icons .cws_icon:last-child {
    margin-right: 0 !important;
}



.cws_social_icons.cws_soc_icon_align_center {

    text-align: center !important;

}



.cws_social_icons.icon_size_regular .cws_icon {

    width: 60px !important;

    height: 60px !important;

    line-height: 60px !important;

    font-size: 25px !important;

}



.cws_social_icons .cws_icon {

    display: inline-block !important;

    text-align: center !important;

    /* Reference gutter: 10px on the right only (was 6px each side = 12px). */

    margin: 0 10px 0 0 !important;

    position: relative !important;

    z-index: 1 !important;

    /* NOT !important: the glyph colour is a per-instance shortcode attribute

       (icon_color) emitted inline - e.g. the dessert/coffee footers use #d0cece.

       An !important here pinned every icon on the site to #4b4342. */

    color: #4b4342;

    text-decoration: none !important;

    transition: all 0.3s ease !important;

}



.cws_social_icons .cws_icon svg {

    position: absolute !important;

    top: 0 !important;

    left: 0 !important;

    width: 100% !important;

    height: 100% !important;

    stroke-width: 35px !important;

    transition: all 0.3s ease !important;

    z-index: -1 !important;

}



.cws_social_icons .cws_icon:before {

    position: relative !important;

    z-index: 2 !important;

    color: inherit;

    transition: color 0.3s ease !important;

}



/* No global .cws_icon:hover rule - the reference has none. Every hover colour

   is per-instance, from the shortcode's icon_color_hover / bg_hover_color /

   stroke_hover_color, emitted as a scoped rule by mishadort_cws_sc_social_icons().

   The block that used to live here forced #ffffff glyphs and a #5fcac7 fill with

   !important on every icon on the site, plus a rotate(18deg) the reference does

   not do, so no widget ever got its own hover colours. */



#site_footer {

    /* NOT !important: the copyright bar colour is a per-page option

       (copyrights_bg_color / _opacity) emitted as an inline style - e.g.

       /home-wedding/ is rgba(53,14,4,0.6). An !important here beat that inline

       value and forced every page to the rgba(0,0,0,0.3) default. */

    background-color: rgba(0, 0, 0, 0.3);

    padding: 50px 0 30px 0 !important;

    margin-top: -20px !important;

}



#site_copyrights {

    text-align: center !important;

    color: #ffffff !important;

    font-family: 'Comfortaa', cursive, sans-serif !important;

    font-size: 14px !important;

    line-height: 25px !important;

}



/* ==========================================================================

   Portfolio Masonry & Grid (Authentic Bellaria Layout & Hover Effects)

   ========================================================================== */

.posts_grid.cwsportfolio_posts_grid .bellaria_grid.isotope.masonry {

    position: relative !important;

    display: block !important;

    /* Reference expands the grid 30px past its wrapper via -15px side margins

       so items land on the gutter grid (e.g. 4-col items become 300px, not

       285px). width:100% + margin:0 auto pinned it and made every item narrow. */

    width: auto !important;

    margin: 0 -15px !important;

    padding: 0 !important;

}



.cwsportfolio_posts_grid .bellaria_grid .grid-size {

    position: absolute !important;

    visibility: hidden !important;

    pointer-events: none !important;

}



.posts_grid_4 .grid-size,

.posts_grid_4 .item {

    width: 25%;

}



.posts_grid_3 .grid-size,

.posts_grid_3 .item {

    width: 33.333333%;

}



.posts_grid_2 .grid-size,

.posts_grid_2 .item {

    width: 50%;

}



.posts_grid_1 .grid-size,

.posts_grid_1 .item {

    width: 100%;

}



.cwsportfolio_posts_grid .item {

    box-sizing: border-box !important;

    padding: 10px !important;

    float: left;

}



.cwsportfolio_posts_grid.wide_style .item {

    padding: 0 !important;

}



.cwsportfolio_posts_grid .item .item_content {

    position: relative !important;

    width: 100% !important;

    height: 100% !important;

    overflow: hidden !important;

    border-radius: 10px !important;

}



.cwsportfolio_posts_grid .item .post_media,

.cwsportfolio_posts_grid .item .pic {

    display: block !important;

    width: 100% !important;

    height: 100% !important;

    border-radius: 10px !important;

    overflow: hidden !important;

    margin: 0 !important;

}



.cwsportfolio_posts_grid .item .pic img {

    width: 100% !important;

    height: 100% !important;

    object-fit: cover !important;

    display: block !important;

    border-radius: 10px !important;

    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important;

}



.cwsportfolio_posts_grid .item:hover .pic img {

    transform: scale(1.08) !important;

}



.cwsportfolio_posts_grid .cwsportfolio_content_wrap {

    position: absolute !important;

    top: 0 !important;

    left: 0 !important;

    width: 100% !important;

    height: 100% !important;

    z-index: 2 !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;

    justify-content: center !important;

    opacity: 0 !important;

    transition: opacity 0.4s ease !important;

}



.cwsportfolio_posts_grid .item:hover .cwsportfolio_content_wrap {

    opacity: 1 !important;

}



.cwsportfolio_posts_grid .cwsportfolio_content_wrap .links.area {

    position: absolute !important;

    top: 0 !important;

    left: 0 !important;

    width: 100% !important;

    height: 100% !important;

    z-index: 1 !important;

}



.cwsportfolio_posts_grid .cwsportfolio_content_wrap .hover-effect {

    position: absolute !important;

    top: 0 !important;

    left: 0 !important;

    width: 100% !important;

    height: 100% !important;

    z-index: 0 !important;

    pointer-events: none !important;

}



.cwsportfolio_posts_grid .cwsportfolio_content_wrap .hover-effect svg {

    width: 100% !important;

    height: 100% !important;

    display: block !important;

}



.cwsportfolio_posts_grid .cwsportfolio_post_title {

    position: relative !important;

    z-index: 2 !important;

    font-family: 'Merienda One', cursive !important;

    font-size: 22px !important;

    font-weight: 500 !important;

    color: #4b4342 !important;

    text-align: center !important;

    margin: 0 !important;

    padding: 0 15px !important;

}



.cwsportfolio_posts_grid .cwsportfolio_post_title a {

    color: #4b4342 !important;

    text-decoration: none !important;

}



/* under_img items carry a 20px bottom gap and are not clipped (measured).

   Scoped to .under_img so the 4-column grids keep their own margin-bottom:0. */

.cwsportfolio_posts_grid .item.under_img {

    margin-bottom: 20px !important;

    overflow: visible !important;

}



/* The legacy .item_content rule pins height:100% + overflow:hidden, which is

   correct for the overlay (inside_img) layout but clips the title and excerpt

   that sit BELOW the image in under_img. Let it grow instead. */

.cwsportfolio_posts_grid .item.under_img .item_content {

    height: auto !important;

    overflow: visible !important;

    border-radius: 0 !important;

}



.cwsportfolio_posts_grid .item.under_img .post_media {

    overflow: hidden !important;

    border-radius: 10px !important;

}



/* under_img layout: title sits below the image, full item width, larger type.

   Values measured from the reference theme.

   The base .portfolio_item_post rule hides the title (opacity:0 + translateY)

   because it is a hover-reveal for the inside_img overlay. Under the image it

   must always be visible. */

.cwsportfolio_posts_grid .under_img .cwsportfolio_post_title {

    font-size: 24px !important;

    line-height: 28.8px !important;

    padding: 0 !important;

    margin: 20px 0 5px !important;

    opacity: 1 !important;

    transform: none !important;

}



/* Filter bar geometry measured from the reference theme: the wrap is an

   inline-block centred by the parent (not a flex row), items are inline-block

   with 40px side padding, and the .filter_svg separators provide the spacing. */

/* Only the filter LAYOUT is centred. simple_filter is emitted on every

   portfolio section whether or not it has a filter bar, so keying off it

   centred grids the reference leaves at text-align:start. */

.posts_grid_filter {

    text-align: center !important;

}



.filter_wrap {

    display: inline-block !important;

    margin: 0 auto 30px !important;

    list-style: none !important;

    padding: 0 !important;

    text-align: center !important;

}



.filter_wrap .filter {

    display: inline-block !important;

    vertical-align: top !important;

    cursor: pointer !important;

    text-align: center !important;

    position: relative !important;

}



.filter_wrap .filter h5 {

    font-family: 'Merienda One', cursive !important;

    font-size: 24px !important;

    line-height: 28.8px !important;

    color: #4b4342 !important;

    margin: 0 !important;

    transition: color 0.3s ease !important;

}



.filter_wrap .filter:hover h5,

.filter_wrap .filter.active h5 {

    color: #5fcac7 !important;

}



.filter_wrap .filter .filter_shape {

    width: 47px !important;

    height: 29px !important;

    margin: 0 auto !important;

    display: block !important;

    opacity: 0 !important;

    transition: opacity 0.3s ease !important;

}



.filter_wrap .filter.active .filter_shape {

    opacity: 1 !important;

}



/* ==========================================================================

   Exact Computed Style Parity Overrides

   ========================================================================== */

.bellaria_button.alt,

.bellaria_button.figure.alt,

.bellaria_button.with_bg.alt,

.bellaria_button.figure.with_bg.alt,

a.bellaria_button.alt {

    background-color: #ea8899 !important;

    border-color: #ea8899 !important;

}



.bellaria_pb_bar {

    background-color: #e3e3e3 !important;

    border-radius: 8px !important;

}



.bellaria_pb_progress {

    border-radius: 8px !important;

}



#footer_widgets,

.footer_widgets {

    padding-top: 80px !important;

    padding-bottom: 80px !important;

}



.menu_wrapper.a_center {

    margin-top: 0px !important;

}



/* ==========================================================================

   Migrated Gutenberg Block Layouts & Carousel Frontend Styles

   ========================================================================== */

.specialties_carousel,

.owl-carousel-wrap,

.cws_carousel,

.cws_testimonials_grid {

    position: relative !important;

    overflow: hidden !important;

    margin: 30px 0 !important;

    width: 100% !important;

}



.service_item_card {

    background: #ffffff;

    border: 1px solid #efeae4;

    border-radius: 24px;

    padding: 30px 20px;

    text-align: center;

    box-shadow: 0 4px 20px rgba(0,0,0,0.04);

    margin: 15px 0;

    transition: transform 0.3s ease, box-shadow 0.3s ease;

}



.service_item_card:hover {

    transform: translateY(-5px);

    box-shadow: 0 8px 30px rgba(0,0,0,0.08);

}



.service_item_card .service_image_wrap {

    width: 140px;

    height: 140px;

    border-radius: 50%;

    overflow: hidden;

    margin: 0 auto 15px;

    border: 4px solid #5fcac7;

    box-shadow: 0 4px 15px rgba(0,0,0,0.08);

}



.service_item_card .service_image_wrap img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

}



.testimonial_card_item {

    background: #ffffff;

    border: 1px solid #efeae4;

    border-radius: 24px;

    padding: 30px 25px;

    text-align: center;

    box-shadow: 0 4px 20px rgba(0,0,0,0.04);

    margin: 15px 0;

}



.cws-row-cropped.crop-style_1 {

    position: relative;

    padding: 70px 40px 190px !important;

    margin-top: -100px;

    margin-bottom: 0;

    background-color: #ff91a4 !important;

    color: #ffffff !important;

    -webkit-mask-image: url('assets/images/svg/shape_menu_1.svg');

    -webkit-mask-position: bottom;

    -webkit-mask-size: cover;

    -webkit-mask-repeat: no-repeat;

    mask-image: url('assets/images/svg/shape_menu_1.svg');

    mask-position: bottom;

    mask-size: cover;

    mask-repeat: no-repeat;

}



.cws-row-cropped.crop-style_1 h1,

.cws-row-cropped.crop-style_1 h2,

.cws-row-cropped.crop-style_1 h3,

.cws-row-cropped.crop-style_1 h4,

.cws-row-cropped.crop-style_1 p,

.cws-row-cropped.crop-style_1 span,

.cws-row-cropped.crop-style_1 .service_item_card p {

    color: #ffffff !important;

}



.cws-row-cropped.crop-style_1 .service_item_card {

    background: transparent !important;

    border: none !important;

    box-shadow: none !important;

}



.wp-block-button.is-style-cutout-figure a {

    position: relative;

    display: inline-block;

    padding: 12px 35px;

    font-family: 'Merienda One', cursive;

    text-decoration: none;

    border-radius: 30px;

    background-color: #5fcac7;

    color: #ffffff;

    transition: all 0.3s ease;

}



.wp-block-button.is-style-alt-pink a {

    background-color: #ff91a4;

    color: #ffffff;

}



/* ==========================================================================

   Sidebar page layout

   Reference lays content + sidebar out as a flex row inside the layout

   container (content 870px, 30px gap, sidebar 270px = 1170px). Without this

   the sidebar falls BELOW the content instead of beside it.

   ========================================================================== */

#page,
.mishadort-page-main {
    overflow-x: clip;
    margin-top: 40px !important;
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}




#page.single_sidebar {

    display: flex !important;

    align-items: flex-start !important;

}



#page.single_sidebar > .page_content_col,
#page.single_sidebar > main {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    order: 2 !important;
}

#page.single_sidebar > .sidebar,
#page.single_sidebar > #right_sidebar,
#page.single_sidebar > .wp-block-template-part {
    flex: 0 0 270px !important;
    width: 270px !important;
    margin-left: 30px !important;
    order: 3 !important;
}

#page.single_sidebar.left_sidebar > .sidebar,
#page.single_sidebar.left_sidebar > #left_sidebar,
#page.single_sidebar.left_sidebar > .wp-block-template-part {
    order: 1 !important;
    margin-left: 0 !important;
    margin-right: 30px !important;
}

#page.single_sidebar > .wp-block-template-part > .sidebar,
#page.single_sidebar > .wp-block-template-part > aside,
#page.single_sidebar > .wp-block-template-part > div {
    width: 100% !important;
    margin-left: 0 !important;
}

/* Between 980 and 1190 the reference narrows the sidebar to 220px with a 20px
   gutter (layout.css). These need the same specificity as the 270px rule above
   or that one keeps winning and the content column ends up 640px, not 700. */
@media (max-width: 1190px) and (min-width: 981px) {
    #page.single_sidebar > .sidebar,
    #page.single_sidebar > #right_sidebar,
    #page.single_sidebar > .wp-block-template-part {
        flex: 0 0 220px !important;
        width: 220px !important;
        margin-left: 20px !important;
    }
}

/* The reference stacks at its own 980px breakpoint, not 991. */
@media (max-width: 980px) {
    #page.single_sidebar {
        display: block !important;
    }
    #page.single_sidebar > .sidebar,
    #page.single_sidebar > #right_sidebar,
    #page.single_sidebar > .wp-block-template-part {
        flex: 0 0 100% !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-top: 40px !important;
    }
}



/* Portfolio info alignment (driven by the shortcode's info_align attribute).

   Must beat the default centred rule on .cwsportfolio_post_title. */

.cwsportfolio_posts_grid .text_alignleft,

.cwsportfolio_posts_grid .cwsportfolio_post_title.text_alignleft,

.cwsportfolio_posts_grid .post_content.text_alignleft {

    text-align: left !important;

}



.cwsportfolio_posts_grid .text_alignright,

.cwsportfolio_posts_grid .cwsportfolio_post_title.text_alignright,

.cwsportfolio_posts_grid .post_content.text_alignright {

    text-align: right !important;

}



.cwsportfolio_posts_grid .text_aligncenter,

.cwsportfolio_posts_grid .cwsportfolio_post_title.text_aligncenter,

.cwsportfolio_posts_grid .post_content.text_aligncenter {

    text-align: center !important;

}



/* wpautop wraps the bare </main> emitted by the page-layout shortcode, which

   the browser parses into an empty paragraph before the sidebar. It is

   invisible in the reference, so drop the stray vertical space it adds. */

#page_content > p:empty,

.page_content_col > p:empty,

#page.single_sidebar > p:empty {

    display: none !important;

}

/* Fix for widget_media_gallery layout (WP 5+ HTML5 gallery) & Card #274 hover effect */

.widget_media_gallery .gallery {
    display: flex;
    flex-wrap: wrap;
    margin: -5px;
}

.widget_media_gallery .gallery-item {
    width: 33.333%;
    padding: 5px;
    margin: 0;
    box-sizing: border-box;
    text-align: center;
}

.widget_media_gallery .gallery-item .gallery-icon,
.widget_media_gallery .gallery-item a {
    position: relative;
    overflow: hidden;
    border-radius: 6px;
    display: block;
    line-height: 0;
}

.widget_media_gallery .gallery-item img {
    width: 100%;
    height: auto;
    border: 2px solid #cfcfcf;
    border-radius: 6px;
    display: block;
    box-sizing: border-box;
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1), border-color 0.3s ease;
}

/* Card #278: Overlay fade-in matching portfolio masonry */
.widget_media_gallery .gallery-item a::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(247, 173, 180, 0.75);
    opacity: 0;
    z-index: 2;
    transition: opacity 0.4s ease;
    pointer-events: none;
    border-radius: 4px;
}

/* Card #278: Link and zoom icons animated badge matching portfolio masonry */
.widget_media_gallery .gallery-item a::after {
    content: "\f00e\00a0\00a0\f0c1";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 13px;
    color: #ffffff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.82);
    opacity: 0;
    z-index: 3;
    transition: transform 0.45s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.4s ease;
    pointer-events: none;
    white-space: nowrap;
    background: rgba(59, 35, 20, 0.72);
    padding: 5px 10px;
    border-radius: 16px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    letter-spacing: 3px;
}

.widget_media_gallery .gallery-item:hover img,
.widget_media_gallery .gallery-item:has(:focus-visible) img {
    transform: scale(1.08);
    border-color: #ff91a4;
}

.widget_media_gallery .gallery-item:hover a::before,
.widget_media_gallery .gallery-item a:focus-visible::before {
    opacity: 1;
}

.widget_media_gallery .gallery-item:hover a::after,
.widget_media_gallery .gallery-item a:focus-visible::after {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
}

/* Card #274 & #278: Sidebar Categories widget hover animation */
.widget.widget_categories ul > li {
    transition: padding-left 0.3s ease, background 0.3s ease;
}

.widget.widget_categories ul > li > a {
    transition: color 0.3s ease;
}

.widget.widget_categories ul > li:hover,
.widget.widget_categories ul > li:nth-child(even):hover,
.widget.widget_categories ul > li:has(> a:focus-visible) {
    background: rgba(255, 145, 164, 0.12);
    padding-left: 25px;
}

.widget.widget_categories ul > li:hover > a,
.widget.widget_categories ul > li > a:hover,
.widget.widget_categories ul > li > a:focus-visible {
    color: #ff91a4;
}



/* ==========================================================================

   Unsupported-shortcode placeholder

   Marks content that is intentionally omitted because its plugin is absent, so

   it cannot be mistaken for a rendering bug. See

   mishadort_unsupported_shortcode_notice() in inc/shortcodes-content.php.

   ========================================================================== */

.mishadort-unsupported-shortcode {

    display: block;

    margin: 10px 0;

    padding: 10px 14px;

    border: 1px dashed rgba(128, 128, 128, 0.55);

    border-radius: 6px;

    background: rgba(128, 128, 128, 0.08);

    color: inherit;

    opacity: 0.75;

    font-size: 13px;

    line-height: 1.5;

    text-align: center;

}



.mishadort-unsupported-shortcode strong {

    font-family: monospace;

    font-weight: 700;

}







/* ==========================================================================

   Main-menu hover intent + viewport-aware submenu placement

   Driven by assets/js/menu-behaviour.js. `mishadort-open` holds a branch open

   through a short grace period so the pointer can travel from a parent item to

   its popup without the chain collapsing; the flip classes re-aim a submenu

   when it would otherwise open off-screen.

   ========================================================================== */

.main_menu:not(#mobile_menu) .menu-item.mishadort-open > .sub-menu,
.main_menu:not(#mobile_menu) .menu-item.mishadort-open > .wp-block-navigation__submenu-container {
    max-height: 2000px !important;
    height: auto !important;
    width: auto !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    -webkit-transform: scale(1) !important;
    transform: scale(1) !important;
    pointer-events: auto !important;
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
    -webkit-transition-duration: 0s, 0.2s, 0.2s !important;
    transition-duration: 0s, 0.2s, 0.2s !important;
}



/* Open leftward instead of rightward. */

.main_menu:not(#mobile_menu) > .menu-item.mishadort-flip > .sub-menu {

    left: auto;

    right: 0;

}



.main_menu:not(#mobile_menu) .sub-menu .menu-item.mishadort-flip > .sub-menu {

    left: auto;

    right: 100%;

    margin-left: 0;

    margin-right: 2px;

}



/* ...and back the other way, for items that would overflow the left edge. */

.main_menu:not(#mobile_menu) > .menu-item.mishadort-flip-right > .sub-menu {

    left: 0;

    right: auto;

}



.main_menu:not(#mobile_menu) .sub-menu .menu-item.mishadort-flip-right > .sub-menu {

    left: 100%;

    right: auto;

    margin-left: 2px;

    margin-right: 0;

}



/* The submenu close should be one movement, not a staged teardown. The theme

   animates opacity/visibility/transform on .sub-menu; while a branch is held open

   by menu-behaviour.js the transition is the normal one, but on the way out we

   collapse it immediately so the panel and its buttons disappear together. */

.main_menu:not(#mobile_menu) .menu-item:not(.mishadort-open):not(:hover) > .sub-menu,
.main_menu:not(#mobile_menu) .menu-item:not(.mishadort-open):not(:hover) > .wp-block-navigation__submenu-container {
    transition-duration: 0.12s;
    height: auto !important;
    width: auto !important;
    overflow: visible !important;
    pointer-events: none !important;
}

/* Ghost paragraph suppression: wpautop / block rendering leaves empty <p></p> tags around shortcodes */
p:empty {
    display: none !important;
}

/*
 * Clear stuck portfolio tile hover state on browser Back navigation (pageshow).
 * Card #273.
 * While .is-nav-restoring is active on <html>, hover styles are suppressed.
 */
.is-nav-restoring .portfolio_item_post:hover .hover-effect,
.is-nav-restoring .portfolio_item_post:hover .cwsportfolio_content_wrap,
.is-nav-restoring .portfolio_item_post:hover .links_wrap {
    opacity: 0 !important;
    transition: none !important;
}

html.is-nav-restoring .posts_grid .portfolio_item_post:hover .item_content img,
html.is-nav-restoring .portfolio_item_post:hover .item_content img,
html.is-nav-restoring .portfolio_item_post:hover .pic img {
    transform: none !important;
    transition: none !important;
}


.mishadort-nav-menu ul.wp-block-navigation__container, .mishadort-nav-menu.wp-block-navigation { gap: 0 !important; }
nav.mishadort-nav-menu, nav.mishadort-nav-menu .wp-block-navigation__container { gap: 0 !important; }

/* Parity: Header navigation item typography and color */
.desktop-menu-wrapper .main_menu .wp-block-navigation-item__content,
.desktop-menu-wrapper .mishadort-nav-menu .wp-block-navigation-item__content,
.desktop-menu-wrapper.mishadort-site-header .wp-block-navigation-item__content,
.mishadort-site-header .desktop-menu-wrapper .wp-block-navigation-item__content {
    font-family: 'Merienda One', cursive !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 36px !important;
    color: #4b4342 !important;
    padding: 20px 15px !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
}

.desktop-menu-wrapper .main_menu .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.desktop-menu-wrapper .main_menu .wp-block-navigation-item__content:hover,
.desktop-menu-wrapper .main_menu .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.desktop-menu-wrapper .main_menu .wp-block-navigation-item.current_page_item > .wp-block-navigation-item__content,
.desktop-menu-wrapper .mishadort-nav-menu .wp-block-navigation-item__content:hover,
.desktop-menu-wrapper.mishadort-site-header .wp-block-navigation-item__content:hover,
.mishadort-site-header .desktop-menu-wrapper .wp-block-navigation-item__content:hover {
    color: #5fcac7 !important;
}
#footer {
  -webkit-mask-image: url('assets/images/svg/style_1_1.svg');
  -webkit-mask-position: top;
  -webkit-mask-size: cover;
  -webkit-mask-repeat: no-repeat;
  mask-image: url('assets/images/svg/style_1_1.svg');
  mask-position: top;
  mask-size: cover;
  mask-repeat: no-repeat;
  padding-top: 50px;
  margin-top: -20px;
  position: relative;
  z-index: 10;
}
#footer:before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background-color: rgba(42,34,35,0.9) !important;
  z-index: -1;
}
#site_footer {
  -webkit-mask-image: url('assets/images/svg/shape_copyright_1.svg');
  -webkit-mask-position: top;
  -webkit-mask-size: cover;
  -webkit-mask-repeat: no-repeat;
  mask-image: url('assets/images/svg/shape_copyright_1.svg');
  mask-position: top;
  mask-size: cover;
  mask-repeat: no-repeat;
  padding-top: 50px;
  margin-top: -20px;
  background-color: rgba(0,0,0,0.3);
}
#site_copyrights { margin: 0; }
.menu_wave {
  -webkit-mask-image: url('assets/images/svg/shape_menu_1.svg');
  -webkit-mask-position: bottom;
  -webkit-mask-size: cover;
  -webkit-mask-repeat: no-repeat;
  mask-image: url('assets/images/svg/shape_menu_1.svg');
  mask-position: bottom;
  mask-size: cover;
  mask-repeat: no-repeat;
}


/* Parity overrides for Gutenberg core/navigation matching Bellaria legacy */
.main_menu .wp-block-navigation__submenu-icon {
    display: none !important;
}

.main_menu .wp-block-navigation-item {
    margin: 0 !important;
}

/* Hide Gutenberg submenu toggle arrow button on desktop to match Bellaria text-only menu items */
.wp-block-navigation .wp-block-navigation-submenu__toggle,
.main_menu .wp-block-navigation-submenu__toggle,
.main_menu button.wp-block-navigation__submenu-icon,
.main_menu .wp-block-navigation__submenu-icon {
    display: none !important;
    width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}



/* Navigation Submenu Popup Styling & Divider Bar Parity */
.main_menu:not(#mobile_menu) .sub-menu,
.main_menu:not(#mobile_menu) .wp-block-navigation__submenu-container {
    position: absolute !important;
    top: 100% !important;
    background-color: #ffffff !important;
    min-width: 200px !important;
    width: auto !important;
    height: auto !important;
    box-shadow: 1px 2px 10px -1px rgba(0, 0, 0, 0.2) !important;
    border-radius: 15px !important;
    padding: 15px 0 !important;
    list-style: none !important;
    margin: 0 !important;
    text-align: center !important;
    z-index: 100 !important;
}

.main_menu:not(#mobile_menu) .sub-menu li,
.main_menu:not(#mobile_menu) .sub-menu .wp-block-navigation-item {
    display: block !important;
    width: 100% !important;
    height: 40px !important;
    line-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    text-align: center !important;
}

.main_menu:not(#mobile_menu) .sub-menu .menu-item > a,
.main_menu:not(#mobile_menu) .sub-menu .wp-block-navigation-item__content {
    display: block !important;
    width: 100% !important;
    height: 40px !important;
    line-height: 40px !important;
    padding: 0 30px !important;
    margin: 0 !important;
    font-family: 'Comfortaa', cursive, sans-serif !important;
    font-size: 17px !important;
    font-weight: 500 !important;
    color: #4b4342 !important;
    position: relative !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    transition: color 0.5s ease !important;
}

.main_menu:not(#mobile_menu) .sub-menu .menu-item > a:hover,
.main_menu:not(#mobile_menu) .sub-menu .menu-item:hover > a,
.main_menu:not(#mobile_menu) .sub-menu .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.main_menu:not(#mobile_menu) .sub-menu .wp-block-navigation-item__content:hover,
.main_menu:not(#mobile_menu) .sub-menu .menu-item.current-menu-item > a,
.main_menu:not(#mobile_menu) .sub-menu .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
    color: #5fcac7 !important;
    background: transparent !important;
}

.main_menu:not(#mobile_menu) .sub-menu .menu-item > a:after,
.main_menu:not(#mobile_menu) .sub-menu .wp-block-navigation-item__content:after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 0 !important;
    top: auto !important;
    width: 30px !important;
    height: 2px !important;
    margin-left: -15px !important;
    background-color: #5fcac7 !important;
    pointer-events: none !important;
    display: block !important;
}

.main_menu:not(#mobile_menu) .sub-menu .menu-item:last-child > a:after,
.main_menu:not(#mobile_menu) .sub-menu .wp-block-navigation-item:last-child > a:after,
.main_menu:not(#mobile_menu) .sub-menu .wp-block-navigation-item:last-child > .wp-block-navigation-item__content:after {
    display: none !important;
}

/* 2nd-Level Nested Submenu Flyout Positioning & Styling */
.main_menu .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container,
.main_menu .sub-menu .sub-menu,
.sticky_main_nav .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container,
.sticky_main_nav .sub-menu .sub-menu {
    top: 0 !important;
    z-index: 105 !important;
}

/* Right-side navigation flyouts open to the left (avoid right viewport clipping) */
.menu-right-part .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container,
.main_menu.a_left .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container,
.sticky_main_nav .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container {
    left: auto !important;
    right: 100% !important;
    margin-right: 2px !important;
    margin-left: 0 !important;
}

/* Left-side navigation flyouts open to the right */
.menu-left-part .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container {
    left: 100% !important;
    right: auto !important;
    margin-left: 2px !important;
    margin-right: 0 !important;
}

/* Submenu Arrow Indicator for items with nested submenus */
.main_menu .wp-block-navigation__submenu-container .wp-block-navigation-submenu > .wp-block-navigation-item__content .wp-block-navigation-item__label::after,
.sticky_main_nav .wp-block-navigation__submenu-container .wp-block-navigation-submenu > .wp-block-navigation-item__content .wp-block-navigation-item__label::after {
    content: "\f105" !important;
    font-family: 'Font Awesome 5 Free' !important;
    font-weight: 900 !important;
    font-size: 14px !important;
    margin-left: 8px !important;
    display: inline-block !important;
    vertical-align: middle !important;
    color: inherit !important;
}


/* Mobile header logo dimensions parity */
#mobile_header .header_logo img,
#mobile_header .mobile_logo_link img,
#mobile_header .header_logo_img {
    max-height: 44px !important;
    height: 44px !important;
    width: auto !important;
    display: block !important;
}



/* Clean Footer Parity Styling */
#footer,
.mishadort-footer-wrap {
    -webkit-mask-image: url('assets/images/svg/style_1_1.svg');
    -webkit-mask-position: top;
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    mask-image: url('assets/images/svg/style_1_1.svg');
    mask-position: top;
    mask-size: cover;
    mask-repeat: no-repeat;
    padding-top: 50px !important;
    margin-top: -20px !important;
    position: relative;
    z-index: 10;
    background-image: url('assets/images/theme/153694902.jpg');
    background-size: cover;
    background-position: center;
}

#footer:before,
.mishadort-footer-wrap:before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(75, 67, 66, 0.9) !important;
    z-index: -1;
}

/* Card #338: Remove Gutenberg default border on navigation submenu container during hover transitions */
.main_menu .sub-menu,
.main_menu .wp-block-navigation__submenu-container {
    border: none !important;
}

/* Card #346: Authentic Bellaria Submenu Inner Rounded Teal Border Parity */
.main_menu:not(#mobile_menu) .sub-menu::before,
.main_menu:not(#mobile_menu) .wp-block-navigation__submenu-container::before,
.sticky_main_nav .sub-menu::before,
.sticky_main_nav .wp-block-navigation__submenu-container::before,
.main_menu:not(#mobile_menu).wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    z-index: 1 !important;
    top: 3px !important;
    left: 3px !important;
    right: auto !important;
    bottom: auto !important;
    width: calc(100% - 6px) !important;
    height: calc(100% - 6px) !important;
    box-sizing: border-box !important;
    border: 3px solid #5fcac7 !important;
    opacity: 0.4 !important;
    border-radius: 15px !important;
    pointer-events: none !important;
}

#site_footer,
footer.site_footer {
    -webkit-mask-image: url('assets/images/svg/shape_copyright_1.svg');
    -webkit-mask-position: top;
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    mask-image: url('assets/images/svg/shape_copyright_1.svg');
    mask-position: top;
    mask-size: cover;
    mask-repeat: no-repeat;
    padding-top: 50px !important;
    padding-bottom: 30px !important;
    margin-top: -20px !important;
    background-color: rgba(0,0,0,0.3) !important;
}

/* Footer widget title wave flourish parity */
#footer_widgets .widgettitle:not(:has(svg))::after,
.footer_widgets .widgettitle:not(:has(svg))::after,
#footer_widgets .widget .wp-block-heading:not(:has(svg))::after,
.footer_widgets .widget .wp-block-heading:not(:has(svg))::after {
	content: "";
	display: block;
	width: 53px;
	height: 26px;
	background-color: #ffffff;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 850.4 410.3'%3E%3Cpath d='M351.6,300.8c45.5,20.8,90.4,42.8,136.4,62.5c23,9.8,43.7,15,68.7,16.8c24.2,1.7,26.9-11.4,47.7-17.2 c36.4-10.2,50.6,30.7,12.4,39.4c-47,10.7-90.1,11.7-135.8-5.3c-43.6-16.2-84-40.4-125.5-61.1c-19.3-9.6-41-21.4-63.2-19.4 c-25.3,2.3-48.4,14.1-74.3,15.3c-33.4,1.5-101.6-4.4-107.8-47.3c-8-55.4,62.8-44,94.4-37.5c27.8,5.7,54.3,16.5,81.9,22 c27.9,5.7,49.2-4.2,74.5-15.3c49.2-21.6,108.5-37,152.6-67.4c-73-44.3-144.1-91.2-222.1-126.4c-68.4-30.9-157.2-64-226-12.7 c-11.1,8.3-20.3,19.6-26,32.2c-6.4,14-2.7,29.4-7.8,42.9C27.4,133.4,16,141,4.9,129.5c-10.1-10.4-2-33.4,2.1-44.6 C28.2,27.4,86.9,0.5,145,0c78.1-0.7,153.1,31.3,222.4,64.4c35.5,16.9,70.1,35.7,103.2,56.8c30.6,19.5,61.9,54.4,100.8,39.3 c68.6-26.4,131.4-75.9,210-57.7c57.6,13.4,99.3,84.7,40.5,125.7c-32.5,22.7-74.6,30.1-113.6,30c-42.6-0.1-77.9-19.1-117-32.7 c-41.5-14.4-84.9,10.2-124.1,24.2C448.9,256.6,351.9,281.1,351.6,300.8z M604.7,191.1c24.8,28.8,71.1,34.9,107.4,34.4 c31.8-0.4,94.3-7.9,110.4-41.2c23.9-49.5-49.1-56-77.9-51.8C695.1,139.9,649,169.4,604.7,191.1z M131.1,283.8 c25.5,27.4,91,30.7,122.6,7.1C212.6,263.8,153.1,259.8,131.1,283.8z'/%3E%3C/svg%3E");
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	margin: 10px auto 0 !important;
}


/* ==========================================================================
   Task #336: Footer Widget Column Widths & Breakpoints Reference Parity
   Viewports:
   - > 1190px (Desktop / 100% zoom): 3 cols x 390px (360px content) -> 5 icons
   - 981px-1190px (Tablet landscape / 110-125% zoom): 3 cols x 320px (300px content) -> 4+1 icons
   - 768px-980px (Tablet portrait / 150% zoom): 3 cols x 252px (234px content) -> 3+2 icons
   - <= 767px (Mobile): 2 cols 48% + 1 col 100%
   - <= 479px (Small mobile): 100% stacked
   ========================================================================== */
#footer_widgets_container,
.footer_widgets_container {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    list-style: none !important;
    margin: 0 auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

#footer_widgets_container > .widget,
.footer_widgets_container > .widget,
.footer_widgets_container > [class*="footer-col-"] {
    box-sizing: border-box !important;
    width: 390px !important;
    max-width: 390px !important;
    padding: 0 15px !important;
    margin: 0 !important;
    flex: 0 0 390px !important;
    text-align: center !important;
}

#footer_widgets_container .footer-col-center,
.footer_widgets_container .footer-col-center {
    width: 390px !important;
    max-width: 390px !important;
    flex: 0 0 390px !important;
}

@media screen and (max-width: 1190px) {
    #footer_widgets_container,
    .footer_widgets_container {
        margin-left: -10px !important;
        margin-right: -10px !important;
        width: calc(100% + 20px) !important;
    }
    #footer_widgets_container > .widget,
    .footer_widgets_container > .widget,
    .footer_widgets_container > [class*="footer-col-"] {
        width: 320px !important;
        max-width: 320px !important;
        padding: 0 10px !important;
        flex: 0 0 320px !important;
    }
    #footer_widgets_container .footer-col-center,
    .footer_widgets_container .footer-col-center {
        width: 320px !important;
        max-width: 320px !important;
        flex: 0 0 320px !important;
    }
}

@media screen and (max-width: 980px) {
    #footer_widgets_container,
    .footer_widgets_container {
        margin-left: -9px !important;
        margin-right: -9px !important;
        width: calc(100% + 18px) !important;
    }
    #footer_widgets_container > .widget,
    .footer_widgets_container > .widget,
    .footer_widgets_container > [class*="footer-col-"] {
        width: 252px !important;
        max-width: 252px !important;
        padding: 0 9px !important;
        flex: 0 0 252px !important;
    }
    #footer_widgets_container .footer-col-center,
    .footer_widgets_container .footer-col-center {
        order: 0 !important;
        width: 252px !important;
        max-width: 252px !important;
        flex: 0 0 252px !important;
        margin-bottom: 0 !important;
    }
}

@media screen and (max-width: 767px) {
    #footer_widgets_container,
    .footer_widgets_container {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        justify-content: space-between !important;
    }
    #footer_widgets_container > .widget,
    .footer_widgets_container > .widget,
    .footer_widgets_container > [class*="footer-col-"] {
        width: 48% !important;
        max-width: 48% !important;
        padding: 0 10px !important;
        flex: 0 0 48% !important;
        margin-bottom: 20px !important;
    }
    #footer_widgets_container .footer-col-center,
    .footer_widgets_container .footer-col-center {
        order: -1 !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
    #footer_widgets_container .footer-col-right,
    .footer_widgets_container .footer-col-right {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}

@media screen and (max-width: 479px) {
    #footer_widgets_container > .widget,
    .footer_widgets_container > .widget,
    .footer_widgets_container > [class*="footer-col-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}

/* Header Active Navigation Item Highlight & Suppress Unwanted Dot Marker (Card #509) */
.main_menu .wp-block-navigation-item.current-menu-item > a,
.main_menu .wp-block-navigation-item.current-menu-ancestor > a,
.main_menu .wp-block-navigation-submenu.current-menu-ancestor > button {
    color: #5fcac7 !important;
}
/* Card #509 / #515 / #526: Desktop navigation circular dot marker & submenu styling */
/* Main desktop navigation: 8px circular marker on top-level items only */
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-item:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-submenu:after {
    content: '' !important;
    position: absolute !important;
    z-index: 10 !important;
    left: 0 !important;
    top: 50% !important;
    margin-top: -4px !important;
    width: 8px !important;
    height: 8px !important;
    border: 3px solid #ff91a4 !important;
    box-sizing: border-box !important;
    border-radius: 50% !important;
    opacity: 0 !important;
    transform: scale(0) !important;
    transition: all 0.3s ease !important;
    display: block !important;
}

.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-item:hover:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-submenu:hover:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-item.current-menu-ancestor:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-item.current-menu-parent:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-item.current_page_item:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-item.current_page_ancestor:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-submenu.current-menu-item:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-submenu.current-menu-ancestor:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-submenu.current-menu-parent:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-submenu.current_page_item:after,
.desktop-menu-wrapper .main_menu .wp-block-navigation__container > .wp-block-navigation-submenu.current_page_ancestor:after {
    opacity: 1 !important;
    transform: scale(1) !important;
}

/* Card #515 / #526: Desktop compact sticky menu circular dot marker on top-level items only */
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-item:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-submenu:after {
    content: '' !important;
    position: absolute !important;
    z-index: 10 !important;
    left: 0 !important;
    top: 50% !important;
    margin-top: -4px !important;
    width: 8px !important;
    height: 8px !important;
    border: 3px solid #ff91a4 !important;
    box-sizing: border-box !important;
    border-radius: 50% !important;
    opacity: 0 !important;
    transform: scale(0) !important;
    transition: all 0.3s ease !important;
    display: block !important;
}

.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-item:hover:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-submenu:hover:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-item.current-menu-ancestor:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-item.current-menu-parent:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-item.current_page_item:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-item.current_page_ancestor:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-submenu.current-menu-item:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-submenu.current-menu-ancestor:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-submenu.current-menu-parent:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-submenu.current_page_item:after,
.sticky_main_nav .wp-block-navigation__container > .wp-block-navigation-submenu.current_page_ancestor:after {
    display: block !important;
    opacity: 1 !important;
    transform: scale(1) !important;
}

/* Card #526: Suppress pseudo-element dot marker strictly on all submenu items (main & sticky) */
.desktop-menu-wrapper .wp-block-navigation__submenu-container .wp-block-navigation-item:after,
.desktop-menu-wrapper .sub-menu .menu-item:after,
.sticky_main_nav .wp-block-navigation__submenu-container .wp-block-navigation-item:after,
.sticky_main_nav .sub-menu .menu-item:after {
    display: none !important;
    content: none !important;
    opacity: 0 !important;
}

/* Authentic Bellaria Search Block and Sidebar Widget Styling (Card #342) */
.wp-block-search.is-style-bellaria-search,
.sidebar .wp-block-search {
    margin-bottom: 45px !important;
}

.wp-block-search.is-style-bellaria-search .wp-block-search__inside-wrapper,
.sidebar .wp-block-search .wp-block-search__inside-wrapper {
    position: relative !important;
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
    display: block !important;
}

.wp-block-search.is-style-bellaria-search .wp-block-search__input,
.sidebar .wp-block-search .wp-block-search__input {
    width: 100% !important;
    height: 46px !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 23px !important;
    padding: 0 50px 0 20px !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    outline: none !important;
    transition: border-color 0.3s ease !important;
}

.wp-block-search.is-style-bellaria-search .wp-block-search__input:focus,
.sidebar .wp-block-search .wp-block-search__input:focus {
    border-color: #5fcac7 !important;
}

.wp-block-search.is-style-bellaria-search .wp-block-search__button,
.sidebar .wp-block-search .wp-block-search__button {
    position: absolute !important;
    right: 5px !important;
    top: 5px !important;
    width: 36px !important;
    height: 36px !important;
    border: none !important;
    border-radius: 50% !important;
    background: #5fcac7 !important;
    color: #ffffff !important;
    cursor: pointer !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background-color 0.3s ease !important;
}

.wp-block-search.is-style-bellaria-search .wp-block-search__button:hover,
.sidebar .wp-block-search .wp-block-search__button:hover {
    background: #e76063 !important;
}

.wp-block-search.is-style-bellaria-search .wp-block-search__button svg,
.sidebar .wp-block-search .wp-block-search__button svg {
    width: 16px !important;
    height: 16px !important;
    fill: #ffffff !important;
}

.sidebar .sidebar_widget_list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.sidebar .sidebar_widget_list .widget {
    margin-bottom: 45px !important;
    list-style: none !important;
}

.sidebar .sidebar_widget_list .widget:last-child {
    margin-bottom: 0 !important;
}

.sidebar .widgettitle,
.sidebar .widget .wp-block-heading,
.sidebar .widget > h3:first-child {
    font-size: 20px !important;
    line-height: 1.2 !important;
    font-family: "Comfortaa", cursive, sans-serif !important;
    color: #3b2314 !important;
    text-align: center !important;
    margin: 0 0 20px 0 !important;
    position: relative !important;
    padding-bottom: 15px !important;
}

.sidebar .widgettitle::after,
.sidebar .widget .wp-block-heading::after,
.sidebar .widget > h3:first-child::after {
    content: "";
    display: block;
    width: 68px;
    height: 33px;
    background-color: #5fcac7;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 850.4 410.3'%3E%3Cpath d='M351.6,300.8c45.5,20.8,90.4,42.8,136.4,62.5c23,9.8,43.7,15,68.7,16.8c24.2,1.7,26.9-11.4,47.7-17.2 c36.4-10.2,50.6,30.7,12.4,39.4c-47,10.7-90.1,11.7-135.8-5.3c-43.6-16.2-84-40.4-125.5-61.1c-19.3-9.6-41-21.4-63.2-19.4 c-25.3,2.3-48.4,14.1-74.3,15.3c-33.4,1.5-101.6-4.4-107.8-47.3c-8-55.4,62.8-44,94.4-37.5c27.8,5.7,54.3,16.5,81.9,22 c27.9,5.7,49.2-4.2,74.5-15.3c49.2-21.6,108.5-37,152.6-67.4c-73-44.3-144.1-91.2-222.1-126.4c-68.4-30.9-157.2-64-226-12.7 c-11.1,8.3-20.3,19.6-26,32.2c-6.4,14-2.7,29.4-7.8,42.9C27.4,133.4,16,141,4.9,129.5c-10.1-10.4-2-33.4,2.1-44.6 C28.2,27.4,86.9,0.5,145,0c78.1-0.7,153.1,31.3,222.4,64.4c35.5,16.9,70.1,35.7,103.2,56.8c30.6,19.5,61.9,54.4,100.8,39.3 c68.6-26.4,131.4-75.9,210-57.7c57.6,13.4,99.3,84.7,40.5,125.7c-32.5,22.7-74.6,30.1-113.6,30c-42.6-0.1-77.9-19.1-117-32.7 c-41.5-14.4-84.9,10.2-124.1,24.2C448.9,256.6,351.9,281.1,351.6,300.8z M604.7,191.1c24.8,28.8,71.1,34.9,107.4,34.4 c31.8-0.4,94.3-7.9,110.4-41.2c23.9-49.5-49.1-56-77.9-51.8C695.1,139.9,649,169.4,604.7,191.1z M131.1,283.8 c25.5,27.4,91,30.7,122.6,7.1C212.6,263.8,153.1,259.8,131.1,283.8z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 850.4 410.3'%3E%3Cpath d='M351.6,300.8c45.5,20.8,90.4,42.8,136.4,62.5c23,9.8,43.7,15,68.7,16.8c24.2,1.7,26.9-11.4,47.7-17.2 c36.4-10.2,50.6,30.7,12.4,39.4c-47,10.7-90.1,11.7-135.8-5.3c-43.6-16.2-84-40.4-125.5-61.1c-19.3-9.6-41-21.4-63.2-19.4 c-25.3,2.3-48.4,14.1-74.3,15.3c-33.4,1.5-101.6-4.4-107.8-47.3c-8-55.4,62.8-44,94.4-37.5c27.8,5.7,54.3,16.5,81.9,22 c27.9,5.7,49.2-4.2,74.5-15.3c49.2-21.6,108.5-37,152.6-67.4c-73-44.3-144.1-91.2-222.1-126.4c-68.4-30.9-157.2-64-226-12.7 c-11.1,8.3-20.3,19.6-26,32.2c-6.4,14-2.7,29.4-7.8,42.9C27.4,133.4,16,141,4.9,129.5c-10.1-10.4-2-33.4,2.1-44.6 C28.2,27.4,86.9,0.5,145,0c78.1-0.7,153.1,31.3,222.4,64.4c35.5,16.9,70.1,35.7,103.2,56.8c30.6,19.5,61.9,54.4,100.8,39.3 c68.6-26.4,131.4-75.9,210-57.7c57.6,13.4,99.3,84.7,40.5,125.7c-32.5,22.7-74.6,30.1-113.6,30c-42.6-0.1-77.9-19.1-117-32.7 c-41.5-14.4-84.9,10.2-124.1,24.2C448.9,256.6,351.9,281.1,351.6,300.8z M604.7,191.1c24.8,28.8,71.1,34.9,107.4,34.4 c31.8-0.4,94.3-7.9,110.4-41.2c23.9-49.5-49.1-56-77.9-51.8C695.1,139.9,649,169.4,604.7,191.1z M131.1,283.8 c25.5,27.4,91,30.7,122.6,7.1C212.6,263.8,153.1,259.8,131.1,283.8z'/%3E%3C/svg%3E");
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    position: absolute;
    left: 0;
    bottom: -10px;
    pointer-events: none;
}

.sidebar .wp-block-categories,
.sidebar .wp-block-archives,
.sidebar .wp-block-latest-posts {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.sidebar .wp-block-categories li,
.sidebar .wp-block-archives li,
.sidebar .wp-block-latest-posts li {
    line-height: 2 !important;
    border-bottom: 1px dashed #e8e8e8 !important;
    padding: 8px 0 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    transition: padding-left 0.3s ease !important;
}

.sidebar .wp-block-categories li:hover,
.sidebar .wp-block-archives li:hover,
.sidebar .wp-block-latest-posts li:hover {
    padding-left: 8px !important;
}

.sidebar .wp-block-categories li:last-child,
.sidebar .wp-block-archives li:last-child,
.sidebar .wp-block-latest-posts li:last-child {
    border-bottom: none !important;
}

.sidebar .wp-block-latest-posts.has-dates .wp-block-latest-posts__post-date {
    color: #999999 !important;
    font-size: 13px !important;
    margin-left: auto !important;
}

.sidebar .wp-block-latest-posts__featured-image {
    margin-right: 12px !important;
    flex-shrink: 0 !important;
}

.sidebar .wp-block-latest-posts__featured-image img {
    width: 50px !important;
    height: 50px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
    border: 2px solid #cfcfcf !important;
    display: block !important;
}

.sidebar .wp-block-tag-cloud {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin: 0 !important;
}

.sidebar .wp-block-tag-cloud a {
    position: relative !important;
    z-index: 1 !important;
    padding: 4px 14px !important;
    font-size: 13px !important;
    color: #ffffff !important;
    background-color: #5fcac7 !important;
    display: inline-block !important;
    border-radius: 30px !important;
    text-decoration: none !important;
    line-height: 1.4 !important;
    transition: background-color 0.3s ease, transform 0.2s ease !important;
}

.sidebar .wp-block-tag-cloud a:hover {
    background-color: #e76063 !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}

/* Staff Member Single Social Links (Card #306) */
.post_social_links.single_social_links {
    text-align: center;
    margin-top: 15px;
    margin-bottom: 20px;
}
.post_social_links.single_social_links a {
    display: inline-block;
    color: #ffffff !important;
    background-color: var(--mdb-staff-accent, #ff91a4);
    border: 3px solid var(--mdb-staff-accent, #ff91a4);
    margin: 0 5px;
    font-size: 24px;
    line-height: 44px;
    position: relative;
    z-index: 1;
    width: 50px;
    height: 50px;
    text-align: center;
    border-radius: 50%;
    box-sizing: border-box;
    text-decoration: none;
    transition: transform 0.3s ease, background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.post_social_links.single_social_links a:hover {
    background-color: #ffffff !important;
    color: var(--mdb-staff-accent, #ff91a4) !important;
}


/* Page With Sidebar Wrapper Parity (Card #497) */
.page_with_sidebar_wrapper {
    position: relative !important;
    width: 1170px !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

@media screen and (max-width: 1190px) {
    .page_with_sidebar_wrapper {
        width: 940px !important;
    }
}

@media screen and (max-width: 980px) {
    .page_with_sidebar_wrapper {
        width: 738px !important;
    }
}

@media screen and (max-width: 767px) {
    .page_with_sidebar_wrapper {
        width: auto !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
    }
}

.page_with_sidebar_wrapper #page.single_sidebar {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

.page_with_sidebar_wrapper #page.single_sidebar.right_sidebar > :is(main#page_content, #page_content) {
    width: 870px !important;
    box-sizing: border-box !important;
    order: 2 !important;
}

.page_with_sidebar_wrapper #page.single_sidebar.right_sidebar > :is(.wp-block-template-part, aside, .sidebar) {
    width: 270px !important;
    margin-left: 30px !important;
    box-sizing: border-box !important;
    order: 3 !important;
}

@media screen and (max-width: 1190px) {
    .page_with_sidebar_wrapper #page.single_sidebar.right_sidebar > :is(main#page_content, #page_content) {
        width: 700px !important;
    }
    .page_with_sidebar_wrapper #page.single_sidebar.right_sidebar > :is(.wp-block-template-part, aside, .sidebar) {
        width: 220px !important;
        margin-left: 20px !important;
    }
}

@media screen and (max-width: 980px) {
    .page_with_sidebar_wrapper #page.single_sidebar {
        flex-direction: column !important;
    }
    .page_with_sidebar_wrapper #page.single_sidebar.right_sidebar > :is(main#page_content, #page_content) {
        width: 100% !important;
    }
    .page_with_sidebar_wrapper #page.single_sidebar.right_sidebar > :is(.wp-block-template-part, aside, .sidebar) {
        width: 100% !important;
        margin-left: 0 !important;
        margin-top: 40px !important;
    }
}

/* ==========================================================================
   Heading Block (H1-H6) Typography Scale on Frontend (Card #520)
   Enforces authentic Bellaria hierarchy and defeats preset class collisions
   ========================================================================== */
h1.wp-block-heading:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
.wp-block-heading:is(h1):not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
h1.wp-block-heading[class*="-font-size"]:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *) {
    font-size: 51px !important;
    line-height: 1.2 !important;
    font-family: 'Merienda One', cursive !important;
    font-weight: 500 !important;
}

h2.wp-block-heading:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
.wp-block-heading:is(h2):not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
h2.wp-block-heading[class*="-font-size"]:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *) {
    font-size: 48px !important;
    line-height: 1.2 !important;
    font-family: 'Merienda One', cursive !important;
    font-weight: 500 !important;
}

h3.wp-block-heading:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
.wp-block-heading:is(h3):not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
h3.wp-block-heading[class*="-font-size"]:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *) {
    font-size: 36px !important;
    line-height: 1.2 !important;
    font-family: 'Merienda One', cursive !important;
    font-weight: 500 !important;
}

h4.wp-block-heading:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
.wp-block-heading:is(h4):not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
h4.wp-block-heading[class*="-font-size"]:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *) {
    font-size: 28px !important;
    line-height: 1.2 !important;
    font-family: 'Merienda One', cursive !important;
    font-weight: 500 !important;
}

h5.wp-block-heading:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
.wp-block-heading:is(h5):not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
h5.wp-block-heading[class*="-font-size"]:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *) {
    font-size: 24px !important;
    line-height: 1.2 !important;
    font-family: 'Merienda One', cursive !important;
    font-weight: 500 !important;
}

h6.wp-block-heading:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
.wp-block-heading:is(h6):not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *),
h6.wp-block-heading[class*="-font-size"]:not(.sidebar *):not(#sidebar *):not(#footer_widgets *):not(.footer_widgets *) {
    font-size: 20px !important;
    line-height: 1.2 !important;
    font-family: 'Merienda One', cursive !important;
    font-weight: 500 !important;
}

/* ==========================================================================
   Comfortaa Optical Weight & Bold Enhancement
   Compensates for slender geometric stroke in variable Comfortaa (300-700)
   ========================================================================== */
body {
    -webkit-text-stroke: 0.25px currentColor;
}

/* Exclude Merienda One headings, menus, buttons, and icon fonts from stroke */
h1, h2, h3, h4, h5, h6,
.main_menu,
button, input[type="button"], input[type="submit"],
i, .fa, .fas, .fab, .far, [class*="fa-"], [class*="flaticon-"], [class*="cwsicon-"] {
    -webkit-text-stroke: 0;
}

/* Distinctive, rich Bold for strong and b tags */
b, strong {
    font-weight: 700;
    -webkit-text-stroke: 0.45px currentColor;
}