/*
Theme Name: North Luxury
Theme URI: https://north-luxury.com
Description: Custom theme for North Luxury Teak Furniture
Version: 1.0
Author: Focus Webdesign
Author URI: https://focus-webdesign.nl
Text Domain: northluxury
*/

:root {
    --bg:       #fdf6f0;
    --dark:         #45403a; /* was #703e1d roodbruin — warm antraciet voor rustiger beeld (klant, 27 jul 2026) */
    --primary:      #bb8f6c;
    --primary-hover: #c9a07e;
    --light:    #c4956a;
    --text:     #5c3d2a;
    --cream:    #f5ece3;
    --border:   #e8d5c4;
    --white:    #ffffff;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: 'Lato', sans-serif;
    background: var(--bg);
    color: var(--text);
    font-size: 16px;
    line-height: 1.6;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }

/* ── TOPBAR ── */
/* Topbar verwijderd (wens klant 27 jul 2026) — zie git-historie voor de oude opzet. */

/* ── HEADER — alles op één sticky rij (klant, 27 jul 2026): logo · zoeken ·
   Contact · Inspiratie · hartje · account · winkelmand. Krimpt bij scrollen. ── */
.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #ffffff;
    border-bottom: 1px solid var(--border);
}
.site-header.stuck { box-shadow: 0 2px 12px rgba(0,0,0,0.10); }
.header-main {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    align-items: center;
    gap: 30px;
    height: 116px; /* groter logo (klant #2) + witruimte erboven/onder */
    transition: height .3s ease;
}
.site-header.stuck .header-main { height: 72px; }
.header-logo { flex-shrink: 0; }
/* Logo iets groter nu de topbar weg is (wens klant #2, 27 jul 2026) */
.header-logo img { height: 84px; width: auto; transition: height .3s ease; }
.site-header.stuck .header-logo img { height: 48px; }
.header-search { flex: 1; }

/* Search */
.search-icon { color: #999; margin-right: 8px; display: flex; align-items: center; }

/* FiboSearch - alleen positionering */
.header-search .dgwt-wcas-search-wrapp {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
}

/* Actions: tekstlinks + drie gelijke icoontjes (klant, 27 jul 2026) */
.header-actions { display: flex; gap: 2px; align-items: center; }
.header-textlink {
    font-size: 14px;
    font-weight: 700;
    color: #111111;
    padding: 0 12px;
    white-space: nowrap;
    transition: color .2s;
}
.header-textlink:hover { color: var(--primary); }
.header-icon-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    position: relative;
    color: var(--mid);
    transition: color .2s;
}
.header-icon-btn:hover { color: var(--primary); }
.header-icon-btn .cart-count { top: 2px; left: 24px; }
.cart-count {
    position: absolute;
    top: 4px; left: 30px;
    background: #fff;
    color: var(--primary);
    font-size: 10px;
    width: 16px; height: 16px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700;
    border: 1.5px solid var(--primary);
}

/* (Aparte nav-balk verwijderd 27 jul 2026 — alles zit nu in .site-header; zie git.) */

/* ── HERO ── */
.hero {
    position: relative;
    height: 65vh;
    min-height: 520px;
    overflow: hidden;
    background: var(--dark);
}
.hero-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1s ease;
}
.hero-slide img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.hero-slide.active { opacity: 1; }
.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, rgba(45,26,14,.75) 0%, rgba(45,26,14,.2) 70%);
}
.hero-content-wrapper {
    position: absolute;
    bottom: 15%;
    left: 0;
    right: 0;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 40px;
}
.hero-content {
    color: var(--white);
    max-width: 560px;
}
.hero-badge {
    display: inline-block;
    position: relative;
    background: transparent;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 7px 20px;
    margin-bottom: 18px;
    border-radius: 20px;
}
.hero-badge::before {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 24px;
    border: 2px solid rgba(255,255,255,0.4);
}
.hero-content h1 {
    font-family: 'Playfair Display', serif;
    font-size: clamp(36px, 5vw, 64px);
    line-height: 1.15;
    margin-bottom: 20px;
    font-weight: 700;
}
.hero-content p {
    font-size: 18px;
    opacity: .85;
    margin-bottom: 36px;
    line-height: 1.7;
}
.btn-primary {
    display: inline-block;
    background: var(--primary);
    color: white;
    padding: 16px 40px;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 600;
    border-radius: 20px;
    transition: background .2s, transform .2s;
}
.btn-primary:hover { background: var(--primary-hover); transform: translateY(-2px); }
.btn-secondary {
    display: inline-block;
    background: transparent;
    color: var(--primary);
    padding: 16px 40px;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 600;
    border-radius: 20px;
    border: 2px solid var(--primary);
    transition: background .2s, color .2s, transform .2s;
}
.btn-secondary:hover { background: var(--primary); color: white; transform: translateY(-2px); }

/* ── 404 ── */
.error-404-section {
    background: var(--cream);
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 80px 40px;
}
.error-404-inner {
    max-width: 560px;
}
.error-404-number {
    font-family: 'Playfair Display', serif;
    font-size: clamp(80px, 15vw, 140px);
    color: var(--primary);
    opacity: 0.25;
    line-height: 1;
    display: block;
    margin-bottom: -20px;
}
.error-404-inner h1 {
    font-family: 'Playfair Display', serif;
    font-size: clamp(28px, 4vw, 42px);
    color: var(--dark);
    margin-bottom: 16px;
}
.error-404-inner p {
    color: var(--text);
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 36px;
}
.error-404-actions {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}
.btn-outline {
    display: inline-block;
    border: 2px solid white;
    color: white;
    padding: 14px 38px;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 600;
    margin-left: 16px;
    border-radius: 20px;
    transition: all .2s;
}
.btn-outline:hover { background: white; color: var(--dark); }
.hero-dots {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
}
.hero-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: rgba(255,255,255,.4);
    cursor: pointer;
    transition: background .2s;
}
.hero-dot.active { background: var(--light); transform: scale(1.3); }

