/* ══════════════════════════════════════════════
   NANDAVAN — ELEMENTOR LAYOUT & CARD FIXES
   Targets custom CSS classes added to containers
   via the "css_classes" Elementor setting.
   
   These classes SURVIVE Elementor import (unlike
   data-id attributes which get regenerated).
   ══════════════════════════════════════════════ */

/* ── 4-COLUMN GRID (Features, Values) ─────── */
.nv-feat-grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
}



/* ── CARD STYLING (shared by all cards) ─────── */
.nv-card {
    background: #FFFDF7 !important;
    border: 3px solid #211D1A !important;
    border-radius: 6px !important;
    box-shadow: 8px 8px 0 #211D1A !important;
    padding: 32px 24px !important;
    text-align: center !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.nv-card:hover {
    transform: translate(-2px, -2px) !important;
    box-shadow: 10px 10px 0 #211D1A !important;
}

/* ── JOURNEY STEPS: 4-column grid ─────── */
.nv-steps-grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
}



/* ── STATS: 3-column grid ─────── */
.nv-stats-grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
    justify-content: center !important;
}



/* ── STORY SECTION: side-by-side layout ─────── */
.nv-story-section {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 40px !important;
}

.nv-story-section > .e-con,
.nv-story-section > .e-child,
.nv-story-section > .elementor-widget {
    flex: 1 !important;
    min-width: 0 !important;
}

/* ── HERO SECTION ─────── */
.nv-hero {
    text-align: center !important;
}

/* ── MARQUEE ANIMATION ─────── */
@keyframes nv-marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.nv-marquee {
    overflow: hidden !important;
    padding: 0 !important;
}

.nandavan-marquee {
    overflow: hidden !important;
    white-space: nowrap !important;
}

.nandavan-marquee__inner {
    display: inline-flex !important;
    align-items: center !important;
    animation: nv-marquee 20s linear infinite !important;
    white-space: nowrap !important;
    line-height: 1 !important;
}

.nandavan-marquee__item {
    display: inline-flex !important;
    align-items: center !important;
    line-height: 1 !important;
}

.nandavan-marquee__dot {
    display: inline-block !important;
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    margin: 0 1.25rem !important;
    align-self: center !important;
    flex-shrink: 0 !important;
    vertical-align: middle !important;
}

/* ── COMPARISON TABLE ─────── */
.nv-cmp-section table,
.nandavan-comparison__table {
    width: 100% !important;
    max-width: 800px !important;
    margin: 24px auto 0 !important;
    border-collapse: collapse !important;
    border: 3px solid #211D1A !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    box-shadow: 8px 8px 0 #211D1A !important;
    background: #FFFDF7 !important;
    color: #211D1A !important;
}

.nv-cmp-section table th,
.nandavan-comparison__table th {
    background: #211D1A !important;
    color: #FFFDF7 !important;
    font-family: 'Prompt', sans-serif !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    padding: 14px 20px !important;
    text-align: left !important;
}

.nv-cmp-section table td,
.nandavan-comparison__table td {
    padding: 12px 20px !important;
    font-size: 14px !important;
    border-bottom: 1px solid rgba(33, 29, 26, 0.12) !important;
    background: #FFFDF7 !important;
}

.nv-cmp-section table tr:nth-child(even) td,
.nandavan-comparison__table tr:nth-child(even) td {
    background: #FFF8EC !important;
}

.nv-cmp-section table tr:last-child td,
.nandavan-comparison__table tr:last-child td {
    border-bottom: none !important;
}

/* ── NEWSLETTER FORM ─────── */
.nandavan-newsletter__form {
    display: flex;
    gap: 0;
    max-width: 460px;
    margin: 24px auto 0;
}

.nandavan-newsletter__input {
    flex: 1;
    height: 52px;
    padding: 0 20px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    border: 3px solid #211D1A;
    border-right: none;
    border-radius: 9999px 0 0 9999px;
    background: #FFFDF7;
    color: #211D1A;
    outline: none;
    transition: border-color 0.2s;
}

.nandavan-newsletter__input:focus {
    border-color: #FFFF00;
}

