.elementor-kit-13{--e-global-color-primary:#1D3946;--e-global-color-secondary:#2C586C;--e-global-color-text:#0C191F;--e-global-color-accent:#D69502;--e-global-color-bd7cdd1:#E8E4D9;--e-global-color-89f907f:#FCF4DF;--e-global-typography-primary-font-family:"Playfair Display";--e-global-typography-primary-font-size:27px;--e-global-typography-primary-font-weight:600;--e-global-typography-primary-font-style:italic;--e-global-typography-secondary-font-family:"Playfair Display";--e-global-typography-secondary-font-size:24px;--e-global-typography-secondary-font-weight:500;--e-global-typography-secondary-font-style:italic;--e-global-typography-text-font-family:"Cormorant Garamond";--e-global-typography-text-font-size:22px;--e-global-typography-text-font-weight:500;--e-global-typography-text-font-style:italic;--e-global-typography-accent-font-family:"Cormorant Garamond";--e-global-typography-accent-font-size:17px;--e-global-typography-accent-font-weight:400;--e-global-typography-accent-text-transform:uppercase;color:var( --e-global-color-primary );--e-page-transition-entrance-animation:e-page-transition-fade-out;--e-page-transition-exit-animation:e-page-transition-fade-in;--e-page-transition-animation-duration:500ms;--e-preloader-animation-duration:1500ms;--e-preloader-delay:0ms;--e-preloader-color:#FFF;--e-preloader-size:20px;}.elementor-kit-13 e-page-transition{background-color:#FFFFFF;}.elementor-kit-13 p{margin-block-end:0px;}.elementor-kit-13 h2{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );font-style:var( --e-global-typography-secondary-font-style );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-kit-13 h2{font-size:var( --e-global-typography-secondary-font-size );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-13 h2{font-size:var( --e-global-typography-secondary-font-size );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ═══════════════════════════════════════════════════════════
   ETHEREAL THREAD COLLECTIVE — Complete CSS
   Paste into: Elementor → Site Settings → Custom CSS

   Covers:
     1.  CSS variables (collection palette)
     2.  Parallax hero
     3.  Posts section typography
     4.  Zigzag archive layout
     5.  Collection themes (Tar, Introspection, Innocence, Renewal)
     6.  Infinite scroll
     7.  WooCommerce — Cart, Checkout, Thank You
     8.  Select2 dropdown fixes
     9.  TPM Credits page
     10. Responsive (tablet, mobile, print)

   Author:  Michael Aquilina (Claude.ai)
   Version: 1.2.0
═══════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────
   1. DEFAULT COLLECTION VARIABLES (Rose palette)
─────────────────────────────────────────────────────────── */
:root {
    --cat-font:            'Playfair Display', serif;
    --cat-hero-title:      #FFFFFF;
    --cat-hero-title-size: 72px;
    --cat-accent:          #C4956A;
    --cat-bg:              #FDF8F0;
    --cat-h1:              #3A3A3A;
    --cat-h2:              #5A4A3A;
    --cat-h3:              #7A6A5A;
    --cat-text:            #4A4A4A;
    --cat-link:            #C4956A;
    --cat-h1-size:         42px;
    --cat-h2-size:         28px;
    --cat-h3-size:         20px;
    --cat-text-size:       17px;
    --cat-line-height:     1.9;
    --cat-letter-spacing:  0.02em;
}


/* ───────────────────────────────────────────────────────────
   2. PARALLAX HERO — base & overlay
─────────────────────────────────────────────────────────── */
.parallax-hero {
    position:            relative;
    overflow:            hidden;
    background-size:     cover !important;
    background-repeat:   no-repeat !important;
    background-position: center center;
    transition:          background-position 0.1s ease-out;
}

.parallax-hero .elementor-container {
    margin-top: 0px !important;
}

.parallax-hero::before {
    content:        '';
    position:       absolute;
    inset:          0;
    z-index:        1;
    pointer-events: none;
}

body:not(.tpm-page).category-rose .parallax-hero::before {
    background: linear-gradient(180deg, rgba(253,248,240,0.2) 0%, rgba(253,248,240,0.5) 100%);
}
body:not(.tpm-page).category-tar .parallax-hero::before {
    background: linear-gradient(180deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 100%);
}
body:not(.tpm-page).category-introspection .parallax-hero::before {
    background: linear-gradient(180deg, rgba(30,42,56,0.4) 0%, rgba(30,42,56,0.7) 100%);
}
body:not(.tpm-page).category-innocence .parallax-hero::before {
    background: linear-gradient(180deg, rgba(253,248,240,0.3) 0%, rgba(253,248,240,0.6) 100%);
}
body:not(.tpm-page).category-renewal .parallax-hero::before {
    background: linear-gradient(180deg, rgba(240,245,236,0.3) 0%, rgba(240,245,236,0.6) 100%);
}

.parallax-hero .elementor-container,
.parallax-hero .elementor-widget-wrap {
    position: relative !important;
    z-index:  2 !important;
}

.parallax-hero .elementor-background-overlay {
    display: none !important;
}


/* ───────────────────────────────────────────────────────────
   3. PARALLAX HERO — typography & divider
─────────────────────────────────────────────────────────── */
.parallax-hero .elementor-heading-title {
    color:          var(--cat-hero-title) !important;
    font-family:    var(--cat-font) !important;
    font-size:      var(--cat-hero-title-size) !important;
    letter-spacing: 4px;
    text-shadow:    0 2px 12px rgba(0,0,0,0.45), 0 1px 3px rgba(0,0,0,0.3);
}

.parallax-hero .elementor-divider-separator {
    border-color: var(--cat-accent) !important;
}


/* ───────────────────────────────────────────────────────────
   4. POSTS SECTION — background, headings, text
─────────────────────────────────────────────────────────── */
.posts-section {
    background-color: var(--cat-bg) !important;
}

.posts-section h1 {
    color:       var(--cat-h1) !important;
    font-family: var(--cat-font) !important;
    font-size:   var(--cat-h1-size) !important;
    line-height: 1.3;
}

.posts-section h2 {
    color:       var(--cat-h2) !important;
    font-family: var(--cat-font) !important;
    font-size:   var(--cat-h2-size) !important;
    line-height: 1.4;
}

.posts-section h3 {
    color:       var(--cat-h3) !important;
    font-family: var(--cat-font) !important;
    font-size:   var(--cat-h3-size) !important;
    line-height: 1.5;
}

.posts-section p {
    color:          var(--cat-text) !important;
    font-family:    var(--cat-font) !important;
    font-size:      var(--cat-text-size) !important;
    line-height:    var(--cat-line-height) !important;
    letter-spacing: var(--cat-letter-spacing) !important;
}

.posts-section a           { color: var(--cat-link) !important; }
.posts-section a:hover     { color: var(--cat-accent) !important; opacity: 0.8; }

.posts-section .elementor-divider-separator {
    border-color: var(--cat-accent) !important;
}


/* ───────────────────────────────────────────────────────────
   5. ZIGZAG LAYOUT — core mechanics
─────────────────────────────────────────────────────────── */
.zigzag-item,
.e-loop-item .zigzag-item {
    display:        flex !important;
    flex-direction: row !important;
    align-items:    stretch !important;
    min-height:     400px;
    border-radius:  8px;
    overflow:       hidden;
    transition:     transform 0.4s ease, box-shadow 0.4s ease;
}

.e-loop-item:nth-child(even) .zigzag-item {
    flex-direction: row-reverse !important;
}

.zigzag-item:hover {
    transform:  translateY(-8px);
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}

.zigzag-image-wrap {
    flex:       0 0 45% !important;
    min-height: 400px;
    position:   relative;
    overflow:   hidden;
}

.e-loop-item:nth-child(odd)  .zigzag-image-wrap { border-radius: 8px 0 0 8px; }
.e-loop-item:nth-child(even) .zigzag-image-wrap { border-radius: 0 8px 8px 0; }

.zigzag-image-wrap img,
.zigzag-featured-image img {
    width:      100% !important;
    height:     100% !important;
    object-fit: cover !important;
    transition: transform 0.6s ease;
}

.zigzag-item:hover .zigzag-image-wrap img,
.zigzag-item:hover .zigzag-featured-image img {
    transform: scale(1.08);
}

.zigzag-content-wrap {
    flex:            0 0 55% !important;
    display:         flex;
    flex-direction:  column;
    justify-content: center;
    padding:         40px 50px;
}

.e-loop-item:nth-child(odd)  .zigzag-content-wrap { border-radius: 0 8px 8px 0; }
.e-loop-item:nth-child(even) .zigzag-content-wrap { border-radius: 8px 0 0 8px; }

.zigzag-container h2.elementor-heading-title {
    color:       var(--cat-h2) !important;
    font-family: var(--cat-font) !important;
    font-size:   var(--cat-h2-size) !important;
    text-align:  center !important;
}

.zigzag-container h2.elementor-heading-title a:hover {
    color: var(--cat-accent) !important;
}

.poem-full-content,
.zigzag-content-wrap .elementor-widget-theme-post-content,
.zigzag-content-wrap .elementor-widget-theme-post-content .elementor-widget-container {
    font-style: italic;
}

.zigzag-content-wrap .elementor-widget-theme-post-content p,
.poem-full-content p {
    margin-top:    0 !important;
    margin-bottom: 0.8em !important;
    line-height:   1.7;
}

.zigzag-content-wrap .elementor-widget-theme-post-content p:empty,
.poem-full-content p:empty {
    margin-bottom: 0.4em !important;
    height:        0.8em;
}

.zigzag-content-wrap .elementor-widget-theme-post-content p:last-child,
.poem-full-content p:last-child {
    margin-bottom: 0 !important;
}

.zigzag-content-wrap .elementor-widget-theme-post-content br {
    display:    block;
    content:    "";
    margin-top: 0.3em;
}


/* ───────────────────────────────────────────────────────────
   6. ZIGZAG — TAR collection
─────────────────────────────────────────────────────────── */
body:not(.tpm-page).category-tar .zigzag-item {
    background-color: #1A1A1A;
    border:           1px solid #333333;
}
body:not(.tpm-page).category-tar .zigzag-item:hover {
    border-color: #555555;
    box-shadow:   0 20px 60px rgba(0,0,0,0.5);
}
body:not(.tpm-page).category-tar .zigzag-content-wrap { background-color: #1A1A1A; }
body:not(.tpm-page).category-tar .poem-meta-date,
body:not(.tpm-page).category-tar .zigzag-content-wrap .elementor-post-info { color: #666666 !important; }
body:not(.tpm-page).category-tar .poem-title a,
body:not(.tpm-page).category-tar .zigzag-content-wrap h2 a { color: #FFFFFF !important; text-decoration: none; }
body:not(.tpm-page).category-tar .poem-title a:hover { color: #CCCCCC !important; }
body:not(.tpm-page).category-tar .poem-divider .elementor-divider-separator,
body:not(.tpm-page).category-tar .zigzag-content-wrap hr { border-color: #FFFFFF !important; background-color: #FFFFFF !important; }
body:not(.tpm-page).category-tar .poem-full-content,
body:not(.tpm-page).category-tar .poem-full-content p,
body:not(.tpm-page).category-tar .zigzag-content-wrap .elementor-widget-theme-post-content { color: #CCCCCC !important; }
body:not(.tpm-page).category-tar .poem-read-more .elementor-button,
body:not(.tpm-page).category-tar .zigzag-content-wrap .elementor-button { color: #FFFFFF !important; border-color: #FFFFFF !important; background-color: transparent !important; }
body:not(.tpm-page).category-tar .poem-read-more .elementor-button:hover { color: #0A0A0A !important; background-color: #FFFFFF !important; }


/* ───────────────────────────────────────────────────────────
   7. ZIGZAG — INTROSPECTION collection
─────────────────────────────────────────────────────────── */
body:not(.tpm-page).category-introspection .zigzag-item {
    background-color: #263545;
    border:           1px solid #3A4A5A;
}
body:not(.tpm-page).category-introspection .zigzag-item:hover {
    border-color: #B8A978;
    box-shadow:   0 20px 60px rgba(0,0,0,0.4);
}
body:not(.tpm-page).category-introspection .zigzag-content-wrap { background-color: #263545; }
body:not(.tpm-page).category-introspection .poem-meta-date,
body:not(.tpm-page).category-introspection .zigzag-content-wrap .elementor-post-info { color: #8BA5B5 !important; }
body:not(.tpm-page).category-introspection .poem-title a,
body:not(.tpm-page).category-introspection .zigzag-content-wrap h2 a { color: #FFFFFF !important; text-decoration: none; }
body:not(.tpm-page).category-introspection .poem-title a:hover { color: #B8A978 !important; }
body:not(.tpm-page).category-introspection .poem-divider .elementor-divider-separator,
body:not(.tpm-page).category-introspection .zigzag-content-wrap hr { border-color: #B8A978 !important; background-color: #B8A978 !important; }
body:not(.tpm-page).category-introspection .poem-full-content,
body:not(.tpm-page).category-introspection .poem-full-content p,
body:not(.tpm-page).category-introspection .zigzag-content-wrap .elementor-widget-theme-post-content { color: #D0D8E0 !important; }
body:not(.tpm-page).category-introspection .poem-read-more .elementor-button,
body:not(.tpm-page).category-introspection .zigzag-content-wrap .elementor-button { color: #B8A978 !important; border-color: #B8A978 !important; background-color: transparent !important; }
body:not(.tpm-page).category-introspection .poem-read-more .elementor-button:hover { color: #1E2A38 !important; background-color: #B8A978 !important; }


/* ───────────────────────────────────────────────────────────
   8. ZIGZAG — INNOCENCE collection
─────────────────────────────────────────────────────────── */
body:not(.tpm-page).category-innocence .zigzag-item {
    background-color: #FFFFFF;
    border:           1px solid #E8DFD3;
}
body:not(.tpm-page).category-innocence .zigzag-item:hover {
    border-color: #C4956A;
    box-shadow:   0 20px 60px rgba(92,74,61,0.2);
}
body:not(.tpm-page).category-innocence .zigzag-content-wrap { background-color: #FFFFFF; }
body:not(.tpm-page).category-innocence .poem-meta-date,
body:not(.tpm-page).category-innocence .zigzag-content-wrap .elementor-post-info { color: #8B7D72 !important; }
body:not(.tpm-page).category-innocence .poem-title a,
body:not(.tpm-page).category-innocence .zigzag-content-wrap h2 a { color: #5C4A3D !important; text-decoration: none; }
body:not(.tpm-page).category-innocence .poem-title a:hover { color: #C4956A !important; }
body:not(.tpm-page).category-innocence .poem-divider .elementor-divider-separator,
body:not(.tpm-page).category-innocence .zigzag-content-wrap hr { border-color: #C4956A !important; background-color: #C4956A !important; }
body:not(.tpm-page).category-innocence .poem-full-content,
body:not(.tpm-page).category-innocence .poem-full-content p,
body:not(.tpm-page).category-innocence .zigzag-content-wrap .elementor-widget-theme-post-content { color: #6B5D52 !important; }
body:not(.tpm-page).category-innocence .poem-read-more .elementor-button,
body:not(.tpm-page).category-innocence .zigzag-content-wrap .elementor-button { color: #C4956A !important; border-color: #C4956A !important; background-color: transparent !important; }
body:not(.tpm-page).category-innocence .poem-read-more .elementor-button:hover { color: #FFFFFF !important; background-color: #C4956A !important; }


/* ───────────────────────────────────────────────────────────
   9. ZIGZAG — RENEWAL collection
─────────────────────────────────────────────────────────── */
body:not(.tpm-page).category-renewal .zigzag-item {
    background-color: #FFFFFF;
    border:           1px solid #D4E4D4;
}
body:not(.tpm-page).category-renewal .zigzag-item:hover {
    border-color: #6B8E6B;
    box-shadow:   0 20px 60px rgba(61,79,61,0.2);
}
body:not(.tpm-page).category-renewal .zigzag-content-wrap { background-color: #FFFFFF; }
body:not(.tpm-page).category-renewal .poem-meta-date,
body:not(.tpm-page).category-renewal .zigzag-content-wrap .elementor-post-info { color: #5A6B5A !important; }
body:not(.tpm-page).category-renewal .poem-title a,
body:not(.tpm-page).category-renewal .zigzag-content-wrap h2 a { color: #3D4F3D !important; text-decoration: none; }
body:not(.tpm-page).category-renewal .poem-title a:hover { color: #6B8E6B !important; }
body:not(.tpm-page).category-renewal .poem-divider .elementor-divider-separator,
body:not(.tpm-page).category-renewal .zigzag-content-wrap hr { border-color: #6B8E6B !important; background-color: #6B8E6B !important; }
body:not(.tpm-page).category-renewal .poem-full-content,
body:not(.tpm-page).category-renewal .poem-full-content p,
body:not(.tpm-page).category-renewal .zigzag-content-wrap .elementor-widget-theme-post-content { color: #4A5A4A !important; }
body:not(.tpm-page).category-renewal .poem-read-more .elementor-button,
body:not(.tpm-page).category-renewal .zigzag-content-wrap .elementor-button { color: #6B8E6B !important; border-color: #6B8E6B !important; background-color: transparent !important; }
body:not(.tpm-page).category-renewal .poem-read-more .elementor-button:hover { color: #FFFFFF !important; background-color: #6B8E6B !important; }


/* ───────────────────────────────────────────────────────────
   10. INFINITE SCROLL LOADING
─────────────────────────────────────────────────────────── */
.elementor-widget-loop-grid .e-load-more-spinner { text-align: center; padding: 40px 0; }
body:not(.tpm-page).category-tar .e-load-more-message           { color: #666666 !important; }
body:not(.tpm-page).category-introspection .e-load-more-message  { color: #8BA5B5 !important; }
body:not(.tpm-page).category-innocence .e-load-more-message     { color: #8B7D72 !important; }
body:not(.tpm-page).category-renewal .e-load-more-message       { color: #5A6B5A !important; }

@keyframes pulse-loading {
    0%, 100% { opacity: 0.4; }
    50%       { opacity: 1; }
}
.e-load-more-spinner { animation: pulse-loading 1.5s infinite; }


/* ═══════════════════════════════════════════════════════════
   WOOCOMMERCE — TPM Design System
   Covers: Cart, Checkout, Order Received (Thank You)
═══════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────
   11. WOOCOMMERCE — SHARED VARIABLES
─────────────────────────────────────────────────────────── */
.woocommerce-cart,
.woocommerce-checkout,
.woocommerce-order-received {
    --tpm-primary:        #0073aa;
    --tpm-primary-dark:   #005f8d;
    --tpm-dark:           #0A2540;
    --tpm-text:           #2d3748;
    --tpm-muted:          #718096;
    --tpm-bg:             #f8f9fa;
    --tpm-border:         #e2e8f0;
    --tpm-radius:         6px;
    --tpm-font:           "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --tpm-success-bg:     #d4edda;
    --tpm-success-text:   #155724;
    --tpm-success-border: #c3e6cb;
    --tpm-error-bg:       #f8d7da;
    --tpm-error-text:     #721c24;
    --tpm-error-border:   #f5c6cb;
    --tpm-warning-bg:     #fff3cd;
    --tpm-warning-text:   #856404;
}


/* ───────────────────────────────────────────────────────────
   12. WOOCOMMERCE — SHARED BASE
─────────────────────────────────────────────────────────── */
.woocommerce-cart,
.woocommerce-cart p,
.woocommerce-cart li,
.woocommerce-checkout,
.woocommerce-checkout p,
.woocommerce-checkout li,
.woocommerce-order-received,
.woocommerce-order-received p,
.woocommerce-order-received li {
    font-family: var(--tpm-font);
    color: var(--tpm-text);
}

/* Section headings */
.woocommerce-cart h2,
.woocommerce-cart h3,
.woocommerce-checkout h2,
.woocommerce-checkout h3,
.woocommerce-order-received h2,
.woocommerce-order-received h3 {
    font-family:    var(--tpm-font);
    font-size:      1.1rem;
    font-weight:    700;
    color:          var(--tpm-dark);
    border-bottom:  2px solid var(--tpm-border);
    padding-bottom: 10px;
    margin:         0 0 20px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Shared tables */
.woocommerce-cart .shop_table,
.woocommerce-checkout .shop_table,
.woocommerce-order-received .woocommerce-table--order-details {
    width:           100%;
    border-collapse: collapse;
    font-family:     var(--tpm-font);
    font-size:       0.9rem;
    border:          1px solid var(--tpm-border);
    border-radius:   var(--tpm-radius);
    overflow:        hidden;
    margin-bottom:   30px;
}

.woocommerce-cart .shop_table thead th,
.woocommerce-checkout .shop_table thead th,
.woocommerce-order-received .woocommerce-table--order-details thead th {
    background:     var(--tpm-dark);
    color:          #ffffff;
    padding:        12px 15px;
    text-align:     left;
    font-size:      0.8rem;
    font-weight:    600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.woocommerce-cart .shop_table tbody tr,
.woocommerce-checkout .shop_table tbody tr,
.woocommerce-order-received .woocommerce-table--order-details tbody tr {
    border-bottom: 1px solid var(--tpm-border);
}

.woocommerce-cart .shop_table tbody tr:hover,
.woocommerce-checkout .shop_table tbody tr:hover,
.woocommerce-order-received .woocommerce-table--order-details tbody tr:hover {
    background: #f0f8ff;
}

.woocommerce-cart .shop_table tbody td,
.woocommerce-cart .shop_table tfoot td,
.woocommerce-cart .shop_table tfoot th,
.woocommerce-checkout .shop_table tbody td,
.woocommerce-checkout .shop_table tfoot td,
.woocommerce-checkout .shop_table tfoot th,
.woocommerce-order-received .woocommerce-table--order-details tbody td,
.woocommerce-order-received .woocommerce-table--order-details tfoot td,
.woocommerce-order-received .woocommerce-table--order-details tfoot th {
    padding:        12px 15px;
    color:          var(--tpm-text);
    vertical-align: middle;
}

.woocommerce-cart .shop_table tfoot tr,
.woocommerce-checkout .shop_table tfoot tr,
.woocommerce-order-received .woocommerce-table--order-details tfoot tr {
    border-top: 2px solid var(--tpm-border);
}

.woocommerce-cart .shop_table tfoot .order-total th,
.woocommerce-cart .shop_table tfoot .order-total td,
.woocommerce-checkout .shop_table tfoot .order-total th,
.woocommerce-checkout .shop_table tfoot .order-total td,
.woocommerce-order-received .woocommerce-table--order-details tfoot .order-total th,
.woocommerce-order-received .woocommerce-table--order-details tfoot .order-total td {
    font-weight: 700;
    color:       var(--tpm-dark);
    font-size:   1rem;
}

/* Shared notices */
.woocommerce-cart .woocommerce-error,
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-info,
.woocommerce-checkout .woocommerce-error,
.woocommerce-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-info,
.woocommerce-order-received .woocommerce-error,
.woocommerce-order-received .woocommerce-message,
.woocommerce-order-received .woocommerce-info {
    font-family:    var(--tpm-font);
    font-size:      0.9rem;
    border-radius:  var(--tpm-radius);
    padding:        12px 16px;
    margin-bottom:  20px;
    border-left:    4px solid transparent;
    list-style:     none;
}

.woocommerce-cart .woocommerce-error,
.woocommerce-checkout .woocommerce-error,
.woocommerce-order-received .woocommerce-error {
    background:       var(--tpm-error-bg);
    color:            var(--tpm-error-text);
    border-left-color: #dc3545;
}

.woocommerce-cart .woocommerce-message,
.woocommerce-checkout .woocommerce-message,
.woocommerce-order-received .woocommerce-message {
    background:       var(--tpm-success-bg);
    color:            var(--tpm-success-text);
    border-left-color: #28a745;
}

.woocommerce-cart .woocommerce-info,
.woocommerce-checkout .woocommerce-info,
.woocommerce-order-received .woocommerce-info {
    background:       #e8f4fd;
    color:            #0c5460;
    border-left-color: var(--tpm-primary);
}

/* Shared buttons */
.woocommerce-cart .button,
.woocommerce-cart a.button,
.woocommerce-checkout .button,
.woocommerce-checkout a.button,
.woocommerce-order-received .button,
.woocommerce-order-received a.button {
    display:         inline-block;
    padding:         10px 22px;
    background:      var(--tpm-primary);
    color:           #ffffff !important;
    font-family:     var(--tpm-font);
    font-size:       0.9rem;
    font-weight:     600;
    border:          none;
    border-radius:   var(--tpm-radius);
    text-decoration: none;
    cursor:          pointer;
    transition:      background 0.2s, transform 0.1s;
}

.woocommerce-cart .button:hover,
.woocommerce-cart a.button:hover,
.woocommerce-checkout .button:hover,
.woocommerce-checkout a.button:hover,
.woocommerce-order-received .button:hover,
.woocommerce-order-received a.button:hover {
    background:  var(--tpm-primary-dark);
    transform:   translateY(-1px);
    color:       #ffffff !important;
}

.woocommerce-cart .button:active,
.woocommerce-checkout .button:active,
.woocommerce-order-received .button:active { transform: translateY(0); }

/* Secondary buttons */
.woocommerce-cart .button.alt,
.woocommerce-checkout .button.alt { background: #666; }
.woocommerce-cart .button.alt:hover,
.woocommerce-checkout .button.alt:hover { background: #444; }


/* ───────────────────────────────────────────────────────────
   13. WOOCOMMERCE — CART PAGE
─────────────────────────────────────────────────────────── */

.woocommerce-cart .woocommerce-cart-form .product-thumbnail img {
    width:         60px;
    height:        60px;
    object-fit:    cover;
    border-radius: var(--tpm-radius);
    border:        1px solid var(--tpm-border);
}

.woocommerce-cart .woocommerce-cart-form .product-name a {
    color:           var(--tpm-primary);
    font-weight:     600;
    text-decoration: none;
}
.woocommerce-cart .woocommerce-cart-form .product-name a:hover {
    color:           var(--tpm-primary-dark);
    text-decoration: underline;
}

.woocommerce-cart .quantity input.qty {
    width:         64px;
    padding:       8px 10px;
    border:        1px solid var(--tpm-border);
    border-radius: var(--tpm-radius);
    font-family:   var(--tpm-font);
    font-size:     0.95rem;
    color:         var(--tpm-text);
    text-align:    center;
}
.woocommerce-cart .quantity input.qty:focus {
    border-color: var(--tpm-primary);
    box-shadow:   0 0 0 3px rgba(0,115,170,0.15);
    outline:      none;
}

.woocommerce-cart .product-remove a.remove {
    color:      var(--tpm-error-text) !important;
    font-size:  1.2rem;
    font-weight: 700;
    opacity:    0.6;
    transition: opacity 0.2s;
}
.woocommerce-cart .product-remove a.remove:hover {
    opacity:    1;
    color:      #dc3545 !important;
    background: none;
}

.woocommerce-cart .actions .button[name="update_cart"] {
    background: #666;
    font-size:  0.85rem;
    padding:    8px 18px;
}
.woocommerce-cart .actions .button[name="update_cart"]:hover { background: #444; }

.woocommerce-cart .coupon input[type="text"] {
    padding:       9px 12px;
    border:        1px solid var(--tpm-border);
    border-radius: var(--tpm-radius);
    font-family:   var(--tpm-font);
    font-size:     0.9rem;
    width:         200px;
    margin-right:  8px;
}
.woocommerce-cart .coupon input[type="text"]:focus {
    border-color: var(--tpm-primary);
    box-shadow:   0 0 0 3px rgba(0,115,170,0.15);
    outline:      none;
}

.woocommerce-cart .coupon .button { padding: 9px 18px; font-size: 0.85rem; background: #666; }
.woocommerce-cart .coupon .button:hover { background: #444; }

.woocommerce-cart .cart_totals {
    background:    #ffffff;
    border:        1px solid var(--tpm-border);
    border-radius: var(--tpm-radius);
    padding:       24px;
}
.woocommerce-cart .cart_totals h2 { margin-top: 0; border-bottom: 2px solid var(--tpm-border); }
.woocommerce-cart .cart_totals .shop_table { border: none; margin-bottom: 20px; }
.woocommerce-cart .cart_totals .shop_table th {
    background:     transparent;
    color:          var(--tpm-muted);
    font-size:      0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding:        10px 0;
    border-bottom:  1px solid var(--tpm-border);
}
.woocommerce-cart .cart_totals .shop_table td {
    padding:       10px 0;
    border-bottom: 1px solid var(--tpm-border);
    color:         var(--tpm-text);
}

.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
    display:         block;
    width:           100%;
    padding:         14px 20px;
    background:      var(--tpm-primary);
    color:           #ffffff !important;
    font-family:     var(--tpm-font);
    font-size:       1rem;
    font-weight:     700;
    text-transform:  uppercase;
    letter-spacing:  0.05em;
    border:          none;
    border-radius:   var(--tpm-radius);
    cursor:          pointer;
    transition:      background 0.2s, transform 0.1s;
    text-align:      center;
    text-decoration: none;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover {
    background: var(--tpm-primary-dark);
    transform:  translateY(-1px);
}

.woocommerce-cart .cross-sells h2 { margin-top: 30px; }


/* ───────────────────────────────────────────────────────────
   14. WOOCOMMERCE — CHECKOUT PAGE
─────────────────────────────────────────────────────────── */

.woocommerce-checkout .form-row label,
.woocommerce-checkout label {
    font-family:   var(--tpm-font);
    font-size:     0.85rem;
    font-weight:   600;
    color:         var(--tpm-dark);
    margin-bottom: 5px;
    display:       block;
}

/* All text inputs — unified 42px height */
.woocommerce-checkout .form-row input[type="text"],
.woocommerce-checkout .form-row input[type="email"],
.woocommerce-checkout .form-row input[type="tel"],
.woocommerce-checkout .form-row input[type="password"],
.woocommerce-checkout .form-row input[type="number"],
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
    width:              100%;
    height:             42px;
    padding:            0 12px;
    border:             1px solid var(--tpm-border);
    border-radius:      var(--tpm-radius);
    font-family:        var(--tpm-font);
    font-size:          0.95rem;
    font-weight:        400;
    color:              var(--tpm-text);
    background:         #ffffff;
    transition:         border-color 0.2s, box-shadow 0.2s;
    box-sizing:         border-box;
    -webkit-appearance: none;
    -moz-appearance:    none;
    appearance:         none;
}

/* Textarea height override */
.woocommerce-checkout .form-row textarea {
    height:     auto;
    padding:    10px 12px;
    min-height: 100px;
}

/* Focus state */
.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus {
    border-color: var(--tpm-primary);
    box-shadow:   0 0 0 3px rgba(0,115,170,0.15);
    outline:      none;
}

/* Native select — custom SVG arrow */
.woocommerce-checkout .form-row select {
    background-image:    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23718096' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:   no-repeat;
    background-position: right 12px center;
    padding-right:       36px;
}

/* Checkboxes & radios */
.woocommerce-checkout .woocommerce-form__input-checkbox,
.woocommerce-checkout input[type="radio"] {
    accent-color: var(--tpm-primary);
    width:        16px;
    height:       16px;
    cursor:       pointer;
    margin-right: 6px;
}

.woocommerce-checkout .required { color: #dc3545; }

/* Payment section */
.woocommerce-checkout #payment {
    background:    #ffffff;
    border:        1px solid var(--tpm-border);
    border-radius: var(--tpm-radius);
    padding:       20px;
}
.woocommerce-checkout #payment ul.payment_methods {
    list-style:    none;
    padding:       0;
    margin:        0 0 15px;
    border-bottom: 1px solid var(--tpm-border);
}
.woocommerce-checkout #payment ul.payment_methods li {
    padding:       10px 0;
    border-bottom: 1px solid var(--tpm-border);
    font-family:   var(--tpm-font);
}
.woocommerce-checkout #payment ul.payment_methods li:last-child { border-bottom: none; }
.woocommerce-checkout #payment ul.payment_methods li label {
    font-weight: 600;
    font-size:   0.95rem;
    color:       var(--tpm-dark);
    cursor:      pointer;
}
.woocommerce-checkout #payment .payment_box {
    background:    var(--tpm-bg);
    border:        1px solid var(--tpm-border);
    border-radius: var(--tpm-radius);
    padding:       15px;
    margin-top:    10px;
    font-size:     0.9rem;
    color:         var(--tpm-muted);
}

/* Place order button */
.woocommerce-checkout #place_order {
    display:        block;
    width:          100%;
    padding:        14px 20px;
    background:     var(--tpm-primary);
    color:          #ffffff !important;
    font-family:    var(--tpm-font);
    font-size:      1rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border:         none;
    border-radius:  var(--tpm-radius);
    cursor:         pointer;
    transition:     background 0.2s, transform 0.1s;
    text-align:     center;
}
.woocommerce-checkout #place_order:hover { background: var(--tpm-primary-dark); transform: translateY(-1px); }
.woocommerce-checkout #place_order:active { transform: translateY(0); }

/* Coupon & login toggle links */
.woocommerce-checkout .woocommerce-form-coupon-toggle a,
.woocommerce-checkout .showcoupon,
.woocommerce-checkout .woocommerce-form-login-toggle a,
.woocommerce-checkout .showlogin {
    color:           var(--tpm-primary);
    font-family:     var(--tpm-font);
    font-size:       0.9rem;
    text-decoration: underline;
}

.woocommerce-checkout .woocommerce-form-coupon input[type="text"] {
    display:   inline-block;
    width:     auto;
    max-width: 280px;
}

/* Ship to different address label */
.woocommerce-checkout .woocommerce-shipping-fields h3 label {
    font-size:      1rem;
    font-weight:    700;
    color:          var(--tpm-dark);
    display:        inline-flex;
    align-items:    center;
    gap:            8px;
    cursor:         pointer;
    text-transform: none;
    border:         none;
    padding:        0;
    margin:         0;
}

/* Privacy policy */
.woocommerce-checkout .woocommerce-privacy-policy-text {
    font-size:  0.8rem;
    color:      var(--tpm-muted);
    font-family: var(--tpm-font);
    margin-top: 10px;
}
.woocommerce-checkout .woocommerce-privacy-policy-text a { color: var(--tpm-primary); }


/* ───────────────────────────────────────────────────────────
   15. SELECT2 DROPDOWN — closed box
─────────────────────────────────────────────────────────── */

.woocommerce-checkout .select2-container--default .select2-selection--single {
    height:     42px !important;
    border:     1px solid var(--tpm-border) !important;
    border-radius: var(--tpm-radius) !important;
    background: #ffffff !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
}

.woocommerce-checkout .select2-container--default.select2-container--open .select2-selection--single,
.woocommerce-checkout .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--tpm-primary) !important;
    box-shadow:   0 0 0 3px rgba(0,115,170,0.15) !important;
    outline:      none !important;
}

/* Rendered text */
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-family: var(--tpm-font) !important;
    font-size:   0.95rem !important;
    font-weight: 400 !important;
    color:       var(--tpm-text) !important;
    line-height: 42px !important;
    padding:     0 35px 0 12px !important;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color:       var(--tpm-muted) !important;
    font-weight: 400 !important;
}

/* Arrow */
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
    height:    42px !important;
    width:     30px !important;
    top:       0 !important;
    right:     6px !important;
    transform: none !important;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color:  var(--tpm-muted) transparent transparent transparent !important;
    border-width:  5px 4px 0 4px !important;
    margin-top:   -2px !important;
}

.woocommerce-checkout .select2-container--default.select2-container--open .select2-selection__arrow b {
    border-color: transparent transparent var(--tpm-primary) transparent !important;
    border-width: 0 4px 5px 4px !important;
}


/* ───────────────────────────────────────────────────────────
   16. SELECT2 DROPDOWN — open list
   Note: Select2 appends the dropdown to <body>, so these
   rules intentionally omit the page-scoping class prefix.
─────────────────────────────────────────────────────────── */

.select2-dropdown {
    border:        1px solid #0073aa !important;
    border-radius: 6px !important;
    box-shadow:    0 4px 16px rgba(0,0,0,0.12) !important;
    overflow:      hidden;
}

.select2-search--dropdown .select2-search__field {
    font-family:   "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size:     0.9rem !important;
    font-weight:   400 !important;
    color:         #2d3748 !important;
    padding:       8px 10px !important;
    border:        1px solid #e2e8f0 !important;
    border-radius: 4px !important;
    outline:       none !important;
}

.select2-search--dropdown .select2-search__field:focus {
    border-color: #0073aa !important;
    box-shadow:   0 0 0 2px rgba(0,115,170,0.15) !important;
}

.select2-results__option {
    font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size:   0.9rem !important;
    font-weight: 400 !important;
    color:       #2d3748 !important;
    padding:     8px 12px !important;
    line-height: 1.4 !important;
}

.select2-results__option--highlighted,
.select2-results__option--highlighted.select2-results__option[aria-selected] {
    background-color: #0073aa !important;
    color:            #ffffff !important;
    font-weight:      400 !important;
}

.select2-results__option[aria-selected="true"] {
    background-color: #e8f4fd !important;
    color:            #0A2540 !important;
    font-weight:      600 !important;
}

.select2-results__options {
    max-height: 220px !important;
    overflow-y: auto !important;
}

/* Group headers (e.g. continent labels in country list) */
.select2-results__group {
    font-family:    "Open Sans", sans-serif !important;
    font-size:      0.75rem !important;
    font-weight:    700 !important;
    color:          #718096 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding:        8px 12px 4px !important;
    background:     #f8f9fa !important;
}

/* No results / searching messages */
.select2-results__option.select2-results__message,
.select2-results__option[aria-disabled="true"] {
    color:      #718096 !important;
    font-style: italic !important;
    font-weight: 400 !important;
}


/* ───────────────────────────────────────────────────────────
   17. WOOCOMMERCE — ORDER RECEIVED (THANK YOU) PAGE
─────────────────────────────────────────────────────────── */

.woocommerce-order-received .woocommerce-thankyou-order-received {
    background:    var(--tpm-success-bg);
    color:         var(--tpm-success-text);
    border:        1px solid var(--tpm-success-border);
    border-left:   4px solid #28a745;
    border-radius: var(--tpm-radius);
    padding:       14px 18px;
    font-family:   var(--tpm-font);
    font-size:     1rem;
    font-weight:   600;
    margin-bottom: 30px;
}

.woocommerce-order-received .woocommerce-order-overview {
    list-style:    none;
    padding:       0;
    margin:        0 0 30px;
    display:       flex;
    flex-wrap:     wrap;
    gap:           1px;
    background:    var(--tpm-border);
    border:        1px solid var(--tpm-border);
    border-radius: var(--tpm-radius);
    overflow:      hidden;
}

.woocommerce-order-received .woocommerce-order-overview li {
    flex:           1 1 160px;
    background:     #ffffff;
    padding:        16px 20px;
    font-size:      0.8rem;
    color:          var(--tpm-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight:    600;
}

.woocommerce-order-received .woocommerce-order-overview li strong {
    display:        block;
    font-size:      1rem;
    color:          var(--tpm-dark);
    text-transform: none;
    letter-spacing: 0;
    margin-top:     4px;
    font-weight:    700;
}

.woocommerce-order-received .woocommerce-columns--2 {
    display:   flex;
    gap:       20px;
    flex-wrap: wrap;
}

.woocommerce-order-received .woocommerce-column {
    flex:          1 1 260px;
    background:    #ffffff;
    border:        1px solid var(--tpm-border);
    border-radius: var(--tpm-radius);
    padding:       20px;
}

.woocommerce-order-received .woocommerce-column h2 {
    margin-top:    0;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--tpm-border);
    font-size:     0.95rem;
}

.woocommerce-order-received address {
    font-style:  normal;
    font-size:   0.9rem;
    line-height: 1.8;
    color:       var(--tpm-text);
}


/* ═══════════════════════════════════════════════════════════
   TPM CREDITS PAGE
═══════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────
   18. TPM CREDITS PAGE
─────────────────────────────────────────────────────────── */
.tpm-buy-credits-page {
    max-width: 900px;
    margin:    0 auto;
    padding:   1.5rem;
}

.tpm-credits-header { margin-bottom: 2rem; }

.tpm-balance-card {
    display:       flex;
    align-items:   center;
    gap:           1.5rem;
    background:    var(--tpm-bg-white, #fff);
    color:         var(--tpm-text, #1e1e1e);
    padding:       2rem;
    border-radius: var(--tpm-radius, 8px);
    border:        1px solid var(--tpm-border, #e8e8e8);
    border-left:   4px solid var(--tpm-primary, #0073aa);
    box-shadow:    var(--tpm-shadow, 0 1px 3px rgba(0,0,0,0.08));
}

.tpm-balance-icon {
    color:         var(--tpm-primary, #0073aa);
    padding:       0.75rem;
    background:    var(--tpm-bg, #f8f9fa);
    border-radius: 50%;
}

.tpm-balance-info   { display: flex; flex-direction: column; }
.tpm-balance-label  { font-size: 0.875rem; color: var(--tpm-text-muted, #666); text-transform: uppercase; letter-spacing: 0.05em; }
.tpm-balance-amount { font-size: 3rem; font-weight: 700; line-height: 1.1; color: var(--tpm-primary, #0073aa); }
.tpm-balance-unit   { font-size: 1rem; color: var(--tpm-text-light, #888); }

.tpm-section {
    background:    var(--tpm-bg-white, #fff);
    border-radius: var(--tpm-radius, 8px);
    padding:       1.5rem;
    margin-bottom: 1.5rem;
    border:        1px solid var(--tpm-border, #e8e8e8);
    box-shadow:    var(--tpm-shadow, 0 1px 3px rgba(0,0,0,0.08));
}

.tpm-section-title       { font-size: 1.25rem; font-weight: 600; margin: 0 0 0.5rem; color: var(--tpm-text, #1e1e1e); }
.tpm-section-description { color: var(--tpm-text-muted, #666); margin: 0 0 1.5rem; }

.tpm-packages-grid {
    display:               grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap:                   1rem;
    margin-bottom:         1rem;
}

.tpm-package-card {
    position:      relative;
    border:        2px solid var(--tpm-border, #e8e8e8);
    border-radius: var(--tpm-radius, 8px);
    padding:       1.5rem;
    text-align:    center;
    background:    var(--tpm-bg-white, #fff);
    transition:    border-color 0.2s ease, box-shadow 0.2s ease;
}
.tpm-package-card:hover {
    border-color: var(--tpm-primary, #0073aa);
    box-shadow:   var(--tpm-shadow-hover, 0 4px 12px rgba(0,0,0,0.1));
}
.tpm-package-popular { border-color: var(--tpm-primary, #0073aa); }

.tpm-package-badge {
    position:       absolute;
    top:            -12px;
    left:           50%;
    transform:      translateX(-50%);
    background:     var(--tpm-primary, #0073aa);
    color:          #fff;
    font-size:      0.75rem;
    font-weight:    600;
    padding:        0.25rem 0.75rem;
    border-radius:  var(--tpm-radius-pill, 20px);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    white-space:    nowrap;
}

.tpm-package-name    { font-size: 1rem; font-weight: 600; margin: 0 0 0.5rem; color: var(--tpm-text, #1e1e1e); }
.tpm-package-credits { margin-bottom: 1rem; }
.tpm-credits-number  { font-size: 2.5rem; font-weight: 700; color: var(--tpm-primary, #0073aa); line-height: 1; }
.tpm-credits-label   { display: block; font-size: 0.875rem; color: var(--tpm-text-muted, #666); }
.tpm-package-price      { font-size: 1.5rem; font-weight: 700; color: var(--tpm-text, #1e1e1e); margin-bottom: 0.25rem; }
.tpm-package-per-credit { font-size: 0.75rem; color: var(--tpm-text-light, #888); margin-bottom: 1rem; }
.tpm-package-btn        { width: 100%; }

.tpm-payment-note {
    display:     flex;
    align-items: center;
    gap:         0.5rem;
    color:       var(--tpm-text-muted, #666);
    font-size:   0.875rem;
    margin:      0;
}

.tpm-usage-grid {
    display:               grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap:                   1rem;
}

.tpm-usage-item {
    display:       flex;
    align-items:   center;
    gap:           1rem;
    padding:       1rem;
    background:    var(--tpm-bg, #f8f9fa);
    border-radius: var(--tpm-radius-sm, 6px);
}

.tpm-usage-icon { color: var(--tpm-primary, #0073aa); }
.tpm-usage-name { display: block; font-weight: 500; color: var(--tpm-text, #1e1e1e); }
.tpm-usage-cost { font-size: 0.875rem; color: var(--tpm-text-muted, #666); }

.tpm-transactions-list { display: flex; flex-direction: column; gap: 0.5rem; }

.tpm-transaction-item {
    display:       flex;
    align-items:   center;
    gap:           1rem;
    padding:       0.75rem 1rem;
    background:    var(--tpm-bg, #f8f9fa);
    border-radius: var(--tpm-radius-sm, 6px);
}

.tpm-transaction-credit .tpm-transaction-icon { color: var(--tpm-success, #28a745); }
.tpm-transaction-debit  .tpm-transaction-icon { color: var(--tpm-danger, #dc3545); }
.tpm-transaction-details { flex: 1; }
.tpm-transaction-desc  { display: block; font-weight: 500; color: var(--tpm-text, #1e1e1e); }
.tpm-transaction-date  { font-size: 0.75rem; color: var(--tpm-text-light, #888); }
.tpm-transaction-amount { font-weight: 600; font-size: 1.125rem; }
.tpm-transaction-credit .tpm-transaction-amount { color: var(--tpm-success, #28a745); }
.tpm-transaction-debit  .tpm-transaction-amount { color: var(--tpm-danger, #dc3545); }


/* ═══════════════════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────
   19. RESPONSIVE — TABLET (≤1024px)
─────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .parallax-hero { min-height: 40vh !important; margin-top: -70px; }
    .parallax-hero .elementor-container { padding-top: 70px !important; }
    .parallax-hero .elementor-heading-title { font-size: 56px !important; }
    .zigzag-item { min-height: 350px; }
    .zigzag-image-wrap { flex: 0 0 40% !important; min-height: 350px; }
    .zigzag-content-wrap { flex: 0 0 60% !important; padding: 30px 35px; }
    .zigzag-content-wrap h2 { font-size: 26px !important; }
}


/* ───────────────────────────────────────────────────────────
   20. RESPONSIVE — MOBILE (≤767px)
─────────────────────────────────────────────────────────── */
@media (max-width: 767px) {

    /* Parallax hero */
    .parallax-hero {
        min-height:            35vh !important;
        background-attachment: scroll !important;
        background-position:   center center !important;
        margin-top:            -60px;
    }
    .parallax-hero .elementor-container { padding-top: 60px !important; }
    .parallax-hero .elementor-heading-title { font-size: calc(var(--cat-hero-title-size) * 0.55) !important; }

    /* Zigzag stacks vertically */
    .zigzag-item,
    .e-loop-item .zigzag-item,
    .e-loop-item:nth-child(even) .zigzag-item { flex-direction: column !important; min-height: auto; }

    .zigzag-image-wrap,
    .e-loop-item:nth-child(odd)  .zigzag-image-wrap,
    .e-loop-item:nth-child(even) .zigzag-image-wrap {
        flex: none !important; width: 100% !important;
        min-height: 250px; max-height: 300px;
        border-radius: 8px 8px 0 0 !important;
    }

    .zigzag-content-wrap,
    .e-loop-item:nth-child(odd)  .zigzag-content-wrap,
    .e-loop-item:nth-child(even) .zigzag-content-wrap {
        flex: none !important; width: 100% !important;
        padding: 25px 20px; border-radius: 0 0 8px 8px !important;
    }

    .zigzag-content-wrap h2 { font-size: 22px !important; }
    .poem-full-content,
    .zigzag-content-wrap .elementor-widget-theme-post-content { font-size: 15px !important; }

    .posts-section h1 { font-size: calc(var(--cat-h1-size) * 0.8) !important; }
    .posts-section h2 { font-size: calc(var(--cat-h2-size) * 0.85) !important; }
    .posts-section h3 { font-size: calc(var(--cat-h3-size) * 0.85) !important; }
    .posts-section p  { font-size: calc(var(--cat-text-size) * 0.95) !important; }

    /* WooCommerce mobile */
    .woocommerce-cart h2,
    .woocommerce-cart h3,
    .woocommerce-checkout h2,
    .woocommerce-checkout h3,
    .woocommerce-order-received h2,
    .woocommerce-order-received h3 { font-size: 1rem; }

    .woocommerce-checkout .form-row input,
    .woocommerce-checkout .form-row select { font-size: 16px; } /* prevent iOS zoom */

    .woocommerce-checkout #place_order { font-size: 0.95rem; padding: 12px 16px; }

    .woocommerce-cart .coupon { display: flex; flex-direction: column; gap: 8px; }
    .woocommerce-cart .coupon input[type="text"] { width: 100%; margin-right: 0; }

    .woocommerce-order-received .woocommerce-order-overview { flex-direction: column; gap: 1px; }
    .woocommerce-order-received .woocommerce-order-overview li { flex: 1 1 100%; }
    .woocommerce-order-received .woocommerce-columns--2 { flex-direction: column; }

    /* TPM credits mobile */
    .tpm-balance-card   { flex-direction: column; text-align: center; }
    .tpm-packages-grid  { grid-template-columns: 1fr; }
    .tpm-input-group    { flex-direction: column; }
}


/* ───────────────────────────────────────────────────────────
   21. PRINT
─────────────────────────────────────────────────────────── */
@media print {
    .parallax-hero { min-height: auto !important; background-attachment: scroll !important; }
    .zigzag-item   { page-break-inside: avoid; box-shadow: none !important; border: 1px solid #ccc !important; }
}/* End custom CSS */