/* ── QUICK LINKS MET ICONEN ── */
.quick-links-icons {
    background: #ffffff;
    border-bottom: 1px solid #e8e8e8;
    padding: 24px 40px;
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}
.qli-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 14px 20px;
    color: #222222;
    font-size: 13px;
    font-weight: 700;
    transition: color .2s;
    cursor: pointer;
}
.qli-item svg {
    width: 48px;
    height: 48px;
    stroke: #222222;
    transition: stroke .2s;
}
.qli-item:hover { color: #bb8f6c; }
.qli-item:hover svg { stroke: #bb8f6c; }

/* ── QUICK LINKS ── */
.quick-links {
    padding: 16px 40px;
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* Variant 1: Licht & Minimaal */
.ql-v1 { background: #ffffff; border-bottom: 1px solid #e8e8e8; }
.ql-v1 a {
    color: var(--dark);
    font-size: 13px;
    font-weight: 600;
    padding: 8px 16px;
    transition: color .2s;
}
.ql-v1 a:hover { color: #bb8f6c; }

/* Variant 2: Crème met lijn */
.ql-v2 { background: #f5ece3; border-top: 2px solid #bb8f6c; border-bottom: 2px solid #bb8f6c; }
.ql-v2 a {
    color: var(--dark);
    font-size: 13px;
    font-weight: 600;
    padding: 8px 16px;
    transition: all .2s;
    border-bottom: 2px solid transparent;
}
.ql-v2 a:hover { border-bottom-color: var(--dark); }

/* Variant 3: Pill knoppen */
.ql-v3 { background: #ffffff; border-bottom: 1px solid #e8e8e8; gap: 10px; }
.ql-v3 a {
    color: var(--dark);
    font-size: 13px;
    font-weight: 600;
    padding: 7px 18px;
    border: 1.5px solid #cccccc;
    border-radius: 20px;
    transition: all .2s;
}
.ql-v3 a:hover { background: #bb8f6c; border-color: #bb8f6c; color: white; }

/* ── SECTION HEADER ── */
.section-header {
    text-align: center;
    margin-bottom: 50px;
}
.section-header .sub {
    font-size: 12px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--primary);
    margin-bottom: 12px;
}
.section-header h2 {
    font-family: 'Playfair Display', serif;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--dark);
    font-weight: 700;
}
.section-header p {
    margin-top: 14px;
    color: var(--text);
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

/* ── COLLECTIES CAROUSEL ── */
.collections-carousel-section {
    padding: 70px 40px;
    background: var(--bg);
}
.collections-carousel-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    max-width: 1400px;
    margin: 0 auto;
}
.collections-carousel-viewport {
    flex: 1;
    overflow: hidden;
    padding: 16px 0;
}
.collections-carousel {
    display: flex;
    gap: 28px;
    transition: transform 0.4s ease;
    will-change: transform;
}
.collection-circle {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
    cursor: pointer;
    text-decoration: none;
}
.collection-circle-img {
    /* 140→210px (klant #4, 27 jul 2026): grotere rondjes → 5 per beeld i.p.v. 7;
       de carrousel-JS rekent het aantal zelf uit op basis van deze breedte */
    width: 210px;
    height: 210px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid var(--border);
    transition: border-color .3s, transform .3s;
}
.collection-circle-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    transition: transform .4s;
}
.collection-circle:hover .collection-circle-img {
    border-color: var(--primary);
    transform: scale(1.05);
}
.collection-circle span {
    font-size: 14px;
    font-weight: 700;
    color: var(--dark);
    font-family: 'Playfair Display', serif;
    transition: color .2s;
}
.collection-circle:hover span { color: var(--primary); }
.carousel-btn {
    background: white;
    border: 1.5px solid #cccccc;
    border-radius: 50%;
    width: 42px;
    height: 42px;
    font-size: 18px;
    cursor: pointer;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s;
    color: var(--dark);
}
.carousel-btn:hover { background: var(--primary); border-color: var(--primary); color: white; }

/* ── CATEGORIES ── */
.categories-section { padding: 80px 40px; max-width: 1400px; margin: 0 auto; }
.categories-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.category-card {
    display: block;
    position: relative;
    overflow: hidden;
    aspect-ratio: 3/4;
    cursor: pointer;
    border-radius: 16px;
}
.category-card img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}
.category-card:hover img { transform: scale(1.06); }
.category-card-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(45,26,14,.7) 0%, transparent 50%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 28px 24px;
}
.category-card-overlay h3 {
    font-family: 'Playfair Display', serif;
    color: white;
    font-size: 22px;
    margin-bottom: 6px;
}
.category-card-overlay span {
    font-size: 12px;
    color: var(--light);
    letter-spacing: 1.5px;
    text-transform: uppercase;
}
.category-card.featured { grid-column: span 2; }

/* ── SHOP ARCHIVE (categoriepagina) ── */
.shop-archive-wrap {
    background: var(--cream);
    min-height: 60vh;
}
.shop-archive-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 60px 40px 80px;
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 48px;
    align-items: start;
}
.shop-archive-header {
    margin-bottom: 16px;
}
.shop-intro {
    max-width: 640px;
    color: var(--text);
    font-size: 0.95rem;
    line-height: 1.8;
    margin-bottom: 40px;
    padding: 28px 36px;
    background: linear-gradient(135deg, var(--cream) 0%, #fff 100%);
    border-left: 4px solid var(--primary);
    border-radius: 0 12px 12px 0;
    box-shadow: 0 2px 16px rgba(112,62,29,0.07);
}
.cat-intro { max-width: 900px; padding: 24px 30px; }
.cat-intro > *:first-child { margin-top: 0; }
.cat-intro > *:last-child { margin-bottom: 0; }
.cat-intro h3 { font-family: 'Playfair Display', serif; color: var(--dark); font-size: 1.2rem; margin: 22px 0 10px; }
.cat-intro p { margin-bottom: 12px; }

/* Verzorgingsstappen naast elkaar (Teakverzorging); valt onder elkaar op smalle schermen */
.care-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 18px 0 18px; }
.care-step { background: rgba(255,255,255,.65); border: 1px solid rgba(112,62,29,.10); border-radius: 10px; padding: 16px 18px; }
.care-step-nr { display: block; margin-bottom: 6px; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--primary); }
.care-step h4 { font-size: .95rem; font-weight: 600; color: var(--dark); margin: 0 0 8px; }
.care-step ul { margin: 0; padding-left: 16px; list-style: disc; font-size: .85rem; line-height: 1.6; }
.care-step li { margin-bottom: 3px; }
.care-more { display: inline-block; font-weight: 600; color: var(--primary); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 1px; }
.care-more:hover { color: var(--dark); }
@media (max-width: 860px) {
    .care-steps { grid-template-columns: 1fr; }
    .cat-intro { padding: 20px 22px; }
}
.search-results-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 60px 40px 80px;
}
.search-results-inner .shop-archive-header h2 em {
    color: var(--primary);
    font-style: normal;
}
.search-no-results {
    padding: 40px 0;
    color: var(--text);
    font-size: 16px;
    line-height: 1.8;
}
.search-no-results a {
    color: var(--primary);
    text-decoration: underline;
}
.shop-archive-header .sub {
    font-size: 12px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--primary);
    margin-bottom: 12px;
}
.shop-archive-header h2 {
    font-family: 'Playfair Display', serif;
    font-size: clamp(24px, 2.5vw, 36px);
    color: var(--dark);
    font-weight: 700;
}
.shop-archive-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
/* ── TAG / STIJL PAGINA ── */
.tag-breadcrumb-inner {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #bbb;
    margin-bottom: 12px;
}
.tag-breadcrumb-inner a {
    color: #bbb;
    text-decoration: none;
    transition: color .2s;
}
.tag-breadcrumb-inner a:hover { color: var(--primary); }
.tag-breadcrumb-inner span:last-child { color: #999; }
.tag-hero {
    /* Volle breedte; hoger dan voorheen zodat er meer van de
       3:2-sfeerfoto's zichtbaar is (minder ingezoomd gevoel). */
    position: relative;
    height: clamp(390px, 36vw, 660px);
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
}
/* Maxima: het onderwerp zit laag in de foto, uitsnede lager leggen
   zodat de hoekset volledig in beeld is. */
.term-maxima .tag-hero {
    background-position: center 80%;
}
/* Grace: idem, eetset zit onderin de foto. */
.term-grace .tag-hero {
    background-position: center 72%;
}
.tag-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(30,18,8,.75) 0%, rgba(30,18,8,.2) 60%, transparent 100%);
}
.tag-hero-inner {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    padding: 0 40px 50px;
}
.tag-hero-inner .sub {
    color: var(--primary);
    font-size: 12px;
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 10px;
}
.tag-hero-inner h1 {
    font-family: 'Playfair Display', serif;
    font-size: clamp(36px, 5vw, 60px);
    color: white;
    margin-bottom: 14px;
}
.tag-hero-desc {
    font-size: 16px;
    color: white;
    max-width: 600px;
    line-height: 1.7;
    text-shadow: 0 1px 6px rgba(0,0,0,0.4);
}
.tag-products-section {
    background: white;
    padding: 60px 40px 80px;
}
.tag-products-inner {
    max-width: 1200px;
    margin: 0 auto;
}
.tag-products-title {
    margin-bottom: 32px;
    padding-bottom: 24px;
    border-bottom: 1px solid #eee;
}
.tag-products-title .sub {
    font-size: 11px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--primary);
    margin-bottom: 8px;
    display: block;
}
.tag-products-title h3 {
    font-family: 'Playfair Display', serif;
    font-size: 26px;
    color: var(--dark);
    font-weight: 700;
}
.tag-products-title h3 em {
    color: var(--primary);
    font-style: normal;
}
.tag-products-inner .cat-products-grid {
    grid-template-columns: repeat(4, 1fr);
}
.tag-products-inner .product-card {
    border: 1px solid #ececec;
}

/* Andere stijlen carousel */
.tag-other-section {
    background: var(--cream);
    padding: 60px 40px 80px;
}
.tag-other-inner {
    max-width: 1200px;
    margin: 0 auto;
}
.tag-styles-carousel-wrap {
    overflow: hidden;
}
.tag-styles-viewport {
    overflow: hidden;
    flex: 1;
}
.tag-styles-track {
    display: flex;
    gap: 20px;
    transition: transform .4s ease;
}
.tag-style-card {
    flex-shrink: 0;
    width: 220px;
    text-decoration: none;
}
.tag-style-card-img {
    position: relative;
    aspect-ratio: 3/4;
    border-radius: 16px;
    overflow: hidden;
}
.tag-style-card-img img,
.tag-style-card-placeholder {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
    background: #e8ddd4;
}
.tag-style-card:hover .tag-style-card-img img { transform: scale(1.05); }
.tag-style-card-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(45,26,14,.65) 0%, transparent 50%);
    display: flex;
    align-items: flex-end;
    padding: 20px;
    border-radius: 16px;
}
.tag-style-card-overlay h3 {
    font-family: 'Playfair Display', serif;
    color: white;
    font-size: 18px;
    margin: 0;
}