.nandavan-newsletter__input::placeholder {
    color: rgba(33, 29, 26, 0.4);
}

.nandavan-newsletter__btn {
    height: 52px;
    padding: 0 28px;
    font-family: 'Prompt', sans-serif;
    font-weight: 900;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 3px solid #211D1A;
    border-radius: 0 9999px 9999px 0;
    background: #FFFF00;
    color: #211D1A;
    cursor: pointer;
    transition: background 0.2s, transform 0.1s;
    white-space: nowrap;
}

.nandavan-newsletter__btn:hover {
    background: #E6E600;
}

.nandavan-newsletter__btn:active {
    transform: scale(0.98);
}

/* ── DARK CTA ─────── */
.nv-dark-cta {
    text-align: center !important;
}

/* ── SECTION SPACING ─────── */
.nv-features-section,
.nv-journey-section,
.nv-stats-section,
.nv-products-section {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

/* ══════════════════════════════════════════════
   RESPONSIVE: Tablet (≤1024px)
   ══════════════════════════════════════════════ */
@media (max-width: 1024px) {
    .nv-story-section {
        gap: 24px !important;
    }
}

/* ══════════════════════════════════════════════
   RESPONSIVE: Mobile (≤768px)
   ══════════════════════════════════════════════ */
@media (max-width: 768px) {

    /* ── GLOBAL OVERFLOW FIX ─────── */
    body,
    html {
        overflow-x: hidden !important;
    }

    .elementor-section,
    .e-con,
    .e-child {
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }

    /* ── HEADINGS: Prevent overflow on mobile ─────── */
    h1, h2, h3,
    .elementor-heading-title {
        word-break: break-word !important;
    }

    /* ── HEADER: Collapse to mobile layout ─────── */
    #nv-header-main,
    [data-id="nv-header-main"] {
        padding: 0 16px !important;
        min-height: 52px !important;
    }

    #nv-nav-left,
    [data-id="nv-nav-left"] {
        display: none !important;
    }

    #nv-logo-center img,
    [data-id="nv-site-logo"] img {
        max-width: 120px !important;
    }

    /* ── HERO SECTION ─────── */
    .nv-hero {
        padding: 40px 20px !important;
    }

    .nv-hero p,
    .nv-hero .elementor-widget-text-editor {
        padding: 0 8px !important;
    }

    /* ── GENERIC CONTAINERS: Reduce padding (pages without css_classes) ─────── */
    .e-con[data-settings],
    .elementor-section {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    /* ── NAMED SECTIONS: Reduce padding ─────── */
    .nv-features-section,
    .nv-journey-section,
    .nv-stats-section,
    .nv-products-section,
    .nv-sp-main,
    .nv-sp-tabs,
    .nv-sp-related,
    .nv-newsletter {
        padding: 40px 16px !important;
    }

    /* ── GRIDS: Stack single-column ─────── */
    .nv-feat-grid,
    .nv-steps-grid,
    .nv-stats-grid {
        flex-direction: column !important;
        gap: 20px !important;
    }

    .nv-feat-grid > .e-con,
    .nv-feat-grid > .e-child,
    .nv-steps-grid > .e-con,
    .nv-steps-grid > .e-child,
    .nv-stats-grid > .e-con,
    .nv-stats-grid > .e-child {
        min-width: 0 !important;
    }

    /* ── ANY ROW CONTAINER: Stack on mobile ─────── */
    .e-con[data-settings*="row"],
    .e-con.e-flex.e-con-full {
        flex-direction: column !important;
    }

    .e-con.e-flex.e-con-full > .e-con,
    .e-con.e-flex.e-con-full > .e-child {
        min-width: 0 !important;
    }

    /* ── STORY SECTION: Stack image + text ─────── */
    .nv-story-section {
        flex-direction: column !important;
        gap: 20px !important;
        padding: 40px 16px !important;
    }

    /* ── CARDS: Tighter padding ─────── */
    .nv-card {
        padding: 24px 16px !important;
        box-shadow: 4px 4px 0 #211D1A !important;
    }

    /* ── BUTTONS: Ensure 44px tap targets ─────── */
    .elementor-button,
    .e-con .elementor-button {
        min-height: 44px !important;
    }

    /* ── HERO BUTTON ROW ─────── */
    .nv-hero .e-con {
        flex-direction: column !important;
        gap: 12px !important;
        align-items: center !important;
    }

    /* ── MARQUEE ─────── */
    .nv-marquee {
        padding: 8px 0 !important;
    }

    .nandavan-marquee__item {
        padding: 0 0.75rem !important;
    }

    .nandavan-marquee__dot {
        width: 7px !important;
        height: 7px !important;
        margin: 0 0.5rem !important;
    }

    /* ── CONTACT PAGE: Stack form + info ─────── */
    #nv-ct-body,
    [data-id="nv-ct-body"] {
        flex-direction: column !important;
        padding: 24px 16px 40px !important;
    }

    #nv-ct-form,
    [data-id="nv-ct-form"],
    #nv-ct-info,
    [data-id="nv-ct-info"] {
        min-width: 0 !important;
    }

    /* ── SINGLE PRODUCT: Stack gallery + details ─────── */
    .nv-sp-main {
        flex-direction: column !important;
        gap: 24px !important;
    }

    .nv-sp-main > .e-con,
    .nv-sp-main > .e-child {
        min-width: 0 !important;
    }

    /* ── WOOCOMMERCE: Shop grid → 2 columns ─────── */
    .woocommerce ul.products[class*="columns-"] {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 16px !important;
    }

    .woocommerce ul.products li.product {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* ── WOOCOMMERCE: Cart table scroll ─────── */
    .woocommerce-cart table.shop_table {
        display: block !important;
        overflow-x: auto !important;
    }

    .woocommerce-cart .cart_totals {
        width: 100% !important;
        float: none !important;
    }

    /* ── WOOCOMMERCE: Checkout ─────── */
    .woocommerce .col2-set {
        display: flex !important;
        flex-direction: column !important;
    }

    .woocommerce .col2-set .col-1,
    .woocommerce .col2-set .col-2 {
        width: 100% !important;
        float: none !important;
    }

    #order_review_heading,
    .woocommerce-checkout-review-order {
        width: 100% !important;
    }

    /* ── WOOCOMMERCE: Single product ─────── */
    .woocommerce div.product div.images,
    .woocommerce div.product div.summary {
        float: none !important;
        width: 100% !important;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs {
        flex-wrap: wrap !important;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs li {
        flex: 1 1 auto !important;
        text-align: center !important;
    }

    /* ── WOOCOMMERCE: My Account ─────── */
    .woocommerce-MyAccount-navigation,
    .woocommerce-MyAccount-content {
        width: 100% !important;
        float: none !important;
    }

    /* ── FOOTER ─────── */
    .nv-footer-links {
        flex-direction: column !important;
        gap: 6px !important;
        align-items: center !important;
    }



    /* ── NEWSLETTER ─────── */
    .nandavan-newsletter__form {
        flex-direction: column !important;
        gap: 12px !important;
    }

    .nandavan-newsletter__input {
        border-right: 3px solid #211D1A !important;
        border-radius: 9999px !important;
        width: 100% !important;
    }

    .nandavan-newsletter__btn {
        border-radius: 9999px !important;
        width: 100% !important;
    }

    /* ── COMPARISON TABLE ─────── */
    .nv-cmp-section table,
    .nandavan-comparison__table {
        box-shadow: 4px 4px 0 #211D1A !important;
    }

    .nv-cmp-section table th,
    .nandavan-comparison__table th,
    .nv-cmp-section table td,
    .nandavan-comparison__table td {
        padding: 10px 8px !important;
    }

    /* ── HEADER: Tighten announcement bar ─────── */
    .nv-announcement-dot {
        margin: 0 8px !important;
    }

    /* ── DARK CTA ─────── */
    .nv-dark-cta {
        padding: 40px 16px !important;
    }



    /* ── ABOUT / CORPORATE: Values grid fix ─────── */
    .nv-values-grid,
    .nv-feat-grid {
        flex-direction: column !important;
    }

    .nv-values-grid > .e-con,
    .nv-values-grid > .e-child {
        width: 100% !important;
        flex: 1 1 auto !important;
    }

    /* ══════════════════════════════════════════════
       ABOUT PAGE: Mobile Overrides
       ══════════════════════════════════════════════ */

    /* ── About Hero: Hide absolute decorations ─────── */
    .nv-ab-deco-flower,
    .nv-ab-quote-card {
        display: none !important;
    }

    .nv-about-hero {
        padding: 48px 20px 40px !important;
    }

    /* ── Story/Founder: Stack vertically ─────── */
    .nv-about-story {
        flex-direction: column !important;
    }

    .nv-ab-sidebar-text {
        display: none !important;
    }

    .nv-ab-founder {
        padding: 32px 20px !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 16px !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .nv-ab-founder img {
        max-width: 140px !important;
        max-height: 140px !important;
    }

    .nv-ab-story-text {
        padding: 32px 20px !important;
        border-left: none !important;
        border-top: 3px solid #111111 !important;
    }



    /* ── Problem Section: Stack vertically ─────── */
    .nv-problem-section {
        flex-direction: column !important;
    }

    .nv-ab-problem-content {
        padding: 32px 20px !important;
    }



    .nv-ab-problem-img {
        min-height: 250px !important;
    }

    .nv-ab-sticker-rotate {
        display: none !important;
    }

    /* ── Values Cards: 2-column grid ─────── */
    .nb-value-card {
        margin-bottom: 12px !important;
    }

    .nv-about-values .nv-feat-grid,
    .nv-about-values .nv-values-grid {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 12px !important;
    }

    .nv-about-values {
        padding: 40px 16px !important;
    }



    /* Values header: stack on mobile */
    .nv-about-values > .e-con:first-child {
        flex-direction: column !important;
        gap: 8px !important;
    }

    /* ── Process Section: Stack vertically ─────── */
    .nv-process-section {
        flex-direction: column !important;
    }

    .nv-ab-process-img {
        min-height: 250px !important;
        border-right: none !important;
        border-bottom: 3px solid #111111 !important;
    }

    .nv-ab-process-text {
        padding: 32px 20px !important;
    }



    /* ── Impact Section: Stack vertically ─────── */
    .nv-about-impact {
        flex-direction: column !important;
    }

    .nv-about-impact > .e-con:first-child {
        padding: 32px 20px !important;
        border-right: none !important;
        border-bottom: 3px solid #111111 !important;
    }



    .nv-about-impact .nv-stats-grid {
        flex-direction: row !important;
    }

    .nv-about-impact .nv-stats-grid .nb-card {
        padding: 20px 12px !important;
    }


}

/* ══════════════════════════════════════════════
   RESPONSIVE: Tablet (About Page) (≤1024px)
   ══════════════════════════════════════════════ */
@media (max-width: 1024px) {

    .nv-ab-story-text {
        padding: 32px !important;
    }
}

/* ══════════════════════════════════════════════
   RESPONSIVE: Small Mobile (≤480px)
   ══════════════════════════════════════════════ */
@media (max-width: 480px) {

    .nv-card {
        padding: 20px 12px !important;
    }

    /* WooCommerce: Single column on very small screens */
    .woocommerce ul.products[class*="columns-"] {
        grid-template-columns: 1fr !important;
    }

    /* ── About Page: Small Mobile ─────── */
    .nv-ab-founder img {
        max-width: 100px !important;
        max-height: 100px !important;
    }



    .nv-about-values .nv-feat-grid,
    .nv-about-values .nv-values-grid {
        flex-direction: column !important;
    }

    /* Impact stats: stack vertically */
    .nv-about-impact .nv-stats-grid {
        flex-direction: column !important;
    }

    .nv-about-impact .nv-stats-grid .nb-card {
        border-right: none !important;
        border-bottom: 3px solid #111111 !important;
    }

    .nv-about-impact .nv-stats-grid .nb-card:last-child {
        border-bottom: none !important;
    }
}