/*
 Theme Name: Shoptimizer Child – Jeanettemai
 Template: shoptimizer
 Text Domain: jm-theme
 Description: jeanettemai.dk v2 child theme (fork of the fabricly v2 system)
 Version: 1.2.3
 Author: Jeanettemai
*/

/* ==========================================================================
   FABRICLY DESIGN SYSTEM
   Colors: #FAF7F2 (cream), #E27297 (pink), #F4A97F (peach)
   Fonts: Nunito (headings), Poppins (body)
   ========================================================================== */

/* ─── CSS CUSTOM PROPERTIES ─────────────────────────────────────────────── */
:root {
    --jm-cream: #FDFDFC;
    --jm-pink: #E27297;
    --jm-pink-dark: #C75B80;
    --jm-pink-light: #FAEDF2;
    /* --jm-yellow family DELETED here (2026-07-23): this block shadowed
       tokens.css AGAIN (July: yellow ghost; today: peach ghost — the exact
       failure mode the old comment warned about). tokens.css is the ONLY
       place accent values live. NEVER redeclare them here. */
    --jm-text: #333E48;
    --jm-text-light: #5D7184;
    --jm-border: #ECEAE6;
    --jm-white: #ffffff;
    --jm-font-heading: 'Inter', sans-serif;
    --jm-font-body: 'Inter', sans-serif;
    --jm-radius: 14px;
    --jm-radius-sm: 8px;
    --jm-radius-lg: 18px;
    --jm-shadow: 0 8px 40px rgba(0,0,0,0.08), 0 2px 8px rgba(0,0,0,0.04);
    --jm-shadow-hover: 0 12px 48px rgba(0,0,0,0.10), 0 4px 12px rgba(0,0,0,0.06);
    --jm-shadow-cta: 0 6px 24px rgba(226, 138, 87, 0.35);
    --jm-shadow-pink: 0 4px 16px rgba(226, 114, 151, 0.25);
    --jm-transition: 0.2s ease-out;
    --jm-max-width: 1400px;
}

/* ─── SITE-WIDE WIDTH OVERRIDE ─────────────────────────────────────────── */
/* Shoptimizer defaults to 1170px — we use 1400px for product grids */
.col-full {
    max-width: var(--jm-max-width);
}

@media (min-width: 1200px) {
    .col-full {
        max-width: var(--jm-max-width);
        padding-left: 2em;
        padding-right: 2em;
    }
}

/* Wider layout ONLY for shop, category, cart, and homepage.
   Product pages stay at Shoptimizer's 1170px (2-column image/summary layout).
   Whitelist approach = no more accidental product page breaks. */
@media (min-width: 993px) {
    .post-type-archive-product .col-full,
    .tax-product_cat .col-full,
    .tax-product_tag .col-full,
    body.woocommerce-cart .col-full,
    body.page-template-front-page .col-full {
        max-width: var(--jm-max-width) !important;
    }
}

/* Hide Shoptimizer's "SHOW FILTERS" button on mobile */
.shoptimizer-mobile-toggle,
button.mobile-filter {
    display: none !important;
}

/* Hide "wurde deinem Warenkorb hinzugefügt" notice — clutters the page */
.woocommerce-message {
    display: none !important;
}

/* Hide CommerceKit Sticky ATC bar — our ATC button on the page is enough */
.commercekit-sticky-add-to-cart {
    display: none !important;
}

/* Hide ATC button on product cards on mobile */
@media (max-width: 768px) {
    ul.products li.product a.add_to_cart_button,
    ul.products li.product a.button.product_type_simple {
        display: none !important;
    }
}

/* Hide ATC button on product cards in shop loop on mobile —
   customers tap the card to visit the product page instead */
@media (max-width: 768px) {
    .woocommerce ul.products li.product .button.add_to_cart_button,
    .woocommerce ul.products li.product a.add_to_cart_button {
        display: none !important;
    }
}