/* Tag intro beschrijving */
.tag-intro {
    background: #c9a97a;
    border-radius: 20px;
    padding: 36px 40px;
    margin-bottom: 28px;
    position: relative;
    overflow: hidden;
}
.tag-intro::before {
    content: '\201C';
    position: absolute;
    top: -10px;
    left: 24px;
    font-family: 'Playfair Display', serif;
    font-size: 120px;
    color: rgba(255,255,255,0.35);
    line-height: 1;
    pointer-events: none;
}
.tag-intro p {
    font-size: 15px;
    line-height: 1.8;
    color: rgba(255,255,255,0.95);
    margin: 0;
    position: relative;
    font-style: italic;
}
.tag-intro-label {
    display: inline-block;
    font-size: 11px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: white;
    margin-bottom: 12px;
    position: relative;
    opacity: 0.8;
}

/* Productgrid binnen categorie */
.cat-products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.cat-products-grid .product-card {
    width: 100%;
}
.cat-products-grid .product-card-img {
    aspect-ratio: 3/2;
}

/* Categoriekaarten in shop archive: exact dezelfde kaart als productkaarten (.product-card) */
.shop-archive-grid .product-card {
    width: 100%;
}

/* Sidebar */
.shop-sidebar {
    position: sticky;
    top: 100px;
}
.shop-sidebar-block {
    background: white;
    border-radius: 16px;
    padding: 24px;
}
.shop-sidebar-title {
    font-family: 'Playfair Display', serif;
    font-size: 16px;
    color: var(--dark);
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eee;
}
.shop-sidebar-cats {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.shop-sidebar-cats li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 10px;
    border-radius: 8px;
    color: var(--text);
    font-size: 14px;
    text-decoration: none;
    transition: background .2s, color .2s;
}
.shop-sidebar-cats li a:hover,
.shop-sidebar-cats li.active a {
    background: var(--cream);
    color: var(--primary);
}
.shop-sidebar-cats li a span {
    font-size: 12px;
    color: #bbb;
}

/* ── FEATURED PRODUCTS ── */
.featured-section {
    background: var(--cream);
    padding: 80px 40px;
}
.featured-inner { max-width: 1200px; margin: 0 auto; }
.products-carousel-wrapper {
    display: flex;
    justify-content: center;
}
.products-carousel-viewport {
    overflow: hidden;
    padding: 12px 0;
}
.products-carousel {
    display: flex;
    gap: 24px;
    transition: transform 0.4s ease;
    will-change: transform;
}
.product-card {
    background: white;
    /* nodig voor de over-de-hele-kaart-uitgerekte productlink hieronder */
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    flex-shrink: 0;
    width: 210px;
    transition: box-shadow .3s, transform .3s;
    cursor: pointer;
    display: flex;
    flex-direction: column;
}
.product-card-footer { margin-top: auto; }
.product-card:hover {
    box-shadow: 0 10px 30px rgba(45,26,14,.12);
    transform: translateY(-3px);
}
.product-card-img {
    position: relative;
    aspect-ratio: 3/2;
    overflow: hidden;
    /* zelfde wit als de genormaliseerde productfoto's, dan valt 'contain' niet op */
    background: #fefefe;
}
.product-card-img img {
    width: 100%; height: 100%;
    object-fit: contain;
    object-position: center;
    /* iets inzoomen: snijdt alleen de witmarge van de foto weg, nooit het product
       (marge is 11% per kant, 1.18 kost 9% per kant) */
    transform: scale(1.15) translateY(2%);
    transition: transform .5s;
}
.product-card:hover .product-card-img img { transform: scale(1.21) translateY(2%); }
.product-badge {
    position: absolute;
    top: 10px; left: 10px;
    background: var(--dark);
    color: white;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 3px 7px;
    text-transform: uppercase;
}
.product-card-body { padding: 14px; }
.product-card-body h4 {
    font-family: 'Playfair Display', serif;
    font-size: 15px;
    color: var(--dark);
    margin-bottom: 4px;
}
.product-card-body .collection {
    font-size: 10px;
    color: var(--primary);
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.product-card-body .price {
    font-size: 16px;
    font-weight: 700;
    color: var(--dark);
}
.product-card-body .price-old {
    font-size: 12px;
    color: #999;
    text-decoration: line-through;
    margin-left: 6px;
}
.product-card-footer {
    padding: 0 14px 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.btn-cart {
    background: var(--primary);
    color: white;
    border: none;
    padding: 10px 24px;
    font-size: 12px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border-radius: 20px;
    cursor: pointer;
    transition: background .2s;
}
.btn-cart:hover { background: var(--primary-hover); }
.btn-cart--outline {
    background: transparent;
    color: var(--primary);
    border: 1.5px solid var(--primary);
}
.btn-cart--outline:hover { background: var(--primary); color: white; }

/* Impressiefoto's per collectie */
.collectie-impressie { padding: 20px 40px 70px; background: white; }
.collectie-impressie-inner { max-width: 1200px; margin: 0 auto; }
.collectie-impressie-inner h3 {
    font-family: 'Playfair Display', serif;
    font-size: 26px;
    color: var(--dark);
    font-weight: 700;
    margin-bottom: 24px;
}
.collectie-impressie-inner h3 em { color: var(--primary); font-style: normal; }
.collectie-impressie-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(4, 1fr);
}
.collectie-impressie-grid--1 { grid-template-columns: 1fr; }
.collectie-impressie-grid--2 { grid-template-columns: repeat(2, 1fr); }
.collectie-impressie-grid--3 { grid-template-columns: repeat(3, 1fr); }
.collectie-impressie-img {
    border-radius: 14px;
    overflow: hidden;
    aspect-ratio: 4/3;
    border: none;
    padding: 0;
    cursor: pointer;
    display: block;
}
.collectie-impressie-grid--1 .collectie-impressie-img { aspect-ratio: 21/9; }
.collectie-impressie-img img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .5s;
}
.collectie-impressie-img:hover img { transform: scale(1.04); }
@media (max-width: 900px) {
    .collectie-impressie-grid--3, .collectie-impressie-grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .collectie-impressie-grid--2, .collectie-impressie-grid--3, .collectie-impressie-grid--4 { grid-template-columns: 1fr; }
}

/* Lightbox voor impressiefoto's */
.nl-lightbox {
    position: fixed;
    inset: 0;
    background: rgba(20,10,5,.92);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s;
    padding: 40px;
}
.nl-lightbox.active { opacity: 1; visibility: visible; }
.nl-lightbox img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0,0,0,.5);
}
.nl-lightbox-close {
    position: absolute;
    top: 24px;
    right: 32px;
    background: none;
    border: none;
    color: white;
    font-size: 40px;
    line-height: 1;
    cursor: pointer;
    opacity: .8;
}
.nl-lightbox-close:hover { opacity: 1; }

