@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Mulish:wght@400;500;600;700;800&display=swap');

/* Stripe/WooPayments BNPL (Klarna) messaging-balk verbergen */
#payment-method-message { display: none !important; }

/* Hero: tekst leesbaar op donkergroene achtergrond */
.mxm-hero h1 { color: #ffffff !important; }
.mxm-hero p { color: rgba(255,255,255,0.92) !important; }


/* ===== Mixopmaat — De Bloei merkfundament (Claude · 5 jun 2026) ===== */
:root{
  --mxm-green:#1F3D2B; --mxm-leaf:#3A6B47; --mxm-cream:#F7F2E7; --mxm-clay:#E9DCC3;
  --mxm-ink:#1C1A17; --mxm-stone:#6B6456;
  --mxm-klaproos:#C0664A; --mxm-goud:#D69A3C; --mxm-salie:#8AA45B;
  --mxm-koren:#5E83A8; --mxm-lavendel:#8A6B95; --mxm-roos:#C77E92;
}
/* Tekstlettertype: Mulish */
body{ font-family:'Mulish', system-ui, -apple-system, 'Segoe UI', sans-serif !important; color:var(--mxm-ink) !important; background-color:var(--mxm-cream); }
/* Koppen: Fraunces */
h1,h2,h3,h4,h5,h6,.wp-block-heading{ font-family:'Fraunces', Georgia, 'Times New Roman', serif !important; letter-spacing:-.01em; }
/* Tekstlinks in content */
.wp-block-post-content a:not([class*='mxm-btn']):not(.button):not(.wp-element-button),.entry-content a:not([class*='mxm-btn']),.mxm-content a:not([class*='mxm-btn']){ color:var(--mxm-leaf); }
.wp-block-post-content a:not([class*='mxm-btn']):not(.button):not(.wp-element-button):hover,.entry-content a:not([class*='mxm-btn']):hover,.mxm-content a:not([class*='mxm-btn']):hover{ color:var(--mxm-green); }
/* Inhoud-knoppen (thema, blokken, WooCommerce) */
.wp-block-button__link,.wp-element-button,button.button,a.button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,input[type="submit"]{
  font-family:'Mulish', sans-serif !important; font-weight:700 !important;
  background-color:var(--mxm-green) !important; color:var(--mxm-cream) !important; border-color:var(--mxm-green) !important;
}
.wp-block-button__link:hover,.wp-element-button:hover,a.button:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,.woocommerce #respond input#submit:hover,input[type="submit"]:hover{
  background-color:var(--mxm-leaf) !important; border-color:var(--mxm-leaf) !important; color:#ffffff !important;
}
/* WooCommerce accenten */
.woocommerce ul.products li.product .price,.woocommerce div.product p.price,.woocommerce div.product span.price,.woocommerce .price .amount{ color:var(--mxm-green); }
.woocommerce span.onsale{ background-color:var(--mxm-klaproos) !important; color:#fff !important; }
.woocommerce-message,.woocommerce-info{ border-top-color:var(--mxm-leaf) !important; }


/* ===== Fase 3 — Shop: kaarten + productkleuren ===== */
.woocommerce ul.products li.product{background:#FFFFFF;border:1px solid #E9DCC3;border-top:4px solid #E9DCC3;border-radius:16px;padding:14px 14px 22px;box-shadow:0 2px 12px rgba(31,61,43,0.05);transition:transform .15s,box-shadow .15s}
.woocommerce ul.products li.product:hover{transform:translateY(-4px);box-shadow:0 10px 28px rgba(31,61,43,0.10)}
.woocommerce ul.products li.product img{border-radius:10px}
.woocommerce ul.products li.product.post-386{border-top-color:#C77E92}
.woocommerce ul.products li.product.post-387{border-top-color:#D69A3C}
.woocommerce ul.products li.product.post-388{border-top-color:#5E83A8}
.woocommerce ul.products li.product.post-389{border-top-color:#C0664A}
.woocommerce ul.products li.product.post-390{border-top-color:#8AA45B}
.woocommerce ul.products li.product.post-416{border-top-color:#8A6B95}
body.single-product .product_title{border-bottom:3px solid #E9DCC3;padding-bottom:10px}
body.postid-386 .product_title{border-bottom-color:#C77E92}
body.postid-387 .product_title{border-bottom-color:#D69A3C}
body.postid-388 .product_title{border-bottom-color:#5E83A8}
body.postid-389 .product_title{border-bottom-color:#C0664A}
body.postid-390 .product_title{border-bottom-color:#8AA45B}
body.postid-416 .product_title{border-bottom-color:#8A6B95}


/* ===== Fase 4 — Configurator ===== */
#mxm_fill100{background:#1F3D2B !important;border-color:#1F3D2B !important;color:#F7F2E7 !important}
#mxm_fill100:hover{background:#3A6B47 !important;border-color:#3A6B47 !important;color:#fff !important}


/* ===== Fase 5 — Binnenpagina-banden (contrast + palet) ===== */
.mxm-page-hero{background:linear-gradient(135deg,#1F3D2B,#3A6B47) !important}
.mxm-page-hero h1{font-family:'Fraunces',Georgia,serif !important;color:#F7F2E7 !important}
.mxm-page-hero p,.mxm-page-hero .mxm-page-hero-chip{color:#F7F2E7 !important}
.mxm-page-hero .mxm-page-hero-chip{background:rgba(247,242,231,0.15) !important;border-color:rgba(247,242,231,0.35) !important}
.mxm-cta-strip{background:linear-gradient(135deg,#1F3D2B,#3A6B47) !important}
.mxm-cta-strip h3,.mxm-cta-strip p{color:#F7F2E7 !important}
.mxm-cta-strip a{background:#F7F2E7 !important;color:#1F3D2B !important}
.mxm-content h2{color:#1F3D2B}
.mxm-highlight-box{background:#F2ECDC !important;border-left-color:#3A6B47 !important}
.mxm-highlight-box p{color:#1F3D2B !important}
.mxm-feature-dot{background:linear-gradient(135deg,#3A6B47,#5E8C5A) !important}


/* ===== Fase 7 — Bloei-streep boven footer ===== */
footer.wp-block-template-part{position:relative}
footer.wp-block-template-part::before{content:'';position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,#C0664A 0 16.66%,#D69A3C 16.66% 33.33%,#8AA45B 33.33% 50%,#5E83A8 50% 66.66%,#8A6B95 66.66% 83.33%,#C77E92 83.33% 100%);z-index:3}


/* ===== Fase 9 — Volle-breedte band sluit aan op header (geen kleurgat) ===== */
.wp-block-post-content.has-global-padding:has(> .mxm-home),
.wp-block-post-content.has-global-padding:has(> .mxm-page-hero){padding-top:0 !important}
.wp-block-post-content > .mxm-home,
.wp-block-post-content > .mxm-page-hero{margin-top:0 !important}


/* ===== Fase 3b — Shop responsive grid (fix mobiel/float-catch) ===== */
.woocommerce ul.products{display:grid !important;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px;margin:0 0 24px}
.woocommerce ul.products::before,.woocommerce ul.products::after{content:none !important;display:none !important}
.woocommerce ul.products li.product{width:auto !important;float:none !important;margin:0 !important;clear:none !important}


/* ===== Fase 5b — Binnenpagina layout (nieuwe pagina's met merk-classes) ===== */
.mxm-page-hero{padding:72px 24px 60px;text-align:center}
.mxm-page-hero-chip{display:inline-block;border-radius:30px;padding:5px 16px;font-size:12px;letter-spacing:1.4px;text-transform:uppercase;margin-bottom:16px;font-weight:700}
.mxm-page-hero h1{font-size:clamp(28px,3.6vw,46px);font-weight:600;margin:0 0 16px;line-height:1.12}
.mxm-page-hero p{font-size:17px;max-width:600px;margin:0 auto;line-height:1.6}
.mxm-content{max-width:720px;margin:0 auto;padding:54px 24px}
.mxm-content h2{font-size:clamp(22px,2.6vw,28px);font-weight:600;margin:38px 0 12px;line-height:1.25}
.mxm-content h2:first-child{margin-top:0}
.mxm-content p{font-size:16.5px;color:#3a382f;line-height:1.75;margin:0 0 16px}
.mxm-content ul{margin:0 0 18px;padding-left:22px}
.mxm-content li{font-size:16.5px;color:#3a382f;line-height:1.7;margin:6px 0}
.mxm-faq details{background:#fff;border:1px solid #E9DCC3;border-radius:12px;padding:2px 18px;margin:10px 0}
.mxm-faq summary{font-family:'Fraunces',Georgia,serif;color:#1F3D2B;font-weight:600;font-size:17px;padding:13px 0;cursor:pointer;list-style:none}
.mxm-faq summary::-webkit-details-marker{display:none}
.mxm-faq details[open] summary{border-bottom:1px solid #E9DCC3}
.mxm-faq details p{padding:12px 0 6px;margin:0}
.mxm-cta-strip{padding:54px 24px;text-align:center}
.mxm-cta-strip h3{font-size:clamp(22px,2.6vw,28px);font-weight:600;margin:0 0 12px}
.mxm-cta-strip p{font-size:15.5px;margin:0 0 24px}
.mxm-cta-strip a{display:inline-flex;align-items:center;gap:8px;padding:13px 30px;border-radius:30px;font-size:14.5px;font-weight:700;text-decoration:none}


/* ===== Menu — strak + levendig (De Bloei) ===== */
header nav{gap:6px !important;flex-wrap:wrap}
header nav a{background:transparent !important;color:#1F3D2B !important;font-family:'Mulish',sans-serif !important;font-weight:800 !important;border:2px solid transparent !important;border-radius:999px !important;padding:9px 16px !important;transition:background .18s,color .18s,transform .18s,border-color .18s !important}
header nav a:hover{transform:translateY(-2px) !important}
header nav a:nth-of-type(1):hover{background:#C0664A !important;color:#fff !important}
header nav a:nth-of-type(2):hover{background:#D69A3C !important;color:#1F3D2B !important}
header nav a:nth-of-type(3):hover{background:#8AA45B !important;color:#1F3D2B !important}
header nav a:nth-of-type(4):hover{background:#5E83A8 !important;color:#fff !important}
header nav a:nth-of-type(5):hover{background:#8A6B95 !important;color:#fff !important}
header nav a:nth-of-type(6):hover{background:#C77E92 !important;color:#fff !important}
header nav a[href*="configurator"]{background:#1F3D2B !important;color:#F7F2E7 !important}
header nav a[href*="configurator"]:hover{background:#3A6B47 !important;color:#fff !important}
header a[href*="winkelwagen"]{background:#D69A3C !important;color:#1F3D2B !important;border-radius:999px !important;font-family:'Mulish',sans-serif !important;font-weight:800 !important;border:2px solid transparent !important;padding:9px 16px !important;transition:background .18s,color .18s,transform .18s !important}
header a[href*="winkelwagen"]:hover{background:#B07F22 !important;color:#fff !important;transform:translateY(-2px) !important}

/* ===== Zaadjes als opsommingstekens (content) ===== */
:is(.mxm-content,.entry-content,.wp-block-post-content) ul:not(.products){list-style:none;padding-left:4px}
:is(.mxm-content,.entry-content,.wp-block-post-content) ul:not(.products)>li{position:relative;padding-left:28px}
:is(.mxm-content,.entry-content,.wp-block-post-content) ul:not(.products)>li::before{content:'';position:absolute;left:4px;top:.5em;width:12px;height:12px;background:#3A6B47;border-radius:0 100% 0 100%;transform:rotate(6deg)}
:is(.mxm-content,.entry-content,.wp-block-post-content) ul:not(.products)>li:nth-child(6n+1)::before{background:#C0664A}
:is(.mxm-content,.entry-content,.wp-block-post-content) ul:not(.products)>li:nth-child(6n+2)::before{background:#D69A3C}
:is(.mxm-content,.entry-content,.wp-block-post-content) ul:not(.products)>li:nth-child(6n+3)::before{background:#8AA45B}
:is(.mxm-content,.entry-content,.wp-block-post-content) ul:not(.products)>li:nth-child(6n+4)::before{background:#5E83A8}
:is(.mxm-content,.entry-content,.wp-block-post-content) ul:not(.products)>li:nth-child(6n+5)::before{background:#8A6B95}
:is(.mxm-content,.entry-content,.wp-block-post-content) ul:not(.products)>li:nth-child(6n)::before{background:#C77E92}


/* ===== FASE 11 — Contentsquare/Hotjar feedback-widget verbergen (5 jun 2026, omkeerbaar) ===== */
._hj-widget-container,
div[id^=hotjar-survey-],
#hj-survey-toggle-1 { display: none !important; }
/* ===== EINDE FASE 11 ===== */