/* ─── GLOBAL TYPOGRAPHY ─────────────────────────────────────────────────── */
body,
.site-content,
.woocommerce,
p {
    font-family: var(--jm-font-body);
    color: var(--jm-text);
    font-weight: 400;
    line-height: 1.6;
    font-size: 15px;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.page-title,
.widget-title,
.woocommerce-loop-product__title,
.product_title,
.cart_totals h2,
.woocommerce-checkout h3 {
    font-family: var(--jm-font-heading);
    color: var(--jm-text);
    font-weight: 700;
    line-height: 1.3;
}

.product_title {
    font-size: 1.75rem;
    font-weight: 800;
}

.woocommerce-loop-product__title {
    font-size: 0.9rem;
    font-weight: 600;
}

/* ─── BODY & BACKGROUND ─────────────────────────────────────────────────── */
body {
    background-color: var(--jm-cream);
}

/* ─── TOP BAR / TRUST BAR ───────────────────────────────────────────────── */
.fabricly-trust-bar,
.jm-trust-bar {
    background: var(--jm-pink);
    color: #fff;
    text-align: center;
    padding: 8px 0;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.02em;
}

.fabricly-trust-bar .col-full,
.jm-trust-bar .col-full {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

.fabricly-trust-item,
.jm-trust-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.fabricly-trust-item svg,
.jm-trust-item svg {
    flex-shrink: 0;
}

.fabricly-trust-sep,
.jm-trust-sep {
    opacity: 0.5;
}

/* Shoptimizer below-header area — override for trust bar look */
.below-header {
    font-family: var(--jm-font-body);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.02em;
}

.below-header .col-full {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
}

/* ─── HEADER ────────────────────────────────────────────────────────────── */
.site-header {
    border-bottom: 1px solid var(--jm-border);
    box-shadow: none;
}

.site-branding img {
    max-height: 45px;
    width: auto;
}

/* ─── NAVIGATION ────────────────────────────────────────────────────────── */
.main-navigation {
    font-family: var(--jm-font-body);
}

.main-navigation ul li a {
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 0.01em;
    padding: 12px 16px;
    transition: color var(--jm-transition);
}

.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item > a {
    color: var(--jm-pink);
}

/* Dropdown styling.
   background HØRER MED: reglen satte radius, skygge, kant og padding, men aldrig
   en baggrund, og Shoptimizers egen hvide baggrund ligger kun på
   `.top-bar .widget_nav_menu ul li .sub-menu` — forkert scope, rammer aldrig
   hovedmenuen. Metervarer/Tilbehør/Stof A-Z så rigtige ud alligevel, fordi
   nav-builderen bytter deres <ul> ud med .jm-mega, som selv maler et hvidt kort.
   Mønstre er den ENESTE dropdown-række uden v2-panel og stod derfor som et
   skyggekastet, kantet, HELT gennemsigtigt kort med sidens indhold bagved
   (Marc 2026-07-30: "drop down menuen ved menupunktet mønstre er transparent").
   Målt før rettelsen: alle fem #site-navigation ul.sub-menu havde
   background-color: rgba(0,0,0,0) med box-shadow og 1px kant.
   #fff frem for var(--cream): de øvrige paneler (.jm-mega) er rent hvide, og
   en dropdown i cremefarve ved siden af et hvidt panel er netop den
   uensartede styling Marc også nævner. */
.main-navigation ul.sub-menu {
    background: #fff;
    border-radius: var(--jm-radius);
    box-shadow: var(--jm-shadow-hover);
    border: 1px solid var(--jm-border);
    padding: 8px 0;
}

.main-navigation ul.sub-menu li a {
    padding: 8px 20px;
    font-size: 13px;
}

/* ─── MEGA MENU — .jm-mega panel (nav-builder.php) ──────────────────────
   Markup: the nav-builder replaces Shoptimizer's <ul class="sub-menu"> with
   <div class="jm-mega"> INSIDE the parent theme's dropdown wrapper:
   li.menu-item-has-children > .sub-menu-wrapper > .container > .jm-mega.
   Hover/focus reveal (visibility/opacity/scale) comes free from Shoptimizer's
   `li.menu-item-has-children:hover > .sub-menu-wrapper` rules — here we only
   (a) anchor the panel to the full nav row, (b) paint the opaque card. */

/* Full-row anchor: the wrapper is absolute left:0/right:0 → make the li
   static and the menu ul the positioned ancestor so the panel spans the row.
   (:has() scopes this to mega items only; plain dropdowns keep li anchoring.) */
.main-navigation > div > ul {
    position: relative;
}
.main-navigation ul.menu > li.menu-item-has-children:has(> .sub-menu-wrapper .jm-mega) {
    position: static !important;
}

/* Neutralize the parent theme's .container shell inside the mega wrapper so
   the card below controls its own width/centering. */
.main-navigation .sub-menu-wrapper > .container:has(> .jm-mega) {
    width: 100%;
    max-width: none;
    padding: 0;
    margin: 0;
}

/* The wrapper stays an invisible positioned shell; its top padding doubles as
   an in-wrapper hover bridge (pointer stays inside while crossing the gap).
   z-index lifts the flyout above hero/polaroid decorations. */
.main-navigation ul.menu > li.menu-item-has-children > .sub-menu-wrapper:has(.jm-mega) {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 18px 0 0;
    overflow: visible;
    z-index: 9999;
}

/* The panel card — opaque white, dashed border, scrapbook shadow, gold-tape
   strip at the top (adapted from fabricly's mega polaroid restyle). */
.jm-mega {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    background: #fff;
    border: 1px dashed var(--border, #ECEAE6);
    border-radius: 18px;
    box-shadow: var(--shadow-2, 0 12px 48px rgba(0,0,0,0.10));
    padding: 36px 40px;
    /* 1.180 → 1.280: de 100 px går udelukkende til kolonnebredde og fjerner
       ombrydning i 14 af 16 rækker. Ved 1440 px vindue står der stadig 116 px
       luft i hver side, så kortet læses som et kort og ikke som en fuldbredde-
       bjælke. Målt 2026-07-31 sammen med padding-fixet i v2-extras.css. */
    max-width: 1280px;
    margin: 0 auto;

    /* Loft bundet til VINDUET, ikke til et fast tal. Målt 2026-07-31: panelet
       står 253 px fra toppen (Metervarer, Stof A-Z) og 277 px (Tilbehør), så
       300 px dækker værste tilfælde plus 23 px luft forneden. Konsekvensen er
       den rigtige vej rundt: en stor skærm scroller aldrig (1.200 px vindue
       giver 900 px panel, og Metervarer fylder 851), mens en lille scroller
       indvendigt i stedet for at løbe ud over skærmkanten. Den tåler også at
       der kommer flere motiver og kategorier til — det gjorde et fast tal ikke.
       max() forhindrer at et lavt vindue klemmer panelet ned til en brevsprække;
       under ca. 640 px vindueshøjde vinder de 340 px, og så kan panelet nå
       under kanten igen. Det er en sjælden desktopstørrelse og et bevidst valg. */
    max-height: max(340px, calc(100vh - 300px));
    overflow-y: auto;
    /* Hjulet må ikke løbe videre ned i siden bagved når panelet er i bund. */
    overscroll-behavior: contain;
    /* Bevidst hverken scrollbar-width eller scrollbar-color. Målt i Chrome
       2026-07-31 på tre prøveelementer: kun ::-webkit = 8 px, med
       scrollbar-color = 0 px, med begge = 0 px. Sætter man én af de
       standardiserede egenskaber, ignorerer Chrome ::-webkit-scrollbar helt,
       og macOS' overlay-scrollbar bliver et 2 px hint — for spinkelt når 450 px
       af panelet er skjult på en bærbar. Firefox får sin egen standard-
       scrollbar; den er ikke i husets farve, men den er synlig, og det er
       pointen. */
}
.jm-mega::-webkit-scrollbar {
    width: 8px;
}
.jm-mega::-webkit-scrollbar-thumb {
    background: rgba(226, 138, 87, 0.55);
    border-radius: 4px;
}
.jm-mega::-webkit-scrollbar-track {
    background: transparent;
}

/* Guldtapen sad på .jm-mega med top:-13px. Da kortet nu er en scroll-beholder,
   ville overflow klippe den halvdel der stikker op over kanten — så den tegnes
   fra den omsluttende container i stedet. Samme midte (begge er centreret om
   samme akse) og samme afstand (containeren har padding 0). */
.main-navigation .sub-menu-wrapper > .container:has(> .jm-mega) {
    position: relative;
}
.main-navigation .sub-menu-wrapper > .container:has(> .jm-mega)::before {
    /* gold masking-tape strip at top of card */
    content: '';
    position: absolute;
    top: -13px;
    left: 50%;
    transform: translateX(-50%) rotate(-2deg);
    width: 120px;
    height: 26px;
    background: rgba(226, 138, 87, 0.55);
    border-left: 1px dashed rgba(0, 0, 0, 0.08);
    border-right: 1px dashed rgba(0, 0, 0, 0.08);
    z-index: 2;
}

/* Column groups — dashed separators, volume-ordered per menu-ia.md */
.jm-mega__col {
    flex: 1 1 0;
    min-width: 150px;
    /* 24 → 16 px: 16 px pr. side gange 6 kolonner er 96 px tekstplads, og
       den prikkede skillelinje bærer adskillelsen fint uden de sidste 8. */
    padding: 0 16px;
    border-right: 1px dashed var(--border-subtle, #F3F1ED);
}
.jm-mega__col:first-child {
    padding-left: 0;
}
.jm-mega__col:last-child {
    border-right: 0;
    padding-right: 0;
}

/* Group headings — eyebrow style */
.jm-mega__col h3 {
    font-family: 'Nunito', var(--jm-font-body), sans-serif;
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 0.14em;
    color: var(--jm-text, #333E48);
    text-transform: uppercase;
    margin: 0 0 14px;
}

.jm-mega__col ul {
    /* The parent theme absolutely-positions every nested nav ul as a flyout
       (.main-navigation ul ul {position:absolute} + left:0 on li:hover) —
       that rips the column lists out of flow, collapses the card to the
       heading row and stacks all columns at left:0 over the page. The mega's
       lists are plain flow content; !important needed to beat the parent's
       higher element-count specificity. */
    position: static !important;
    list-style: none;
    margin: 0;
    padding: 0;
}
.jm-mega__col li {
    margin: 0;
    padding: 0;
}
.jm-mega__col a {
    display: inline-block;
    font-family: var(--jm-font-body);
    font-weight: 500;
    font-size: 14px;
    color: var(--jm-text, #333E48);
    padding: 6px 0;
    text-decoration: none;
    transition: all 150ms ease-out;
}
.jm-mega__col a:hover {
    color: var(--jm-pink);
    transform: translateX(3px);
}

/* ── Ensfarvet-båndet — fuldbredde-række under de seks materialekolonner
   (nav-builder.php: jm_render_ensfarvet_band).

   Marc 2026-07-29: ensfarvet var praktisk taget ikke til at finde. Formen er
   valgt for at sige noget sandt om indholdet: ensfarvet går PÅ TVÆRS af de seks
   materialer, så den får en række der spænder hele kortet i stedet for en
   syvende kolonne der ville trunkere navnene i alle seks. Overskriften bærer
   ordet "Ensfarvet" én gang, så rækkerne kan hedde det korte ("French terry,
   børstet" i stedet for "Ensfarvet French Terry | Børstet").

   .jm-mega__motiv (2026-07-31) er det ANDET bånd og deler hver eneste regel
   her — bevidst. De er samme slags indgang: to egenskaber der går på tværs af
   de seks materialekolonner, og de skal derfor se ens ud. Selektorlisterne er
   udvidet frem for kopieret, så de to bånd ikke kan drive fra hinanden ved
   næste rettelse. Det gælder nu også foden: motivbåndet fik sin "se alle" da
   hub-siden (page-print.php) blev bygget 2026-07-31, og den genbruger
   .jm-mega__uni-all frem for at få sin egen klasse. Foden rendrer kun hvis
   siden er publiceret — se jm_motiv_hub_url(). ─────────────────────────── */
.jm-mega__uni,
.jm-mega__motiv {
    flex: 1 1 100%;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px dashed var(--border, #ECEAE6);
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 22px;
}
.jm-mega__uni h3,
.jm-mega__motiv h3 {
    /* Samme eyebrow som kolonneoverskrifterne, men pink: den er en anden slags
       indgang end de seks, og båndet skal kunne findes uden at læse. */
    font-family: 'Nunito', var(--jm-font-body), sans-serif;
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 0.14em;
    color: var(--jm-pink-dark, #C75B80);
    text-transform: uppercase;
    margin: 0;
    flex: 0 0 auto;
}
.jm-mega__uni ul,
.jm-mega__motiv ul {
    /* Se .jm-mega__col ul — forældretemaet flyver enhver nested nav-ul ud af
       flow, og det gælder også her. */
    position: static !important;
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 2px 20px;
    flex: 1 1 auto;
}
.jm-mega__uni li,
.jm-mega__motiv li {
    margin: 0;
    padding: 0;
    white-space: nowrap;
}
.jm-mega__uni a,
.jm-mega__motiv a {
    display: inline-block;
    font-family: var(--jm-font-body);
    font-weight: 500;
    font-size: 14px;
    color: var(--jm-text, #333E48);
    padding: 4px 0;
    text-decoration: none;
    transition: all 150ms ease-out;
}
.jm-mega__uni a:hover,
.jm-mega__motiv a:hover {
    color: var(--jm-pink);
    transform: translateX(3px);
}
/* Foden skal bære forældrebåndet i selektoren. Uden det er ".jm-mega__uni a"
   (0,1,1) stærkere end ".jm-mega__uni-all" (0,1,0), og foden arvede båndets
   almindelige linkstil — 14px/500 i mørk tekst — i stedet for sin egen.
   Målt 2026-07-31 da motivbåndet skulle bruge samme klasse. */
.jm-mega__uni .jm-mega__uni-all,
.jm-mega__motiv .jm-mega__uni-all {
    flex: 0 0 auto;
    font-family: var(--jm-font-body);
    font-weight: 800;
    font-size: 13px;
    color: var(--jm-pink-dark, #C75B80);
    text-decoration: none;
    white-space: nowrap;
}
.jm-mega__uni .jm-mega__uni-all:hover,
.jm-mega__motiv .jm-mega__uni-all:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* Product counts next to each category link */
.jm-mega__cnt {
    font-size: 12px;
    color: var(--jm-text-light, #888);
    font-weight: 500;
}

/* Hide the mega panel entirely at ≤992 — the primary nav lives in
   Shoptimizer's slide-out drawer there and the mobile menu carries its own
   accordion groups (nav-builder.php, theme_location 'mobile'). */
@media (max-width: 992px) {
    .jm-mega {
        display: none !important;
    }
}

/* ─── BUTTONS ───────────────────────────────────────────────────────────── */
.button,
button,
input[type="submit"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .button,
.woocommerce #respond input#submit {
    font-family: var(--jm-font-body);
    font-weight: 600;
    font-size: 14px;
    border-radius: var(--jm-radius);
    padding: 12px 28px;
    transition: all var(--jm-transition);
    text-transform: none;
    letter-spacing: 0.01em;
}

/* ─── CONTENT PAGES — Component Library (from blueprint skill) ─────────── */
/* Container for all content pages — match site width */
.fabricly-content-page { max-width: var(--jm-max-width, 1400px); margin: 0 auto; padding: 0 2em; overflow-x: hidden; }

/* Hero — full-width cream bg, centered content */
.hero { background-color: #f8f5f0; padding: 48px 32px; text-align: center; margin-left: -2em; margin-right: -2em; padding-left: 2em; padding-right: 2em; }
.hero__title { font-family: var(--jm-font-heading); font-size: 2rem; font-weight: 700; color: #2a2a2a; margin-bottom: 8px; }
.hero__subtitle { font-family: var(--jm-font-body); font-size: 15px; color: #666; max-width: 480px; margin: 0 auto 24px; line-height: 1.6; }
.hero--split { display: flex; align-items: center; gap: 24px; text-align: left; padding: 32px; }
.hero__image { width: 50%; border-radius: 12px; object-fit: cover; flex-shrink: 0; }
.hero__content { flex: 1; }
.hero__tagline { font-family: var(--jm-font-body); font-size: 12px; font-weight: 600; color: #E27297; margin-bottom: 4px; }

/* ─── HEADER SEARCH BAR ─────────────────────────────────────────────────── */
/* Fill the space between logo and right edge in the header row */
.main-header.col-full {
    display: flex;
    align-items: center;
    gap: 20px;
}
.site-search {
    flex: 1;
    min-width: 0;
    position: relative;
}
.site-search .widget_product_search,
.site-search .woocommerce-product-search {
    width: 100%;
    position: relative;
}
.site-search .woocommerce-product-search {
    display: flex;
    align-items: center;
}
/* The magnifying glass icon (Shoptimizer ::before pseudo-element) */
.site-search .woocommerce-product-search:before {
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    margin-top: 0;
    background-color: #999;
}
/* The actual input field — pad left for the icon */
.site-search .search-field,
.site-search input.commercekit-ajax-search {
    width: 100% !important;
    border: 1.5px solid #ddd;
    border-radius: 25px;
    padding: 10px 20px 10px 44px;
    font-family: var(--jm-font-body);
    font-size: 14px;
    background: #f7f7f7;
    color: #333;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
    box-sizing: border-box;
}
.site-search .search-field:focus,
.site-search input.commercekit-ajax-search:focus {
    border-color: var(--jm-pink);
    box-shadow: 0 0 0 3px rgba(226,114,151,0.1);
    background: #fff;
}
.site-search .search-field::placeholder,
.site-search input.commercekit-ajax-search::placeholder {
    color: #999;
    font-family: var(--jm-font-body);
}
/* Hide the default submit button */
.site-search .woocommerce-product-search button[type="submit"] {
    display: none;
}
/* Hide the separate search toggle icon (magnifying glass next to logo) */
.site-header .search-toggle,
.site-header .ckit-search-toggle,
.site-header .header-search-toggle {
    display: none;
}

/* ─── CommerceKit AJAX Search Dropdown ──────────────────────────────────── */
.widget_product_search.commercekit-ajs-active {
    overflow: visible !important;
    position: relative;
}
/* Ensure no parent clips the dropdown */
.site-search,
.site-header,
.main-header,
.main-header.col-full {
    overflow: visible !important;
}
.commercekit-ajs-results {
    z-index: 99999 !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.15);
    border: 1px solid #e5e5e5;
    margin-top: 4px;
    max-height: 480px;
    background: #fff;
}
.commercekit-ajs-suggestions {
    border-radius: 12px 12px 0 0;
    background: #fff;
}
.commercekit-ajs-view-all-holder > a {
    background: var(--jm-pink);
    border-radius: 0 0 12px 12px;
    font-family: var(--jm-font-body);
    font-size: 12px;
    letter-spacing: 0.03em;
}
.commercekit-ajs-view-all-holder > a:hover {
    background: var(--jm-pink-dark, #339a9f);
}
.commercekit-ajs-product-title {
    font-family: var(--jm-font-body);
    font-size: 13px;
}
.commercekit-ajs-product-price,
.commercekit-ajs-product-price ins {
    color: var(--jm-pink);
    font-weight: 600;
}

/* Category cards */
.category-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; padding: 32px; }
.category-card { background: #fff; border: 0.5px solid #ddd; border-radius: 8px; padding: 16px 8px; text-align: center; cursor: pointer; transition: border-color 0.2s; }
.category-card:hover { border-color: #E27297; }
.category-card__icon { width: 32px; height: 32px; background: #e0f7f8; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 8px; }
.category-card__label { font-family: var(--jm-font-body); font-size: 13px; font-weight: 500; color: #2a2a2a; }

/* Accordion */
.accordion-group { padding: 16px 24px; }
.accordion-group__title { font-family: var(--jm-font-heading); font-size: 16px; font-weight: 700; color: #E27297; margin-bottom: 8px; padding-bottom: 8px; border-bottom: 2px solid #e0f7f8; }
.accordion-item { border: 0.5px solid #ddd; border-radius: 8px; margin-bottom: 8px; overflow: hidden; }
.accordion-item__question { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; cursor: pointer; font-family: var(--jm-font-body); font-size: 14px; font-weight: 500; color: #2a2a2a; background: #fff; transition: background 0.2s; border: none; width: 100%; text-align: left; }
.accordion-item__question:hover { background: #f5f5f2; }
.accordion-item__toggle { width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; flex-shrink: 0; background: #e0f7f8; color: #E27297; transition: all 0.2s; }
.accordion-item__answer { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; font-family: var(--jm-font-body); font-size: 13px; line-height: 1.6; color: #666; }
.accordion-item__answer-inner { padding: 0 16px 14px; }
.accordion-item__answer-inner a { color: #E27297; }
.accordion-item.is-open .accordion-item__question { background: #f8f5f0; }
.accordion-item.is-open .accordion-item__toggle { background: #E27297; color: #fff; }
.accordion-item.is-open .accordion-item__answer { max-height: 500px; }

/* Contact channel cards */
.contact-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 24px; }
.contact-card { border: 0.5px solid #ddd; border-radius: 8px; padding: 18px 14px; text-align: center; }
.contact-card--emphasis { border: 1.5px solid #E27297; }
.contact-card__icon { width: 40px; height: 40px; border-radius: 50%; background: #e0f7f8; display: flex; align-items: center; justify-content: center; margin: 0 auto 8px; }
.contact-card--emphasis .contact-card__icon { background: #E27297; color: #fff; }
.contact-card__title { font-family: var(--jm-font-body); font-size: 13px; font-weight: 600; margin-bottom: 2px; }
.contact-card__desc { font-family: var(--jm-font-body); font-size: 11px; color: #666; line-height: 1.4; }
.contact-card__link { display: inline-block; margin-top: 8px; font-family: var(--jm-font-body); font-size: 11px; color: #E27297; font-weight: 500; text-decoration: none; }

/* Contact form — Design System v2.0 */
.contact-form { padding: 0; }
.contact-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.contact-form__field { display: flex; flex-direction: column; gap: 6px; }
.contact-form__field--full { grid-column: span 2; }
.contact-form__label { font-family: var(--jm-font-body); font-size: 13px; font-weight: 500; color: var(--jm-text-light); }
.contact-form__input, .contact-form__select, .contact-form__textarea { border: 2px solid var(--jm-border); border-radius: var(--jm-radius); padding: 16px 18px; font-family: var(--jm-font-body); font-size: 15px; color: var(--jm-text); background: #fff; transition: border-color var(--jm-transition), box-shadow var(--jm-transition); width: 100%; box-sizing: border-box; }
.contact-form__input:focus, .contact-form__textarea:focus, .contact-form__select:focus { border-color: var(--jm-pink); outline: none; box-shadow: 0 0 0 4px rgba(226,114,151,0.12); }
.contact-form__textarea { resize: vertical; min-height: 120px; }
.contact-form__footer { display: flex; justify-content: space-between; align-items: center; margin-top: 24px; grid-column: span 2; }
.contact-form__privacy { font-size: 13px; color: var(--jm-text-muted, #888); max-width: 320px; line-height: 1.5; }
.contact-form__privacy a { color: var(--jm-pink); }

/* CF7 submit button — coral primary CTA */
.contact-form .wpcf7-submit,
.contact-form .btn--primary {
    background: var(--jm-yellow) !important;
    color: #fff !important;
    font-family: var(--jm-font-heading);
    font-size: 16px;
    font-weight: 800;
    padding: 16px 32px;
    border: none;
    border-radius: var(--jm-radius);
    cursor: pointer;
    box-shadow: var(--jm-shadow-cta);
    transition: all var(--jm-transition);
}
.contact-form .wpcf7-submit:hover,
.contact-form .btn--primary:hover {
    background: var(--jm-yellow-dark) !important;
    transform: translateY(-2px);
}

/* CF7 validation styling */
.wpcf7-not-valid { border-color: #E53935 !important; }
.wpcf7-not-valid-tip { font-size: 13px; color: #E53935; margin-top: 4px; }
.wpcf7-response-output { font-family: var(--jm-font-body); font-size: 15px; text-align: center; padding: 16px; border-radius: var(--jm-radius); margin-top: 24px; }
.wpcf7-mail-sent-ok { background: #E8F5E9; color: #2E7D32; border: 1px solid rgba(76,175,80,0.2); }
.wpcf7 form.sent .wpcf7-response-output { border-color: #4CAF50; }

/* Stats row */
.stats-row { display: flex; gap: 8px; padding: 24px; }
.stat-card { flex: 1; text-align: center; padding: 16px 8px; border: 0.5px solid #ddd; border-radius: 8px; }
.stat-card__number { font-family: var(--jm-font-heading); font-size: 28px; font-weight: 700; color: #E27297; }
.stat-card__label { font-family: var(--jm-font-body); font-size: 11px; color: #888; margin-top: 2px; }

/* Badge / pill */
.badge { display: inline-flex; align-items: center; gap: 5px; padding: 5px 14px; border-radius: 20px; font-family: var(--jm-font-body); font-size: 11px; font-weight: 600; }
.badge--jm-pink { background: #e0f7f8; color: #E27297; }
.badge--jm-yellow { background: #FCEBDD; color: #E28A57; }

/* Buttons */
.btn { display: inline-block; padding: 10px 24px; border-radius: 8px; font-family: var(--jm-font-body); font-size: 14px; font-weight: 600; cursor: pointer; border: none; transition: all 0.2s; text-decoration: none; text-align: center; }
.btn--primary { background: #E27297; color: #fff; }
.btn--primary:hover { background: #37a8af; }
.btn--white { background: #fff; color: #E27297; }
.btn--outline-white { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,0.5); }
.btn--outline-white:hover { border-color: #fff; }

/* Trust footer */
.trust-footer { display: flex; justify-content: center; gap: 24px; padding: 24px; background: #f8f5f0; }
.trust-item { display: flex; align-items: center; gap: 6px; font-family: var(--jm-font-body); font-size: 12px; color: #666; }
.trust-item__icon { width: 22px; height: 22px; background: #e0f7f8; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 10px; color: #E27297; }

/* Timeline */
.timeline { padding: 32px; }
.timeline__title { font-family: var(--jm-font-heading); font-size: 17px; font-weight: 700; text-align: center; margin-bottom: 24px; }
.timeline__track { position: relative; padding-left: 36px; border-left: 2px solid #e0f7f8; margin-left: 20px; }
.timeline__item { position: relative; margin-bottom: 18px; }
.timeline__dot { position: absolute; left: -42px; top: 2px; width: 14px; height: 14px; border-radius: 50%; background: #E27297; border: 3px solid #e0f7f8; }
.timeline__dot--accent { background: #F4A97F; border-color: #FCEBDD; }
.timeline__year { font-family: var(--jm-font-heading); font-size: 15px; font-weight: 700; color: #E27297; margin-bottom: 1px; }
.timeline__year--accent { color: #E28A57; }
.timeline__desc { font-family: var(--jm-font-body); font-size: 12px; color: #666; line-height: 1.5; }

/* USP cards */
.usp-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; padding: 32px; }
.usp-card { background: #f5f5f2; border: 0.5px solid #ddd; border-radius: 8px; padding: 18px 16px; }
.usp-card__icon { width: 36px; height: 36px; background: #e0f7f8; border-radius: 8px; display: flex; align-items: center; justify-content: center; margin-bottom: 8px; color: #E27297; }
.usp-card__title { font-family: var(--jm-font-body); font-size: 14px; font-weight: 600; margin-bottom: 3px; }
.usp-card__desc { font-family: var(--jm-font-body); font-size: 12px; color: #666; line-height: 1.5; }

/* Team */
.team-section { padding: 32px; text-align: center; }
.team-section__title { font-family: var(--jm-font-heading); font-size: 17px; font-weight: 700; margin-bottom: 24px; }
.team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; max-width: 600px; margin: 0 auto; }
.team-card { text-align: center; width: 140px; display: flex; flex-direction: column; align-items: center; }
.team-card__photo { width: 120px; height: 140px; border-radius: 12px; object-fit: cover; margin: 0 auto 8px; display: block; }
.team-card__name { font-family: var(--jm-font-body); font-size: 14px; font-weight: 600; margin-bottom: 1px; }
.team-card__role { font-family: var(--jm-font-body); font-size: 12px; color: #666; }

/* Values */
.values-section { padding: 32px; background: #f8f5f0; }
.values-section__title { font-family: var(--jm-font-heading); font-size: 17px; font-weight: 700; text-align: center; margin-bottom: 16px; }
.values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.values-card { text-align: center; padding: 14px 10px; }
.values-card__icon { font-size: 24px; margin-bottom: 6px; }
.values-card__label { font-family: var(--jm-font-body); font-size: 13px; font-weight: 600; color: #2a2a2a; margin-bottom: 2px; }
.values-card__desc { font-family: var(--jm-font-body); font-size: 11px; color: #666; line-height: 1.4; }

/* CTA banner */
.cta-banner { background: #E27297; border-radius: 8px; padding: 32px; text-align: center; margin: 24px; }
.cta-banner__title { font-family: var(--jm-font-heading); font-size: 20px; font-weight: 700; color: #fff; margin-bottom: 4px; }
.cta-banner__desc { font-family: var(--jm-font-body); font-size: 13px; color: rgba(255,255,255,0.85); margin-bottom: 16px; }
.cta-banner__buttons { display: flex; gap: 10px; justify-content: center; }

/* Self-service teaser (contact page) — also fix category-grid with 3 items */
.self-service { padding: 24px; }
.self-service__title { font-family: var(--jm-font-body); font-size: 13px; font-weight: 500; color: #888; text-align: center; margin-bottom: 12px; }
.self-service__cards { display: flex; gap: 8px; }
.self-service__card { flex: 1; background: #f8f5f0; border: 0.5px solid #ddd; border-radius: 8px; padding: 14px; text-align: center; text-decoration: none; transition: border-color 0.2s; }
.self-service__card:hover { border-color: #E27297; }
.self-service__card-icon { font-size: 18px; margin-bottom: 4px; display: block; }
.self-service__card-label { font-family: var(--jm-font-body); font-size: 12px; font-weight: 500; color: #2a2a2a; display: block; }
.self-service__card-hint { font-family: var(--jm-font-body); font-size: 10px; color: #888; }

/* Contact page: 3-item category grid fix */
.page-id-91 .category-grid { grid-template-columns: repeat(3, 1fr); padding: 16px 0; }
.page-id-91 .category-card { padding: 14px 10px; }

/* Contact page: tighter channel cards */
.page-id-91 .contact-cards { padding: 16px 0; }
.page-id-91 .contact-card { padding: 16px 12px; }

/* ─── CONTENT PAGES MOBILE ─────────────────────────────────────────────── */
@media (max-width: 768px) {
    /* Container */
    .fabricly-content-page { padding: 0 16px; }

    /* Hero */
    .hero { padding: 24px 16px; margin-left: -16px; margin-right: -16px; padding-left: 16px; padding-right: 16px; }
    .hero__title { font-size: 22px; }
    .hero__subtitle { font-size: 13px; margin-bottom: 16px; }
    .hero--split { flex-direction: column; text-align: center; padding: 20px 16px; }
    .hero__image { width: 100%; max-height: 200px; }
    .hero__tagline { font-size: 11px; }

    /* Search */
    .search-field { max-width: 100%; }

    /* Category cards — 2 col */
    .category-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 8px; padding: 16px 0; }
    .category-card { padding: 12px 8px; }
    .category-card__label { font-size: 12px; }

    /* Accordion */
    .accordion-group { padding: 12px 0; }
    .accordion-group__title { font-size: 14px; }
    .accordion-item__question { font-size: 13px; padding: 10px 12px; min-height: 48px; }
    .accordion-item__answer-inner { padding: 0 12px 12px; font-size: 12px; }

    /* Contact cards */
    .contact-cards { grid-template-columns: 1fr; gap: 8px; padding: 16px 0; }
    .contact-card { display: flex; align-items: center; gap: 10px; text-align: left; padding: 12px 14px; }
    .contact-card__icon { margin: 0; width: 36px; height: 36px; flex-shrink: 0; }

    /* Contact form */
    .contact-form { padding: 16px 0; }
    .contact-form__grid { grid-template-columns: 1fr; }
    .contact-form__field--full { grid-column: span 1; }
    .contact-form__footer { flex-direction: column-reverse; gap: 8px; grid-column: span 1; }
    .contact-form__footer .btn { width: 100%; }

    /* Stats */
    .stats-row { gap: 6px; padding: 12px 0; }
    .stat-card { padding: 10px 4px; }
    .stat-card__number { font-size: 20px; }
    .stat-card__label { font-size: 9px; }

    /* Timeline */
    .timeline { padding: 20px 0; }
    .timeline__track { padding-left: 26px; margin-left: 10px; }
    .timeline__dot { left: -31px; width: 10px; height: 10px; border-width: 2px; }
    .timeline__year { font-size: 13px; }
    .timeline__desc { font-size: 11px; }

    /* USP cards */
    .usp-grid { grid-template-columns: 1fr; padding: 16px 0; }

    /* Team */
    .team-section { padding: 20px 0; }
    .team-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .team-card__photo { width: 100%; height: auto; aspect-ratio: 3/4; }
    .team-card__name { font-size: 13px; }
    .team-card__role { font-size: 11px; }

    /* Values */
    .values-section { padding: 20px 16px; margin-left: -16px; margin-right: -16px; }
    .values-grid { grid-template-columns: 1fr; }

    /* Trust footer */
    .trust-footer { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 16px; margin-left: -16px; margin-right: -16px; }
    .trust-item { font-size: 11px; }

    /* CTA banner */
    .cta-banner { margin: 16px -16px; border-radius: 0; padding: 24px 16px; }
    .cta-banner__title { font-size: 18px; }
    .cta-banner__buttons { flex-direction: column; }
    .btn { font-size: 13px; padding: 10px 20px; width: 100%; }

    /* Self-service cards */
    .self-service__cards { flex-direction: column; }
}

/* Legacy compat — keep .fabricly-btn for existing references */
.fabricly-btn { display: inline-block; background: #E27297; color: #fff; border: none; border-radius: 8px; padding: 10px 24px; font-size: 14px; font-weight: 600; font-family: var(--jm-font-body); text-decoration: none; cursor: pointer; }
.fabricly-btn:hover { background: #37a8af; color: #fff; }

/* ─── HILFE DROPDOWN — single-column, positioned under link ────────────── */
/* Hilfe li needs relative positioning (not static like Stoffe) */
#nav-menu-item-5248.fabricly-has-mega {
    position: relative !important;
}

.fabricly-hilfe-menu {
    width: 280px !important;
    left: 0 !important;
    right: auto !important;
}

.fabricly-hilfe-inner {
    padding: 12px 0;
}

.fabricly-hilfe-link {
    display: block;
    padding: 12px 24px;
    text-decoration: none;
    transition: background 0.15s;
}

.fabricly-hilfe-link:hover {
    background: var(--jm-cream);
}

.fabricly-hilfe-link strong {
    display: block;
    font-family: var(--jm-font-body);
    font-size: 14px;
    font-weight: 600;
    color: var(--jm-text);
}

.fabricly-hilfe-link span {
    font-size: 12px;
    color: var(--jm-text-light);
}

.fabricly-hilfe-link:hover strong {
    color: var(--jm-pink);
}

/* Hide on mobile — Shoptimizer submenu handles it */
@media (max-width: 1024px) {
    .fabricly-hilfe-menu {
        display: none !important;
    }
}

/* Primary button (ATC, checkout) */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.single_add_to_cart_button {
    background: var(--jm-pink);
    border-color: var(--jm-pink);
    color: #fff;
    border-radius: var(--jm-radius);
    font-size: 16px;
    font-weight: 700;
    padding: 14px 32px;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.single_add_to_cart_button:hover {
    background: var(--jm-pink-dark);
    border-color: var(--jm-pink-dark);
    transform: translateY(-1px);
    box-shadow: var(--jm-shadow-hover);
}

/* ─── PRODUCT CARDS (CATEGORY/SHOP PAGES) ───────────────────────────────── */
.woocommerce ul.products li.product {
    background: var(--jm-white);
    border-radius: var(--jm-radius-lg);
    overflow: hidden;
    box-shadow: var(--jm-shadow);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    border: none;
    padding-bottom: 16px;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.woocommerce ul.products li.product:hover {
    box-shadow: var(--jm-shadow-hover);
    transform: translateY(-4px);
}

.woocommerce ul.products li.product .woocommerce-loop-product__link {
    text-decoration: none;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Product image in card */
.woocommerce ul.products li.product img {
    border-radius: 0;
    margin-bottom: 0;
}

/* Product title in card */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    padding: 10px 14px 4px;
    margin: 0;
}

/* Price in card */
.woocommerce ul.products li.product .price {
    padding: 0 14px 8px;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--jm-text);
}

/* Category name in card */
.woocommerce ul.products li.product .shoptimizer-category {
    padding: 0 14px;
    font-size: 0.75rem;
    color: var(--jm-text-light);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Sale badge */
.woocommerce span.onsale,
.shoptimizer-badge {
    border-radius: 50%;
    font-family: var(--jm-font-body);
    font-weight: 600;
    font-size: 12px;
}

/* New badge (CommerceKit) */
.commercekit-badge {
    background: var(--jm-pink) !important;
    font-family: var(--jm-font-body);
    font-weight: 600;
}

/* ─── SINGLE PRODUCT PAGE ───────────────────────────────────────────────── */
.single-product div.product {
    background: var(--jm-white);
    border-radius: var(--jm-radius);
    padding: 0;
}

/* Related products — padding + inherit card styling */
.single-product .related.products,
.single-product .upsells.products {
    padding-bottom: 40px;
    margin-bottom: 0;
}

/* Force related products to use same card grid as shop */
.related.products ul.products,
.upsells.products ul.products {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 20px !important;
}

.related.products ul.products li.product,
.upsells.products ul.products li.product {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
    display: flex !important;
    flex-direction: column !important;
}

@media (max-width: 768px) {
    .related.products ul.products,
    .upsells.products ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* Accordion + related products width consistency */
.single-product .related.products,
.single-product .upsells.products,
.single-product .woocommerce-tabs {
    max-width: var(--jm-max-width);
}

/* Price display */
.single-product .price {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--jm-text);
}

.single-product .price ins {
    text-decoration: none;
}

/* Product meta (SKU, category) */
.single-product .product_meta {
    font-size: 13px;
    color: var(--jm-text-light);
    border-top: 1px solid var(--jm-border);
    padding-top: 16px;
    margin-top: 16px;
}

/* Tabs → Accordion style overrides */
.woocommerce-tabs .panel,
.woocommerce-tabs .wc-tab {
    font-family: var(--jm-font-body);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    font-family: var(--jm-font-heading);
    font-weight: 600;
    font-size: 14px;
}

/* Additional information table (specs) */
.woocommerce table.shop_attributes {
    border: none;
    border-collapse: collapse;
}

.woocommerce table.shop_attributes tr {
    border-bottom: 1px solid var(--jm-border);
}

.woocommerce table.shop_attributes th {
    font-weight: 600;
    color: var(--jm-text);
    background: transparent;
    font-size: 13px;
    padding: 10px 12px;
}

.woocommerce table.shop_attributes td {
    font-size: 13px;
    padding: 10px 12px;
    background: transparent;
}

.woocommerce table.shop_attributes td p {
    margin: 0;
}

/* ─── PRODUCT GALLERY ───────────────────────────────────────────────────── */
.single-product .woocommerce-product-gallery {
    border-radius: var(--jm-radius);
    overflow: hidden;
}

.single-product .woocommerce-product-gallery img {
    border-radius: var(--jm-radius-sm);
}

/* ─── BREADCRUMBS ───────────────────────────────────────────────────────── */
.woocommerce .woocommerce-breadcrumb {
    font-size: 12px;
    color: var(--jm-text-light);
    font-family: var(--jm-font-body);
    padding: 12px 0;
}

.woocommerce .woocommerce-breadcrumb a {
    color: var(--jm-text-light);
    transition: color var(--jm-transition);
}

.woocommerce .woocommerce-breadcrumb a:hover {
    color: var(--jm-pink);
}

/* ─── SIDEBAR FILTERS ───────────────────────────────────────────────────── */
.widget-area .widget {
    background: var(--jm-white);
    border-radius: var(--jm-radius);
    padding: 20px;
    margin-bottom: 16px;
    box-shadow: var(--jm-shadow);
}

.widget-area .widget-title {
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--jm-pink);
}

/* ─── CART ───────────────────────────────────────────────────────────────── */
.woocommerce-cart .cart-collaterals {
    background: var(--jm-white);
    border-radius: var(--jm-radius);
    padding: 24px;
    box-shadow: var(--jm-shadow);
}

.woocommerce table.cart td,
.woocommerce table.cart th {
    font-family: var(--jm-font-body);
}

/* Cart: Checkout button */
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
    background: var(--jm-pink);
    color: #fff;
    border-radius: var(--jm-radius);
    font-weight: 700;
    font-size: 16px;
    padding: 16px 32px;
    width: 100%;
    text-align: center;
    display: block;
    border: none;
    font-family: var(--jm-font-body);
}

.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover {
    background: var(--jm-pink-dark);
    transform: translateY(-1px);
    box-shadow: var(--jm-shadow-hover);
}

/* Cart: Coupon field */
.woocommerce-cart .coupon .input-text {
    border: 1px solid var(--jm-border);
    border-radius: var(--jm-radius-sm);
    padding: 10px 14px;
    font-family: var(--jm-font-body);
    font-size: 14px;
}

.woocommerce-cart .coupon .button {
    background: var(--jm-cream);
    color: var(--jm-text);
    border: 1px solid var(--jm-border);
    border-radius: var(--jm-radius-sm);
    font-family: var(--jm-font-body);
    font-weight: 600;
}

.woocommerce-cart .coupon .button:hover {
    background: var(--jm-pink-light);
    border-color: var(--jm-pink);
    color: var(--jm-pink-dark);
}

/* Cart: Update cart button */
.woocommerce-cart button[name="update_cart"] {
    background: var(--jm-cream);
    border: 1px solid var(--jm-border);
    color: var(--jm-text);
    border-radius: var(--jm-radius-sm);
    font-family: var(--jm-font-body);
    font-weight: 600;
}

.woocommerce-cart button[name="update_cart"]:hover {
    background: var(--jm-pink-light);
    border-color: var(--jm-pink);
}

/* Cart: Continue shopping link */
.fabricly-continue-shopping {
    display: inline-block;
    margin-top: 16px;
    color: var(--jm-pink);
    font-weight: 600;
    text-decoration: none;
    font-size: 14px;
    font-family: var(--jm-font-body);
}

.fabricly-continue-shopping:hover {
    color: var(--jm-pink-dark);
    text-decoration: underline;
}

/* Cart: Mobile — compact, clean, Zalando-inspired */
@media (max-width: 768px) {
    /* Compact product rows */
    .woocommerce table.cart .product-thumbnail {
        width: 70px;
    }
    .woocommerce table.cart .product-thumbnail img {
        width: 70px;
        height: 70px;
        object-fit: cover;
        border-radius: var(--jm-radius-sm);
    }
    .woocommerce table.cart td {
        padding: 6px;
        font-size: 13px;
    }
    .woocommerce table.cart .product-name a {
        font-size: 13px;
        font-weight: 600;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        line-height: 1.3;
    }
    .woocommerce table.cart .product-price,
    .woocommerce table.cart .product-subtotal {
        font-size: 13px;
    }
    .woocommerce table.cart .product-remove a {
        font-size: 16px;
        color: #ccc;
    }

    /* Hide "Update cart" button — WC auto-updates */
    .woocommerce-cart button[name="update_cart"] {
        display: none;
    }

    /* Collapse coupon — small link, expandable */
    .woocommerce-cart .coupon {
        display: none;
    }
    .fabricly-coupon-toggle {
        display: block;
        font-size: 12px;
        color: var(--jm-text-light);
        text-decoration: underline;
        cursor: pointer;
        margin-bottom: 12px;
        background: none;
        border: none;
        padding: 0;
        font-family: var(--jm-font-body);
    }
    .fabricly-coupon-toggle.open + .coupon,
    .woocommerce-cart .coupon.fabricly-coupon-visible {
        display: flex;
        gap: 8px;
        margin-bottom: 12px;
    }
    .woocommerce-cart .coupon .input-text {
        flex: 1;
        min-width: 0;
        font-size: 13px;
        padding: 8px 10px;
    }

    /* Tighter shipping progress bar */
    .fabricly-shipping-progress {
        padding: 8px 12px;
        font-size: 12px;
        margin-bottom: 12px;
    }
    .fabricly-shipping-progress .fabricly-ship-bar {
        height: 5px;
    }

    /* Tighter bundle discount box */
    .fabricly-bundle-box {
        padding: 10px 14px;
        font-size: 12px;
        margin-bottom: 12px;
    }
    .fabricly-bundle-badge {
        font-size: 11px;
        padding: 3px 8px;
    }

    /* Compact cart totals */
    .woocommerce-cart .cart-collaterals {
        padding: 16px;
    }
}

/* Cart trust strip — subtle, above checkout button */
.fabricly-cart-trust {
    display: flex;
    justify-content: center;
    gap: 12px;
    font-size: 11px;
    color: var(--jm-text-light);
    font-family: var(--jm-font-body);
    padding: 10px 0;
    margin-bottom: 4px;
    flex-wrap: wrap;
}

.fabricly-cart-trust__item {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.fabricly-cart-trust__item svg {
    flex-shrink: 0;
    opacity: 0.6;
}

/* ─── CART CROSS-SELL CAROUSEL ──────────────────────────────────────────── */
.fabricly-cart-xsell {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--jm-border);
}

.fabricly-cart-xsell__title {
    font-family: var(--jm-font-heading);
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--jm-text);
    margin: 0 0 4px;
}

.fabricly-cart-xsell__sub {
    font-size: 13px;
    color: var(--jm-pink);
    font-weight: 600;
    margin: 0 0 16px;
}

/* Cart cross-sell: use standard shop grid layout */
.fabricly-cart-xsell__grid.products {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 20px !important;
    list-style: none;
    padding: 0;
    margin: 0;
}

.fabricly-cart-xsell__grid.products li.product {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
}

@media (max-width: 768px) {
    .fabricly-cart-xsell {
        margin-top: 20px;
        padding-top: 16px;
    }
    .fabricly-cart-xsell__title {
        font-size: 1rem;
    }
    .fabricly-cart-xsell__sub {
        font-size: 12px;
        margin-bottom: 10px;
    }
    .fabricly-cart-xsell__grid.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
}

/* Sidebar mini cart */
.shoptimizer-mini-cart-wrap {
    font-family: var(--jm-font-body);
}

/* ─── CHECKOUT ──────────────────────────────────────────────────────────── */
.woocommerce-checkout .woocommerce-checkout-review-order {
    background: var(--jm-white);
    border-radius: var(--jm-radius);
    padding: 24px;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
    border: 1px solid var(--jm-border);
    border-radius: var(--jm-radius-sm);
    padding: 10px 14px;
    font-family: var(--jm-font-body);
    font-size: 14px;
    transition: border-color var(--jm-transition);
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
    border-color: var(--jm-pink);
    outline: none;
    box-shadow: 0 0 0 3px var(--jm-pink-light);
}

/* Checkout: product thumbnails in order review */
.woocommerce-checkout-review-order-table .product-name img,
.woocommerce-checkout-review-order-table td.product-name img,
#order_review .shop_table img {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 6px;
    background: #f8f5f0;
    padding: 2px;
    border: 1px solid #f0ece8;
    vertical-align: middle;
    margin-right: 10px;
}

.woocommerce-checkout-review-order-table td {
    vertical-align: middle;
}

@media (max-width: 768px) {
    .woocommerce-checkout-review-order-table .product-name img,
    .woocommerce-checkout-review-order-table td.product-name img,
    #order_review .shop_table img {
        width: 40px;
        height: 40px;
    }
}

/* Checkout: shipping method labels — carrier icons inline */
.woocommerce-checkout .woocommerce-shipping-methods label {
    display: flex;
    align-items: center;
    font-size: 14px;
    padding: 8px 0;
}

.woocommerce-checkout .woocommerce-shipping-methods label img {
    flex-shrink: 0;
}

/* Checkout: compact legal checkbox */
.fabricly-legal-row {
    font-size: 13px;
    color: var(--jm-text-light);
}

.fabricly-legal-row a {
    color: var(--jm-pink);
}

/* Checkout: trust signals below legal checkbox */
.fabricly-checkout-trust {
    background: var(--jm-pink-light);
    border: 1px solid rgba(226, 114, 151, 0.2);
    border-radius: var(--jm-radius);
    padding: 16px 20px;
    margin-top: 16px;
    margin-bottom: 8px;
}

.fabricly-checkout-trust__row {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-family: var(--jm-font-body);
    color: var(--jm-text);
    padding: 4px 0;
}

.fabricly-checkout-trust__row svg {
    flex-shrink: 0;
}

.fabricly-checkout-trust__payments {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(226, 114, 151, 0.2);
}

.fabricly-checkout-trust__payments span {
    background: #fff;
    border: 1px solid var(--jm-border);
    border-radius: 4px;
    padding: 3px 8px;
    font-size: 11px;
    font-weight: 600;
    color: var(--jm-text-light);
    font-family: var(--jm-font-body);
}

/* ─── BUNDLE DISCOUNT BOX (cart page) ──────────────────────────────────── */
.fabricly-bundle-box {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    border-radius: var(--jm-radius);
    margin-bottom: 16px;
    font-size: 13px;
    font-family: var(--jm-font-body);
    color: var(--jm-text);
    line-height: 1.5;
}

.fabricly-bundle-box--hint {
    background: var(--jm-pink-light);
    border: 1px solid rgba(226, 114, 151, 0.25);
}

.fabricly-bundle-box--active {
    background: var(--jm-pink-light);
    border: 1px solid var(--jm-pink);
}

.fabricly-bundle-box--full {
    background: var(--jm-pink-light);
    border: 2px solid var(--jm-pink);
}

.fabricly-bundle-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--jm-pink);
    color: #fff;
    font-weight: 800;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 20px;
    white-space: nowrap;
    flex-shrink: 0;
    letter-spacing: 0.02em;
}

.fabricly-bundle-box--full .fabricly-bundle-badge {
    font-size: 14px;
    padding: 6px 14px;
}

/* ─── FOOTER ────────────────────────────────────────────────────────────── */
.site-footer {
    font-family: var(--jm-font-body);
}

.site-footer .widget-title {
    font-family: var(--jm-font-heading);
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.site-footer .copyright {
    font-size: 12px;
    border-top: 1px solid rgba(255,255,255,0.1);
}

/* ─── PAGINATION ────────────────────────────────────────────────────────── */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    border-radius: var(--jm-radius-sm);
    font-family: var(--jm-font-body);
    font-weight: 500;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
    background: var(--jm-pink);
    border-color: var(--jm-pink);
}

/* ─── SEARCH (see main block above) ─────────────────────────────────────── */

/* ─── NOTICES / MESSAGES ────────────────────────────────────────────────── */
.woocommerce-message {
    border-top-color: var(--jm-pink);
    background: var(--jm-pink-light);
}

.woocommerce-message::before {
    color: var(--jm-pink);
}

.woocommerce-info {
    border-top-color: var(--jm-pink);
}

.woocommerce-error {
    border-top-color: var(--jm-yellow);
}

/* ─── PROGRESS BAR (CHECKOUT) — Fabricly branded ──────────────────────── */
/* Shoptimizer fallback — hide their progress bar if it ever appears alongside ours */
.checkout-wrap ul.checkout-bar { display: none; }

/* ─── SELECTION / FOCUS COLORS ──────────────────────────────────────────── */
::selection {
    background: var(--jm-pink-light);
    color: var(--jm-text);
}

a:focus-visible,
button:focus-visible,
input:focus-visible {
    outline: 2px solid var(--jm-pink);
    outline-offset: 2px;
}

/* ─── MOBILE RESPONSIVE ─────────────────────────────────────────────────── */
@media (max-width: 768px) {
    /* Trust bar: stack on very small screens */
    .fabricly-trust-bar .col-full,
    .jm-trust-bar .col-full,
    .below-header .col-full {
        gap: 8px;
        font-size: 11px;
        padding: 6px 12px;
    }

    .fabricly-trust-sep,
    .jm-trust-sep {
        display: none;
    }

    /* Product cards: tighter spacing on mobile */
    .woocommerce ul.products li.product {
        margin-bottom: 12px;
    }

    .woocommerce ul.products li.product .woocommerce-loop-product__title {
        font-size: 0.8rem;
        padding: 8px 10px 2px;
    }

    .woocommerce ul.products li.product .price {
        padding: 0 10px 6px;
        font-size: 0.85rem;
    }

    /* Single product: stack layout */
    .single-product .price {
        font-size: 1.3rem;
    }

    .product_title {
        font-size: 1.4rem;
    }

    /* Touch targets: minimum 48px */
    .woocommerce a.button,
    .woocommerce button.button,
    .single_add_to_cart_button {
        min-height: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* ─── MOBILE MENU — Full-width, Zalando-clean ──────────────── */

    /* Full-width drawer instead of 300px */
    .col-full-nav {
        width: 100vw !important;
        left: -100vw !important;
    }
    .mobile-toggled .col-full-nav {
        left: 0 !important;
    }
    .mobile-menu.close-drawer {
        left: auto !important;
        right: 16px !important;
        top: 16px !important;
        z-index: 200 !important;
    }

    /* Menu font and base styles */
    .shoptimizer-mobile-menu {
        font-family: var(--jm-font-body);
        padding-top: 8px;
    }

    /* Top-level items — bold, with bottom border */
    .shoptimizer-mobile-menu > ul > li > a,
    .shoptimizer-mobile-menu > ul > li > .cg-menu-link {
        font-size: 16px;
        font-weight: 600;
        color: var(--jm-text);
        padding: 14px 20px;
        min-height: 48px;
        display: flex;
        align-items: center;
        border-bottom: 1px solid #f0ece8;
    }

    /* Shoptimizer caret — smaller, muted */
    .shoptimizer-mobile-menu .caret,
    .main-navigation ul.menu li.menu-item-has-children span.caret {
        width: 36px !important;
        right: 0 !important;
    }
    .shoptimizer-mobile-menu .caret::after,
    .main-navigation ul.menu li.menu-item-has-children span.caret::after {
        width: 10px !important;
        height: 10px !important;
        background-color: #999 !important;
        opacity: 1 !important;
    }
    .shoptimizer-mobile-menu li.dropdown-open > .caret::after {
        background-color: var(--jm-pink) !important;
        opacity: 1 !important;
    }

    /* MENU text — fix iOS blue default, match brand */
    .menu-toggle .bar-text {
        color: var(--jm-text) !important;
    }

    /* Close button — prominent X in top-right of drawer */
    .mobile-menu.close-drawer {
        position: fixed !important;
        left: auto !important;
        right: 16px !important;
        top: 16px !important;
        z-index: 9999 !important;
        width: 44px !important;
        height: 44px !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        background: #f8f5f0 !important;
        border-radius: 50% !important;
        border: 1px solid #e8e4df !important;
    }
    .mobile-menu.close-drawer svg {
        width: 20px !important;
        height: 20px !important;
        stroke: #333 !important;
    }
    .mobile-toggled .mobile-menu.close-drawer {
        visibility: visible !important;
        opacity: 1 !important;
    }
    /* Overlay behind drawer — tap to close */
    .mobile-toggled .mobile-overlay {
        position: fixed !important;
        inset: 0 !important;
        background: rgba(0,0,0,0.3) !important;
        z-index: 100 !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Sub-menu items — lighter weight, indented, smaller */
    .shoptimizer-mobile-menu .sub-menu a,
    .shoptimizer-mobile-menu .sub-menu .cg-menu-link {
        font-size: 14px;
        font-weight: 400;
        color: var(--jm-text-light);
        padding: 10px 20px 10px 32px;
        min-height: 42px;
        display: flex;
        align-items: center;
        border-bottom: 1px solid #f8f5f0;
    }

    .shoptimizer-mobile-menu .sub-menu a:hover,
    .shoptimizer-mobile-menu .sub-menu .cg-menu-link:hover {
        color: var(--jm-pink);
        background: #f8f5f0;
    }

    /* Top-level menu icons — monochrome SVG, brand teal */
    .shoptimizer-mobile-menu > ul > li > a > span::before,
    .shoptimizer-mobile-menu > ul > li > .cg-menu-link > span::before {
        content: '';
        display: inline-block;
        width: 18px;
        height: 18px;
        margin-right: 10px;
        vertical-align: middle;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        opacity: 0.6;
        flex-shrink: 0;
    }
    /* Stoffe — fabric/grid icon */
    #nav-menu-item-5258 > .cg-menu-link > span::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%233FBAC2' stroke-width='1.5'%3E%3Crect x='3' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1'/%3E%3C/svg%3E");
    }
    /* Bedruckte Jersey — palette/pattern icon */
    #nav-menu-item-5267 > .cg-menu-link > span::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%233FBAC2' stroke-width='1.5'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10c.83 0 1.5-.67 1.5-1.5 0-.39-.15-.74-.39-1.01-.23-.26-.38-.61-.38-1 0-.83.67-1.5 1.5-1.5H16c3.31 0 6-2.69 6-6 0-4.96-4.49-9-10-9z'/%3E%3Ccircle cx='6.5' cy='11.5' r='1.5' fill='%233FBAC2'/%3E%3Ccircle cx='9.5' cy='7.5' r='1.5' fill='%233FBAC2'/%3E%3Ccircle cx='14.5' cy='7.5' r='1.5' fill='%233FBAC2'/%3E%3Ccircle cx='17.5' cy='11.5' r='1.5' fill='%233FBAC2'/%3E%3C/svg%3E");
    }
    /* Neuheiten — sparkle icon */
    #nav-menu-item-5274 > .cg-menu-link > span::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%233FBAC2' stroke-width='1.5'%3E%3Cpath d='M12 2l2.4 7.4H22l-6 4.6 2.3 7L12 16.4 5.7 21l2.3-7L2 9.4h7.6z'/%3E%3C/svg%3E");
    }
    /* Über uns — heart icon */
    #nav-menu-item-5275 > .cg-menu-link > span::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%233FBAC2' stroke-width='1.5'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z'/%3E%3C/svg%3E");
    }
    /* Hilfe — question circle icon */
    #nav-menu-item-5276 > .cg-menu-link > span::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%233FBAC2' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M9.09 9a3 3 0 015.83 1c0 2-3 3-3 3'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E");
    }

    /* Mobile menu bottom: teal deal box */
    .fabricly-mobile-promo {
        list-style: none !important;
        padding: 24px 20px 32px !important;
        margin: 0 !important;
    }

    .fabricly-mobile-deal {
        display: flex;
        align-items: center;
        gap: 16px;
        background: var(--jm-pink);
        border-radius: 12px;
        padding: 20px;
        text-decoration: none;
    }

    .fabricly-mobile-deal__pct {
        font-size: 32px;
        font-weight: 800;
        color: #fff;
        font-family: var(--jm-font-heading);
        line-height: 1;
        flex-shrink: 0;
    }

    .fabricly-mobile-deal__text strong {
        display: block;
        font-size: 14px;
        font-weight: 700;
        color: #fff;
        font-family: var(--jm-font-heading);
        margin-bottom: 2px;
    }

    .fabricly-mobile-deal__text span {
        font-size: 12px;
        color: rgba(255, 255, 255, 0.85);
        line-height: 1.3;
    }

    /* Product count badges — subtle, teal, brand-consistent */
    .fabricly-menu-count {
        font-size: 11px;
        font-weight: 400;
        color: var(--jm-pink);
        margin-left: 6px;
        opacity: 0.7;
    }

    /* ─── Uni-Stoffe mobile submenu styling ────────────────────────────── */
    /* The Uni-Stoffe submenu wrapper — cream background, rounded, padded */
    .shoptimizer-mobile-menu .menu-item-has-children .sub-menu li a {
        padding: 12px 16px;
        font-size: 14px;
        border-bottom: 1px solid var(--jm-border, #e8e4df);
    }
    .shoptimizer-mobile-menu .menu-item-has-children .sub-menu li:last-child a {
        border-bottom: none;
    }
    .shoptimizer-mobile-menu .menu-item-has-children .sub-menu {
        background: var(--jm-cream, #f8f5f0);
        border-radius: var(--jm-radius, 8px);
        margin: 4px 12px 8px;
        padding: 4px 0;
        overflow: hidden;
    }

    /* Sub-menu wrapper — clean, no extra padding */
    .shoptimizer-mobile-menu .sub-menu-wrapper {
        background: #fff;
    }
    .shoptimizer-mobile-menu .sub-menu-wrapper .container {
        padding: 0;
    }
    .shoptimizer-mobile-menu .sub-menu {
        padding: 0;
        margin: 0;
        list-style: none;
    }

    /* Default link styles */
    .shoptimizer-mobile-menu a {
        font-size: 15px;
        padding: 12px 20px;
        min-height: 48px;
        display: flex;
        align-items: center;
    }

    /* Form inputs: larger on mobile for easier tapping */
    .woocommerce form .form-row input.input-text,
    .woocommerce form .form-row select {
        min-height: 48px;
        font-size: 16px; /* Prevents iOS zoom on focus */
    }
}

@media (max-width: 480px) {
    .fabricly-trust-bar .col-full,
    .jm-trust-bar .col-full,
    .below-header .col-full {
        flex-direction: column;
        gap: 2px;
    }

    /* Single trust item on very small screens */
    .fabricly-trust-item:nth-child(n+3),
    .jm-trust-item:nth-child(n+3) {
        display: none;
    }
}

/* ─── MOBILE: HEADER LAYOUT FIX ────────────────────────────────────────── */
@media (max-width: 768px) {
    /* Solid background */
    .site-header,
    .site-header .col-full,
    .site-header .main-header,
    .col-full-nav {
        background: #fff !important;
    }

    /* Force header to be single row: MENU | LOGO | ICONS */
    .site-header .main-header.col-full {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        position: relative !important;
        min-height: 56px !important;
    }

    /* Hide search bar + observer on mobile */
    .site-header .site-search,
    .site-header .s-observer {
        display: none !important;
    }

    /* Branding: full width, centered logo, padded to avoid overlap */
    .site-header .site-branding {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding-left: 100px !important;
        padding-right: 100px !important;
        box-sizing: border-box !important;
    }

    /* Menu toggle inside branding — absolute left */
    .site-header .site-branding .menu-toggle {
        position: absolute !important;
        left: 12px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 2 !important;
    }

    /* Account icon — absolute right, before cart */
    .site-header .fabricly-header-account {
        position: absolute !important;
        right: 56px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 2 !important;
    }

    /* Cart — absolute far right */
    .site-header .site-header-cart {
        position: absolute !important;
        right: 12px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 2 !important;
    }

    /* Sticky state */
    .site-header.stuck,
    .site-header[style*="position: fixed"] {
        box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
        z-index: 999 !important;
    }
}

/* ─── HIDE Shoptimizer "Request a Call Back" button ────────────────────── */
.call-back-feature,
.shoptimizer-modal[data-shoptimizermodal-id="callBack"] {
    display: none !important;
}

/* ─── HIDE ALL sticky ATC bars (mobile + desktop) ──────────────────────── */
/* We use sticky header with cart icon instead */
.fabricly-sticky-atc,
.commercekit-sticky-add-to-cart,
.shoptimizer-sticky-add-to-cart,
[class*="commercekit-sticky"],
[class*="sticky-atc"] {
    display: none !important;
}

/* ─── PRODUCT CARDS: DESIGN SYSTEM v2.0 ──────────────────────────────────── */
/* White elevated surface, shadow defines edge — no border */
.woocommerce ul.products li.product {
    background: var(--jm-white);
    border: none;
}

.woocommerce ul.products li.product:hover {
    box-shadow: var(--jm-shadow-hover);
}

/* Image zoom on hover */
.woocommerce ul.products li.product img {
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.woocommerce ul.products li.product:hover img {
    transform: scale(1.04);
}

/* Fabric type + cert badges on product cards */
.woocommerce ul.products li.product .shoptimizer-category {
    color: var(--jm-pink);
    font-weight: 600;
    font-size: 0.7rem;
    letter-spacing: 0.04em;
}

/* Price formatting */
.woocommerce ul.products li.product .price {
    color: var(--jm-text);
    font-weight: 700;
}

/* ATC button on hover — brand it */
.woocommerce ul.products li.product .button {
    background: var(--jm-pink);
    color: #fff;
    border-radius: var(--jm-radius);
    font-size: 12px;
    font-weight: 600;
    padding: 8px 16px;
}

.woocommerce ul.products li.product .button:hover {
    background: var(--jm-pink-dark);
}

/* ─── FILTER SIDEBAR: POLISHED ───────────────────────────────────────────── */
/* Section headers with teal accent */
.widget-area .widget-title {
    border-bottom-color: var(--jm-pink);
    position: relative;
    padding-bottom: 10px;
}

/* Color swatches: larger, more visible */
.fabricly-filter-swatch {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    border: 2px solid #e8e4df !important;
    transition: all 0.15s ease !important;
}

.fabricly-filter-swatch:hover,
.fabricly-filter-swatch.active {
    border-color: var(--jm-pink) !important;
    box-shadow: 0 0 0 3px var(--jm-pink-light) !important;
    transform: scale(1.1);
}

/* Active filter count badge */
.fabricly-filter-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--jm-pink);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    margin-left: 6px;
}

/* ─── HEADER: BRANDED ────────────────────────────────────────────────────── */
/* Logo sizing */
.site-branding img,
.custom-logo {
    max-height: 40px;
    width: auto;
}

/* Search bar focus — see main search block */

/* Cart icon color — teal */
.shoptimizer-cart-icon {
    color: var(--jm-pink);
}

/* Header row padding — desktop only, mobile keeps compact */
@media (min-width: 769px) {
    .site-header .col-full,
    .site-header .header-inner {
        padding-top: 12px;
        padding-bottom: 12px;
    }
}

/* Cart total amount — was white/invisible on light background */
.site-header .cart-contents .amount,
.site-header .cart-contents,
.shoptimizer-cart .amount,
.cart-contents .woocommerce-Price-amount {
    color: var(--jm-text);
    font-weight: 600;
}

/* CommerceKit wishlist heart */
.commercekit-wishlist {
    color: var(--jm-yellow);
}

.commercekit-wishlist:hover,
.commercekit-wishlist.active {
    color: var(--jm-yellow-dark);
}

/* ─── STICKY ATC BAR (CommerceKit) — brand it ──────────────────────────── */
.commercekit-sticky-add-to-cart,
.commercekit-sticky-atc,
[class*="commercekit-sticky"] {
    background: #fff !important;
    border-top: 1px solid var(--jm-border) !important;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.06) !important;
}

.commercekit-sticky-add-to-cart .single_add_to_cart_button,
.commercekit-sticky-add-to-cart .button,
[class*="commercekit-sticky"] .single_add_to_cart_button,
[class*="commercekit-sticky"] .button {
    background: var(--jm-pink) !important;
    color: #fff !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    font-size: 14px !important;
}

/* Sticky bar title text */
.commercekit-sticky-add-to-cart *,
[class*="commercekit-sticky"] * {
    color: var(--jm-text);
}

/* ─── ADD TO CART NOTIFICATION BANNER ──────────────────────────────────── */
.woocommerce-message {
    background: var(--jm-cream) !important;
    border-top: 3px solid var(--jm-pink) !important;
    color: var(--jm-text) !important;
    font-family: var(--jm-font-body) !important;
    font-size: 14px !important;
    padding: 14px 20px !important;
    border-radius: 0 0 var(--jm-radius) var(--jm-radius) !important;
}

.woocommerce-message::before {
    color: var(--jm-pink) !important;
}

.woocommerce-message a.button {
    background: var(--jm-pink) !important;
    color: #fff !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 8px 16px !important;
}

.woocommerce-message a.button:hover {
    background: var(--jm-pink-dark) !important;
}

.woocommerce-message a.button.checkout {
    background: var(--jm-yellow) !important;
}

.woocommerce-message a.button.checkout:hover {
    background: var(--jm-yellow-dark) !important;
}

/* Content padding from header — more breathing room */
/* Only on product and shop pages, not the breadcrumb itself */
.single-product .product-details-wrapper {
    padding-top: 16px;
    max-width: 1400px;
}

.woocommerce.archive .shoptimizer-archive {
    padding-top: 10px;
}

/* Sticky header — solid white background, no transparency */
.site-header.stuck,
.site-header.is-sticky,
.col-full-nav.stuck,
body.sticky-d .site-header,
body.sticky-d .col-full-nav {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* Ensure nav bar is also opaque when sticky */
.main-navigation.stuck,
.primary-navigation.stuck {
    background: #ffffff;
}

/* Announcement bar */
.below-header {
    background: var(--jm-pink);
    font-weight: 500;
    letter-spacing: 0.02em;
}

/* ─── FOOTER: WARM + PERSONAL ────────────────────────────────────────────── */
.site-footer {
    background: #1e1e1e;
}

.site-footer .widget-title {
    color: #fff;
    font-size: 13px;
    letter-spacing: 0.06em;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--jm-pink);
}

.site-footer,
.site-footer .widget,
.site-footer .widget a,
.site-footer a {
    color: #ccc;
    transition: color 0.15s ease;
}

.site-footer a:hover {
    color: var(--jm-pink) !important;
}

.site-footer .copyright {
    color: #888;
    font-size: 12px;
    padding-top: 20px;
    border-top-color: rgba(255,255,255,0.08);
}

/* ─── FOOTER: PAYMENT ICONS + CERTIFICATIONS ───────────────────────────── */
.fabricly-footer-trust {
    background: #1e1e1e;
    border-top: 1px solid rgba(255,255,255,0.08);
    padding: 24px 0;
}

.fabricly-footer-trust .col-full {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 24px;
}

.fabricly-footer-certs {
    display: flex;
    align-items: center;
    gap: 20px;
}

.fabricly-cert {
    display: flex;
    align-items: center;
    gap: 6px;
    opacity: 0.85;
    transition: opacity 0.15s;
}

.fabricly-cert:hover {
    opacity: 1;
}

/* OEKO-TEX SVG is black — invert to white for dark footer */
.fabricly-cert img.fabricly-cert-oeko {
    height: 44px;
    width: auto;
    filter: brightness(0) invert(1);
    opacity: 0.8;
}

/* GOTS PNG has green+black — DON'T invert, just show at full color */
.fabricly-cert img.fabricly-cert-gots {
    height: 44px;
    width: auto;
    opacity: 0.9;
}

.fabricly-cert--text {
    color: #999;
    font-family: var(--jm-font-body);
    font-size: 12px;
    font-weight: 500;
}

.fabricly-cert--text svg {
    color: var(--jm-pink);
    opacity: 0.8;
}

/* Social icons */
.fabricly-footer-social {
    display: flex;
    align-items: center;
    gap: 16px;
}

.fabricly-social-icon {
    color: #999;
    transition: color 0.15s ease, transform 0.15s ease;
    display: flex;
}

.fabricly-social-icon:hover {
    color: var(--jm-pink);
    transform: translateY(-2px);
}

.fabricly-footer-payments {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.fabricly-payment {
    opacity: 0.75;
    transition: opacity 0.15s;
}

.fabricly-payment:hover {
    opacity: 1;
}

.fabricly-payment svg {
    display: block;
    border-radius: 4px;
}

@media (max-width: 768px) {
    .fabricly-footer-trust .col-full {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .fabricly-footer-certs,
    .fabricly-footer-payments {
        justify-content: center;
    }
}

/* ─── CATEGORY PAGE HEADER ───────────────────────────────────────────────── */
.term-description {
    background: var(--jm-white);
    padding: 20px 24px;
    border-radius: var(--jm-radius);
    margin-bottom: 24px;
    border-left: 3px solid var(--jm-pink);
    font-size: 14px;
    line-height: 1.7;
    color: var(--jm-text-light);
}

/* ─── SHOP LOOP: TRUST ELEMENTS ────────────────────────────────────────── */
/* "Exklusiv" badge — top-left, premium gold ribbon style */
/* NEU badge is top-right, so Exklusiv goes top-left to not block Fabricly watermark */
.fabricly-loop-exclusive {
    position: absolute;
    top: 8px;
    left: 8px;
    background: linear-gradient(135deg, #c9a84c, #e8c96d);
    color: #2d2300;
    font-family: var(--jm-font-body);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 3px 8px 3px 6px;
    border-radius: 3px;
    z-index: 2;
    pointer-events: none;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.fabricly-loop-exclusive::before {
    content: "★ ";
    font-size: 8px;
}

/* Specs row — compact single line, aligned with card text */
.fabricly-loop-specs,
.woocommerce ul.products li.product .fabricly-loop-specs {
    display: flex;
    gap: 4px;
    flex-wrap: nowrap;
    padding: 0;
    margin-top: 2px;
    justify-content: flex-start;
    text-align: left;
    align-items: center;
    overflow: hidden;
}

.fabricly-loop-spec {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-family: var(--jm-font-body);
    font-size: 9px;
    font-weight: 500;
    color: var(--jm-text-light);
    background: var(--jm-cream);
    padding: 2px 5px;
    border-radius: 3px;
    white-space: nowrap;
    flex-shrink: 0;
}

.fabricly-loop-spec--cert {
    color: #3a8f40;
    background: #edf7ee;
}

.fabricly-loop-spec svg {
    flex-shrink: 0;
}

/* Stock status as inline spec pill */
.fabricly-loop-spec--stock {
    color: #4caf50;
    background: #edf7ee;
}

.fabricly-loop-spec--oos {
    color: var(--jm-yellow);
    background: #fef0ef;
}

.fabricly-stock-dot,
.fh-stock-dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #4caf50;
    margin-right: 1px;
}

/* On smaller shop cards, abbreviate "Auf Lager" to just dot */
@media (max-width: 1400px) {
    .woocommerce ul.products .fabricly-loop-spec--stock {
        font-size: 0;
        padding: 4px 6px;
        gap: 0;
    }
    .woocommerce ul.products .fabricly-loop-spec--stock .fabricly-stock-dot {
        margin: 0;
    }
}

/* Stock status */
.fabricly-loop-stock {
    display: flex;
    align-items: center;
    gap: 3px;
    padding: 0 14px;
    margin-top: 4px;
    margin-bottom: 2px;
    font-family: var(--jm-font-body);
    font-size: 10px;
    font-weight: 500;
}

.fabricly-loop-stock--in {
    color: #4caf50;
}

.fabricly-loop-stock--out {
    color: var(--jm-yellow);
}

/* Ensure product image container is positioned for badges */
.woocommerce ul.products li.product .shoptimizer-loop-image-wrapper,
.woocommerce ul.products li.product .attachment-woocommerce_thumbnail {
    position: relative;
}

.woocommerce ul.products li.product .shoptimizer-loop-image-wrapper {
    position: relative;
}

/* ─── SHOP PAGE: SIDEBAR LAYOUT ────────────────────────────────────────── */
/* Layout handled by fabricly-filters.css flex on .fabricly-shop-layout */
/* Hide the empty secondary-wrapper (placeholder widget, not needed) */
.left-woocommerce-sidebar .col-full > .secondary-wrapper {
    display: none;
}

/* ─── CATEGORY PAGE: HERO BANNER ────────────────────────────────────────── */
.fabricly-cat-hero {
    display: flex;
    align-items: center;
    gap: 24px;
    background: linear-gradient(135deg, #f8f5f0 0%, #fff 100%);
    border: 1px solid #e8e0d8;
    border-radius: var(--jm-radius);
    padding: 24px 28px;
    margin-bottom: 24px;
    grid-column: 1 / -1; /* Span full width in grid layout */
}

.fabricly-cat-hero__image {
    flex-shrink: 0;
    width: 140px;
    height: 140px;
    border-radius: 10px;
    overflow: hidden;
}

.fabricly-cat-hero__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fabricly-cat-hero__content {
    flex: 1;
}

.fabricly-cat-hero__title {
    font-family: var(--jm-heading);
    font-size: 1.6em;
    font-weight: 800;
    color: var(--jm-dark);
    margin: 0 0 6px;
}

.fabricly-cat-hero__desc {
    color: #555;
    font-size: 0.92em;
    line-height: 1.5;
    margin-bottom: 8px;
}

.fabricly-cat-hero__desc p {
    margin: 0;
}

@media (max-width: 768px) {
    .fabricly-cat-hero {
        flex-direction: column;
        text-align: center;
        padding: 16px;
        gap: 12px;
    }
    .fabricly-cat-hero__image {
        width: 100px;
        height: 100px;
        margin: 0 auto;
    }
    .fabricly-cat-hero__title {
        font-size: 1.2em;
    }
}

.fabricly-cat-hero__count {
    display: inline-block;
    background: var(--jm-pink);
    color: #fff;
    font-size: 0.78em;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 20px;
}

@media (max-width: 768px) {
    .fabricly-cat-hero {
        flex-direction: column;
        text-align: center;
        padding: 20px 16px;
    }

    .fabricly-cat-hero__image {
        width: 100px;
        height: 100px;
    }

    .fabricly-cat-hero__title {
        font-size: 1.3em;
    }
}

/* ─── CATEGORY SEO TEXT (below products) ────────────────────────────────── */
.fabricly-cat-seo {
    max-width: 900px;
    margin: 40px auto 20px;
    padding: 32px 28px;
    background: #fdfaf6;
    border: 1px solid #f0ece8;
    border-radius: var(--jm-radius);
    color: #444;
    font-size: 0.92em;
    line-height: 1.7;
    clear: both;
    width: 100%;
    float: none;
}

.fabricly-cat-seo h2 {
    font-family: var(--jm-heading);
    font-size: 1.15em;
    font-weight: 700;
    color: var(--jm-dark);
    margin: 24px 0 10px;
}

.fabricly-cat-seo h2:first-child {
    margin-top: 0;
}

.fabricly-cat-seo p {
    margin: 0 0 12px;
}

.fabricly-cat-seo ul {
    margin: 0 0 12px;
    padding-left: 20px;
}

.fabricly-cat-seo li {
    margin-bottom: 4px;
}

.fabricly-cat-seo a {
    color: var(--jm-pink);
    text-decoration: underline;
}

.fabricly-cat-seo .fabricly-faq-item {
    margin-bottom: 16px;
}

.fabricly-cat-seo .fabricly-faq-item strong {
    display: block;
    color: var(--jm-dark);
    margin-bottom: 4px;
}

@media (max-width: 768px) {
    .fabricly-cat-seo {
        padding: 20px 16px;
        margin: 24px auto 16px;
    }
}

/* ─── SHOP PAGE: PRODUCT CARD — MATCH HOMEPAGE STYLE ───────────────────── */
.woocommerce ul.products li.product {
    background: #fdfaf6;
    border: 1px solid #f0ece8;
    border-radius: var(--jm-radius);
    overflow: hidden;
    padding-bottom: 0;
    transition: all 0.25s ease;
}

.woocommerce ul.products li.product:hover {
    border-color: var(--jm-pink);
    box-shadow: 0 6px 20px rgba(226,114,151,0.12);
    transform: translateY(-2px);
}

/* Card content wrapper — flex column, FORCE left-aligned, equal heights */
.woocommerce ul.products li.product .woocommerce-card__header,
.woocommerce ul.products li.product .shoptimizer-loop-product-content-header {
    padding: 12px 14px 14px;
    flex: 1;
    display: flex;
    flex-direction: column;
    text-align: left !important;
    align-items: flex-start !important;
}

/* Force ALL children left-aligned too */
.woocommerce ul.products li.product .woocommerce-card__header *,
.woocommerce ul.products li.product .shoptimizer-loop-product-content-header * {
    text-align: left !important;
}

/* Category text — show only first category, single line, teal eyebrow style */
.woocommerce ul.products li.product .product__categories,
.woocommerce ul.products li.product .shoptimizer-category {
    font-family: var(--jm-font-body);
    font-size: 11px;
    font-weight: 600;
    color: var(--jm-pink);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0 0 4px;
    padding: 0;
    /* Clip to single line — hides 2nd, 3rd category after comma */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 1.4em;
    line-height: 1.4;
    display: block;
}

.woocommerce ul.products li.product .product__categories a {
    color: var(--jm-pink);
    text-decoration: none;
}

/* Title — matching homepage */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: var(--jm-font-heading);
    font-size: 14px;
    font-weight: 600;
    color: var(--jm-text);
    line-height: 1.3;
    margin: 0 0 6px;
    padding: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title a {
    color: var(--jm-text);
    text-decoration: none;
}

/* Price — "ab" prefix style like homepage */
.woocommerce ul.products li.product .fabricly-grundpreis-loop {
    font-family: var(--jm-font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--jm-text);
    margin: 0 0 6px;
    display: block;
}

.woocommerce ul.products li.product .fabricly-grundpreis-loop::before {
    content: "ab ";
    font-weight: 400;
}

/* Stock/specs inherit card header padding — no extra padding needed */

/* Wishlist — position at bottom-right of stock row */
.woocommerce ul.products li.product .commercekit-wishlist {
    position: absolute;
    bottom: 14px;
    right: 14px;
    z-index: 3;
}

.woocommerce ul.products li.product .commercekit-wishlist .cg-wishlist {
    color: #ccc;
    font-size: 18px;
}

.woocommerce ul.products li.product .commercekit-wishlist:hover .cg-wishlist,
.woocommerce ul.products li.product .commercekit-wishlist.active .cg-wishlist {
    color: var(--jm-yellow);
}

/* Ensure card is positioned for absolute wishlist */
.woocommerce ul.products li.product {
    position: relative;
}

/* Hide default ATC button on loop (length stepper is on PDP) */
.woocommerce ul.products li.product .add_to_cart_button {
    display: none;
}

/* Image: zoom on hover */
.woocommerce ul.products li.product .woocommerce-image__wrapper img {
    transition: transform 0.4s ease;
}

.woocommerce ul.products li.product:hover .woocommerce-image__wrapper img {
    transform: scale(1.04);
}

/* Product grid: CSS grid for equal heights + proper gaps */
@media (min-width: 993px) {
    .woocommerce ul.products.columns-4 {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }

    .woocommerce ul.products.columns-4 li.product {
        width: 100%;
        margin: 0;
        float: none;
    }

    /* When sidebar present, use 3 columns */
    .left-woocommerce-sidebar .woocommerce ul.products.columns-4 {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 769px) and (max-width: 992px) {
    .woocommerce ul.products.columns-4 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
    }

    .woocommerce ul.products.columns-4 li.product {
        width: 100%;
        margin: 0;
        float: none;
    }
}

/* Equal height cards in shop grid */
.woocommerce ul.products li.product {
    display: flex;
    flex-direction: column;
}

.woocommerce ul.products li.product .shoptimizer-loop-product-content-header {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* ─── SHOP PAGE: OVERALL POLISH ────────────────────────────────────────── */
/* Results count styling */
.woocommerce-result-count {
    font-family: var(--jm-font-body);
    font-size: 13px;
    color: var(--jm-text-light);
}

/* Pagination styling */
.woocommerce nav.woocommerce-pagination {
    margin-top: 32px;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    min-width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--jm-font-body);
    font-size: 14px;
}

/* Sort dropdown polish */
.woocommerce-ordering {
    margin-bottom: 16px;
}

/* ─── SORT BAR ───────────────────────────────────────────────────────────── */
.woocommerce-ordering select {
    border: 1px solid var(--jm-border);
    border-radius: var(--jm-radius-sm);
    padding: 8px 12px;
    font-family: var(--jm-font-body);
    font-size: 13px;
    color: var(--jm-text);
    background: var(--jm-white);
}

.woocommerce-ordering select:focus {
    border-color: var(--jm-pink);
    outline: none;
}

/* ─── MINI CART SIDEBAR ──────────────────────────────────────────────────── */
.shoptimizer-mini-cart-wrap .widget_shopping_cart_content {
    font-family: var(--jm-font-body);
}

.shoptimizer-mini-cart-wrap .woocommerce-mini-cart__buttons a {
    border-radius: var(--jm-radius);
}

/* ─── NEW BADGE STYLING ──────────────────────────────────────────────────── */
.commercekit-badge,
.shoptimizer-badge {
    font-family: var(--jm-font-body) !important;
    font-weight: 700 !important;
    font-size: 11px !important;
    letter-spacing: 0.02em;
}

/* ─── PRODUCT PAGE: GALLERY RADIUS ───────────────────────────────────────── */
.single-product .woocommerce-product-gallery__image img {
    border-radius: 6px;
}

/* ─── PRINT STYLES ──────────────────────────────────────────────────────── */
@media print {
    .below-header,
    .fabricly-trust-bar,
    .jm-trust-bar,
    .site-header,
    .site-footer,
    .main-navigation {
        display: none;
    }
}

/* ─── SHOPTIMIZER OVERRIDES (specificity fixes) ─────────────────────────── */
/* Ensure our fonts override Kirki-injected inline styles */
body.flavor-flavor,
body.flavor-flavor h1,
body.flavor-flavor h2,
body.flavor-flavor h3,
body.flavor-flavor h4,
body.flavor-flavor p,
body:not(.wp-admin) {
    font-family: var(--jm-font-body);
}

body:not(.wp-admin) h1,
body:not(.wp-admin) h2,
body:not(.wp-admin) h3,
body:not(.wp-admin) h4,
body:not(.wp-admin) h5,
body:not(.wp-admin) h6 {
    font-family: var(--jm-font-heading);
}

/* ==========================================================================
   HOMEPAGE — front-page.php
   11 Conversion Blocks based on 28-site competitive analysis
   ========================================================================== */

/* ─── HOMEPAGE LAYOUT ──────────────────────────────────────────────────── */
.fabricly-homepage {
    background: var(--jm-white);
}

.fh-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
}

.fh-section-title {
    font-family: var(--jm-font-heading);
    font-size: 34px;
    font-weight: 800;
    color: var(--jm-text);
    text-align: center;
    margin: 0 0 32px;
    letter-spacing: -0.5px;
    line-height: 1.15;
}

.fh-section-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 24px;
}

.fh-section-header .fh-section-title {
    text-align: left;
    margin-bottom: 0;
}

.fh-section-link {
    font-family: var(--jm-font-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--jm-pink);
    text-decoration: none;
    transition: color var(--jm-transition);
    white-space: nowrap;
}

.fh-section-link:hover {
    color: var(--jm-pink-dark);
}

/* ─── BLOCK 3: HERO ────────────────────────────────────────────────────── */
.fh-hero {
    position: relative;
    width: 100%;
    height: 540px;
    overflow: hidden;
    background: var(--jm-cream);
}

.fh-hero__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center right;
}

.fh-hero__image--placeholder {
    background: linear-gradient(135deg, var(--jm-cream) 0%, #e8ddd4 50%, var(--jm-pink-light) 100%);
}

.fh-hero__overlay {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 50%;
    display: flex;
    align-items: center;
    background: linear-gradient(to right, rgba(248,245,240,0.92) 60%, rgba(248,245,240,0) 100%);
}

.fh-hero__content {
    padding: 40px 40px 40px 60px;
    max-width: 520px;
}

.fh-hero__heading {
    font-family: var(--jm-font-heading);
    font-size: 44px;
    font-weight: 900;
    color: var(--jm-text);
    line-height: 1.12;
    letter-spacing: -0.8px;
    margin: 0 0 16px;
}

.fh-hero__subtext {
    font-family: var(--jm-font-body);
    font-size: 16px;
    color: #555;
    line-height: 1.6;
    margin: 0 0 28px;
}

.fh-hero__cta {
    display: inline-block;
    background: var(--jm-yellow);
    color: #fff;
    font-family: var(--jm-font-heading);
    font-size: 18px;
    font-weight: 800;
    padding: 18px 36px;
    border-radius: var(--jm-radius);
    text-decoration: none;
    transition: all var(--jm-transition);
    box-shadow: var(--jm-shadow-cta);
}

.fh-hero__cta:hover {
    background: var(--jm-yellow-dark);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: var(--jm-shadow-cta);
}

/* ─── BLOCK 4: CATEGORY CARDS ──────────────────────────────────────────── */
.fh-categories {
    padding: 96px 0 64px;
    background: var(--jm-white);
}

.fh-categories__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.fh-categories__card {
    position: relative;
    display: block;
    border-radius: var(--jm-radius-lg);
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: var(--jm-cream);
    text-decoration: none;
    box-shadow: var(--jm-shadow);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.fh-categories__card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.fh-categories__card:hover {
    transform: translateY(-4px);
    box-shadow: var(--jm-shadow-hover);
}

.fh-categories__card:hover img {
    transform: scale(1.06);
}

.fh-categories__card-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.1) 50%, rgba(0,0,0,0) 70%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 20px;
    transition: background 0.3s ease;
}

.fh-categories__card:hover .fh-categories__card-overlay {
    background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.15) 55%, rgba(0,0,0,0) 75%);
}

.fh-categories__card-name {
    font-family: var(--jm-font-heading);
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    transition: transform 0.3s ease;
}

.fh-categories__card:hover .fh-categories__card-name {
    transform: translateY(-2px);
}

.fh-categories__card-desc {
    font-family: var(--jm-font-body);
    font-size: 13px;
    color: rgba(255,255,255,0.85);
    margin-top: 4px;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.fh-categories__card:hover .fh-categories__card-desc {
    opacity: 1;
    transform: translateY(0);
}

/* "Entdecken →" arrow that appears on hover */
.fh-categories__card-overlay::after {
    content: 'Entdecken \2192';
    font-family: var(--jm-font-body);
    font-size: 12px;
    font-weight: 600;
    color: #fff;
    opacity: 0;
    transform: translateX(-8px);
    transition: opacity 0.3s ease 0.05s, transform 0.3s ease 0.05s;
    margin-top: 8px;
}

.fh-categories__card:hover .fh-categories__card-overlay::after {
    opacity: 0.9;
    transform: translateX(0);
}

/* Neuheiten highlight card — same style as others now that it has an image */
.fh-categories__card--highlight {
    background: var(--jm-cream);
}

/* ─── BLOCK 5: NEW ARRIVALS CAROUSEL ───────────────────────────────────── */
.fh-new-arrivals {
    padding: 64px 0 96px;
}

/* Product cards — shared between carousel and grid */
.fh-product-card {
    display: block;
    background: var(--jm-white);
    border: none;
    border-radius: var(--jm-radius-lg);
    overflow: hidden;
    text-decoration: none;
    box-shadow: var(--jm-shadow);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.fh-product-card:hover {
    box-shadow: var(--jm-shadow-hover);
    transform: translateY(-4px);
}

.fh-product-card__image {
    position: relative;
    aspect-ratio: 1;
    overflow: hidden;
    background: var(--jm-cream);
}

.fh-product-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.fh-product-card:hover .fh-product-card__image img {
    transform: scale(1.05);
}

.fh-product-card__badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: var(--jm-pink);
    color: #fff;
    font-family: var(--jm-font-body);
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 4px;
    letter-spacing: 0.03em;
    z-index: 2;
}

/* Equal height cards — flex column so info pushes to bottom */
.fh-product-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.fh-product-card__info {
    padding: 12px 14px 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.fh-product-card__type {
    display: block;
    font-family: var(--jm-font-body);
    font-size: 11px;
    font-weight: 600;
    color: var(--jm-pink);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 4px;
}

.fh-product-card__name {
    font-family: var(--jm-font-heading);
    font-size: 14px;
    font-weight: 600;
    color: var(--jm-text);
    line-height: 1.3;
    margin: 0 0 6px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Specs row: weight + certification — FORCE left aligned */
.fh-product-card__specs {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 6px;
    justify-content: flex-start;
    text-align: left;
    align-items: center;
}

.fh-product-card__spec {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-family: var(--jm-font-body);
    font-size: 10px;
    font-weight: 500;
    color: var(--jm-text-light);
    background: var(--jm-cream);
    padding: 2px 7px;
    border-radius: 4px;
}

.fh-product-card__spec--cert {
    color: #3a8f40;
    background: #edf7ee;
}

.fh-product-card__spec svg {
    flex-shrink: 0;
}

/* Stock as inline spec pill on homepage cards */
.fh-product-card__spec--stock {
    color: #4caf50;
    background: #edf7ee;
}

/* Exclusive badge — top-left, premium gold ribbon (matching shop page) */
.fh-product-card__badge--exclusive {
    top: 10px;
    bottom: auto;
    left: 10px;
    right: auto;
    background: linear-gradient(135deg, #c9a84c, #e8c96d);
    color: #2d2300;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 3px 8px 3px 6px;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.fh-product-card__badge--exclusive::before {
    content: "★ ";
    font-size: 8px;
}

.fh-product-card__price {
    font-family: var(--jm-font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--jm-text);
    margin-top: auto; /* push price to bottom for equal alignment */
}

/* Stock status + wishlist row */
.fh-product-card__meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--jm-border);
}

.fh-product-card__stock {
    font-family: var(--jm-font-body);
    font-size: 11px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 4px;
}

.fh-product-card__stock--instock {
    color: #4caf50;
}

.fh-product-card__stock--outofstock {
    color: var(--jm-yellow);
}

.fh-product-card__wishlist {
    cursor: pointer;
    color: #ccc;
    transition: color 0.15s ease;
    line-height: 1;
}

.fh-product-card__wishlist:hover,
.fh-product-card__wishlist.active {
    color: var(--jm-yellow);
}

/* Swiper carousel overrides */
.fh-carousel .swiper-slide {
    width: 22%;
    flex-shrink: 0;
}

.fh-carousel__nav {
    color: var(--jm-pink);
    width: 36px;
    height: 36px;
    background: var(--jm-cream);
    border-radius: 50%;
    box-shadow: var(--jm-shadow);
}

.fh-carousel__nav::after {
    font-size: 14px;
    font-weight: 700;
}

.fh-carousel__dots .swiper-pagination-bullet {
    background: var(--jm-pink);
    opacity: 0.3;
}

.fh-carousel__dots .swiper-pagination-bullet-active {
    opacity: 1;
}

/* CSS scroll-snap fallback (when Swiper not loaded) */
.fh-carousel:not(.swiper-initialized) .swiper-wrapper {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 4px;
}

.fh-carousel:not(.swiper-initialized) .swiper-wrapper::-webkit-scrollbar {
    display: none;
}

.fh-carousel:not(.swiper-initialized) .swiper-slide {
    flex: 0 0 calc(25% - 12px);
    scroll-snap-align: start;
}

.fh-carousel:not(.swiper-initialized) .fh-carousel__nav,
.fh-carousel:not(.swiper-initialized) .fh-carousel__dots {
    display: none;
}

/* ─── BLOCK 6: ORIGIN STORY ────────────────────────────────────────────── */
.fh-story {
    padding: 96px 0;
    background: var(--jm-white);
}

.fh-story__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
}

.fh-story__image-wrap {
    border-radius: var(--jm-radius);
    overflow: hidden;
}

.fh-story__image {
    width: 100%;
    height: auto;
    display: block;
    border-radius: var(--jm-radius);
}

.fh-story__image--placeholder {
    aspect-ratio: 4 / 3;
    background: linear-gradient(135deg, #e8ddd4, var(--jm-pink-light));
    display: flex;
    align-items: center;
    justify-content: center;
}

.fh-story__heading {
    font-family: var(--jm-font-heading);
    font-size: 28px;
    font-weight: 700;
    color: var(--jm-text);
    line-height: 1.25;
    margin: 0 0 16px;
}

.fh-story__text {
    font-family: var(--jm-font-body);
    font-size: 15px;
    color: #555;
    line-height: 1.7;
    margin: 0 0 28px;
}

.fh-story__usps {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.fh-story__usp {
    display: flex;
    align-items: center;
    gap: 14px;
    color: var(--jm-pink);
}

.fh-story__usp svg {
    flex-shrink: 0;
}

.fh-story__usp span {
    font-family: var(--jm-font-body);
    font-size: 14px;
    font-weight: 600;
    color: var(--jm-text);
}

/* ─── BLOCK 7: BESTSELLERS GRID ────────────────────────────────────────── */
.fh-bestsellers {
    padding: 96px 0;
}

.fh-bestsellers__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.fh-bestsellers__cta-wrap {
    text-align: center;
    margin-top: 32px;
}

.fh-btn {
    display: inline-block;
    font-family: var(--jm-font-body);
    font-size: 14px;
    font-weight: 600;
    padding: 12px 28px;
    border-radius: var(--jm-radius);
    text-decoration: none;
    transition: all var(--jm-transition);
    cursor: pointer;
}

.fh-btn--outline {
    color: var(--jm-pink);
    border: 2px solid var(--jm-pink);
    background: transparent;
}

.fh-btn--outline:hover {
    background: var(--jm-pink);
    color: #fff;
}

/* ─── BLOCK 8: RECOMMENDATIONS ─────────────────────────────────────────── */
.fh-recommendations {
    padding: 96px 0;
    background: var(--jm-white);
}

.fh-recommendations__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

@media (max-width: 768px) {
    .fh-recommendations__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .fh-recommendations {
        padding: 40px 0;
    }
}

/* ─── BLOCK 9: INSPIRATION ─────────────────────────────────────────────── */
.fh-inspiration {
    padding: 96px 0;
    background: var(--jm-cream);
}

.fh-inspiration__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.fh-inspiration__card {
    display: block;
    background: var(--jm-white);
    border-radius: var(--jm-radius);
    overflow: hidden;
    text-decoration: none;
    transition: all 0.25s ease;
    box-shadow: var(--jm-shadow);
}

.fh-inspiration__card:hover {
    transform: translateY(-3px);
    box-shadow: var(--jm-shadow-hover);
}

.fh-inspiration__card-image {
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.fh-inspiration__card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.fh-inspiration__card:hover .fh-inspiration__card-image img {
    transform: scale(1.05);
}

.fh-inspiration__card-content {
    padding: 16px 20px 20px;
}

.fh-inspiration__card-tag {
    display: inline-block;
    font-family: var(--jm-font-body);
    font-size: 11px;
    font-weight: 600;
    color: var(--jm-pink);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 8px;
}

.fh-inspiration__card-title {
    font-family: var(--jm-font-heading);
    font-size: 18px;
    font-weight: 700;
    color: var(--jm-text);
    line-height: 1.3;
    margin: 0 0 8px;
}

.fh-inspiration__card-excerpt {
    font-family: var(--jm-font-body);
    font-size: 13px;
    color: #555;
    line-height: 1.5;
    margin: 0 0 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.fh-inspiration__card-link {
    font-family: var(--jm-font-body);
    font-size: 13px;
    font-weight: 600;
    color: var(--jm-yellow);
}

/* Static inspiration cards (no blog posts yet) */
.fh-inspiration__card--static {
    background: var(--jm-white);
    border: 1px dashed var(--jm-border);
}

.fh-inspiration__card--static .fh-inspiration__card-content {
    padding: 28px 20px;
}

/* ─── BLOCK 10: TRUST ROW (FOOTER BRIDGE) ─────────────────────────────── */
/* Trust bar — cream, bridges newsletter into footer */
.fh-trust {
    padding: 64px 20px;
    background: var(--jm-cream);
    border-top: 1px solid var(--jm-border);
    margin-bottom: 0;
}

/* Remove any gap between trust row and footer */
.fabricly-homepage {
    margin-bottom: 0;
    padding-bottom: 0;
}

/* Remove gap between main content and footer */
#content,
.site-content,
.woocommerce-page #content,
.woocommerce-page .site-content {
    padding-bottom: 0;
    margin-bottom: 0;
}

/* Remove bottom margin on shop archive */
.woocommerce.archive .site-main,
.woocommerce.archive .content-area {
    padding-bottom: 0;
    margin-bottom: 0;
}

.fh-trust__grid {
    display: flex;
    justify-content: center;
    gap: 48px;
    flex-wrap: wrap;
    max-width: 1400px;
    margin: 0 auto;
}

.fh-trust__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
    color: var(--jm-pink);
    min-width: 120px;
}

.fh-trust__item svg {
    opacity: 0.8;
    color: var(--jm-pink);
}

.fh-trust__label {
    font-family: var(--jm-font-body);
    font-size: 13px;
    font-weight: 600;
    color: var(--jm-text-light);
    line-height: 1.4;
}

/* ─── BLOCK 9+10: FULL-WIDTH BREAKOUT ──────────────────────────────────── */
/* Newsletter + Trust row must go edge-to-edge like Selfmade's bottom flow.
   Uses viewport-width trick to break out of any parent container. */
.fh-newsletter,
.fh-trust {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

/* ─── BLOCK 9: NEWSLETTER ──────────────────────────────────────────────── */
.fh-newsletter {
    padding: 96px 20px;
    background: var(--jm-pink);
}

.fh-newsletter__inner {
    max-width: 560px;
    margin: 0 auto;
    text-align: center;
}

.fh-newsletter__heading {
    font-family: var(--jm-font-heading);
    font-size: 28px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 12px;
}

.fh-newsletter__text {
    font-family: var(--jm-font-body);
    font-size: 15px;
    color: rgba(255,255,255,0.9);
    margin: 0 0 24px;
    line-height: 1.5;
}

.fh-newsletter__field {
    display: flex;
    gap: 0;
    max-width: 460px;
    margin: 0 auto;
    background: #fff;
    border-radius: 50px;
    padding: 5px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}

.fh-newsletter__input {
    flex: 1;
    padding: 14px 20px;
    border: none !important;
    border-radius: 50px;
    font-family: var(--jm-font-body);
    font-size: 15px;
    outline: none;
    background: transparent;
    color: var(--jm-text);
    box-shadow: none !important;
}

.fh-newsletter__input::placeholder {
    color: #999;
}

.fh-newsletter__input:focus,
.fh-newsletter__input:active,
.fh-newsletter__input:focus-visible {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    background: transparent;
}

.fh-newsletter__btn {
    padding: 14px 32px;
    background: var(--jm-yellow);
    color: #fff;
    border: none;
    border-radius: 50px;
    font-family: 'Nunito', sans-serif;
    font-size: 15px;
    font-weight: 800;
    cursor: pointer;
    transition: all var(--jm-transition);
    white-space: nowrap;
    box-shadow: var(--jm-shadow-cta);
}

.fh-newsletter__btn:hover {
    background: var(--jm-yellow-dark);
    transform: scale(1.02);
}

.fh-newsletter__privacy {
    font-size: 11px;
    color: rgba(255,255,255,0.65);
    margin-top: 12px;
}

.fh-newsletter__privacy a {
    color: rgba(255,255,255,0.85);
    text-decoration: underline;
}

/* ─── HOMEPAGE MOBILE ──────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .fh-hero {
        height: 460px;
    }

    .fh-hero__overlay {
        width: 55%;
    }

    .fh-hero__heading {
        font-size: 34px;
    }

    .fh-hero__content {
        padding: 30px 30px 30px 40px;
    }

    .fh-categories__grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .fh-bestsellers__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .fh-hero {
        height: auto;
        min-height: 0;
    }

    .fh-hero__image {
        position: relative;
        height: 280px;
    }

    .fh-hero__overlay {
        position: relative;
        width: 100%;
        background: var(--jm-cream);
        padding: 0;
    }

    .fh-hero__content {
        padding: 28px 20px 36px;
        max-width: none;
    }

    .fh-hero__heading {
        font-size: 28px;
    }

    .fh-hero__subtext {
        font-size: 15px;
        margin-bottom: 20px;
    }

    .fh-hero__cta {
        display: block;
        text-align: center;
        width: 100%;
        padding: 16px;
        font-size: 16px;
    }

    .fh-categories {
        padding: 40px 0 30px;
    }

    .fh-categories__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .fh-categories__card-name {
        font-size: 15px;
    }

    .fh-categories__card-desc {
        font-size: 11px;
    }

    /* Carousel: show 1.5 cards */
    .fh-carousel .swiper-slide,
    .fh-carousel:not(.swiper-initialized) .swiper-slide {
        flex: 0 0 calc(60% - 8px);
        width: 60%;
    }

    .fh-carousel__nav {
        display: none;
    }

    .fh-new-arrivals {
        padding: 30px 0 40px;
    }

    .fh-section-title {
        font-size: 22px;
    }

    .fh-story__grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .fh-story__image-wrap {
        max-height: 240px;
    }

    .fh-story__heading {
        font-size: 24px;
    }

    .fh-story {
        padding: 40px 0;
    }

    .fh-bestsellers {
        padding: 40px 0;
    }

    .fh-bestsellers__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .fh-inspiration {
        padding: 40px 0;
    }

    .fh-inspiration__grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .fh-trust__grid {
        gap: 24px;
    }

    .fh-trust__item {
        min-width: 100px;
    }

    .fh-trust__item svg {
        width: 28px;
        height: 28px;
    }

    .fh-trust__label {
        font-size: 11px;
    }

    .fh-newsletter {
        padding: 40px 0;
    }

    .fh-newsletter__heading {
        font-size: 22px;
    }

    .fh-newsletter__field {
        flex-direction: column;
        gap: 0;
        border-radius: var(--jm-radius);
        padding: 0;
    }

    .fh-newsletter__input {
        border-radius: var(--jm-radius) var(--jm-radius) 0 0;
        min-height: 48px;
        font-size: 16px; /* prevent iOS zoom */
        padding: 16px 20px;
        background: #fff;
    }

    .fh-newsletter__btn {
        border-radius: 0 0 var(--jm-radius) var(--jm-radius);
        min-height: 48px;
        width: 100%;
    }

    .fh-section-header {
        flex-direction: column;
        gap: 8px;
    }
}

@media (max-width: 480px) {
    .fh-trust__grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
    }

    .fh-trust__item:nth-child(4),
    .fh-trust__item:nth-child(5) {
        grid-column: span 1;
    }

    .fh-categories__card {
        aspect-ratio: 3 / 2;
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   MINI-CART OVERRIDES — Bigger thumbs, teal buttons, length stepper, bundle CTA
   ═══════════════════════════════════════════════════════════════════════════ */

/* Bigger thumbnails */
.widget_shopping_cart .mini_cart_item img,
.woocommerce-mini-cart-item img {
    width: 70px !important;
    height: 70px !important;
    object-fit: cover;
    border-radius: 8px !important;
}

/* Teal "Warenkorb ansehen" button */
.widget_shopping_cart .buttons a.button:not(.checkout),
.woocommerce-mini-cart__buttons a.button:not(.checkout) {
    background: #fff !important;
    color: #E27297 !important;
    border: 2px solid #E27297 !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 16px !important;
}

.widget_shopping_cart .buttons a.button:not(.checkout):hover,
.woocommerce-mini-cart__buttons a.button:not(.checkout):hover {
    background: #FAEDF2 !important;
}

/* Teal "Zur Kasse" button */
.widget_shopping_cart .buttons a.button.checkout,
.woocommerce-mini-cart__buttons a.checkout {
    background: #E27297 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 14px 16px !important;
}

.widget_shopping_cart .buttons a.button.checkout:hover,
.woocommerce-mini-cart__buttons a.checkout:hover {
    background: #35a5ac !important;
}

/* Mobile mini-cart fixes */
@media (max-width: 768px) {
    /* Smaller bottom padding — just enough to clear browser chrome */
    .widget_shopping_cart_content,
    .cart-sidebar-content {
        padding-bottom: 16px !important;
    }

    /* Spacing between cart header and shipping progress */
    .cgkit-fsn-bar {
        margin-top: 8px !important;
        padding: 10px 12px !important;
        background: #f8f5f0 !important;
        border-radius: 8px !important;
        border: 1px solid #e8e0d8 !important;
    }

    /* Mini-cart sidebar + backdrop must be above EVERYTHING */
    .cart-sidebar,
    .shoptimizer-mini-cart,
    .site-header-cart-sidebar,
    .cart-sidebar-content {
        z-index: 100000 !important;
    }

    .cart-sidebar-overlay,
    .shoptimizer-mini-cart-overlay {
        z-index: 99999 !important;
    }

    /* Hide bottom nav when mini-cart/menu is open */
    body.drawer-open .fabricly-bottom-nav,
    body.mobile-toggled .fabricly-bottom-nav {
        display: none !important;
    }

    /* Hide CommerceKit sticky ATC when mini-cart is open */
    body.drawer-open .commercekit-sticky-add-to-cart {
        display: none !important;
    }
}

/* Shipping progress bar — truck icon + visual separation from header */
.cgkit-fsn-notice::before,
.cgkit-fsn-title::before {
    content: '🚚 ';
}

.cgkit-fsn-bar {
    margin: 8px 0 !important;
    padding: 10px 14px !important;
    background: #f8f5f0 !important;
    border-radius: 8px !important;
    border: 1px solid #e8e0d8 !important;
}

.cgkit-fsn-notice,
.cgkit-fsn-title {
    font-size: 13px !important;
    font-weight: 600 !important;
}

/* Mini-cart: simple one-line bundle status */
.fabricly-mc-status {
    list-style: none !important;
    padding: 8px 12px !important;
    margin: 8px 0 0 !important;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
}

.fabricly-mc-status a {
    color: inherit;
    text-decoration: underline;
}

.fabricly-mc-status--teaser {
    background: #fff8e1;
    color: #b8860b;
    border: 1px dashed #e6d088;
    transition: all 0.15s;
}

.fabricly-mc-status--teaser:hover {
    background: #fff3c4;
    border-style: solid;
    transform: scale(1.01);
}

.fabricly-mc-status--partial {
    background: #FAEDF2;
    color: #E27297;
    border: 1px dashed #b8e8ec;
    transition: all 0.15s;
}

.fabricly-mc-status--partial:hover {
    background: #d4f0f3;
    border-style: solid;
}

.fabricly-mc-status--active {
    background: #e8f5e9;
    color: #27ae60;
}

/* Per-print "find matching" link */
.fabricly-mc-find-match {
    display: block;
    font-size: 11px;
    color: #E27297;
    font-weight: 600;
    text-decoration: none;
    margin-top: 4px;
}

.fabricly-mc-find-match:hover {
    text-decoration: underline;
}

/* Mini-cart length stepper */
.fabricly-mc-stepper {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
}

.fabricly-mc-stepper__btn {
    width: 26px;
    height: 26px;
    border: 1px solid #e8e0d8;
    border-radius: 6px;
    background: #fff;
    font-size: 15px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #555;
    transition: all 0.15s;
    padding: 0;
    font-family: inherit;
}

.fabricly-mc-stepper__btn:hover {
    border-color: #E27297;
    color: #E27297;
}

.fabricly-mc-stepper__val {
    font-size: 13px;
    font-weight: 700;
    min-width: 36px;
    text-align: center;
    color: #333;
}

/* Mini-cart price with discount */
.fabricly-mc-price {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
}

.fabricly-mc-price__old {
    text-decoration: line-through;
    color: #bbb;
    font-size: 12px;
}

.fabricly-mc-price__new {
    font-weight: 700;
    font-size: 13px;
    color: #1e1e1e;
}

.fabricly-mc-price__pct {
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    background: #27ae60;
    padding: 1px 5px;
    border-radius: 4px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   CHECKOUT — PROGRESS BAR + TRUST BADGES + DELIVERY ESTIMATE
   ═══════════════════════════════════════════════════════════════════════════ */

.jm-checkout-progress {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin: 0 auto 30px;
    max-width: 600px;
}

.jm-cp-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    opacity: 0.35;
}

.jm-cp-step--done,
.jm-cp-step--active {
    opacity: 1;
}

.jm-cp-step__icon {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--jm-cream);
    border: 2px solid var(--jm-border);
    color: #bbb;
    font-size: 16px;
    transition: all 0.3s;
}
.jm-cp-step__icon svg {
    width: 18px;
    height: 18px;
}

.jm-cp-step--active .jm-cp-step__icon {
    background: var(--jm-pink);
    border-color: var(--jm-pink);
    color: #fff;
    box-shadow: 0 3px 12px rgba(226,114,151,0.35);
}
.jm-cp-step--done .jm-cp-step__icon {
    background: var(--jm-pink);
    border-color: var(--jm-pink);
    color: #fff;
}

.jm-cp-step__label {
    font-size: 11px;
    font-weight: 600;
    color: #555;
    white-space: nowrap;
}

.jm-cp-step__line {
    flex: 1;
    height: 2px;
    background: #e8e0d8;
    min-width: 30px;
    margin: 0 6px;
    margin-bottom: 18px;
}

.fabricly-checkout-trust {
    display: flex;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
    margin: 30px 0 10px;
    padding: 16px;
    background: #f8f5f0;
    border-radius: 10px;
    border: 1px solid #e8e0d8;
}

.fabricly-ct-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #555;
    font-weight: 500;
}

.fabricly-delivery-estimate {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 14px;
    margin: 12px 0 16px;
    background: #FAEDF2;
    border-radius: 8px;
    font-size: 13.5px;
    color: #333;
}

@media (max-width: 768px) {
    .jm-checkout-progress {
        gap: 0;
        margin-bottom: 20px;
    }

    .jm-cp-step__icon {
        width: 34px;
        height: 34px;
        font-size: 14px;
    }

    .jm-cp-step__label {
        font-size: 10px;
    }

    .fabricly-checkout-trust {
        flex-direction: column;
        gap: 10px;
        align-items: flex-start;
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   MOBILE BOTTOM NAV BAR
   ═══════════════════════════════════════════════════════════════════════════ */

/* Hidden on desktop */
.fabricly-bottom-nav {
    display: none;
}

@media (max-width: 768px) {
    .fabricly-bottom-nav {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 9999;
        background: #ffffff;
        border-top: 1px solid #e8e0d8;
        box-shadow: 0 -2px 10px rgba(0,0,0,0.06);
        padding: 6px 0;
        padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px));
        transition: transform 0.3s ease;
    }

    .fabricly-bottom-nav.fabricly-bnav--hidden {
        transform: translateY(100%);
    }

    .fabricly-bnav__item {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 2px;
        padding: 4px 0;
        text-decoration: none;
        color: #888;
        font-size: 10px;
        font-family: var(--jm-body, 'Poppins', sans-serif);
        font-weight: 500;
        background: none;
        border: none;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        transition: color 0.15s;
    }

    .fabricly-bnav__item.active,
    .fabricly-bnav__item:active {
        color: var(--jm-pink, #E27297);
    }

    .fabricly-bnav__item.active svg {
        stroke: var(--jm-pink, #E27297);
    }

    .fabricly-bnav__item svg {
        transition: stroke 0.15s;
    }

    /* Body padding so content isn't hidden behind bottom nav */
    body {
        padding-bottom: 68px;
    }

    /* Adjust mobile filter FAB position (don't overlap bottom nav) */
    .fabricly-mobile-filter-toggle {
        bottom: 80px !important;
    }

    /* Product pages: keep bottom nav visible for search/navigation */
    body.single-product {
        padding-bottom: 68px;
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   FORCE OVERRIDES — at end of file for maximum cascade priority
   ═══════════════════════════════════════════════════════════════════════════ */

/* Hide WC "added to cart" notice everywhere */
body .woocommerce-message,
body .woocommerce .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-message {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ─── EYEBROW LABELS ───────────────────────────────────────────────────── */
.fh-eyebrow {
    font-family: var(--jm-font-heading);
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--jm-yellow);
    text-align: center;
    margin-bottom: 8px;
}

.fh-section-header .fh-eyebrow {
    text-align: left;
}

/* ─── BLOG LAYOUT — Hero + Sidebar ─────────────────────────────────────── */
@media (max-width: 768px) {
    /* Stack blog layout on mobile */
    .col-full[style*="grid-template-columns: 1fr 300px"] {
        grid-template-columns: 1fr !important;
        gap: 32px !important;
    }
    .blog-sidebar {
        position: static !important;
    }
}

/* Sidebar link hover */
.blog-sidebar a:hover {
    color: var(--jm-pink) !important;
}

/* Category nav hover — highlight background */
.blog-sidebar a[style*="border-radius: 10px"]:hover {
    background: var(--jm-cream, #FAF7F2) !important;
    color: var(--jm-pink) !important;
}

/* ─── BLOG ARCHIVE — CARD STYLING ──────────────────────────────────────── */
/* Blog grid layout */
.site-main.grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

@media (max-width: 768px) {
    .site-main.grid-2 {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

/* Blog post cards */
.site-main article.post {
    background: var(--jm-white);
    border-radius: var(--jm-radius-lg);
    overflow: hidden;
    box-shadow: var(--jm-shadow);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.site-main article.post:hover {
    transform: translateY(-4px);
    box-shadow: var(--jm-shadow-hover);
}

/* Blog post thumbnail */
.site-main article.post .post-thumbnail,
.site-main article.post .entry-thumbnail {
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.site-main article.post .post-thumbnail img,
.site-main article.post .entry-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.site-main article.post:hover .post-thumbnail img,
.site-main article.post:hover .entry-thumbnail img {
    transform: scale(1.04);
}

/* Blog post content wrapper */
.site-main article.post .blog-loop-content-wrapper,
.site-main article.post .entry-content-wrap {
    padding: 24px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Blog post category label */
.site-main article.post .posted-on,
.site-main article.post .cat-links {
    font-family: var(--jm-font-body);
    font-size: 11px;
    font-weight: 600;
    color: var(--jm-yellow);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 8px;
    display: block;
}

.site-main article.post .cat-links a {
    color: var(--jm-yellow);
    text-decoration: none;
}

/* Blog post title */
.site-main article.post .entry-header h2,
.site-main article.post .entry-title {
    font-family: var(--jm-font-heading);
    font-size: 21px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 12px;
}

.site-main article.post .entry-header h2 a,
.site-main article.post .entry-title a {
    color: var(--jm-text);
    text-decoration: none;
    transition: color var(--jm-transition);
}

.site-main article.post .entry-header h2 a:hover,
.site-main article.post .entry-title a:hover {
    color: var(--jm-pink);
}

/* Blog post excerpt */
.site-main article.post .entry-summary,
.site-main article.post .entry-content {
    font-family: var(--jm-font-body);
    font-size: 14px;
    color: var(--jm-text-light);
    line-height: 1.6;
    flex: 1;
}

/* Blog post date */
.site-main article.post .posted-on {
    font-size: 13px;
    color: var(--jm-text-light);
    text-transform: none;
    letter-spacing: 0;
}

/* Blog page header */
.page-header .page-title {
    font-family: var(--jm-font-heading);
    font-size: 34px;
    font-weight: 800;
    color: var(--jm-text);
    letter-spacing: -0.5px;
    text-align: center;
    margin-bottom: 48px;
}

/* Blog pagination */
.navigation.pagination {
    margin-top: 48px;
    text-align: center;
}

.navigation.pagination .page-numbers {
    display: inline-flex;
    gap: 8px;
    list-style: none;
    padding: 0;
}

.navigation.pagination .page-numbers li {
    padding: 0;
}

.navigation.pagination a.page-numbers,
.navigation.pagination span.page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 8px 14px;
    border-radius: var(--jm-radius);
    font-family: var(--jm-font-body);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: all var(--jm-transition);
}

.navigation.pagination a.page-numbers {
    color: var(--jm-text);
    background: var(--jm-white);
    box-shadow: var(--jm-shadow);
}

.navigation.pagination a.page-numbers:hover {
    color: var(--jm-pink);
    transform: translateY(-2px);
    box-shadow: var(--jm-shadow-hover);
}

.navigation.pagination span.page-numbers.current {
    background: var(--jm-pink);
    color: #fff;
    box-shadow: var(--jm-shadow-pink);
}

/* Hide ALL sticky ATC bars — CommerceKit + Shoptimizer legacy */
body section.commercekit-sticky-add-to-cart,
body .commercekit-sticky-add-to-cart,
body .shoptimizer-sticky-add-to-cart,
section[class*="commercekit-sticky"] {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* ==========================================================================
   FABRICLY LAYOUT SYSTEM — Responsive grid classes
   Use these instead of inline grid styles in page content.
   All grids collapse automatically on mobile.
   ========================================================================== */

/* Grid containers */
.fab-grid { display: grid; gap: 24px; }
.fab-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.fab-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.fab-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.fab-grid-sidebar { display: grid; grid-template-columns: 300px 1fr; gap: 48px; align-items: center; }

/* Section containers */
.fab-section { padding: 96px 24px; }
.fab-section--white { background: #fff; }
.fab-section--cream { background: var(--jm-cream, #FAF7F2); }
.fab-section--card { background: #fff; border-radius: 24px; margin: 0 16px 32px; box-shadow: 0 8px 40px rgba(0,0,0,0.06); padding: 96px 24px; }
.fab-section--jm-pink { background: var(--jm-pink); border-radius: 24px; margin: 0 16px 32px; }

/* Content widths */
.fab-narrow { max-width: 680px; margin-left: auto; margin-right: auto; }
.fab-medium { max-width: 900px; margin-left: auto; margin-right: auto; }
.fab-wide { max-width: 1100px; margin-left: auto; margin-right: auto; }

/* Hero */
.fab-hero { position: relative; overflow: visible; margin-bottom: 80px; }
.fab-hero__img { position: relative; height: 420px; overflow: hidden; border-radius: 0 0 24px 24px; }
.fab-hero__img img { width: 100%; height: 100%; object-fit: cover; }
.fab-hero__overlay { position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(226,114,151,0.1) 0%, rgba(51,51,51,0.7) 100%); }
.fab-hero__text { position: absolute; bottom: 0; left: 0; right: 0; padding: 48px 24px 120px; text-align: center; }
.fab-hero__overlap { max-width: 900px; margin: -48px auto 0; padding: 0 24px; position: relative; z-index: 2; }

/* Center text */
.fab-center { text-align: center; }

/* Stitch divider */
.fab-stitch { height: 3px; background: repeating-linear-gradient(to right, var(--jm-yellow) 0 12px, transparent 12px 22px); opacity: 0.5; margin: 32px 48px; }

/* ─── MOBILE RESPONSIVE ─── */
@media (max-width: 768px) {
    .fab-grid-2 { grid-template-columns: 1fr; }
    .fab-grid-3 { grid-template-columns: 1fr; }
    .fab-grid-4 { grid-template-columns: repeat(2, 1fr); }
    .fab-grid-sidebar { grid-template-columns: 1fr; gap: 24px; }

    .fab-section { padding: 48px 16px; }
    .fab-section--card { margin: 0; border-radius: 0; padding: 48px 16px; }
    .fab-section--jm-pink { margin: 0; border-radius: 0; }

    .fab-hero__img { height: 260px; }
    .fab-hero__text { padding: 32px 16px 80px; }
    .fab-hero__overlap { margin-top: -32px; padding: 0 16px; }
    .fab-hero { margin-bottom: 48px; }

    .fab-stitch { margin: 24px 16px; }
}

/* ==========================================================================
   PAGE-SPECIFIC MOBILE OVERRIDES — Content pages
   ========================================================================== */

/* Global: prevent ANY page from scrolling horizontally */
html, body {
    overflow-x: hidden;
}

/* Content page wrapper — clip overflow */
.entry-content,
.fabricly-content-page,
.fc {
    overflow-x: hidden;
    max-width: 100vw;
}

/* Logo — force center on ALL pages on mobile */
@media (max-width: 768px) {
    .site-header .site-branding {
        flex: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Club page: logo hidden by full-width layout — ensure header visible */
    .fabricly-club-page .site-header {
        position: relative;
        z-index: 50;
    }

    /* ─── ABOUT + CONTACT PAGES — Nuclear mobile grid fix ─── */
    /* Force ALL display:grid elements to max 2 columns on these pages */
    .page-id-90 .entry-content [style*="display: grid"],
    .page-id-90 .entry-content [style*="display:grid"],
    .page-id-91 .entry-content [style*="display: grid"],
    .page-id-91 .entry-content [style*="display:grid"] {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }

    /* Camilla intro: force single column (image above text) */
    .page-id-90 .entry-content [style*="300px 1fr"] {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    /* Team photo containers — full width */
    .page-id-90 .entry-content [style*="width: 140px"] {
        width: 100% !important;
    }
    .page-id-90 .entry-content [style*="height: 160px"] {
        height: 180px !important;
        width: 100% !important;
    }

    /* White floating sections — no side margins on mobile */
    .page-id-90 .entry-content > .fab-reveal,
    .page-id-90 .entry-content > div[style*="margin: 0 16px"],
    .page-id-91 .entry-content > .fab-reveal,
    .page-id-91 .entry-content > div[style*="margin: 0 16px"] {
        margin-left: 0 !important;
        margin-right: 0 !important;
        border-radius: 0 !important;
    }

    /* All content must stay within viewport */
    .page-id-90 .entry-content,
    .page-id-91 .entry-content {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    /* Hero + Camilla image — reduce height */
    .page-id-90 .entry-content [style*="height: 420px"],
    .page-id-90 .entry-content [style*="height: 380px"],
    .page-id-91 .entry-content [style*="height: 380px"] {
        height: 240px !important;
    }

    /* Section padding — tighter on mobile */
    .page-id-90 .entry-content [style*="padding: 96px"],
    .page-id-91 .entry-content [style*="padding: 96px"] {
        padding: 48px 16px !important;
    }

    /* Headings — smaller on mobile */
    .page-id-90 .entry-content h1,
    .page-id-91 .entry-content h1 {
        font-size: 28px !important;
        letter-spacing: -0.5px !important;
    }
    .page-id-90 .entry-content h2,
    .page-id-91 .entry-content h2 {
        font-size: 24px !important;
    }
    .page-id-90 .entry-content h3,
    .page-id-91 .entry-content h3 {
        font-size: 20px !important;
    }

    /* Contact: emphasized card — remove lift */
    .page-id-91 .entry-content [style*="translateY(-8px)"] {
        transform: none !important;
    }

    /* Contact: channel cards — single column */
    .page-id-91 .entry-content [style*="repeat(3, 1fr)"] {
        grid-template-columns: 1fr !important;
    }

    /* Hero text padding — tighter on mobile */
    .page-id-91 .entry-content [style*="padding: 48px 24px 110px"] {
        padding: 32px 16px 80px !important;
    }

    /* Card overlap — less on mobile */
    .page-id-91 .entry-content [style*="margin: -48px auto"],
    .page-id-90 .entry-content [style*="margin: -48px auto"] {
        margin-top: -24px !important;
    }

    /* Stitch divider — tighter margins */
    .page-id-90 .entry-content [style*="repeating-linear-gradient"],
    .page-id-91 .entry-content [style*="repeating-linear-gradient"] {
        margin-left: 16px !important;
        margin-right: 16px !important;
    }

    /* ─── HERO on mobile: text MUST stay ON the image ─── */
    .fab-hero__img {
        height: auto !important;
        min-height: 320px;
    }
    /* Make hero text flow within the image container, not absolute */
    .fab-hero__text {
        position: relative !important;
        padding: 48px 20px 72px !important;
        background: linear-gradient(to bottom, rgba(226,114,151,0.15) 0%, rgba(51,51,51,0.75) 100%);
    }
    .fab-hero__overlay {
        display: none !important; /* text div now has its own gradient */
    }
    .fab-hero__text h1 {
        font-size: 26px !important;
        line-height: 1.2 !important;
        letter-spacing: -0.3px !important;
        margin-bottom: 8px !important;
    }
    .fab-hero__text p {
        font-size: 14px !important;
        margin-bottom: 0 !important;
    }
    .fab-hero__text > div:first-child {
        font-size: 11px !important;
        padding: 4px 12px !important;
        margin-bottom: 10px !important;
    }
    /* Hero image fills behind the text */
    .fab-hero__img img {
        position: absolute !important;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: -1;
    }

    /* Hero overlap cards */
    .fab-hero__overlap {
        margin-top: -36px !important;
        padding: 0 16px !important;
    }
    .fab-hero {
        margin-bottom: 32px !important;
    }

    /* ─── CHANNEL CARDS: more padding, visual depth ─── */
    .fab-grid-3 > [style*="border-radius: 18px"] {
        padding: 24px 20px !important;
        margin-bottom: 8px;
        box-shadow: 0 4px 20px rgba(0,0,0,0.08), 0 1px 4px rgba(0,0,0,0.04) !important;
        border: 1px solid rgba(0,0,0,0.05) !important;
    }
    /* Emphasized card keeps its teal border */
    .fab-grid-3 > [style*="border: 2px solid #E27297"] {
        border: 2px solid #E27297 !important;
    }

    /* ─── TRUST GRID: force 2x2 on mobile ─── */
    .fab-grid-4 {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }

    /* ─── TEAM PHOTOS: constrain height, 2 columns ─── */
    .fab-grid-4 [style*="aspect-ratio: 7/8"] {
        aspect-ratio: 1 / 1 !important;
        max-height: 160px !important;
    }

    /* ─── CAMILLA IMAGE: much shorter on mobile ─── */
    .fab-grid-sidebar img[style*="height: 380px"] {
        height: 220px !important;
    }

    /* ─── CARDS: subtle border for depth ─── */
    .page-id-90 .entry-content [style*="box-shadow"][style*="border-radius"],
    .page-id-91 .entry-content [style*="box-shadow"][style*="border-radius"] {
        border: 1px solid rgba(0,0,0,0.06) !important;
    }

    /* ─── PADDING: tighter on mobile ─── */
    .fab-section {
        padding: 48px 16px !important;
    }
    .fab-section--card {
        padding: 40px 16px !important;
    }

    /* ─── TEXT: proper hierarchy ─── */
    .page-id-90 .entry-content h2,
    .page-id-91 .entry-content h2 {
        font-size: 22px !important;
    }
    .page-id-90 .entry-content h3,
    .page-id-91 .entry-content h3 {
        font-size: 18px !important;
    }

    /* CTA banner — tighter */
    .fab-section--jm-pink {
        padding: 40px 16px !important;
    }
    .fab-section--jm-pink h2 {
        font-size: 22px !important;
    }
    .fab-section--jm-pink a[style*="border: 2px"] {
        border-color: rgba(255,255,255,0.8) !important;
    }
}