/* "Binnenkort meer" banner onder collectie-grid */
.more-products-banner {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 24px;
    padding: 22px 28px;
    background: var(--bg);
    border-radius: 14px;
}
.more-products-icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: white;
    color: var(--primary);
}
.more-products-text { flex: 1; }
.more-products-text h4 { font-size: 15px; color: var(--dark); margin: 0 0 4px; }
.more-products-text p { font-size: 13px; color: #8a7a6a; line-height: 1.5; margin: 0; }
.more-products-banner .btn-cart { flex-shrink: 0; white-space: nowrap; }
@media (max-width: 600px) {
    .more-products-banner { flex-direction: column; text-align: center; }
}

/* ── BANNER STRIP ── */
.banner-strip {
    background: var(--primary);
    padding: 60px 40px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    max-width: 100%;
}
.banner-strip-item {
    padding: 40px 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.banner-strip-item:first-child { border-right: 1px solid rgba(255,255,255,.2); }
.banner-strip-item .tag {
    font-size: 11px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: rgba(255,255,255,.7);
    margin-bottom: 10px;
}
.banner-strip-item h3 {
    font-family: 'Playfair Display', serif;
    font-size: 32px;
    color: white;
    margin-bottom: 16px;
}
.banner-strip-item p { color: rgba(255,255,255,.8); margin-bottom: 28px; }
.btn-white {
    display: inline-block;
    background: white;
    color: var(--primary);
    padding: 14px 36px;
    font-size: 12px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 700;
    border-radius: 20px;
    align-self: flex-start;
    transition: all .2s;
}
.btn-white:hover { background: var(--primary-hover); color: white; }

/* ── COLLECTIONS ── */
.collections-section { padding: 80px 40px; max-width: 1400px; margin: 0 auto; }
.collections-scroll {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 16px;
}
.collection-item { text-align: center; cursor: pointer; }
.collection-item-img {
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: 50%;
    border: 3px solid var(--border);
    margin-bottom: 12px;
    transition: border-color .2s;
}
.collection-item:hover .collection-item-img { border-color: var(--primary); }
.collection-item-img img { width: 100%; height: 100%; object-fit: cover; }
.collection-item span {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--dark);
}

/* ── CONTACT SECTIE ── */
.contact-section {
    background: #ffffff;
    padding: 70px 40px;
}
.contact-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    gap: 60px;
    align-items: center;
}
.contact-left {
    flex: 0 0 50%;
}
.contact-right {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.contact-map-label {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.contact-map-label strong {
    font-size: 16px;
    font-weight: 700;
    color: var(--dark);
}
.contact-map-label span {
    font-size: 13px;
    color: #888;
}
.contact-map {
    border-radius: 16px;
    overflow: hidden;
}
.contact-map img {
    width: 100%;
    aspect-ratio: 3/2;
    object-fit: cover;
    display: block;
    border-radius: 16px;
}
.contact-map svg {
    width: 100%;
    height: auto;
    display: block;
}
.pin-pulse {
    animation: pin-ring 1.8s ease-out infinite;
    transform-origin: 202px 82px;
}
@keyframes pin-ring {
    0%   { r: 12; opacity: 1; }
    100% { r: 28; opacity: 0; }
}
.contact-inner h2 {
    font-family: 'Playfair Display', serif;
    font-size: 28px;
    color: var(--dark);
    margin-bottom: 36px;
    font-weight: 700;
}
.contact-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}
.contact-card {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 22px 24px;
    border: 1.5px solid #e8e8e8;
    border-radius: 20px;
    color: var(--dark);
    transition: all .2s;
}
.contact-card:hover {
    border-color: var(--primary);
    background: #fdf6f0;
    transform: translateY(-2px);
}
.contact-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #f5ece3;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--dark);
    transition: background .2s;
}
.contact-card:hover .contact-icon { background: var(--primary); color: white; }
.contact-text { display: flex; flex-direction: column; gap: 3px; }
.contact-text strong { font-size: 15px; font-weight: 700; }
.contact-text span { font-size: 13px; color: #888; }

/* ── USP'S ── */
.usps-section {
    background: var(--dark);
    padding: 60px 40px;
}
.usps-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    text-align: center;
}
.usp-item { color: #e8d5c4; }
.usp-item .icon { font-size: 36px; margin-bottom: 16px; color: var(--light); }
.usp-item h4 { font-size: 15px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 8px; color: white; }
.usp-item p { font-size: 13px; opacity: .7; line-height: 1.6; }

/* ── FOOTER BASE ── */
.site-footer {
    padding: 70px 40px 30px;
}
.footer-inner {
    max-width: 1400px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 50px;
    padding-bottom: 50px;
}
.footer-logo-img { height: 80px !important; width: auto !important; max-width: none !important; margin-bottom: 20px; display: block; }
.footer-about { font-size: 14px; line-height: 1.8; margin-bottom: 24px; }
.footer-social { display: flex; gap: 12px; }
.footer-social a {
    width: 36px; height: 36px;
    border-radius: 50%;
    border: 1px solid currentColor;
    display: flex; align-items: center; justify-content: center;
    opacity: .6;
    transition: all .2s;
}
.footer-social a:hover { opacity: 1; }
.footer-col h5 {
    font-size: 11px;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 20px;
    font-weight: 700;
}
.footer-col ul { list-style: none; }
.footer-col ul li { margin-bottom: 10px; }
.footer-col ul li a { font-size: 14px; opacity: .7; transition: opacity .2s; }
.footer-col ul li a:hover { opacity: 1; }
.footer-contact-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}
.footer-contact-list li svg { flex-shrink: 0; opacity: .95; color: #3b342e; }
.footer-about-icon { width: 16px; height: 16px; object-fit: contain; flex-shrink: 0; opacity: .7; }
.footer-contact-list li span { font-size: 14px; opacity: .75; color: #3b342e; }
.footer-payments-img { height: 22px; width: auto; display: block; margin-top: 20px; }
.footer-bottom .footer-payments-img { margin-top: 0; }
.footer-bottom {
    max-width: 1400px;
    margin: 24px auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
}
.footer-bottom-left { display: flex; align-items: center; gap: 12px; }
.footer-bottom-right { display: flex; align-items: center; gap: 12px; }
.footer-opt-1 .footer-bottom a { color: rgba(59,52,46,.75); transition: color .2s; }
.footer-opt-1 .footer-bottom a:hover { color: rgba(59,52,46,1); }
.footer-opt-1 .footer-bottom span { color: rgba(59,52,46,.75); }
.footer-opt-1 .footer-bottom .footer-bottom-sep { color: rgba(59,52,46,.4); }
.footer-opt-1 .footer-designed { color: rgba(59,52,46,.75); }
.footer-opt-1 .footer-designed a { color: rgba(59,52,46,.75); transition: color .2s; }
.footer-opt-1 .footer-designed a:hover { color: rgba(59,52,46,1); }

/* ── OPTIE 1: LUXE WARM ── */
.footer-opt-1 { background: var(--primary); color: #3b342e; }
.footer-opt-1 .footer-inner { border-bottom: 1px solid rgba(59,52,46,.15); }
.footer-opt-1 .footer-logo-img { filter: none; }
.footer-opt-1 .footer-about { color: #3b342e; opacity: .8; }
.footer-opt-1 .footer-col h5 { color: #3b342e; opacity: 1; font-weight: 800; font-size: 12px; }
.footer-opt-1 .footer-col ul li a,
.footer-opt-1 .footer-col ul li span { color: #3b342e; opacity: .75; font-size: 14px; }
.footer-opt-1 .footer-col ul li a:hover { opacity: 1; }
.footer-opt-1 .footer-social a { color: #3b342e; border-color: rgba(59,52,46,.55); opacity: .95; }
.footer-opt-1 .footer-social a:hover { background: #3b342e; border-color: #3b342e; color: white; opacity: 1; }
.footer-opt-1 .footer-payments { border-color: rgba(59,52,46,.15); }
.footer-opt-1 .footer-bottom { color: #3b342e; }

/* ── OPTIE 2: LICHT & WARM ── */
.footer-opt-2 { background: #f5ece3; color: var(--dark); }
.footer-opt-2 .footer-inner { border-bottom: 1px solid rgba(112,62,29,.15); }
.footer-opt-2 .footer-logo-img { filter: none; }
.footer-opt-2 .footer-about { color: var(--dark); opacity: .7; }
.footer-opt-2 .footer-col h5 { color: var(--dark); }
.footer-opt-2 .footer-col ul li a { color: var(--dark); }
.footer-opt-2 .footer-social a { color: var(--dark); }
.footer-opt-2 .footer-social a:hover { background: var(--primary); border-color: var(--primary); color: white; opacity: 1; }
.footer-opt-2 .footer-bottom { color: var(--dark); }

/* ── OPTIE 3: MINIMALISTISCH ── */
.footer-opt-3 { background: #12100e; color: #c4956a; }
.footer-opt-3 .footer-inner { border-bottom: 1px solid rgba(196,149,106,.12); padding-bottom: 40px; }
.footer-opt-3 .footer-logo-img { filter: brightness(10); }
.footer-opt-3 .footer-col h5 { color: rgba(255,255,255,.5); }
.footer-opt-3 .footer-col ul li a { color: #a07850; font-size: 13px; }
.footer-opt-3 .footer-social a { color: #c4956a; }
.footer-opt-3 .footer-social a:hover { background: var(--primary); border-color: var(--primary); color: white; opacity: 1; }
.footer-opt-3 .footer-bottom { color: #c4956a; }
.footer-minimal-inner { grid-template-columns: 1.5fr 1fr 1fr 1fr !important; gap: 40px !important; }
.footer-minimal-links { display: contents; }

/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
    .categories-grid { grid-template-columns: repeat(2, 1fr); }
    .shop-archive-inner { grid-template-columns: 180px 1fr; gap: 28px; }
    .shop-archive-grid { grid-template-columns: repeat(2, 1fr); }
    .category-card.featured { grid-column: span 1; }
    .products-grid { grid-template-columns: repeat(2, 1fr); }
    .collections-scroll { grid-template-columns: repeat(3, 1fr); }
    .usps-inner { grid-template-columns: repeat(2, 1fr); }
    .footer-inner { grid-template-columns: 1fr 1fr; gap: 30px; }
    .banner-strip { grid-template-columns: 1fr; }
    .banner-strip-item:first-child { border-right: none; border-bottom: 1px solid rgba(255,255,255,.2); }
}
@media (max-width: 768px) {
    .header-inner { padding: 0 20px; }
    .header-textlink { display: none; } /* Contact/Inspiratie vallen weg op mobiel; iconen blijven */
    .categories-grid,
    .shop-archive-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
    .shop-archive-inner { grid-template-columns: 1fr; }
    .shop-sidebar { position: static; }
    .products-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
    .collections-scroll { grid-template-columns: repeat(3, 1fr); }
    .usps-inner { grid-template-columns: 1fr 1fr; }
    .footer-inner { grid-template-columns: 1fr; }
}

/* ── INSPIRATIE PAGINA ─────────────────────────────── */
.inspiratie-hero {
    position: relative;
    background-size: cover;
    background-position: center;
    padding: 100px 40px 80px;
    text-align: center;
}
.inspiratie-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(20,10,5,.45) 0%, rgba(20,10,5,.25) 50%, rgba(20,10,5,.55) 100%);
}
.inspiratie-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 700px;
    margin: 0 auto;
}
.inspiratie-hero .sub { color: white; letter-spacing: 2px; text-shadow: 0 1px 8px rgba(0,0,0,.4); }
.inspiratie-hero h1 {
    font-family: 'Playfair Display', serif;
    font-size: 60px;
    color: white;
    margin: 8px 0 20px;
    text-shadow: 0 2px 24px rgba(0,0,0,.3);
}
.inspiratie-intro {
    font-size: 17px;
    color: white;
    line-height: 1.7;
    text-shadow: 0 1px 8px rgba(0,0,0,.4);
}
.inspiratie-section { padding: 60px 40px 100px; background: white; }
.inspiratie-inner { max-width: 1200px; margin: 0 auto; }

/* Collectie-grid (lookbook) */
.inspiratie-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}
.inspiratie-card {
    display: block;
    text-decoration: none;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 4px 20px rgba(45,26,14,.06);
    transition: box-shadow .3s, transform .3s;
}
.inspiratie-card:hover { box-shadow: 0 16px 40px rgba(45,26,14,.14); transform: translateY(-4px); }
.inspiratie-card-img {
    position: relative;
    aspect-ratio: 4/3;
    overflow: hidden;
}
.inspiratie-card-img img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .5s;
}
.inspiratie-card:hover .inspiratie-card-img img { transform: scale(1.05); }
.inspiratie-card-count {
    position: absolute;
    bottom: 12px; left: 12px;
    background: rgba(255,255,255,.92);
    color: var(--dark);
    font-size: 11px;
    font-weight: 600;
    padding: 4px 12px;
    border-radius: 100px;
    letter-spacing: .5px;
}
.inspiratie-card-body { padding: 22px 24px 26px; }
.inspiratie-card-body h2 {
    font-family: 'Playfair Display', serif;
    font-size: 24px;
    color: var(--dark);
    margin: 0 0 8px;
}
.inspiratie-card-body p {
    font-size: 14px;
    color: #7a6a5a;
    line-height: 1.6;
    margin: 0 0 14px;
}
.inspiratie-card-link {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--primary);
}
@media (max-width: 900px) { .inspiratie-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; } }
@media (max-width: 560px) { .inspiratie-grid { grid-template-columns: 1fr; } }

.inspiratie-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.inspiratie-row--reverse { direction: rtl; }
.inspiratie-row--reverse > * { direction: ltr; }

.inspiratie-img {
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 4/3;
}
.inspiratie-img img {
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform .5s;
}
.inspiratie-img:hover img { transform: scale(1.03); }

.inspiratie-text { display: flex; flex-direction: column; gap: 16px; }
.inspiratie-number {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    color: var(--primary);
    text-transform: uppercase;
}
.inspiratie-text h2 {
    font-family: 'Playfair Display', serif;
    font-size: 36px;
    color: var(--dark);
    margin: 0;
}
.inspiratie-text p {
    font-size: 16px;
    color: #7a6a5a;
    line-height: 1.75;
    margin: 0;
}

@media (max-width: 768px) {
    .inspiratie-row, .inspiratie-row--reverse { grid-template-columns: 1fr; direction: ltr; }
    .inspiratie-hero h1 { font-size: 36px; }
}

/* ── PRODUCT DETAIL PAGE ───────────────────────────── */
.pdp-wrap { background: white; }
.pdp-breadcrumb {
    padding: 24px 40px 0;
}
.pdp-breadcrumb-inner {
    max-width: 1100px;
    margin: 0 auto;
}
.pdp-breadcrumb .woocommerce-breadcrumb {
    font-size: 12px;
    letter-spacing: .3px;
    color: #b5a89a;
    margin: 0;
    text-align: left;
}
.pdp-breadcrumb .woocommerce-breadcrumb a {
    color: #b5a89a;
    text-decoration: none;
    transition: color .2s;
}
.pdp-breadcrumb .woocommerce-breadcrumb a:hover { color: var(--primary); }
.pdp-inner {
    max-width: 1100px;
    margin: 0 auto;
    padding: 60px 40px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}

/* Gallery */
.pdp-main-img {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 4/3;
    /* zelfde wit als de productfoto's; contain + zoom binnen de witmarge (zie kaarten) */
    background: #fefefe;
    cursor: zoom-in;
}
.pdp-main-img .product-wishlist {
    top: 14px;
    right: 14px;
}
.pdp-main-img img {
    width: 100%; height: 100%;
    object-fit: contain;
    transform: scale(1.15);
    transition: transform .25s ease-out;
}

/* Lightbox */
.pdp-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(20, 14, 8, .92);
    z-index: 9999;
    align-items: center;
    justify-content: center;
}
.pdp-lightbox.open { display: flex; }
.pdp-lightbox img {
    max-width: 88vw;
    max-height: 88vh;
    object-fit: contain;
    border-radius: 8px;
}
.pdp-lightbox-close,
.pdp-lightbox-prev,
.pdp-lightbox-next {
    position: absolute;
    background: rgba(255,255,255,.12);
    border: none;
    color: #fff;
    cursor: pointer;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    font-size: 28px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .2s;
}
.pdp-lightbox-close:hover,
.pdp-lightbox-prev:hover,
.pdp-lightbox-next:hover { background: rgba(255,255,255,.25); }
.pdp-lightbox-close { top: 24px; right: 24px; }
.pdp-lightbox-prev { left: 24px; top: 50%; transform: translateY(-50%); }
.pdp-lightbox-next { right: 24px; top: 50%; transform: translateY(-50%); }
.pdp-thumbs {
    display: flex;
    gap: 10px;
    margin-top: 12px;
    flex-wrap: wrap;
}
.pdp-thumb {
    width: 72px; height: 72px;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    transition: border-color .2s;
}
.pdp-thumb.active,
.pdp-thumb:hover { border-color: var(--primary); }
.pdp-thumb img { width: 100%; height: 100%; object-fit: cover; }

/* Info */
.pdp-cat {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--primary);
    display: block;
    margin-bottom: 10px;
}
.pdp-tags { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 12px; margin-bottom: 20px; }
.pdp-tags-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.pdp-tags-label { font-size: 12px; font-weight: 600; color: #999; }
.pdp-tag {
    font-size: 11px;
    padding: 3px 10px;
    border-radius: 999px;
    border: 1px solid var(--border);
    color: var(--mid);
    text-decoration: none;
    transition: border-color .2s, color .2s;
}
.pdp-tag:hover { border-color: var(--primary); color: var(--primary); }
.pdp-title {
    font-family: 'Playfair Display', serif;
    font-size: 36px;
    color: var(--dark);
    margin: 0 0 16px;
    line-height: 1.2;
}
.pdp-price {
    font-size: 26px;
    font-weight: 700;
    color: var(--dark);
    margin-bottom: 20px;
}
.pdp-price .woocommerce-Price-amount { font-size: inherit; }
.pdp-short-desc {
    font-size: 15px;
    color: #6b5a4e;
    line-height: 1.75;
    margin-bottom: 28px;
}
.pdp-actions {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    margin-bottom: 32px;
}
.pdp-actions .cart { display: flex; gap: 12px; align-items: center; }
.pdp-actions { position: relative; }
.pdp-actions > form.cart { flex: 1; }
.pdp-whatsapp {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 12px;
    border: 1.5px solid var(--border);
    color: var(--dark);
    flex-shrink: 0;
    transition: border-color .2s, color .2s;
}
.pdp-whatsapp:hover { border-color: #25d366; color: #25d366; }
.pdp-actions .quantity { flex-shrink: 0; }
.pdp-actions .quantity input {
    width: 64px !important;
    height: 50px !important;
    border: 1.5px solid var(--border) !important;
    border-radius: 10px !important;
    text-align: center !important;
    line-height: 50px !important;
    padding: 0 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--dark) !important;
    background: white !important;
    font-family: 'Lato', sans-serif !important;
    display: block !important;
}
.pdp-actions .single_add_to_cart_button,
.pdp-actions button[type="submit"] {
    background: var(--primary) !important;
    color: white !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 14px 32px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: background .2s !important;
    flex: 1 !important;
}
.pdp-actions .single_add_to_cart_button:hover { background: var(--primary-hover) !important; }

/* Paginering shop-archieven */
.shop-pagination {
    display: flex;
    justify-content: center;
    margin-top: 40px;
}
.shop-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    margin: 0 4px;
    padding: 0 12px;
    border: 1.5px solid var(--border);
    border-radius: 10px;
    color: var(--dark);
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    transition: all .2s;
}
.shop-pagination .page-numbers:hover { border-color: var(--primary); color: var(--primary); }
.shop-pagination .page-numbers.current {
    background: var(--primary);
    border-color: var(--primary);
    color: white;
}
.shop-pagination .page-numbers.dots { border: none; }

/* Specificaties-tab: tabel links, toelichting rechts */
.pdp-specs-cols {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 48px;
    align-items: start;
}
@media (max-width: 900px) {
    .pdp-specs-cols { grid-template-columns: 1fr; gap: 24px; }
}

/* Specificaties-tab: lijstjes en alinea's */
.pdp-tab-content ul {
    margin: 0 0 18px;
    padding-left: 20px;
}
.pdp-tab-content ul li { margin-bottom: 8px; }
.pdp-tab-content p { margin-bottom: 14px; }

/* Variabele producten (kleur-dropdown etc.) */
.pdp-actions:has(form.variations_form) { align-items: flex-end; }
.pdp-actions form.variations_form {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.pdp-actions .variations { width: 100%; border-collapse: collapse; margin: 0; }
.pdp-actions .variations tbody { display: flex; flex-wrap: wrap; gap: 0 20px; }
.pdp-actions .variations tr { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; align-items: flex-start; }
.pdp-actions .variations th,
.pdp-actions .variations td { padding: 0; border: none; text-align: left; }
.pdp-actions .variations label {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--dark);
}
.pdp-actions .variations select {
    width: 100%;
    max-width: 240px;
    height: 42px;
    border: 1.5px solid var(--border);
    border-radius: 10px;
    padding: 0 12px;
    font-size: 14px;
    color: var(--dark);
    background: white;
    font-family: 'Lato', sans-serif;
    cursor: pointer;
}
.pdp-actions .variations select:focus { outline: none; border-color: var(--primary); }
.pdp-actions .reset_variations { font-size: 12px; color: var(--primary); margin-top: 4px; display: inline-block; }
.pdp-actions .woocommerce-variation-price { margin-bottom: 12px; font-size: 18px; font-weight: 600; color: var(--dark); }
.pdp-actions .woocommerce-variation-availability { font-size: 13px; color: var(--primary); }
.pdp-actions .single_variation_wrap { width: 100%; }
.pdp-actions .woocommerce-variation-add-to-cart {
    display: flex;
    gap: 12px;
    align-items: center;
    width: 100%;
}
/* Knop altijd in huisstijlkleur, ook zolang er nog geen kleur gekozen is */
.pdp-actions .single_add_to_cart_button.disabled,
.pdp-actions .single_add_to_cart_button:disabled {
    background: var(--primary) !important;
    opacity: 1 !important;
}
.pdp-offerte {
    text-align: center;
    font-size: 13px;
    color: var(--primary);
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color .2s;
}
.pdp-offerte:hover { color: var(--dark); }

/* USPs */
.pdp-usps {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 24px;
    border-radius: 12px;
    overflow: hidden;
    background: #f4f4f4;
    padding: 4px 0;
}
.pdp-usp {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    padding: 10px 18px;
}
.pdp-usp::before {
    content: '';
    width: 16px; height: 16px;
    flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}
.pdp-usps-payments {
    padding: 12px 18px 14px;
    border-top: 1px solid #e0e0e0;
    margin-top: 4px;
}
.pdp-usps-payments img { height: 20px; width: auto; }

/* Tabs */
.pdp-tabs-section {
    background: var(--bg);
    padding: 60px 40px;
}
.pdp-tabs-inner { max-width: 1100px; margin: 0 auto; }
.pdp-tab-nav {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--border);
    margin-bottom: 36px;
}
.pdp-tab-btn {
    background: none;
    border: none;
    padding: 12px 28px;
    font-size: 14px;
    font-weight: 600;
    color: #999;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: color .2s, border-color .2s;
    font-family: 'Lato', sans-serif;
}
.pdp-tab-btn.active { color: var(--dark); border-bottom-color: var(--primary); }
.pdp-tab-content { display: none; }
.pdp-tab-content.active { display: block; }
.pdp-tab-content p { font-size: 15px; color: #6b5a4e; line-height: 1.8; margin-bottom: 16px; }
.pdp-tab-content a {
    color: var(--primary);
    text-decoration: underline;
    display: inline;
    margin: 0;
    padding: 0;
    white-space: normal;
    word-spacing: normal;
}

/* Specs table */
.pdp-specs-table { width: 100%; border-collapse: collapse; }
.pdp-specs-table tr { border-bottom: 1px solid var(--border); }
.pdp-specs-table th {
    text-align: left;
    padding: 12px 0;
    font-size: 13px;
    font-weight: 700;
    color: var(--dark);
    width: 200px;
}
.pdp-specs-table td {
    padding: 12px 0;
    font-size: 14px;
    color: #6b5a4e;
}

/* Related */
.pdp-related { padding: 60px 40px; background: white; }
.pdp-related-inner { max-width: 1100px; margin: 0 auto; }
.pdp-related-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-top: 40px;
}

@media (max-width: 900px) {
    .pdp-inner { grid-template-columns: 1fr; padding: 40px 20px; }
    .pdp-related-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── PAGE TEMPLATE ── */
.page-main { min-height: 60vh; background: var(--bg); padding: 60px 40px; }
.page-inner { max-width: 1100px; margin: 0 auto; }
body.woocommerce-page .page-inner,
body.woocommerce-cart .page-inner,
body.woocommerce-checkout .page-inner,
body.woocommerce-account .page-inner { max-width: 1200px; }
.page-title { font-family: 'Playfair Display', serif; color: var(--dark); margin-bottom: 32px; font-size: clamp(28px,4vw,42px); }
.page-content h2 { font-family: 'Playfair Display', serif; color: var(--dark); font-size: 26px; margin: 40px 0 16px; }
.page-content h3 { font-family: 'Playfair Display', serif; color: var(--dark); font-size: 19px; margin: 32px 0 12px; }
.page-content p { color: var(--text); font-size: 16px; line-height: 1.85; margin-bottom: 20px; }
.page-content ul, .page-content ol { color: var(--text); font-size: 16px; line-height: 1.85; margin: 0 0 20px 24px; }
.page-content li { margin-bottom: 8px; }
.page-content a { color: var(--primary); text-decoration: underline; }
.page-content h4 { color: var(--dark); font-size: 16px; font-weight: 600; margin: 24px 0 8px; }
.page-cta { margin-top: 28px; }
.page-content .btn-primary { color: #fff; text-decoration: none; padding: 11px 24px; font-size: 12px; letter-spacing: 1.2px; }
.page-content h2:first-child, .page-content h3:first-child { margin-top: 0; }
@media (max-width: 768px) { .page-main { padding: 40px 24px; } }

/* ── WOOCOMMERCE CART / CHECKOUT BUTTONS ── */
.wc-proceed-to-checkout .checkout-button,
.woocommerce .checkout-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    background: var(--primary) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 12px 32px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    width: auto !important;
    display: inline-block !important;
    transition: background .2s !important;
    box-shadow: none !important;
}
.wc-proceed-to-checkout .checkout-button:hover,
.woocommerce .checkout-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    background: var(--dark) !important;
    color: #ffffff !important;
}
.wc-proceed-to-checkout {
    text-align: right;
    padding: 0 !important;
}

/* Coupon button – subtiel */
.woocommerce .coupon .button {
    background: transparent !important;
    color: var(--primary) !important;
    border: 1.5px solid var(--primary) !important;
    border-radius: 20px !important;
    padding: 8px 20px !important;
    font-size: 13px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    font-weight: 600 !important;
    width: auto !important;
}
.woocommerce .coupon .button:hover {
    background: var(--primary) !important;
    color: #fff !important;
}

/* Coupon sectie – gestapeld formulier */
.woocommerce .coupon {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    max-width: 360px;
}
.woocommerce .coupon input.input-text {
    width: 100% !important;
    border: 1.5px solid #ddd !important;
    border-radius: 20px !important;
    padding: 10px 18px !important;
    font-size: 14px !important;
    outline: none !important;
    font-family: 'Lato', sans-serif !important;
    color: var(--text) !important;
    background: #fff !important;
}
.woocommerce .coupon input.input-text:focus {
    border-color: var(--primary) !important;
}
.woocommerce .coupon .button {
    width: 100% !important;
    background: var(--primary) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 11px 20px !important;
    font-size: 13px !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    text-align: center !important;
    cursor: pointer !important;
}
.woocommerce .coupon .button:hover {
    background: var(--dark) !important;
    color: #fff !important;
}

/* ── CHECKOUT: INLOG BLOK ── */
.nl-checkout-login {
    background: #fff;
    border: 1.5px solid var(--border);
    border-radius: 12px;
    padding: 16px 20px;
    margin-bottom: 24px;
}
.nl-checkout-login-inner {
    display: flex;
    align-items: center;
    gap: 12px;
}
.nl-checkout-login-icon {
    width: 40px; height: 40px;
    border-radius: 50%;
    background: var(--cream);
    display: flex; align-items: center; justify-content: center;
    color: var(--primary);
    flex-shrink: 0;
}
.nl-checkout-login-text { font-size: 14px; color: var(--text); }
.nl-checkout-login-toggle {
    color: var(--primary);
    font-weight: 700;
    text-decoration: underline;
    cursor: pointer;
}
.nl-checkout-login-form { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }

/* ── CHECKOUT: PARTICULIER / ZAKELIJK ── */
.nl-customer-type { margin-bottom: 24px; }
.nl-customer-type-label {
    font-weight: 700;
    font-size: 15px;
    color: var(--dark);
    margin-bottom: 10px;
}
.nl-customer-type-options { display: flex; gap: 12px; }
.nl-customer-type-opt {
    flex: 1;
    border: 1.5px solid var(--border);
    border-radius: 10px;
    padding: 12px 16px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
    text-align: center;
    transition: all .2s;
}
.nl-customer-type-opt input { display: none; }
.nl-customer-type-opt.active {
    border-color: var(--primary);
    background: var(--cream);
    color: var(--dark);
}

/* ── WOOCOMMERCE FORM VELDEN ── */
.woocommerce .woocommerce-checkout .form-row input.input-text,
.woocommerce .woocommerce-checkout .form-row select,
.woocommerce .woocommerce-checkout .form-row textarea,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea {
    width: 100%;
    border: 1.5px solid var(--border) !important;
    border-radius: 10px !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    font-family: 'Lato', sans-serif !important;
    color: var(--text) !important;
    background: #ffffff !important;
    box-shadow: none !important;
    outline: none !important;
    transition: border-color .2s !important;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row select:focus,
.woocommerce form .form-row textarea:focus {
    border-color: var(--primary) !important;
}
.woocommerce form .form-row label {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--dark) !important;
    margin-bottom: 6px !important;
    display: block !important;
}
.woocommerce form .form-row {
    margin-bottom: 16px !important;
}
.woocommerce-additional-fields {
    margin-top: 28px !important;
}
.woocommerce-billing-fields h3,
.woocommerce-additional-fields h3 {
    font-family: 'Playfair Display', serif !important;
    font-size: 20px !important;
    color: var(--dark) !important;
    margin-bottom: 20px !important;
}

/* ── CHECKOUT ORDER REVIEW ── */
.nl-order-review {
    background: #fff;
    border: 1.5px solid var(--border);
    border-radius: 16px;
    padding: 24px;
}
.nl-order-review-title {
    font-family: 'Playfair Display', serif;
    font-size: 18px;
    color: var(--dark);
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border);
}
.nl-order-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
}
.nl-order-item-img {
    position: relative;
    width: 60px;
    height: 60px;
    flex-shrink: 0;
    border-radius: 8px;
    overflow: hidden;
    background: var(--cream);
}
.nl-order-item-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.nl-order-item-qty {
    position: absolute;
    top: -6px;
    right: -6px;
    background: var(--dark);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.nl-order-item-info {
    flex: 1;
}
.nl-order-item-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--dark);
    display: block;
}
.nl-order-item-price {
    font-size: 14px;
    font-weight: 700;
    color: var(--dark);
    white-space: nowrap;
}
.nl-order-totals {
    margin-top: 16px;
}
.nl-order-total-row {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    padding: 6px 0;
    color: var(--text);
}
.nl-order-grand-total {
    font-size: 16px;
    font-weight: 700;
    color: var(--dark);
    border-top: 1.5px solid var(--border);
    margin-top: 8px;
    padding-top: 12px;
}

