/*
 * Mobile refinements for Dayool Farm homepage
 * Scope: body.home3, plus minimal padding wrappers for body.ab2 (About)
 */
@media (max-width: 768px) {
    /* A. Global Mobile Safety */
    html,
    body {
        overflow-x: hidden;
    }
    body.home3 {
        font-size: 16px;
        line-height: 1.6;
        background-color: #fff;
        color: #111827;
    }
    body.home3 .body_wrap,
    body.home3 .page_wrap,
    body.ab2 .body_wrap,
    body.ab2 .page_wrap {
        overflow-x: hidden;
    }
    body.home3 *,
    body.home3 *::before,
    body.home3 *::after,
    body.ab2 .page_content_wrap *,
    body.ab2 .page_content_wrap *::before,
    body.ab2 .page_content_wrap *::after {
        box-sizing: border-box;
    }
    body.home3 img,
    body.home3 video {
        max-width: 100%;
        height: auto;
        display: block;
    }
    /* Hide desktop header on mobile, show mobile header */
    .top_panel_wrap {
        display: none !important;
    }
    body.home3 .page_content_wrap > .content_wrap,
    body.home3 .call_wrap .content_wrap,
    body.home3 .footer_wrap .content_wrap,
    .call_wrap .content_wrap,
    .footer_wrap .content_wrap {
        padding-left: 18px;
        padding-right: 18px;
    }
    /* About page: mirror the homepage container model */
    body.ab2 .page_content_wrap > .content_wrap {
        padding-left: 18px;
        padding-right: 18px;
    }
    body.ab2 .vc_row {
        margin-left: auto !important;
        margin-right: auto !important;
    }
    body.ab2 .vc_column_container .vc_column-inner {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
    body.ab2 .values-grid-wrapper {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    body.home3 .vc_row {
        margin-left: auto !important;
        margin-right: auto !important;
    }
    body.home3 .vc_row .vc_column-inner {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-top: 0rem !important;
        margin-bottom: 0rem !important;
    }
    body.home3 .vc_empty_space,
    body.ab2 .vc_empty_space {
        height: 0.5em;
    }
    body.home3 .sc_section_title,
    body.ab2 .sc_section_title {
        font-size: clamp(2rem, 4.4vw, 2rem);
        line-height: 1.25;
        margin-top: 4px;
        margin-bottom: 0.5em;
    }
    body.home3 .sc_section_button .sc_button,
    body.home3 .whats-fresh-cta,
    body.home3 .call_wrap_inner,
    .call_wrap_inner {
        padding: 32px 18px;
        text-align: center;
    }
    body.home3 .menu_footer_nav,
    .menu_footer_nav {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
    }
    .mobile-footer-call .content_wrap,
    .mobile-footer-main .content_wrap,
    .mobile-footer-copy .content_wrap,
    .mobile-footer-socials .content_wrap {
        display: flex;
        flex-direction: column;
    }
    .mobile-footer-call .content_wrap {
        width: 100% !important;
        padding-left: 14px;
        padding-right: 14px;
        box-sizing: border-box;
    }
    .mobile-footer-call .call_wrap_inner {
        padding: 28px 18px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        text-align: left;
    }
    .mobile-footer-call .call-title,
    .mobile-footer-call .call-text {
        text-align: left;
        margin: 0 0 0.2rem 0;
    }
    .mobile-footer-call .mobile-store-cta {
        width: 100%;
        max-width: none;
        margin: 8px 0 0;
        display: inline-flex;
        justify-content: center;
        box-sizing: border-box;
    }
    .mobile-footer-main .content_wrap {
        display: flex;
        flex-direction: column;
        width: 100% !important;
        padding: 0;
        box-sizing: border-box;
    }
    .mobile-footer-main .mobile-footer-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0rem 1rem;
    }
    .mobile-footer-main .mobile-footer-column {
        width: 100%;
        display: flex;
        box-sizing: border-box;
    }
    .mobile-footer-column > aside {
        width: 100%;
    }
    .mobile-footer-main .mobile-footer-columns {
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        gap: 16px;
    }
    .mobile-footer-main .mobile-footer-columns > aside {
        flex: 1 1 calc(50% - 10px);
        min-width: calc(50% - 10px);
        display: flex;
        flex-direction: column;
        gap: 8px;
        text-align: left;
    }
    .mobile-footer-main .widget_title,
    .mobile-footer-main .widget,
    .mobile-footer-main .widget .textwidget {
        text-align: left !important;
        align-items: flex-start;
    }
    .mobile-footer-main .widget_nav_menu .menu {
        display: flex;
        flex-direction: column;
        gap: 6px;
        padding: 0;
        margin: 0;
    }
    .mobile-footer-main .widget_nav_menu .menu li a {
        display: inline-flex;
        flex-wrap: wrap;
        gap: 4px;
        white-space: normal;
        line-height: 1.5;
    }
    .mobile-footer-main .widget_socials .logo,
    .mobile-footer-main .widget_socials .sc_socials {
        display: flex;
        justify-content: flex-start;
    }
    .mobile-footer-main .textwidget {
        font-size: 0.98rem;
        line-height: 1.6;
    }
    .centered-contact .textwidget {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .mobile-footer-copy .content_wrap {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding: 0 18px 24px;
    }
    .mobile-footer-copy .menu_footer_nav {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 12px;
        padding: 0;
        margin: 0;
    }
    body.home3 .header_actions, 
    .header_mobile .header_actions {
        width: 100%;
        display: flex;
        justify-content: center !important;
        gap: 18px !important;
        flex-wrap: wrap;
    }
    body.home3 .top_panel_cart_button_simple,
    body.home3 .user_icon_button {
        width: 48px;
        height: 48px;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    body.home3 .top_panel_login_button_simple {
        min-width: 160px;
        justify-content: center;
    }
    body.home3 .header_mobile,
    .header_mobile {
        display: block;
        padding: 12px 16px;
        background: #fec321;
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
        position: relative;
        z-index: 20;
    }
    body.home3 .header_mobile .content_wrap,
    .header_mobile .content_wrap {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center;
        justify-content: space-between;
        gap: 0;
        min-height: 56px;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 16px;
        margin: 0;
        box-sizing: border-box;
    }
    /* Kill the clearfix pseudo-element that becomes a third flex item */
    body.home3 .header_mobile .content_wrap::after,
    .header_mobile .content_wrap::after {
        display: none !important;
        content: none !important;
    }
    body.home3 .header_mobile .logo,
    .header_mobile .logo {
        flex: 0 1 auto;
        min-width: 0;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 0 0 0 6px !important;
        background: transparent;
        border-radius: 0;
        box-shadow: none;
        overflow: hidden;
    }
    body.home3 .header_mobile .brand-mark,
    .header_mobile .brand-mark {
        flex-shrink: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        border-radius: 50%;
        background: transparent;
        box-shadow: none;
        text-decoration: none;
    }
    body.home3 .header_mobile .logo_main,
    .header_mobile .logo_main {
        width: 40px;
        height: 40px;
    }
    body.home3 .header_mobile .logo-text-box,
    .header_mobile .logo-text-box {
        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: left;
        gap: 1px;
        min-width: 0;
        align-items: flex-start;
    }
    body.home3 .header_mobile .logo-title,
    .header_mobile .logo-title {
        font-family: 'Oswald', sans-serif;
        font-size: 0.92rem;
        letter-spacing: 0.05em;
        font-weight: 700;
        text-transform: uppercase;
        color: #1d1403;
        line-height: 1.15;
        white-space: nowrap;
    }
    body.home3 .header_mobile .logo-tagline,
    .header_mobile .logo-tagline {
        font-family: 'Average', serif;
        font-size: 0.62rem;
        text-transform: uppercase;
        letter-spacing: 0.2em;
        color: rgba(29, 20, 3, 0.75);
        white-space: nowrap;
    }
    body.home3 .header_mobile .menu_button,
    .header_mobile .menu_button {
        position: static !important;
        left: auto !important;
        top: auto !important;
        right: auto !important;
        margin-top: 0 !important;
        margin-left: auto;
        width: 44px;
        min-width: 44px;
        height: 44px;
        border-radius: 8px;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        border: none;
        background: rgba(255, 255, 255, 0.9);
        color: #1d1403;
        font-size: 22px;
        line-height: 1;
        padding: 0;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        transition: all 0.15s ease;
        flex-shrink: 0;
    }
    body.home3 .header_mobile .menu_button:hover {
        background: #fff;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    }
    body.home3 .header_mobile .menu_button:focus-visible {
        outline: 2px solid rgba(29, 20, 3, 0.3);
        outline-offset: 2px;
    }
    body.home3 .header_mobile .menu_button:active {
        transform: scale(0.95);
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
    }

    /* Mobile Sidebar Panel */
    .header_mobile .side_wrap {
        background: #ffffff;
        padding: 0;
        box-sizing: border-box;
        overflow-x: hidden;
    }
    .header_mobile .side_wrap .mobile-nav-panel {
        position: relative;
        display: flex;
        flex-direction: column;
        gap: 16px;
        padding: 0px 12px 12px 12px;
        min-height: 100%;
        box-sizing: border-box;
        align-items: stretch;
        overflow-x: hidden;
    }
    .mobile-nav-close {
        position: absolute;
        top: 14px;
        right: 14px;
        background: transparent !important;
        border: none;
        font-size: 1.6rem !important;
        color: #0f172a;
        line-height: 1;
        cursor: pointer;
        padding: 0px 2px 0px 1.2rem !important;
    }
    .mobile-nav-header-row {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-top: 3.3rem;
        padding-right: 0px;
    }
    .mobile-nav-brand {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        text-decoration: none;
        color: #0f172a;
    }
    .mobile-nav-logo {
        width: 56px;
        height: 56px;
        border-radius: 12px;
        object-fit: contain;
    }
    .mobile-nav-brand-text {
        display: flex;
        flex-direction: column;
        line-height: 1.2;
    }
    .mobile-nav-brand-title {
        font-family: 'Oswald', sans-serif;
        font-size: 1rem;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: #0f172a;
    }
    .mobile-nav-brand-tagline {
        font-size: 0.8rem;
        letter-spacing: 0.08em;
        color: #475569;
        text-transform: uppercase;
        font-family: 'Oswald', sans-serif;
    }
    .mobile-nav-login {
        margin-left: auto;
        background: transparent;
        color: #ffffff;
        padding: 10px 8px 10px 14px;
        border-radius: 10px;
        text-decoration: none;
        font-weight: 700;
        text-transform: uppercase;
        font-size: 0.9rem;
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        min-width: 96px;
    }
    .mobile-nav-cart {
        display: block;
        width: 100%;
        max-width: 100%;
        padding: 12px 14px;
        border-radius: 12px;
        background: #fec321;
        color: #0f172a !important;
        font-weight: 700;
        font-family: "Oswald", sans-serif;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        text-align: center;
        text-decoration: none;
        box-shadow: 0 0px 28px rgba(254, 195, 33, 0.25);
        box-sizing: border-box;
    }
    .mobile-nav-menu {
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 6px 0;
        margin: 0;
        list-style: none;
    }
    .mobile-nav-item {
        list-style: none;
        width: 100%;
        text-align: left !important;
    }
    .mobile-nav-link {
        display: block;
        width: 100%;
        padding: 12px 14px;
        border-radius: 12px;
        color: #0f172a;
        text-decoration: none;
        font-weight: 600;
        letter-spacing: 0.01em;
        background: #f8fafc;
    }
    .mobile-nav-item.is-active .mobile-nav-link {
        background: #fec321;
        color: #0f172a;
    }
    .mobile-nav-footer {
        margin-top: auto;
        padding-top: 12px;
        border-top: 1px solid #e5e7eb;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .mobile-nav-socials {
        display: flex;
        gap: 12px;
        justify-content: space-around;
    }
    /* Mobile sidebar visibility states */
    .header_mobile .side_wrap {
        position: fixed;
        top: 0;
        left: -100%;
        width: 100%;
        max-width: 85%;
        height: 100vh;
        background: #ffffff;
        z-index: 1001;
        overflow-y: auto;
        overflow-x: hidden;
        box-sizing: border-box;
        transition: left 0.3s ease;
    }
    .header_mobile .side_wrap.active {
        left: 0;
    }
    .header_mobile .mask {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.3);
        z-index: 999;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s ease;
    }
    .header_mobile .mask.active {
        opacity: 1;
        pointer-events: all;
    }
    .mobile-nav-socials a {
        width: 36px;
        height: 36px;
        border-radius: 10px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: #fec321;
        color: #ffffff;
        text-decoration: none;
        font-size: 16px;
    }
    .mobile-nav-contact {
        display: flex;
        flex-direction: column;
        gap: 8px;
        color: #475569;
        font-size: 0.95rem;
    }
    .mobile-nav-user {
        margin-left: auto;
        display: none;
        width: 38px;
        height: 38px;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
        background: #0c1a3a;
        color: #ffffff;
        text-decoration: none;
        font-weight: 700;
        font-size: 1rem;
        box-shadow: 0 10px 30px rgba(12, 26, 58, 0.15);
    }
    .mobile-nav-user-initial {
        line-height: 1;
        color: #ffffff;
    }

    .mobile-nav-contact-row {
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .mobile-nav-contact-row a {
        color: inherit;
        text-decoration: none;
    }

    /* C. Hero Slider / Banner */
    body.home3 .hero-slider {
        position: relative;
        isolation: isolate;
        min-height: min(95vh, 640px);
        height: min(95vh, 640px);
        max-height: none;
        margin: 0;
        padding: 0;
        border-radius: 0;
        overflow: hidden;
        background-color: transparent;
    }
    body.home3 .hero-slider-track {
        min-height: inherit;
        height: 100%;
    }
    body.home3 .hero-slide {
        position: absolute;
        inset: 0;
        min-height: inherit;
        height: 100%;
        background-size: cover !important;
        background-position: center center !important;
        background-repeat: no-repeat !important;
    }
    body.home3 .hero-slide::before {
        content: '';
        position: absolute;
        inset: 0;
        background-color: rgba(0, 0, 0, var(--overlay-intensity, 0.3));
        z-index: 1;
    }
    body.home3 .hero-slide-inner {
        position: relative;
        z-index: 2;
        min-height: inherit;
        height: 100%;
        padding: clamp(36px, 8vw, 56px) 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
    body.home3 .hero-slide-content {
        width: 100%;
        max-width: 520px;
        padding: 0;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: clamp(16px, 2vw, 18px);
    }
    body.home3 .hero-slide-title {
        font-family: 'Oswald', sans-serif;
        font-size: clamp(2.1rem, 7vw, 3rem);
        line-height: 1.15;
        color: #ffffff;
        text-transform: uppercase;
        letter-spacing: 0.08em;
        font-weight: 700;
        margin-top: 12vh;
        text-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
    }
    body.home3 .hero-slide-subtitle {
        font-size: clamp(1rem, 3.8vw, 1.2rem);
        color: rgba(255, 255, 255, 0.92);
        max-width: 440px;
        margin: 0 auto;
        line-height: 1.6;
    }
    body.home3 .hero-slide .accent-line {
        width: 64px;
        height: 3px;
        background: #fec321;
        border-radius: 999px;
        margin: 6px auto 4px;
        display: block;
    }
    body.home3 .hero-slide-actions {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 14px;
    }
    body.home3 .hero-slide-actions .sc_button {
        width: min(320px, 90%);
        min-height: 52px;
        justify-content: center;
        font-size: 1rem;
        font-weight: 600;
        margin: 4px auto 0;
    }
    body.home3 .hero-slider-dots {
        position: absolute;
        bottom: clamp(14px, 3vw, 26px);
        left: 50%;
        transform: translateX(-50%);
        z-index: 10;
        display: flex;
        gap: 10px;
    }
    body.home3 .hero-slider-dot {
        width: 10px;
        height: 10px;
        border-radius: 999px;
        background: rgba(8, 9, 10, 0.25);
        border: 2px solid rgba(255, 255, 255, 0.78);
        box-shadow: 0 0 8px rgba(0, 0, 0, 0.35);
        transition: all 0.3s ease;
    }
    body.home3 .hero-slider-dot.is-active {
        width: 28px;
        border-radius: 999px;
        background: #fec321;
        border-color: #fec321;
        box-shadow: 0 0 12px rgba(254, 195, 33, 0.7);
    }

    /* D. Welcome Section */
    body.home3 .page_content_wrap {
        margin-top: 0;
    }
    /* Reduce padding on page_paddings_yes for mobile (login, register, etc.) */
    .page_content_wrap.page_paddings_yes {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }
    body.home3 .section_style_dark_text {
        padding-top: 32px;
        padding-bottom: 0px;
    }
    body.home3 .overlay-tagline {
        font-size: 1rem !important;
        letter-spacing: 0.12em;
    }
    body.home3 .sc_highlight {
        display: block;
        max-width: 60ch;
        margin: 0 auto;
        font-size: 1rem;
        line-height: 1.7;
    }
    body.home3 .sc_section.aligncenter figure img {
        max-height: 160px !important;
        margin: 0px auto 0px;
    }

    /* E. 3-Card Feature Row */
    body.home3 #home-products {
        margin-top: 0px;
    }
    body.home3 #home-products .sc_columns.columns_wrap {
        display: flex;
        flex-wrap: nowrap;
        gap: 14px;
        overflow-x: auto;
        padding: 0px 14px 4px;
        scroll-snap-type: x mandatory;
        scroll-padding: 16px;
        margin: 0 -16px;
    }
    body.home3 #home-products .sc_columns.columns_wrap::-webkit-scrollbar {
        display: none;
    }
    body.home3 #home-products .column-1_3 {
        flex: 0 0 82%;
        scroll-snap-align: center;
    }
    body.home3 #home-products .sc_services_item {
        border-radius: 12px;
        overflow: hidden;
        background: #fff;
        box-shadow: 0 10px 28px rgba(17, 24, 39, 0.12);
        height: 100%;
    }
    body.home3 #home-products .sc_services_item_featured.post_featured {
        margin-bottom: 1rem;
    }
    body.home3 #home-products .sc_services_item_featured img {
        width: 100%;
        height: min(20vh, 240px);
        min-height: 180px;
        object-fit: cover;
    }
    body.home3 #home-products .sc_services_item_content {
        padding: 0px 15px 1.2rem;
    }
    body.home3 #home-products .sc_services_item_description {
        margin-top: 0.8rem;
    }
    body.home3 #home-products .sc_services_item_description p {
        font-size: 0.98rem;
        line-height: 1.5;
    }
    body.home3 #home-products .sc_services_item .sc_button {
        display: inline-flex;
        margin-top: 1.3rem;
        margin-left: auto;
        margin-right: auto;
    }

    /* F. What's Fresh Section */
    body.home3 .whats-fresh-hero {
        display: flex;
        flex-direction: column;
        padding: 36px 24px;
        gap: 1rem;
    }
    body.home3 .whats-fresh-kicker {
        margin-bottom: 0px;
        order: 1;
        text-align: left;
    }
    body.home3 .whats-fresh-kicker::after {
        margin-top: 0px;;
    }
    body.home3 .whats-fresh-content {
        display: contents;
        text-align: left;
    }
    body.home3 .whats-fresh-title {
        order: 2;
        text-align: center;
    }
    body.home3 .whats-fresh-description {
        max-width: 60ch;
        margin: 0 auto 0.4rem;
        line-height: 1.65;
        order: 3;
        text-align: center;
    }
    body.home3 .whats-fresh-media {
        width: 100%;
        order: 4;
    }
    body.home3 .whats-fresh-image-frame {
        max-width: 420px;
        margin: 0 auto 1rem;
    }
    body.home3 .whats-fresh-cta {
        order: 5;
    }

    /* G. About Timeline */
    /* Override margin-top for About Us section on mobile */
    body.home3 .sc_section.margin_top_huge:has(#sc_tabs_583) {
        margin-top: 2rem !important;
    }
    /* Override margin-top for Meet the Team section on mobile */
    body.home3 .sc_section.margin_top_huge:has(.portfolio-layout1) {
        margin-top: 2rem !important;
    }
    /* Override margins for Blog section on mobile */
    body.home3 #home-stories.margin_top_huge.margin_bottom_huge {
        margin-top: 2rem !important;
        margin-bottom: 2.5rem !important;
    }
    /* About-2: override the huge margins to match homepage section spacing */
    body.ab2 .sc_section.margin_top_huge,
    body.ab2 .sc_section.margin_bottom_huge {
        margin-top: 2rem !important;
        margin-bottom: 2rem !important;
    }
    body.ab2 .sc_section.margin_bottom_huge.aligncenter {
        margin-bottom: 1.5rem !important;
    }
    /* Target the promo container that holds image and content blocks */
    body.home3 .sc_promo_size_large .sc_promo_inner,
    body.ab2 .sc_promo_size_large .sc_promo_inner {
        display: flex;
        flex-direction: column;
        gap: 18px;
        position: relative;
    }
    body.home3 .sc_promo_size_large .sc_promo_image,
    body.home3 .sc_promo_size_large .sc_promo_block,
    body.home3 .sc_promo_size_large .sc_promo_block_inner,
    body.ab2 .sc_promo_size_large .sc_promo_image,
    body.ab2 .sc_promo_size_large .sc_promo_block,
    body.ab2 .sc_promo_size_large .sc_promo_block_inner {
        width: 100%;
        max-width: 100%;
    }
    body.home3 .sc_promo_size_large .sc_promo_image,
    body.ab2 .sc_promo_size_large .sc_promo_image {
        order: 1;
        position: relative !important;
        top: auto !important;
        bottom: auto !important;
        min-height: 240px;
        border-radius: 18px;
        background-size: cover;
        background-position: center;
        overflow: hidden;
    }
    body.home3 .sc_promo_size_large .sc_promo_image img,
    body.ab2 .sc_promo_size_large .sc_promo_image img {
        width: 100%;
        height: auto;
        display: block;
        border-radius: inherit;
    }
    body.home3 .sc_promo_block_inner,
    body.ab2 .sc_promo_block_inner {
        padding: 1em 1em 1.33em;
    }
    body.home3 .sc_promo_size_large .sc_promo_block,
    body.ab2 .sc_promo_size_large .sc_promo_block {
        order: 2;
        width: 100%;
        padding: 0;
        border-radius: 12px;
    }
    body.home3 #sc_tabs_583 .sc_promo_block_inner,
    body.home3 #sc_tabs_583 .sc_promo_content,
    body.ab2 #sc_tabs_113 .sc_promo_block_inner,
    body.ab2 #sc_tabs_113 .sc_promo_content {
        padding: 1em !important;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 14px;
    }
    body.home3 #sc_tabs_583 .sc_promo_content .sc_section_descr,
    body.home3 #sc_tabs_583 .sc_tabs_content .wpb_text_column,
    body.ab2 #sc_tabs_113 .sc_promo_content .sc_section_descr,
    body.ab2 #sc_tabs_113 .sc_tabs_content .wpb_text_column {
        max-width: 60ch;
        margin: 0 auto;
        line-height: 1.65;
    }
    body.home3 #sc_tabs_583 .sc_promo_content .sc_button,
    body.ab2 #sc_tabs_113 .sc_promo_content .sc_button {
        width: min(92%, 320px);
        margin: 6px auto 0;
    }
    body.home3 #sc_tabs_583 .years-bar,
    body.ab2 #sc_tabs_113 .years-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0;
        padding: 0 2px;
        width: 100%;
        margin-bottom: 0px;
    }
    body.home3 #sc_tabs_583 .years-list,
    body.ab2 #sc_tabs_113 .years-list {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        gap: 6px;
        scrollbar-width: none;
        -ms-overflow-style: none;
        scroll-snap-type: x proximity;
        scroll-padding: 12px;
        scroll-behavior: smooth;
        flex: 1;
        min-width: 0;
        padding: 0 6px;
        margin: 0;
    }
    body.home3 #sc_tabs_583 .years-list::-webkit-scrollbar,
    body.ab2 #sc_tabs_113 .years-list::-webkit-scrollbar {
        display: none;
    }
    body.home3 #sc_tabs_583 .sc_tabs_title,
    body.ab2 #sc_tabs_113 .sc_tabs_title {
        flex: 0 0 auto;
        display: block !important;
        scroll-snap-align: start;
        margin: 0;
        float: none;
    }
    body.home3 #sc_tabs_583 .sc_tabs_title .theme_button,
    body.ab2 #sc_tabs_113 .sc_tabs_title .theme_button {
        font-size: clamp(0.8rem, 2.5vw, 0.88rem);
        padding: 0.32em 0.9em !important;
    }
    body.home3 #sc_tabs_583 .years-nav-btn,
    body.ab2 #sc_tabs_113 .years-nav-btn {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: auto;
        height: auto;
        padding: 4px;
        margin: 0;
        flex: 0 0 auto;
        background: transparent;
        border: none;
        color: #9ca3af;
        font-size: 20px;
        font-weight: 300;
        line-height: 1;
        cursor: pointer;
        transition: color 0.2s ease;
    }
    body.home3 #sc_tabs_583 .years-nav-btn:hover,
    body.ab2 #sc_tabs_113 .years-nav-btn:hover {
        color: #6b7280;
    }
    body.home3 #sc_tabs_583 .years-nav-btn:active,
    body.ab2 #sc_tabs_113 .years-nav-btn:active {
        color: #4b5563;
    }
    body.home3 #sc_tabs_583 .years-nav-btn.disabled,
    body.home3 #sc_tabs_583 .years-nav-btn:disabled,
    body.ab2 #sc_tabs_113 .years-nav-btn.disabled,
    body.ab2 #sc_tabs_113 .years-nav-btn:disabled {
        color: #d1d5db;
        opacity: 0.6;
        pointer-events: none;
    }
    body.home3 #sc_tabs_583 .sc_tabs_content,
    body.ab2 #sc_tabs_113 .sc_tabs_content {
        text-align: center;
        padding: 10px 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    body.home3 #sc_tabs_583 .sc_tabs_content h4,
    body.ab2 #sc_tabs_113 .sc_tabs_content h4 {
        font-size: clamp(1.15rem, 3.8vw, 1.5rem);
        margin-bottom: 4px;
        margin-top: 0em;
    }
    body.home3 #sc_tabs_583 .sc_tabs_content p,
    body.ab2 #sc_tabs_113 .sc_tabs_content p {
        line-height: 1.7;
        font-size: clamp(0.95rem, 3.4vw, 1.05rem);
        padding: 0.1em;
    }

    /* H. Products Section */
    body.home3 .rotating-ring-section {
        padding: 2.3em 0 0.5em;
        margin-top: 1rem !important;
        margin-bottom: 0.5em !important;
    }
    body.home3 .rotating-ring-container {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 36px;
        padding: 0;
    }
    body.home3 .ring-wrapper {
        width: min(320px, 80vw);
        height: min(320px, 80vw);
        margin: 0 auto;
        position: relative;
    }
    body.home3 .ring-item {
        width: min(58px, 18vw) !important;
        height: min(58px, 18vw) !important;
        opacity: 0.75;
    }
    body.home3 .ring-item.active {
        width: min(150px, 48vw) !important;
        height: min(150px, 48vw) !important;
        opacity: 1;
    }
    body.home3 .ring-content {
        align-items: center;
        text-align: center;
        gap: 20px;
        max-width: min(420px, 92vw);
        margin: 0 0 1.5rem 0;
        min-height: 17rem !important;
        justify-content: flex-end;
    }
    body.home3 .product-details {
        min-height: auto;
    }
    body.home3 .product-description {
        max-width: 60ch;
    }

    /* I. Featured Recipe */
    body.home3 .vc_custom_1475048754773 {
        padding-top: 1.5em !important;
        padding-bottom: 1.5em !important;
    }
    body.home3 .vc_custom_1475048754773 .wpb_column {
        width: 100% !important;
    }
    body.home3 .vc_custom_1475048754773 figure {
        text-align: center;
        margin-bottom: 1em;
        margin-top: 1em !important;
        display: none;
    }
    body.home3 .vc_custom_1475048754773 figure img {
        max-width: min(190px, 70vw);
        margin: 0 auto;
    }
    body.home3 .featured-recipe-heading,
    body.home3 .featured-recipe-callout {
        text-align: center !important;
        margin-bottom: 0rem !important;
    }
    body.home3 .featured-recipe-heading .sc_section_inner,
    body.home3 .featured-recipe-callout .sc_section_inner {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.5em;
    }
    body.home3 .featured-recipe-heading .sc_section_title,
    body.home3 .featured-recipe-callout .sc_section_title {
        text-align: center;
    }
    body.home3 .featured-recipe-heading .sc_section_title span,
    body.home3 .featured-recipe-callout .sc_section_title span {
        display: block;
        position: relative;
        margin-left: auto;
        margin-right: auto;
    }
    body.home3 .featured-recipe-heading.alignleft .sc_section_title:after,
    body.home3 .featured-recipe-callout .sc_section_title:after {
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        transform: translateX(-50%);
        margin-bottom: 0.37rem;
    }
    body.home3 .featured-recipe-heading.alignleft .sc_section_title span:before,
    body.home3 .featured-recipe-callout .sc_section_title span:before {
        left: calc(50% - 3.65rem);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        transform: translateX(-50%);
    }
    body.home3 .featured-recipe-heading.alignleft .sc_section_title span:after,
    body.home3 .featured-recipe-callout .sc_section_title span:after {
        left: calc(50% + 3.2rem);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        transform: translateX(-50%);
    }
    body.home3 .featured-recipe-heading .sc_section_title {
        font-size: clamp(1.4rem, 4vw, 1.6rem);
        margin-bottom: 0.1em;
    }
    body.home3 .featured-recipe-callout .sc_section_title {
        font-size: clamp(1.5rem, 4.5vw, 1.8rem);
        margin-bottom: 0.8em;
        line-height: 1.3;
        padding-bottom: 0;
    }
    body.home3 .featured-recipe-callout .sc_section_title:after,
    body.home3 .featured-recipe-callout .sc_section_title span:before,
    body.home3 .featured-recipe-callout .sc_section_title span:after {
        display: none;
    }
    body.home3 .featured-recipe-callout .sc_section_descr {
        max-width: 60ch;
        margin: 0 auto 1em;
        line-height: 1.6;
        font-size: 0.95rem;
    }
    body.home3 .featured-recipe-callout .sc_section_content_wrap {
        margin-top: 0.7rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 16px;
    }
    body.home3 .featured-recipe-callout .sc_section_content_wrap::before {
        content: '';
        width: min(180px, 56vw);
        aspect-ratio: 1 / 1;
        border-radius: 50%;
        background-image: url('../../images/88417b888aceef44019134d17e94635d0593947d-2000x2000.avif');
        background-size: cover;
        background-position: center;
        border: 4px solid rgba(255, 255, 255, 0.8);
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.22);
    }
    body.home3 .featured-recipe-callout .sc_button {
        width: min(87%);
        margin-bottom: 2.7rem;
    }

    /* J. Blog Cards Section */
    body.home3 #home-stories .isotope_wrap {
        display: flex;
        flex-direction: column;
        gap: 20px;
        overflow: visible;
        scroll-snap-type: none;
        padding: 8px 0 24px;
        margin: 0;
        width: 100%;
        scroll-padding: 0;
        scrollbar-width: none;
        -ms-overflow-style: none;
        align-items: center;
    }
    body.home3 #home-stories .isotope_wrap::-webkit-scrollbar {
        display: none;
    }
    body.home3 #home-stories .isotope_item {
        width: 100%;
        scroll-snap-align: none;
        margin-bottom: 0;
        padding: 0;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
    }
    body.home3 #home-stories .post_item {
        height: auto;
        border-radius: 20px;
        overflow: hidden;
        background: #fff;
        box-shadow: 0 18px 48px rgba(17, 24, 39, 0.12);
        display: flex;
        flex-direction: column;
        width: min(420px, 90vw);
        max-width: 420px;
        flex: 0 0 auto;
        margin: 0 1rem 1.5rem;
    }
    body.home3 #home-stories .post_featured {
        flex-shrink: 0;
        width: 100%;
    }
    body.home3 #home-stories .post_featured img {
        width: 100%;
        height: auto;
        min-height: 190px;
        max-height: 260px;
        object-fit: cover;
        display: block;
    }
    body.home3 #home-stories .post_content {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 18px;
        width: 100%;
    }
    body.home3 #home-stories .post_title {
        font-size: clamp(1.1rem, 3.6vw, 1.35rem);
        line-height: 1.3;
        margin-bottom: 0;
    }
    body.home3 #home-stories .post_descr {
        margin-bottom: 0;
    }
    body.home3 #home-stories .post_descr p {
        font-size: 0.95rem;
        line-height: 1.6;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    body.home3 #home-stories .post_info {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 14px;
        align-items: center;
    }
    body.home3 #home-stories .post_info,
    body.home3 #home-stories .post_info a {
        font-size: 0.9rem;
    }

    /* K. Team Section */
    body.home3 .portfolio-layout1 .team-grid,
    body.ab2 .portfolio-layout1 .team-grid {
        display: flex;
        flex-wrap: nowrap;
        gap: 0.9rem;
        overflow-x: auto;
        padding: 16px 18px 16px;
        margin: 0 -18px;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    body.home3 .portfolio-layout1 .team-grid::-webkit-scrollbar,
    body.ab2 .portfolio-layout1 .team-grid::-webkit-scrollbar {
        display: none;
    }
    body.home3 .portfolio-layout1 .portfolio-item,
    body.ab2 .portfolio-layout1 .portfolio-item {
        flex: 0 0 min(88vw, 376px);
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 14px 14px 14px;
        gap: 0.5rem !important;
        background: #ffffff;
        border-radius: 12px;
        box-shadow: 0 5px 24px rgba(17, 24, 39, 0.15);
        scroll-snap-align: center;
    }
    body.home3 .portfolio-layout1 .portfolio__img,
    body.ab2 .portfolio-layout1 .portfolio__img {
        width: 160px;
        height: 160px;
    }
    body.home3 .portfolio-layout1 .portfolio__body,
    body.ab2 .portfolio-layout1 .portfolio__body {
        align-items: center;
    }
    body.home3 .portfolio-layout1 .portfolio__desc,
    body.ab2 .portfolio-layout1 .portfolio__desc {
        -webkit-line-clamp: unset;
        min-height: auto;
    }
    body.home3 .portfolio-layout1 .social-icons,
    body.ab2 .portfolio-layout1 .social-icons {
        justify-content: center;
        flex-wrap: nowrap;
        gap: 10px;
    }

    /* L. Footer */
    body.home3 .call_wrap_inner,
    .call_wrap_inner {
        padding: 28px 18px;
        text-align: center;
    }
    .mobile-footer-call .call_wrap_inner {
        padding: 22px 16px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        text-align: left;
    }
    .mobile-footer-main .content_wrap {
        width: 100% !important;
        padding-left: 0;
        padding-right: 0;
        box-sizing: border-box;
    }
    .mobile-footer-call .content_wrap {
        width: 100% !important;
        padding-left: 0;
        padding-right: 0;
        box-sizing: border-box;
    }
    .mobile-footer-call .call-title,
    .mobile-footer-call .call-text {
        text-align: left;
        margin: 0;
    }
    .mobile-footer-call .mobile-store-cta {
        width: 100%;
        max-width: none;
        margin: 1rem 0 0;
        justify-content: center;
        box-sizing: border-box;
    }
    body.home3 .footer_wrap .columns_wrap,
    .footer_wrap .columns_wrap {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        padding: 10px 14px 16px;
    }
    body.home3 .footer_wrap .columns_wrap > aside.widget_nav_menu,
    .footer_wrap .columns_wrap > aside.widget_nav_menu {
        flex: 0 0 calc(50% - 6px);
        width: calc(50% - 6px);
        max-width: calc(50% - 6px);
        margin: 0;
    }
    body.home3 .footer_wrap .columns_wrap > aside:not(.widget_nav_menu),
    .footer_wrap .columns_wrap > aside:not(.widget_nav_menu) {
        flex: 0 0 calc(50% - 6px);
        width: calc(50% - 6px);
        margin: 0;
    }
    body.home3 .footer_wrap .columns_wrap > aside.footer-logo-card,
    .footer_wrap .columns_wrap > aside.footer-logo-card {
        display: none;
    }
    body.home3 .footer_wrap .widget,
    body.home3 .footer_wrap .widget_title,
    body.home3 .footer_wrap .textwidget,
    .footer_wrap .widget,
    .footer_wrap .widget_title,
    .footer_wrap .textwidget {
        text-align: left;
    }
    body.home3 .footer_wrap .widget_nav_menu .menu,
    .footer_wrap .widget_nav_menu .menu {
        display: flex;
        flex-direction: column;
        gap: 4px;
        padding: 0;
        margin: 0;
    }
    body.home3 .footer_wrap .widget_nav_menu .menu li a,
    .footer_wrap .widget_nav_menu .menu li a {
        display: inline-flex;
        flex-wrap: wrap;
        gap: 4px;
        line-height: 1.4;
    }
    body.home3 .footer_wrap .widget_socials .sc_socials,
    .footer_wrap .widget_socials .sc_socials {
        display: flex;
        justify-content: center;
        gap: 3rem;
        margin-top: 0rem !important;
        margin-left: 0rem !important;
    }
    body.home3 .footer_wrap .textwidget,
    .footer_wrap .textwidget {
        font-size: 0.95rem;
        line-height: 1.5;
    }
    body.home3 .centered-contact .textwidget,
    .centered-contact .textwidget {
        display: flex;
        flex-direction: column;
        gap: 2px;
        align-items: flex-start;
        text-align: left !important;
    }
    body.home3 .mobile-footer-socials,
    .mobile-footer-socials {
        padding: 0px;
    }
    body.home3 .mobile-footer-socials .content_wrap,
    .mobile-footer-socials .content_wrap {
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding-left: 14px;
        padding-right: 14px;
        box-sizing: border-box;
    }
    body.home3 .mobile-footer-socials-row,
    .mobile-footer-socials-row {
        width: 100%;
        display: flex;
        justify-content: space-evenly;
        align-items: center;
    }
    body.home3 .copyright_wrap_inner,
    .copyright_wrap_inner {
        flex-direction: column;
        align-items: center;
        gap: 0px;
        padding: 12px 0px 16px;
        text-align: center;
    }
    body.home3 .copyright_wrap .content_wrap,
    .copyright_wrap .content_wrap {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        padding: 0 0 0px;
    }
    body.home3 .menu_footer_nav,
    .menu_footer_nav {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
        padding: 0;
        margin: 0;
    }

    /* Hide desktop footer when mobile footer is present */
    .mobile-footer-call ~ .call_wrap:not(.mobile-footer-call),
    .mobile-footer-main ~ .footer_wrap:not(.mobile-footer-main):not(.mobile-footer-socials),
    .mobile-footer-copy ~ .copyright_wrap:not(.mobile-footer-copy),
    #footer-container ~ .call_wrap:not(.mobile-footer-call),
    #footer-container ~ .footer_wrap:not(.mobile-footer-main):not(.mobile-footer-socials),
    #footer-container ~ .copyright_wrap:not(.mobile-footer-copy) {
        display: none !important;
    }

    /* M. Contact Page Mobile Layout */
    body.contactspg .contact_layout_container {
        display: flex !important;
        flex-direction: column;
        gap: 32px;
        padding: 24px 18px 40px;
        min-height: auto !important;
        align-items: stretch;
    }

    body.contactspg .contact_form_section {
        order: 1;
        max-width: 100%;
        width: 100%;
        margin-top: 1rem !important;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 0;
        padding: 0;
    }

    body.contactspg .contact_info_section {
        order: 2;
        margin: 0;
        width: 100%;
    }

    body.contactspg .contact_info_grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
        width: 100%;
        max-width: 100%;
        padding: 0;
        margin: 0 auto;
        justify-items: center;
    }

    body.contactspg .contact-info-card {
        width: 100% !important;
        min-height: auto;
        padding: 20px 16px;
        grid-column: auto;
    }

    /* Phone card - first row, first column */
    body.contactspg .contact_info_grid .contact-info-card:nth-child(2) {
        order: 1;
        grid-column: 1;
    }

    /* Email card - first row, second column */
    body.contactspg .contact_info_grid .contact-info-card:nth-child(3) {
        order: 2;
        grid-column: 2;
    }

    /* Address card - second row, spans full width */
    body.contactspg .contact_info_grid .contact-info-card:nth-child(1) {
        order: 3;
        grid-column: 1 / -1;
        justify-self: center;
    }

    body.contactspg .contact-info-header {
        margin: 0 !important;
    }

    body.contactspg .contact-icon-wrapper {
        width: 56px;
        height: 56px;
        margin-bottom: 14px;
    }

    body.contactspg .contact-icon {
        font-size: 24px;
    }

    body.contactspg .contact-card-title {
        font-size: 13px;
        margin-bottom: 8px;
        letter-spacing: 0.12em;
    }

    body.contactspg .contact-card-text {
        font-size: 13px;
        line-height: 1.6;
        font-weight: 500;
    }

    /* Hide floating contact overlay on mobile */
    body.contactspg .floating-contact-grid,
    body.contactspg #floating-contact-cards {
        display: none !important;
    }

    /* Map section full width and proper height */
    body.contactspg .contact_map_section {
        margin: 0 calc(50% - 50vw) !important;
        width: 100vw !important;
    }

    body.contactspg #map-container {
        min-height: 400px;
        width: 100%;
    }

    body.contactspg #map-iframe {
        min-height: 400px;
        width: 100%;
    }

    /* Form fields responsive */
    body.contactspg .sc_input_hover_default input[type="text"],
    body.contactspg .sc_input_hover_default input[type="email"],
    body.contactspg .sc_input_hover_default textarea {
        width: 100% !important;
        box-sizing: border-box;
    }

    body.contactspg .sc_form .sc_form_info {
        padding: 16px;
        font-size: 14px;
    }

    body.contactspg .sc_form_field {
        margin-bottom: 16px;
    }

    body.contactspg .sc_form_button {
        width: 100%;
    }

    /* Ensure proper stacking */
    body.contactspg .sc_googlemap_wrap.contact-main-wrapper {
        min-height: auto !important;
    }

    body.contactspg .bg_cust_2 {
        background-size: cover;
        background-position: center;
    }

    body.contactspg .fresh-from-farm-overlay h1 {
        font-size: clamp(1.8rem, 6vw, 2.4rem);
        padding: 0 16px;
    }

    body.contactspg .overlay-tagline {
        font-size: 14px !important;
        padding: 0 20px;
    }

    /* Checkout Page Mobile Layout */
    body .checkout-stage {
        padding: 16px 14px 26px;
    }
    body .checkout-page {
        max-width: 900px;
        margin: 0 auto;
        padding: 0;
    }
    
    /* Mobile header with back button on left and heading on right */
    body .checkout-mobile-header {
        display: flex;
        align-items: center;
        gap: 14px;
        margin: 12px 0 18px 0;
        padding: 0 14px;
    }
    
    body .checkout-mobile-header .checkout-back-link {
        width: 54px;
        height: 38px;
        border-radius: 12px;
        flex-shrink: 0;
        order: 1;
    }
    
    body .checkout-mobile-heading {
        display: block;
        text-align: left;
        font-size: 1.5rem;
        margin: 0;
        padding: 0;
        color: var(--checkout-navy, #0C1A3A);
        font-weight: 700;
        flex: 1;
        order: 2;
    }
    
    /* Hide desktop heading on mobile */
    body .checkout-top-copy h1 {
        display: none;
    }
    
    /* Hide back button inside card on mobile */
    body .checkout-topbar .checkout-back-link {
        display: none;
    }
    
    /* Keep description text visible and adjust layout */
    body .checkout-top-copy {
        flex: 1;
    }
    
    body .checkout-top-copy p {
        font-size: 0.98rem;
        line-height: 1.45;
        margin: 0;
        color: var(--checkout-muted, #7d7b72);
    }
    
    /* Checkout card - restore yellow border at top */
    body .checkout-card {
        padding: 18px 16px;
        border-radius: 14px;
        gap: 14px;
        border: 1px solid rgba(12, 26, 58, 0.05);
    }
    
    body .checkout-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: linear-gradient(90deg, var(--checkout-yellow, #FEC321) 0%, var(--checkout-yellow-hover, #ffd54f) 100%);
        border-radius: 14px 14px 0 0;
    }
    
    /* Topbar with only description visible */
    body .checkout-topbar {
        gap: 12px;
        align-items: center;
        margin-bottom: 16px;
        justify-content: flex-start;
    }
    body .checkout-progress {
        gap: 0;
        padding: 0;
        margin-bottom: 16px;
        border-radius: 12px;
        position: relative;
        justify-content: space-between;
    }
    
    /* Progress background line - mobile: center of first step to center of last */
    body .checkout-progress::before {
        content: '';
        position: absolute;
        top: 15px;
        left: 16.67%;
        right: 16.67%;
        height: 3px;
        margin-top: 7px;
        background: rgba(12, 26, 58, 0.1);
        z-index: 0;
    }
    
    /* Progress fill line - mobile: spans exactly one step width (33.33%) per completed step */
    body .progress-step.completed::after {
        content: '';
        position: absolute;
        top: 15px;
        left: 50%;
        width: 100%;
        height: 3px;
        margin-top: 7px !important;
        background: var(--checkout-success, #31c17c);
        z-index: 0;
    }
    
    /* Hide fill after last step */
    body .progress-step:last-child::after {
        display: none;
    }
    
    body .checkout-progress .progress-step {
        padding: 8px 6px;
        min-width: 0;
        z-index: 1;
        flex: 1 1 0%;
        text-align: center;
    }
    body .progress-step-circle {
        width: 30px;
        height: 30px;
        font-size: 0.95rem;
    }
    body .progress-step-label {
        font-size: 0.95rem;
    }
    body .checkout-form-card {
        padding: 0;
        gap: 14px;
    }
    body .form-section {
        padding: 0px;
        border-radius: 14px;
        gap: 12px;
        margin-bottom: 14px;
    }
    body .section-heading {
        gap: 10px;
    }
    body .section-index {
        width: 30px;
        height: 30px;
        font-size: 0.95rem;
    }
    body .section-label {
        font-size: 1.02rem;
        margin: 0;
    }
    body .section-helper {
        font-size: 0.95rem;
        margin: 2px 0 0;
        line-height: 1.45;
    }
    body .inputs-grid {
        gap: 12px;
    }
    body .inputs-grid.split-50,
    body .inputs-grid.split-80-20 {
        grid-template-columns: 1fr !important;
        gap: 0.5rem;
    }
    body .form-control label {
        font-size: 0.95rem;
        margin-bottom: 6px;
    }
    body .form-control input,
    body .form-control select,
    body .form-control textarea {
        font-size: 0.98rem;
        padding: 12px 12px;
        border-radius: 12px;
    }
    body .phone-input {
        gap: 8px;
    }
    body .phone-input select {
        min-width: 92px;
        font-size: 0.95rem;
        padding: 10px 10px;
    }
    body .phone-input input {
        flex: 1;
        min-width: 0;
    }
    body .phone-status {
        right: 8px;
        font-size: 0.9rem;
    }
    body .pill-toggle {
        flex-wrap: wrap;
        gap: 10px;
        padding: 8px;
        border-radius: 12px;
        margin-bottom: 0.5rem;
    }
    body .pill-toggle .pill-option {
        flex: 1 1 46%;
        min-width: 15rem;
        padding: 10px 12px;
        font-size: 0.98rem;
        border-radius: 12px;
    }
    body .payment-note,
    body .section-helper,
    body .secure-note {
        font-size: 0.95rem;
    }
    body .step-button-container {
        margin-top: 8px;
    }
    body .next-step-button,
    body .primary-button {
        width: 100%;
        padding: 12px 14px;
        font-size: 1rem;
        border-radius: 12px;
    }
    body .primary-button {
        margin-top: 4px;
    }
    body .secure-note {
        margin-top: 6px;
        line-height: 1.4;
    }

    /* Shop Page Filter - Max Price Input */
    .shop-filters > div:last-child {
        width: 100% !important;
        flex: 1 1 100% !important;
    }
    
    #filter-price {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    /* N. Cart Page Mobile Layout */
    body.cart-page-view {
        overflow-x: hidden !important;
    }

    body.cart-page-view .cart-section-wrapper {
        padding: 32px 0 80px;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }

    body.cart-page-view .cart-section-wrapper .content_wrap {
        padding: 0 18px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    body.cart-page-view .cart-page {
        flex-direction: column;
        gap: 28px;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    body.cart-page-view .cart-items {
        max-height: none;
        min-height: 250px;
        padding: 16px 12px;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    /* Fix cart-item-card layout for mobile */
    body.cart-page-view .cart-item-card {
        display: grid;
        grid-template-columns: 60px 1fr auto;
        grid-template-rows: auto auto auto;
        gap: 8px 10px;
        padding: 14px 12px;
        box-sizing: border-box;
        align-items: start;
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    body.cart-page-view .cart-item-card .ci-media {
        grid-row: 1 / 4;
        grid-column: 1 / 2;
    }

    body.cart-page-view .cart-item-card .ci-media img {
        width: 60px;
        height: 60px;
        flex-shrink: 0;
        border-radius: 8px;
        object-fit: cover;
    }

    body.cart-page-view .cart-item-card .ci-info {
        display: contents;
    }

    body.cart-page-view .cart-item-card .ci-title {
        grid-column: 2 / 3;
        grid-row: 1 / 2;
        font-size: 15px;
        line-height: 1.35;
        font-weight: 700;
        color: #231f20;
        word-wrap: break-word;
        align-self: start;
    }

    body.cart-page-view .cart-item-card .ci-price {
        grid-column: 2 / 4;
        grid-row: 2 / 3;
        display: block;
        font-weight: 700;
        color: #FEC321;
        font-size: 14px;
        white-space: nowrap;
        align-self: start;
    }

    body.cart-page-view .cart-item-card .ci-meta {
        grid-column: 2 / 3;
        grid-row: 3 / 4;
        display: flex;
        align-items: center;
        gap: 8px;
        flex-wrap: wrap;
        align-self: center;
    }

    body.cart-page-view .cart-item-card .ci-total {
        grid-column: 3 / 4;
        grid-row: 3 / 4;
        font-weight: 800;
        color: #0C1A3A;
        font-size: 16px;
        text-align: right;
        justify-self: end;
        align-self: center;
    }

    body.cart-page-view .cart-item-card .ci-actions {
        grid-column: 3 / 4;
        grid-row: 1 / 2;
        justify-self: end;
        align-self: start;
    }

    body.cart-page-view .cart-item-card .ci-actions .remove-cart-item {
        width: 32px;
        min-height: 32px;
        border-radius: 50%;
        background: #fafafa;
        border: 1px solid #e6e6e6;
        color: #231f20;
        font-weight: 700;
        font-size: 18px;
        cursor: pointer;
    }

    body.cart-page-view .cart-item-card .ci-actions .remove-cart-item:hover {
        background: #FEC321;
        border-color: #FEC321;
        color: #181516;
    }

    /* Quantity controls for mobile */
    body.cart-page-view .qty-control {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 3px 5px;
        border: 1px solid #e6e6e6;
        border-radius: 9999px;
        background: #fff;
        box-shadow: 0 2px 6px rgba(0,0,0,0.04);
        height: 30px;
    }

    body.cart-page-view .qty-control .qc-btn {
        width: 24px !important;
        min-height: 24px !important;
        padding: 0 !important;
        border: none;
        border-radius: 50% !important;
        background: #FEC321;
        color: #231f20;
        font-weight: 800;
        font-size: 13px;
        line-height: 1;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    body.cart-page-view .qty-control .qc-btn:hover {
        background: #ffb800;
    }

    body.cart-page-view .qty-control .qc-input {
        width: 32px !important;
        height: 20px !important;
        padding: 0 !important;
        text-align: center;
        border: none !important;
        background: transparent !important;
        box-shadow: none !important;
        font-weight: 900;
        color: #0C1A3A;
        font-size: 14px;
    }

    body.cart-page-view .qty-control .qc-input:focus {
        outline: none !important;
        background: transparent !important;
    }

    body.cart-page-view .cart-summary {
        width: 100% !important;
        max-width: 100% !important;
        flex-shrink: 0 !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    body.cart-page-view .summary-card {
        padding: 0 !important;
        background: #ffffff !important;
        border: 1px solid #eee !important;
        border-radius: 12px !important;
        box-shadow: 0 8px 24px rgba(12, 26, 58, 0.10), 0 4px 12px rgba(0, 0, 0, 0.06) !important;
        overflow: hidden !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    body.cart-page-view .summary-title {
        margin: 0 !important;
        padding: 18px 16px 14px !important;
        font-size: 19px !important;
        font-weight: 800 !important;
        color: #0C1A3A !important;
        font-family: "Oswald", sans-serif !important;
        text-align: left !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
        border-bottom: 1px solid #f0f0f0 !important;
    }

    body.cart-page-view .summary-row {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 12px 16px !important;
        font-size: 15px !important;
        margin: 0 !important;
        line-height: 1.4 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    body.cart-page-view .summary-row span:first-child {
        color: #6B7280 !important;
        font-weight: 600 !important;
        font-size: 14px !important;
        flex-shrink: 0 !important;
        white-space: nowrap !important;
    }

    body.cart-page-view .summary-row span:last-child,
    body.cart-page-view .summary-subtotal,
    body.cart-page-view .summary-shipping,
    body.cart-page-view .summary-total {
        color: #0C1A3A !important;
        font-weight: 700 !important;
        text-align: right !important;
        font-size: 15px !important;
        flex-shrink: 0 !important;
        white-space: nowrap !important;
    }

    body.cart-page-view .summary-divider {
        height: 1px !important;
        background: #E9E9E9 !important;
        margin: 8px 16px !important;
        border: none !important;
    }

    body.cart-page-view .summary-row.total {
        font-size: 17px !important;
        font-weight: 900 !important;
        padding: 14px 16px !important;
        margin: 0 !important;
        background: #fafafa !important;
    }

    body.cart-page-view .summary-row.total span:first-child {
        color: #0C1A3A !important;
        font-weight: 800 !important;
        font-size: 16px !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }

    body.cart-page-view .summary-row.total span:last-child,
    body.cart-page-view .summary-row.total .summary-total {
        color: #FEC321 !important;
        font-size: 20px !important;
        font-weight: 900 !important;
    }

    body.cart-page-view .summary-actions {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        padding: 14px 16px 18px !important;
        border-top: 1px solid #f0f0f0 !important;
        background: #fff !important;
    }

    body.cart-page-view .checkout-button {
        width: 100% !important;
        padding: 14px 20px !important;
        font-size: 15px !important;
        text-align: center !important;
        display: block !important;
        box-sizing: border-box !important;
        background: #FEC321 !important;
        color: #0C1A3A !important;
        border: none !important;
        border-radius: 8px !important;
        font-weight: 900 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.6px !important;
        cursor: pointer !important;
        font-family: inherit !important;
    }

    body.cart-page-view .checkout-button:hover {
        background: #f8bf00 !important;
    }

    body.cart-page-view .continue-link {
        width: 100% !important;
        text-align: center !important;
        display: inline-block !important;
        padding: 11px 16px !important;
        font-size: 14px !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
        background: #fff !important;
        color: #0C1A3A !important;
        border: 1px solid #E6E6E6 !important;
        border-radius: 8px !important;
        font-weight: 700 !important;
    }

    body.cart-page-view .continue-link:hover {
        border-color: #FEC321 !important;
        color: #FEC321 !important;
    }

    body.cart-page-view h2 {
        font-size: 26px;
        margin-bottom: 20px;
        text-align: center;
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        word-wrap: break-word;
    }

    body.cart-page-view .empty-cart-message {
        font-size: 16px;
        text-align: center;
        padding: 40px 20px;
    }

    body.cart-page-view .coupon-wrap {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        padding: 14px 16px 18px !important;
        margin: 0 !important;
        border-top: 1px solid #f0f0f0 !important;
        background: #fafafa !important;
    }

    body.cart-page-view #coupon-code {
        width: 100% !important;
        margin: 0 !important;
        padding: 11px 14px !important;
        font-size: 14px !important;
        box-sizing: border-box !important;
        border: 1px solid #e6e6e6 !important;
        border-radius: 8px !important;
        background: #fff !important;
    }

    body.cart-page-view .apply-coupon {
        width: 100% !important;
        padding: 11px 18px !important;
        font-size: 14px !important;
        border: none !important;
        border-radius: 8px !important;
        background: #0C1A3A !important;
        color: #fff !important;
        font-weight: 700 !important;
        cursor: pointer !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }

    body.cart-page-view .apply-coupon:hover {
        background: #16284d !important;
    }
}

@media (max-width: 480px) {
    /* A. Global Mobile Safety */
    body.home3 {
        font-size: 15px;
    }
    body.home3 .page_content_wrap > .content_wrap,
    body.ab2 .page_content_wrap > .content_wrap,
    body.home3 .call_wrap .content_wrap,
    body.home3 .footer_wrap .content_wrap,
    .call_wrap .content_wrap,
    .footer_wrap .content_wrap {
        padding-left: 14px;
        padding-right: 14px;
        padding-bottom: 0px;
    }
    /* About page: mirror homepage container model at smallest mobile */
    body.ab2 .vc_row {
        margin-left: auto !important;
        margin-right: auto !important;
    }
    body.ab2 .vc_column_container .vc_column-inner {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    /* B. Header / Nav */
    body.home3 .header_actions {
        flex-direction: column;
        align-items: center;
    }
    body.home3 .top_panel_login_button_simple {
        width: 100%;
    }
    body.home3 .header_mobile,
    .header_mobile {
        padding: 10px 14px;
    }
    body.home3 .header_mobile .content_wrap,
    .header_mobile .content_wrap {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center;
        justify-content: space-between;
        min-height: 52px;
        gap: 0;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 3px;
        box-sizing: border-box;
    }
    body.home3 .header_mobile .content_wrap::after,
    .header_mobile .content_wrap::after {
        display: none !important;
        content: none !important;
    }
    body.home3 .header_mobile .logo,
    .header_mobile .logo {
        gap: 11px;
        padding: 4px !important;
    }
    body.home3 .header_mobile .brand-mark,
    .header_mobile .brand-mark {
        width: 40px;
        height: 40px;
    }
    body.home3 .header_mobile .logo_main,
    .header_mobile .logo_main {
        width: 56px;
        height: 56px;
        max-width: 56px;
        margin: 0 !important;
    }
    body.home3 .header_mobile .logo-title,
    .header_mobile .logo-title {
        font-size: 1rem;
    }
    body.home3 .header_mobile .logo-tagline,
    .header_mobile .logo-tagline {
        font-size: 0.58rem;
        letter-spacing: 0.18em;
    }
    body.home3 .header_mobile .menu_button,
    .header_mobile .menu_button {
        width: 40px;
        min-width: 40px;
        height: 40px;
        font-size: 20px;
        margin-left: auto;
        flex-shrink: 0;
    }

    /* C. Hero Slider / Banner */
    body.home3 .hero-slider {
        min-height: min(92vh, 560px);
        height: min(92vh, 560px);
    }
    body.home3 .hero-slide-inner {
        padding: clamp(24px, 10vw, 40px) 12px;
    }
    body.home3 .hero-slide-title {
        font-size: clamp(1.85rem, 8vw, 2.35rem);
        letter-spacing: 0.06em;
    }
    body.home3 .hero-slide-subtitle {
        font-size: 0.98rem;
    }
    body.home3 .hero-slide-actions .sc_button {
        width: min(290px, 94%);
        min-height: 50px;
    }
    body.home3 .hero-slider-dots {
        bottom: 14px;
    }

    /* D. Welcome Section */
    body.home3 .sc_highlight {
        font-size: 0.98rem;
    }

    /* E. 3-Card Feature Row */
    body.home3 #home-products .column-1_3 {
        flex: 0 0 96%;
        padding-right: 2px;
    }
    body.home3 #home-products .sc_services_item_featured img {
        height: 200px;
    }

    /* F. What's Fresh Section */
    body.home3 .whats-fresh-hero {
        padding: 28px 20px;
    }

    /* G. About Timeline */
    body.home3 #sc_tabs_583 .years-nav-btn,
    body.ab2 #sc_tabs_113 .years-nav-btn {
        font-size: 18px;
        padding: 2px;
    }
    body.home3 #sc_tabs_583 .years-list,
    body.ab2 #sc_tabs_113 .years-list {
        padding-bottom: 4px;
    }
    body.home3 .sc_promo_size_large .sc_promo_image,
    body.ab2 .sc_promo_size_large .sc_promo_image {
        min-height: 200px;
    }

    /* H. Products Section */
    body.home3 .rotating-ring-section {
        margin-top: 2.5em;
        margin-bottom: 2.5em;
    }
    body.home3 .ring-wrapper {
        width: min(260px, 78vw);
        height: min(260px, 78vw);
    }
    body.home3 .ring-item.active {
        width: 130px !important;
        height: 130px !important;
    }

    /* I. Featured Recipe */
    body.home3 .vc_custom_1475048754773 figure img {
        max-width: min(200px, 65vw);
    }
    body.home3 .featured-recipe-heading .sc_section_title {
        font-size: clamp(2rem, 4.4vw, 2rem);
    }
    body.home3 .featured-recipe-callout .sc_section_title {
        font-size: clamp(1.4rem, 5vw, 1.6rem);
        text-align: center;
    }
    body.home3 .featured-recipe-callout .sc_section_descr {
        font-size: 0.9rem;
        line-height: 1.55;
        text-align: center;
    }
    body.home3 .featured-recipe-callout .sc_section_content_wrap {
        gap: 2.2rem;
    }
    body.home3 .featured-recipe-callout .sc_section_content_wrap::before {
        width: min(150px, 68vw);
    }

    /* J. Blog Cards Section */
    body.home3 #home-stories .isotope_item {
        flex: 0 0 90%;
    }
    body.home3 #home-stories .post_featured img {
        height: 180px;
    }

    /* K. Team Section */
    body.home3 .portfolio-layout1 .portfolio__img,
    body.ab2 .portfolio-layout1 .portfolio__img {
        width: 140px;
        height: 140px;
    }

    /* L. Footer */
    body.home3 .footer_wrap .columns_wrap > aside.widget_nav_menu,
    body.home3 .footer_wrap .columns_wrap > aside:not(.widget_nav_menu),
    .footer_wrap .columns_wrap > aside.widget_nav_menu,
    .footer_wrap .columns_wrap > aside:not(.widget_nav_menu) {
        flex: 1 1 100%;
        min-width: 100%;
        max-width: 100%;
    }
    .mobile-footer-call .call_wrap_inner {
        padding: 24px 14px;
    }
    .mobile-footer-main .content_wrap {
        width: 100% !important;
        padding-left: 14px;
        padding-right: 14px;
        box-sizing: border-box;
    }
    .mobile-footer-call .content_wrap {
        width: 100% !important;
        padding-left: 14px;
        padding-right: 14px;
        box-sizing: border-box;
    }
    .mobile-footer-call .mobile-store-cta {
        width: 100%;
        max-width: none;
        margin: 0.75rem 0 0;
        display: inline-flex;
        justify-content: center;
        box-sizing: border-box;
    }
    .mobile-footer-main .mobile-footer-column {
        width: 100%;
    }

    /* M. Contact Page - Smaller Screens */
    body.contactspg .contact_layout_container {
        padding: 16px 14px 32px;
        gap: 2rem !important;
    }

    body.contactspg .contact-info-card {
        padding: 20px 16px;
        min-height: auto;
    }

    body.contactspg .contact-icon-wrapper {
        width: 56px;
        height: 56px;
        margin-bottom: 12px;
    }

    body.contactspg .contact-icon {
        font-size: 24px;
    }

    body.contactspg .contact-card-title {
        font-size: 13px;
        letter-spacing: 0.12em;
    }

    body.contactspg .contact-card-text {
        font-size: 13px;
    }

    body.contactspg #map-container,
    body.contactspg #map-iframe {
        min-height: 350px;
    }

    body.contactspg .fresh-from-farm-overlay h1 {
        font-size: clamp(1.5rem, 5vw, 2rem);
    }

    body.contactspg .overlay-tagline {
        font-size: 13px !important;
    }

    body.contactspg .sc_form_field label {
        font-size: 14px;
    }

    body.contactspg .sc_form_field input,
    body.contactspg .sc_form_field textarea {
        font-size: 14px;
        padding: 10px 12px;
    }

    /* N. Cart Page - Smaller Screens */
    body.cart-page-view {
        overflow-x: hidden !important;
    }

    body.cart-page-view .cart-section-wrapper {
        padding: 1.3rem 0 1.7rem;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }

    body.cart-page-view .cart-section-wrapper .content_wrap {
        padding: 0 14px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    body.cart-page-view .cart-page {
        flex-direction: column;
        gap: 0.8rem;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    body.cart-page-view .cart-items {
        max-height: none;
        min-height: 200px;
        padding: 14px 10px;
        margin-bottom: 12px;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    /* Fix cart-item-card layout for smaller mobile */
    body.cart-page-view .cart-item-card {
        display: grid;
        grid-template-columns: 95px 1fr 3rem;
        grid-template-rows: auto auto auto;
        gap: 6px 8px;
        padding: 12px 10px;
        box-sizing: border-box;
        align-items: start;
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    body.cart-page-view .cart-item-card .ci-media {
        grid-row: 1 / 4;
        grid-column: 1 / 2;
    }

    body.cart-page-view .cart-item-card .ci-media img {
        width: 95px;
        height: 95px;
        flex-shrink: 0;
        border-radius: 7px;
        object-fit: cover;
    }

    body.cart-page-view .cart-item-card .ci-info {
        display: contents;
    }

    body.cart-page-view .cart-item-card .ci-title {
        grid-column: 2 / 3;
        grid-row: 1 / 2;
        font-size: 15px;
        line-height: 1.35;
        font-weight: 700;
        color: #231f20;
        word-wrap: break-word;
        align-self: anchor-center;
    }

    body.cart-page-view .cart-item-card .ci-price {
        grid-column: 2 / 4;
        grid-row: 2 / 3;
        display: block;
        font-weight: 700;
        color: #FEC321;
        font-size: 14px;
        white-space: nowrap;
        align-self: start;
    }

    body.cart-page-view .cart-item-card .ci-meta {
        grid-column: 2 / 3;
        grid-row: 3 / 4;
        display: flex;
        align-items: center;
        gap: 6px;
        flex-wrap: wrap;
        align-self: center;
    }

    body.cart-page-view .cart-item-card .ci-total {
        grid-column: 3 / 4;
        grid-row: 3 / 4;
        font-weight: 800;
        color: #0C1A3A;
        font-size: 1rem;
        text-align: right;
        justify-self: end;
        align-self: center;
    }

    body.cart-page-view .cart-item-card .ci-actions {
        grid-column: 3 / 4;
        grid-row: 1 / 2;
        justify-self: end;
        align-self: start;
    }

    body.cart-page-view .cart-item-card .ci-actions .remove-cart-item {
        width: 36px;
        min-height: 22px;
        border-radius: 12px;
        background: #fafafa;
        border: 1px solid #e6e6e6;
        color: #231f20;
        font-weight: 700;
        font-size: 1rem;
        cursor: pointer;
    }

    body.cart-page-view .cart-item-card .ci-actions .remove-cart-item:hover {
        background: #FEC321;
        border-color: #FEC321;
        color: #181516;
    }

    /* Quantity controls for smaller mobile */
    body.cart-page-view .qty-control {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        padding: 2px 4px;
        border: 1px solid #e6e6e6;
        border-radius: 9999px;
        background: #fff;
        box-shadow: 0 2px 6px rgba(0,0,0,0.04);
        height: 28px;
    }

    body.cart-page-view .qty-control .qc-btn {
        width: 22px !important;
        min-height: 22px !important;
        padding: 0 !important;
        border: none;
        border-radius: 50% !important;
        background: #FEC321;
        color: #231f20;
        font-weight: 800;
        font-size: 12px;
        line-height: 1;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    body.cart-page-view .qty-control .qc-btn:hover {
        background: #ffb800;
    }

    body.cart-page-view .qty-control .qc-input {
        width: 30px !important;
        height: 18px !important;
        padding: 0 !important;
        text-align: center;
        border: none !important;
        background: transparent !important;
        box-shadow: none !important;
        font-weight: 900;
        color: #0C1A3A;
        font-size: 13px;
    }

    body.cart-page-view .qty-control .qc-input:focus {
        outline: none !important;
        background: transparent !important;
    }

    body.cart-page-view .cart-summary {
        width: 100% !important;
        max-width: 100% !important;
        flex-shrink: 0 !important;
        position: relative !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    body.cart-page-view .summary-card {
        padding: 0 !important;
        background: #ffffff !important;
        border: 1px solid #eee !important;
        border-radius: 12px !important;
        box-shadow: 0 6px 20px rgba(12, 26, 58, 0.10), 0 3px 10px rgba(0, 0, 0, 0.06) !important;
        overflow: hidden !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    body.cart-page-view .summary-title {
        margin: 0 !important;
        padding: 16px 14px 12px !important;
        font-size: 1.25rem !important;
        font-weight: 800 !important;
        color: #0C1A3A !important;
        font-family: "Oswald", sans-serif !important;
        text-align: left !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
        border-bottom: 1px solid #f0f0f0 !important;
    }

    body.cart-page-view .summary-row {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 10px 14px !important;
        font-size: 14px !important;
        margin: 0 !important;
        line-height: 1.4 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    body.cart-page-view .summary-row span:first-child {
        color: #6B7280 !important;
        font-weight: 600 !important;
        font-size: 1rem !important;
        flex-shrink: 0 !important;
        white-space: nowrap !important;
    }

    body.cart-page-view .summary-row span:last-child,
    body.cart-page-view .summary-subtotal,
    body.cart-page-view .summary-shipping,
    body.cart-page-view .summary-total {
        color: #0C1A3A !important;
        font-weight: 700 !important;
        text-align: right !important;
        font-size: 1rem !important;
        flex-shrink: 0 !important;
        white-space: nowrap !important;
        font-family: 'Oswald', sans-serif;
    }

    body.cart-page-view .summary-subtotal,
    body.cart-page-view .summary-shipping {
        font-family: 'Open Sans', sans-serif !important;
    }
    body.cart-page-view .summary-divider {
        height: 1px !important;
        background: #E9E9E9 !important;
        margin: 6px 14px !important;
        border: none !important;
    }

    body.cart-page-view .summary-row.total {
        font-size: 1.15rem !important;
        font-weight: 900 !important;
        padding: 12px 14px !important;
        margin: 0 !important;
        background: #fafafa !important;
        font-family: 'Oswald', sans-serif;
    }

    body.cart-page-view .summary-row.total span:first-child {
        color: #0C1A3A !important;
        font-weight: 800 !important;
        font-size: 1.15rem !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }

    body.cart-page-view .summary-row.total span:last-child,
    body.cart-page-view .summary-row.total .summary-total {
        color: #FEC321 !important;
        font-size: 1.15rem !important;
        font-weight: 900 !important;
    }

    body.cart-page-view .summary-actions {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        padding: 12px 14px 16px !important;
        border-top: 1px solid #f0f0f0 !important;
        background: #fff !important;
    }

    body.cart-page-view .checkout-button {
        width: 100% !important;
        padding: 13px 18px !important;
        font-size: 1rem !important;
        text-align: center !important;
        display: block !important;
        box-sizing: border-box !important;
        background: #FEC321 !important;
        color: #0C1A3A !important;
        border: none !important;
        border-radius: 8px !important;
        font-weight: 900 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.6px !important;
        cursor: pointer !important;
        font-family: 'Oswald', sans-serif !important;
    }

    body.cart-page-view .checkout-button:hover {
        background: #f8bf00 !important;
    }

    body.cart-page-view .continue-link {
        width: 100% !important;
        text-align: center !important;
        display: inline-block !important;
        padding: 10px 14px !important;
        font-size: 1rem !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
        background: #fff !important;
        color: #0C1A3A !important;
        border: 1px solid #E6E6E6 !important;
        border-radius: 8px !important;
        font-weight: 700 !important;
    }

    body.cart-page-view .continue-link:hover {
        border-color: #FEC321 !important;
        color: #FEC321 !important;
    }

    body.cart-page-view h2 {
        font-size: 24px;
        margin-bottom: 16px;
        margin-top: 0rem;
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        word-wrap: break-word;
        text-align: center;
    }

    body.cart-page-view .empty-cart-message {
        font-size: 16px;
        padding: 20px;
        text-align: center;
    }

    body.cart-page-view .coupon-wrap {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        padding: 12px 14px 16px !important;
        margin: 0 !important;
        border-top: 1px solid #f0f0f0 !important;
        background: #fafafa !important;
    }

    body.cart-page-view #coupon-code {
        width: 100% !important;
        margin: 0 !important;
        padding: 10px 12px !important;
        font-size: 13px !important;
        box-sizing: border-box !important;
        border: 1px solid #e6e6e6 !important;
        border-radius: 8px !important;
        background: #fff !important;
    }

    body.cart-page-view .apply-coupon {
        width: 100% !important;
        padding: 10px 16px !important;
        font-size: 1rem !important;
        border: none !important;
        border-radius: 8px !important;
        background: #0C1A3A !important;
        color: #fff !important;
        font-weight: 700 !important;
        cursor: pointer !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }

    body.cart-page-view .apply-coupon:hover {
        background: #16284d !important;
    }

    /* Auth form spacing - reduce gaps on mobile only */
    .field {
        margin-bottom: 0.7rem !important;
    }
    .field label {
        margin-bottom: 0.2rem !important;
    }
    .field-hint {
        margin-top: 0.1rem !important;
        min-height: 0rem !important;
    }
    .form-meta {
        margin-bottom: 0.8rem !important;
        gap: 0.5rem !important;
        margin-top: 1.1rem !important;
    }
    .auth-form {
        gap: 0.5rem !important;
    }

    /* ============================================
     * USER PROFILE PAGE MOBILE OPTIMIZATION
     * Ensures proper padding, spacing, and layout
     * on mobile devices without affecting desktop
     * ============================================ */

    /* Profile V2 (Modern Layout) Mobile Optimization */
    .profile-v2 {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto 40px !important;
        padding: 16px 16px 60px !important;
        box-sizing: border-box;
    }

    .profile-v2 *,
    .profile-v2 *::before,
    .profile-v2 *::after {
        box-sizing: border-box;
    }

    /* Main grid - stack sidebar and content vertically */
    .profile-v2 .profile-shell {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important;
        grid-template-columns: none !important;
    }

    /* Sidebar - full width on mobile with proper padding */
    .profile-v2 .profile-sidebar {
        width: 100% !important;
        max-width: 100% !important;
        padding: 16px !important;
        margin: 0 !important;
        box-sizing: border-box;
    }

    .profile-v2 .sidebar-brand {
        flex-wrap: wrap;
        gap: 8px;
    }

    .profile-v2 .sidebar-user {
        padding: 12px !important;
        gap: 10px;
    }

    .profile-v2 .sidebar-avatar {
        width: 38px !important;
        height: 38px !important;
        font-size: 14px !important;
    }

    .profile-v2 .sidebar-name {
        font-size: 15px !important;
    }

    .profile-v2 .sidebar-email {
        font-size: 12px !important;
        max-width: 200px;
    }

    /* Sidebar navigation - ensure proper padding and spacing */
    .profile-v2 .sidebar-nav {
        gap: 6px !important;
    }

    .profile-v2 .sidebar-link {
        padding: 10px 14px !important;
        font-size: 0.9rem !important;
        border-left-width: 3px !important;
        padding-left: 14px !important;
    }

    .profile-v2 .sidebar-link.is-active {
        padding-left: 14px !important;
    }

    .profile-v2 .sidebar-link small {
        font-size: 0.72rem !important;
    }

    /* Sidebar upgrade section */
    .profile-v2 .sidebar-upgrade {
        padding: 14px !important;
        gap: 10px;
    }

    .profile-v2 .sidebar-upgrade h4 {
        font-size: 0.85rem !important;
    }

    .profile-v2 .sidebar-cta {
        padding: 8px 18px !important;
        font-size: 0.8rem !important;
        margin-top: 8px;
    }

    /* Main content area - full width with proper padding */
    .profile-v2 .profile-main {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        gap: 20px !important;
    }

    /* Overview container */
    .profile-v2-overview {
        width: 100% !important;
        max-width: 100% !important;
        padding: 16px !important;
        margin: 0 0 20px 0 !important;
        box-sizing: border-box;
        gap: 20px;
    }

    /* Profile heading */
    .profile-v2 .profile-heading {
        flex-direction: column;
        gap: 12px !important;
    }

    .profile-v2 .profile-heading h1 {
        font-size: 1.5rem !important;
        line-height: 1.3 !important;
    }

    .profile-v2 .heading-subtitle {
        font-size: 0.9rem !important;
    }

    /* Insight grid - stack cards vertically on mobile */
    .profile-v2 .insight-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        width: 100% !important;
        grid-template-columns: none !important;
    }

    .profile-v2 .insight-card {
        width: 100% !important;
        max-width: 100% !important;
        padding: 16px !important;
        box-sizing: border-box;
    }

    .profile-v2 .insight-label {
        font-size: 0.78rem !important;
    }

    .profile-v2 .insight-value {
        font-size: 1.5rem !important;
    }

    .profile-v2 .insight-hint {
        font-size: 0.8rem !important;
    }

    /* Cards - proper padding and spacing */
    .profile-v2 .card {
        width: 100% !important;
        max-width: 100% !important;
        padding: 16px !important;
        margin: 0 !important;
        box-sizing: border-box;
    }

    .profile-v2 .card + .card {
        margin-top: 20px !important;
    }

    /* Card header - stack on small screens */
    .profile-v2 .card-header {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 10px !important;
        margin-bottom: 14px !important;
        padding-bottom: 14px !important;
    }

    .profile-v2 h2 {
        font-size: 1.1rem !important;
    }

    .profile-v2 .card-eyebrow {
        font-size: 0.7rem !important;
    }

    /* Form grid - single column on mobile */
    .profile-v2 .form-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;
        grid-template-columns: none !important;
    }

    .profile-v2 .form-field {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        flex: none !important;
    }

    /* Form inputs - ensure proper sizing */
    .profile-v2 input,
    .profile-v2 textarea {
        width: 100% !important;
        max-width: 100% !important;
        padding: 10px 12px !important;
        font-size: 0.9rem !important;
        min-height: 42px !important;
        box-sizing: border-box;
    }

    .profile-v2 label {
        font-size: 0.85rem !important;
        gap: 5px;
    }

    /* Form actions - stack buttons vertically */
    .profile-v2 .form-actions {
        flex-direction: column !important;
        gap: 10px !important;
        padding-top: 10px !important;
        margin-top: 10px !important;
    }

    /* Buttons - full width on mobile */
    .profile-v2 .btn-primary,
    .profile-v2 .btn-danger,
    .profile-v2 .btn-secondary {
        width: 100% !important;
        padding: 10px 20px !important;
        font-size: 0.9rem !important;
        justify-content: center;
        box-sizing: border-box;
    }

    .profile-v2 .text-button {
        padding: 8px 16px !important;
        font-size: 0.85rem !important;
    }

    .profile-v2 .card-actions {
        width: 100%;
        flex-wrap: wrap;
        gap: 8px !important;
    }

    /* Support list - stack items */
    .profile-v2 .support-list li {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 12px !important;
        padding-bottom: 16px !important;
    }

    .profile-v2 .support-list li > div {
        width: 100%;
    }

    /* Address and order cards */
    .profile-v2 .address-card,
    .profile-v2 .order-card {
        padding: 14px !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Preference items */
    .profile-v2 .preference-item {
        flex-direction: row !important;
        padding: 12px 14px !important;
        gap: 12px !important;
    }

    .profile-v2 .preference-item > div {
        max-width: calc(100% - 32px) !important;
    }

    .profile-v2 .preference-item strong {
        font-size: 0.9rem;
    }

    .profile-v2 .preference-item p {
        font-size: 0.85rem !important;
    }

    /* Banner - ensure proper wrapping */
    .profile-v2 .profile-banner {
        padding: 10px 14px !important;
        flex-wrap: wrap;
        gap: 8px !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    .profile-v2 .profile-banner button {
        width: 100%;
        margin-top: 8px;
    }

    /* Modal - proper mobile sizing */
    .profile-v2 .modal-layer {
        padding: 16px !important;
    }

    .profile-v2 .modal {
        padding: 24px !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    .profile-v2 .modal h3 {
        font-size: 1.2rem !important;
    }

    /* Empty state */
    .profile-v2 .empty-state {
        padding: 20px 14px !important;
        font-size: 0.9rem;
    }

    /* ============================================
     * PROFILE LEGACY (Fallback Layout) Mobile
     * ============================================ */

    .profile-container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0px !important;
        margin: 0 !important;
        box-sizing: border-box;
    }

    /* Profile hero section */
    .profile-hero {
        padding: 20px !important;
        margin-bottom: 20px !important;
        border-radius: 20px !important;
    }

    /* Profile header - stack avatar and info */
    .profile-header {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center;
        gap: 16px !important;
        margin-bottom: 20px !important;
    }

    .profile-avatar {
        width: 80px !important;
        height: 80px !important;
    }

    .avatar-initial {
        font-size: 28px !important;
    }

    .profile-title {
        width: 100%;
    }

    .profile-title h1 {
        font-size: 1.5rem !important;
    }

    .profile-eyebrow {
        font-size: 10px !important;
    }

    .profile-email {
        font-size: 13px !important;
    }

    .profile-meta {
        justify-content: center;
        gap: 8px !important;
    }

    .profile-pill {
        padding: 5px 12px !important;
        font-size: 10px !important;
    }

    /* Quick actions - center on mobile */
    .profile-quick-actions {
        margin-left: 0 !important;
        width: 100%;
        justify-content: center;
    }

    .btn-logout {
        padding: 10px 18px !important;
        font-size: 10px !important;
    }

    /* Stats grid - stack on mobile */
    .profile-stats-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        grid-template-columns: none !important;
    }

    .profile-stat-card {
        width: 100% !important;
        padding: 16px 18px !important;
        border-radius: 16px !important;
    }

    .stat-label {
        font-size: 10px !important;
    }

    .stat-value {
        font-size: 26px !important;
    }

    .stat-trend {
        font-size: 12px !important;
    }

    /* Tabs - scrollable on mobile */
    .profile-tabs {
        gap: 6px !important;
        padding: 6px !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        margin-bottom: 20px !important;
    }

    .profile-tabs::-webkit-scrollbar {
        display: none;
    }

    .tab-button {
        padding: 12px 14px !important;
        min-width: 140px;
        flex: 0 0 auto;
    }

    .tab-icon {
        width: 36px !important;
        height: 36px !important;
    }

    .tab-icon svg {
        width: 16px !important;
        height: 16px !important;
    }

    .tab-label {
        font-size: 13px !important;
    }

    .tab-label small {
        font-size: 10px !important;
    }

    /* Tab content */
    .profile-tab-content {
        width: 100% !important;
        padding: 0 !important;
    }

    /* Profile cards (legacy) */
    .profile-card {
        width: 100% !important;
        padding: 16px !important;
        margin-bottom: 16px !important;
        border-radius: 20px !important;
        box-sizing: border-box;
    }

    .profile-card .card-header {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 10px !important;
        margin-bottom: 14px !important;
    }

    .profile-card h2 {
        font-size: 1.1rem !important;
    }

    /* Form rows - stack on mobile */
    .profile-form .form-row {
        flex-direction: column !important;
        gap: 14px !important;
    }

    .form-group {
        width: 100% !important;
    }

    .form-group label {
        font-size: 0.85rem !important;
    }

    .form-group input,
    .form-group textarea {
        width: 100% !important;
        padding: 10px 12px !important;
        font-size: 0.9rem !important;
        box-sizing: border-box;
    }

    /* Form actions (legacy) */
    .profile-form .form-actions {
        flex-direction: column !important;
        gap: 10px !important;
    }

    .profile-form .form-actions button {
        width: 100% !important;
        padding: 10px 20px !important;
    }

    .btn-edit,
    .btn-save,
    .btn-cancel {
        width: auto !important;
        min-width: 100px;
        padding: 8px 16px !important;
        font-size: 0.85rem !important;
    }

    /* Orders list */
    .orders-list {
        gap: 16px !important;
    }

    .order-card {
        padding: 16px !important;
        border-radius: 20px !important;
    }

    .order-card-header {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 10px !important;
        padding-bottom: 14px !important;
        margin-bottom: 14px !important;
    }

    .order-card-number {
        font-size: 18px !important;
    }

    .order-card-status {
        align-items: flex-start !important;
        width: 100%;
    }

    .order-card-date {
        font-size: 11px !important;
    }

    .order-status-badge {
        padding: 5px 12px !important;
        font-size: 10px !important;
    }

    .order-details {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        grid-template-columns: none !important;
    }

    .detail-item {
        width: 100% !important;
        padding: 12px !important;
    }

    .detail-label {
        font-size: 11px !important;
    }

    .detail-value {
        font-size: 16px !important;
    }

    /* Address list */
    .addresses-list {
        gap: 14px !important;
    }

    .address-card {
        width: 100% !important;
        padding: 14px !important;
        box-sizing: border-box;
    }

    /* Pagination */
    .pagination {
        flex-wrap: wrap;
        gap: 8px !important;
        justify-content: center;
    }

    /* Loading state */
    .loading-state {
        padding: 20px !important;
        font-size: 0.9rem !important;
    }

    /* Ensure all content has proper horizontal padding */
    .profile-v2 .panel-stack,
    .profile-tab-content {
        width: 100% !important;
        padding: 0 !important;
    }

    .profile-v2 .panel {
        width: 100% !important;
    }

    /* Fix any overflow issues */
    .profile-v2,
    .profile-container {
        overflow-x: hidden;
    }

    .profile-v2 .profile-shell,
    .profile-v2 .profile-main,
    .profile-v2 .card,
    .profile-card {
        overflow-x: hidden;
    }

    /* Ensure page wrapper doesn't add asymmetric padding */
    body.page .page_content_wrap .content_wrap {
        padding-left: 16px !important;
        padding-right: 16px !important;
        box-sizing: border-box;
        margin-top: 1.7rem;
    }

    /* Profile pages should have consistent padding */
    .page_content_wrap .content .post_content {
        padding: 0 !important;
    }

    .page_content_wrap .profile-v2,
    .page_content_wrap .profile-container {
        margin-left: auto;
        margin-right: auto;
    }
    
    /* Fix comment login button overflow on mobile */
    .bbc-post .comment-login-content {
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .bbc-post .comment-login-button {
        box-sizing: border-box;
        max-width: 100%;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
}