/* ── CHECKOUT TWEE-KOLOM LAYOUT ── */
.woocommerce-checkout.woocommerce {
    max-width: 1200px;
    margin: 0 auto;
}
form.woocommerce-checkout {
    display: grid;
    grid-template-columns: 1fr 400px;
    grid-template-rows: auto;
    gap: 40px;
    align-items: start;
}
form.woocommerce-checkout #customer_details {
    grid-column: 1;
    grid-row: 1;
}
form.woocommerce-checkout #order_review_heading {
    display: none;
}
form.woocommerce-checkout #order_review {
    grid-column: 2;
    grid-row: 1;
    position: sticky;
    top: 100px;
}

/* Checkout: customer details als één kolom */
.woocommerce-checkout #customer_details {
    display: block !important;
}
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.woocommerce-checkout #customer_details .col-2 {
    margin-top: 0 !important;
}

/* Betaalsectie: zelfde witte kaart als de rest van de checkout
   (idioom .nl-checkout-login: wit, 1.5px rand, radius 12px), methodes als
   dropdown (js/main.js bouwt een select; de originele radio's blijven
   verborgen aanwezig voor WooCommerce's eigen logica) */
form.woocommerce-checkout #payment {
    margin-top: 32px;
    background: #fff !important;
    border: 1.5px solid var(--border);
    border-radius: 12px !important;
    padding: 20px;
}
#payment ul.wc_payment_methods {
    padding: 0 !important;
    margin: 0 !important;
    border-bottom: none !important;
    background: transparent !important;
}
.wc_payment_methods.nl-payment-as-dropdown li > input.input-radio,
.wc_payment_methods.nl-payment-as-dropdown li > label {
    display: none !important;
}
.wc_payment_methods.nl-payment-as-dropdown li {
    list-style: none;
    margin: 0;
    padding: 0;
}
#payment div.payment_box {
    background: var(--cream) !important;
    border-radius: 10px !important;
    color: var(--text) !important;
    font-size: 13px !important;
    line-height: 1.6;
    padding: 12px 16px !important;
    margin: 10px 0 0 !important;
}
#payment div.payment_box::before {
    display: none !important; /* grijze standaard-pijlpunt */
}
#nl-payment-select-row {
    margin: 0;
}
#nl-payment-select-row label {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark);
    margin-bottom: 6px;
    display: block;
}
#nl-payment-select {
    width: 100%;
    border: 1.5px solid var(--border) !important;
    border-radius: 10px !important;
    padding: 12px 44px 12px 16px !important;
    font-size: 14px !important;
    font-family: 'Lato', sans-serif !important;
    color: var(--text) !important;
    background-color: #ffffff !important;
    outline: none !important;
    transition: border-color .2s;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23bb8f6c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
}
#nl-payment-select:focus {
    border-color: var(--primary) !important;
}
/* Iconenrij onder de dropdown: klikbare snelkeuze, actieve methode licht op */
#nl-payment-icons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}
.nl-payment-icon {
    background: #fff;
    border: 1.5px solid var(--border);
    border-radius: 8px;
    padding: 5px 9px;
    cursor: pointer;
    opacity: .45;
    transition: opacity .2s, border-color .2s;
    display: flex;
    align-items: center;
    line-height: 0;
}
.nl-payment-icon img {
    height: 20px;
    width: auto;
    display: block;
}
.nl-payment-icon:hover { opacity: .85; }
.nl-payment-icon.active {
    opacity: 1;
    border-color: var(--primary);
}
/* Privacytekst + voorwaarden in dezelfde toon als de rest */
#payment .place-order {
    padding: 0 !important;
    margin: 18px 0 0 !important;
}
#payment .woocommerce-privacy-policy-text p {
    font-size: 13px;
    color: var(--text);
    line-height: 1.7;
    margin-bottom: 14px;
}
#payment .woocommerce-terms-and-conditions-wrapper .form-row {
    padding: 0;
    margin: 0 0 16px;
}
#payment .woocommerce-terms-and-conditions-wrapper label.woocommerce-form__label-for-checkbox {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: var(--text) !important;
    line-height: 1.6;
    cursor: pointer;
}
#payment .woocommerce-terms-and-conditions-wrapper input[type="checkbox"] {
    margin: 3px 0 0 !important;
    flex-shrink: 0;
}
#payment button#place_order {
    width: 100%;
    margin-top: 0;
}

#ship-to-different-address {
    margin: 4px 0 0 3px !important;
    padding: 0 !important;
    border: none !important;
    font-family: 'Lato', sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

#ship-to-different-address label {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    cursor: pointer;
    font-size: 14px;
    color: #3a2e1e;
    margin: 0 !important;
    padding: 0 !important;
}

#ship-to-different-address-checkbox {
    margin: 0 !important;
    position: relative !important;
    top: 0 !important;
}



/* ── WISHLIST HARTJE ── */
.product-wishlist {
    position: absolute;
    /* boven de uitgerekte kaartlink, anders vangt die de klik op het hartje */
    z-index: 2;
    top: 10px;
    right: 10px;
    background: rgba(255,255,255,0.95);
    border: none;
    border-radius: 50%;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #2d1a0e;
    transition: all .2s;
    z-index: 2;
    padding: 0;
    line-height: 1;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.product-wishlist:hover { color: #e05a5a; transform: scale(1.1); }
.product-wishlist.active { color: #e05a5a; }
.product-card-metas { display: flex; flex-direction: column; gap: 2px; margin-top: 6px; }
.product-card-meta { font-size: 11px; color: #aaa; line-height: 1.4; }
.pmc-label { font-weight: 600; color: #bbb; }
.product-wishlist.active svg { fill: #e05a5a; }

/* Incl. BTW label na prijs */
.woocommerce-Price-amount + .tax-label,
.price .woocommerce-Price-amount::after {
    font-size: 11px;
    color: #999;
    font-weight: 400;
    margin-left: 3px;
}

/* Verberg "(optioneel)" op smalle velden */
.form-row-name-infix .optional { display: none !important; }

/* Verberg standaard "Factuurgegevens" kop van WooCommerce */
/* WooCommerce notices */
.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
    border-top-color: var(--primary) !important;
    background: white !important;
    color: var(--text) !important;
}
.woocommerce-info::before,
.woocommerce-message::before {
    color: var(--primary) !important;
}

.woocommerce-billing-fields > h3:not(.nl-checkout-heading) { display: none !important; }

#nl-zakelijk-fields {
    flex-wrap: wrap !important;
    gap: 0 16px !important;
    align-items: flex-start !important;
    margin-bottom: 4px;
}
#nl-zakelijk-fields .form-row {
    float: none !important;
    clear: none !important;
    box-sizing: border-box !important;
    margin-bottom: 16px !important;
}
#nl-zakelijk-fields .form-row-first,
#nl-zakelijk-fields .form-row-last {
    flex: 0 0 calc(50% - 8px) !important;
    width: calc(50% - 8px) !important;
    max-width: calc(50% - 8px) !important;
}

/* Checkout veld-layout staat inline in wp_head (zie functions.php) */

/* Sectiekoppen */
.nl-checkout-heading {
    font-family: 'Playfair Display', serif;
    font-size: 20px;
    font-weight: 700;
    color: var(--dark);
    margin: 0 0 18px;
}
.nl-checkout-heading-row {
    margin-top: 14px !important;
    padding-top: 22px !important;
    border-top: 1px solid #eee;
    margin-bottom: 0 !important;
}
.nl-checkout-heading-row .nl-checkout-heading {
    margin-bottom: 0;
}

/* Particulier/Zakelijk radio stijl */
.nl-customer-type { margin-bottom: 24px; }
.nl-customer-type-options { display: flex; gap: 8px; align-items: center; }
.nl-customer-type-radio {
    cursor: pointer;
}
.nl-customer-type-radio input[type="radio"] {
    display: none;
}
.nl-customer-type-radio span {
    display: inline-block;
    padding: 8px 22px;
    border-radius: 999px;
    border: 1.5px solid var(--border);
    font-size: 14px;
    font-weight: 600;
    color: var(--mid);
    background: white;
    cursor: pointer;
    transition: all .2s;
    user-select: none;
}
.nl-customer-type-radio input[type="radio"]:checked + span {
    background: var(--primary);
    border-color: var(--primary);
    color: white;
}

/* Verberg oude toggle stijlen */
.nl-customer-type-opt { display: none !important; }

/* ===== Over ons ===== */
.about-section { background: var(--bg); padding: 80px 40px; }
.about-inner { max-width: 1200px; margin: 0 auto; }
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.about-text p { color: var(--text); font-size: 16px; line-height: 1.9; margin-bottom: 28px; }
.about-intro {
    font-family: 'Playfair Display', serif;
    font-size: 22px !important;
    line-height: 1.6 !important;
    color: var(--dark) !important;
    background: var(--cream);
    border-left: 3px solid var(--primary);
    border-radius: 0 12px 12px 0;
    padding: 28px 32px;
    margin-bottom: 36px !important;
}
.about-tagline { font-family: 'Playfair Display', serif; font-style: italic; font-size: 20px !important; color: var(--primary) !important; margin-top: 40px; }
.about-cta { margin-top: 32px; }
.about-image { position: sticky; top: 120px; }
.about-image img { width: 100%; height: auto; display: block; border-radius: 16px; }
@media (max-width: 900px) {
    .about-section { padding: 56px 24px; }
    .about-grid { grid-template-columns: 1fr; gap: 40px; }
    .about-intro { font-size: 19px !important; padding: 20px 22px; }
    .about-image { position: static; order: -1; }
}

/* ===== Service pagina layout (tekst + sticky adviseur) ===== */
.service-layout { display: grid; grid-template-columns: 1fr 300px; gap: 64px; max-width: 1200px; margin: 0 auto; padding: 60px 40px; background: var(--bg); min-height: 60vh; align-items: start; }
.service-content .page-title { font-family: 'Playfair Display', serif; color: var(--dark); margin-bottom: 32px; font-size: clamp(28px,4vw,42px); }
.service-sidebar { position: sticky; top: 120px; }

.advisor-card { background: #2c1d10; border-radius: 24px; padding: 36px 28px; text-align: center; }
.advisor-logo { margin: 0 auto 24px; display: flex; align-items: center; justify-content: center; }
.advisor-logo img { width: 180px; max-width: 100%; height: auto; }
.advisor-tagline { color: rgba(255,255,255,.85); font-size: 14px; line-height: 1.6; margin-bottom: 24px; }
.advisor-btns { display: flex; flex-direction: column; gap: 10px; }
.advisor-btn { display: flex; align-items: center; justify-content: center; gap: 8px; background: rgba(255,255,255,.1); color: #fff; border-radius: 20px; padding: 11px 18px; font-size: 14px; font-weight: 500; text-decoration: none; transition: background .2s; }
.advisor-btn:hover { background: rgba(255,255,255,.22); }

@media (max-width: 960px) {
    .service-layout { grid-template-columns: 1fr; padding: 40px 24px; gap: 40px; }
    .service-sidebar { position: static; }
    .advisor-card { max-width: 320px; margin: 0 auto; }
}

/* Normaal &-teken i.p.v. het sierlijke cursieve glyph van Playfair Display */
.amp {
    font-family: 'Lato', Arial, sans-serif;
    font-style: normal;
}

/* Normaal &-teken i.p.v. het sierlijke cursieve glyph van Playfair Display */
@font-face {
    font-family: 'PlayfairAmpFix';
    src: local('Lato'), local('Arial');
    unicode-range: U+0026;
    font-weight: 400 700;
}
.category-card-overlay h3,
.tag-style-card-overlay h3,
.inspiratie-card-body h2,
.collection-circle span,
.product-card-body h4,
.pdp-title {
    font-family: 'PlayfairAmpFix', 'Playfair Display', serif;
}

/* Gebruiksaanwijzing-tab: genummerde stappen + intro/outro-notities */
.pdp-usage-steps {
    counter-reset: usage-step;
    list-style: none;
    margin: 0 0 20px;
    padding: 0;
}
.pdp-usage-steps li {
    counter-increment: usage-step;
    display: flex;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid #f0e8de;
}
.pdp-usage-steps li::before {
    content: counter(usage-step);
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--primary);
    color: white;
    font-size: 13px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pdp-usage-note {
    background: var(--bg);
    border-left: 3px solid var(--primary);
    border-radius: 0 8px 8px 0;
    padding: 12px 18px;
    font-size: 14px;
    font-style: italic;
    color: #7a6a5a;
    margin-bottom: 16px;
}
.pdp-usage-note a { color: var(--primary); }

/* Hele kaart klikbaar op plekken waar de kaart zelf geen link is (homepage,
   blogindex): de knop-link rekt zich over de kaart uit. Geen link in een link,
   dus geldige HTML; het hartje ligt er met z-index 2 bovenop. */
.product-card > .product-card-footer a.btn-cart::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
}