/* ==========================================================================
   Xieje Creatieve Producties – Divi child theme
   Styling voor de geïmporteerde Divi-layouts (homepage, Theme Builder-header en -footer).

   Werking: elke Divi-sectie/rij/kolom/module in de layouts heeft een CSS-klasse
   (Geavanceerd > CSS-ID en klassen) die met "xj-" begint. Deze stylesheet geeft die
   klassen de look van het ontwerp. Wil je iets in Divi zelf aanpassen (kleur, tekst,
   afbeelding): gewoon doen. Maten/afstanden van secties, rijen en kolommen worden hier
   met !important vastgezet, zodat Divi-standaarden (4% padding, 1080px rijbreedte,
   kolom-floats) het ontwerp niet verschuiven.

   Inhoud
   0. Variabelen en basis
   1. Divi-structuur (sectie / rij / kolom / module) voor xj-klassen
   2. Typografie-componenten (eyebrow, titels, labels)
   3. Knoppen
   4. Linnen-textuur
   5. Topbalk  6. Header + menu + winkelmand  7. Hero  8. Categoriekaarten
   9. Twee manieren  10. Maakproces  11. Atelier  12. Klantreactie
   13. Contact + terugbelformulier  14. Footer  15. Responsive
   16. WooCommerce (basis)  17. Reduced motion
   ========================================================================== */

/* ---------- 0. Variabelen en basis ---------- */
:root {
  --cream: #f7f2ec;
  --cream-header: #f8f3ed;
  --white: #ffffff;
  --paper: #fbf9f4;
  --linen: #e6ddcc;
  --ink: #2a2826;
  --ink-soft: #3a3631;
  --muted: #5a5855;
  --gold: #b08d57;
  --gold-line: #a89a78;
  --gold-text: #6a5a3f;
  --line: #dedbd6;
  --line-warm: #d2cbc0;
  --line-linen: #cdc3b0;
  --footer-bg: #201f1d;
  --footer-text: #e0ddd8;
  --footer-muted: #bdbab4;
  --footer-link: #d9c8a8;
  --footer-rule: #42413f;

  --serif: "Cormorant Garamond", "Cormorant", Garamond, "Times New Roman", serif;
  --sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --label: "Barlow Semi Condensed", "Barlow", "Arial Narrow", sans-serif;

  --container: 1200px;
  --gutter: 24px;
  --section-y: 104px;

  --xj-linen-texture:
    repeating-linear-gradient(90deg, rgba(110, 90, 60, .045) 0 1px, transparent 1px 4px),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .06) 0 1px, transparent 1px 3px);
  --xj-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%232a2826' stroke-width='1.6'/%3E%3C/svg%3E");
  --xj-cart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 3.5h2.6l2.2 11.2h11.1l2.1-8H6.2'/%3E%3Ccircle cx='9.2' cy='19.4' r='1.3'/%3E%3Ccircle cx='17.2' cy='19.4' r='1.3'/%3E%3C/svg%3E");
}

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
html body {
  background-color: var(--cream);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body input, body select, body textarea, body button { font-family: var(--sans); }
body h1, body h2, body h3, body h4, body h5, body h6 { font-family: var(--serif); font-weight: 500; color: var(--ink); }
body #page-container, body #main-content, body #et-main-area { background-color: var(--cream); }
body :focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
body .xj-section, body .xj-topbar, body .xj-header, body .xj-footer { scroll-margin-top: 16px; }

/* ---------- 1. Divi-structuur ---------- */
/* Secties */
body .et_pb_section.xj-section { padding: var(--section-y) 0 !important; }
body .et_pb_section.xj-hero,
body .et_pb_section.xj-categories,
body .et_pb_section.xj-process,
body .et_pb_section.xj-testimonial { background-color: var(--cream); }

/* Rijen: zelfde container als het ontwerp (max 1200px, 24px marge) */
body .et_pb_row.xj-row {
  width: min(var(--container), calc(100% - 2 * var(--gutter))) !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
}
body .et_pb_row.xj-row::before,
body .et_pb_row.xj-row::after { content: none !important; display: none !important; }
body .et_pb_row.xj-grid { display: grid !important; }

/* Kolommen: geen Divi-floats/-breedtes, de rij bepaalt de opbouw */
body .et_pb_row.xj-row > .et_pb_column {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  min-width: 0;
}
body .et_pb_row.xj-grid > .et_pb_column { min-height: 0; }

/* Modules: geen Divi-ondermarge, de afstanden komen uit dit bestand */
body .xj-row .et_pb_module,
body .xj-row .et_pb_button_module_wrapper { margin-bottom: 0 !important; }
body .xj-row .et_pb_button_module_wrapper { line-height: 0; }
body .xj-row p,
body .xj-row h1, body .xj-row h2, body .xj-row h3, body .xj-row h4 { padding-bottom: 0 !important; margin-top: 0; margin-bottom: 0; }
body .xj-row .et_pb_text ul,
body .xj-row .et_pb_text ol { margin: 0; padding: 0 !important; list-style: none !important; line-height: inherit; }
body .xj-row .et_pb_text li { line-height: inherit; }
body .xj-row .et_pb_text a { color: inherit; }
body .xj-row p { text-wrap: pretty; }
body .xj-row .et_pb_text_inner > :first-child { margin-top: 0; }

/* ---------- 2. Typografie-componenten ---------- */
body .xj-eyebrow .et_pb_text_inner {
  display: flex; align-items: center; gap: 14px;
  font-family: var(--label); font-weight: 600; font-size: 13px; line-height: 16px;
  letter-spacing: .2em; text-transform: uppercase; color: var(--gold-text);
}
body .xj-eyebrow .et_pb_text_inner::before {
  content: ""; flex: none; width: 36px; height: 1px; background: var(--gold-line);
}
body .xj-eyebrow p { line-height: 16px; }

body .et_pb_module.xj-title { margin-top: 12px; }
body .xj-title h2 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(2.1rem, 1.2rem + 2.4vw, 2.985rem);
  line-height: 1.15; letter-spacing: -.003em; color: var(--ink);
}

/* Losse hulpklassen die je ook elders in Divi kunt gebruiken */
body .xj-label {
  font-family: var(--label); font-weight: 600; font-size: 13px; line-height: 16px;
  letter-spacing: .14em; text-transform: uppercase; color: var(--ink);
}
body .xj-serif { font-family: var(--serif); font-weight: 500; }
body .xj-muted { color: var(--muted); }

/* ---------- 3. Knoppen (Divi-knopmodule met klasse xj-btn + variant) ---------- */
body .et_pb_button.xj-btn,
body .xj-callback-form .et_pb_contact_submit.et_pb_button {
  display: inline-flex !important; align-items: center; justify-content: center;
  min-height: 52px; padding: 0 29px !important; margin: 0 !important;
  font-family: var(--label) !important; font-weight: 600 !important; font-size: 15px !important;
  line-height: 1.2 !important; letter-spacing: .14em !important; text-transform: uppercase !important;
  text-decoration: none !important; text-align: center;
  border: 1px solid var(--ink) !important; border-radius: 0 !important;
  box-shadow: none !important; cursor: pointer;
  transition: background-color .2s, color .2s, border-color .2s !important;
}
body .et_pb_button.xj-btn::before, body .et_pb_button.xj-btn::after,
body .xj-callback-form .et_pb_contact_submit::before,
body .xj-callback-form .et_pb_contact_submit::after { content: none !important; display: none !important; }

body .et_pb_button.xj-btn--dark,
body .xj-callback-form .et_pb_contact_submit.et_pb_button { background: var(--ink) !important; color: var(--cream) !important; }
body .et_pb_button.xj-btn--dark:hover,
body .xj-callback-form .et_pb_contact_submit.et_pb_button:hover { background: #46423d !important; border-color: #46423d !important; color: var(--cream) !important; }
body .et_pb_button.xj-btn--outline { background: transparent !important; color: var(--ink) !important; }
body .et_pb_button.xj-btn--outline:hover { background: var(--ink) !important; color: var(--cream) !important; }
body .et_pb_button.xj-btn--light { background: var(--cream) !important; color: var(--ink) !important; border-color: var(--cream) !important; }
body .et_pb_button.xj-btn--light:hover { background: #fff !important; border-color: #fff !important; color: var(--ink) !important; }

/* Tekstlink met pijl (knopmodule met klasse xj-textlink) */
body .et_pb_button.xj-textlink {
  display: inline-flex !important; align-items: center;
  padding: 0 0 1px !important; margin: 0 !important;
  background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--gold-line) !important; border-radius: 0 !important;
  font-family: var(--label) !important; font-weight: 600 !important; font-size: 15px !important; line-height: 1.7 !important;
  letter-spacing: .14em !important; text-transform: uppercase !important; color: var(--ink) !important; text-decoration: none !important;
}
body .et_pb_button.xj-textlink::before { content: none !important; display: none !important; }
body .et_pb_button.xj-textlink::after,
body .et_pb_button.xj-textlink:hover::after {
  content: "\2192" !important; position: static !important; display: inline-block !important; opacity: 1 !important;
  margin: 0 0 0 -1px !important; font-family: var(--sans) !important; font-size: 14px !important; line-height: inherit !important;
  letter-spacing: 0 !important; font-weight: 600; transition: transform .2s !important;
}
body .et_pb_button.xj-textlink:hover::after { transform: translateX(4px); }

/* ---------- 4. Linnen-textuur (klasse xj-linen op sectie, rij of kolom) ---------- */
body .xj-linen {
  background-color: var(--linen);
  background-image: var(--xj-linen-texture);
}

/* ---------- 5. Topbalk ---------- */
body .et_pb_section.xj-topbar { background-color: #2b2a28; color: #f3eee7; padding: 0 !important; }
body .xj-topbar__inner > .et_pb_column {
  display: flex !important; justify-content: space-between; align-items: center; gap: 16px;
  min-height: 36px;
}
body .xj-topbar .et_pb_text {
  font-family: var(--label); font-weight: 500; font-size: 13px; letter-spacing: .12em;
  text-transform: uppercase; line-height: 1; color: #f3eee7;
}
body .xj-topbar .et_pb_text p { line-height: 1; }
body .xj-topbar a { color: inherit; text-decoration: none; }
body .xj-topbar a:hover { text-decoration: underline; text-underline-offset: 3px; }
body .xj-topbar__contact span { margin: 0 .2em; }

/* ---------- 6. Header + menu + winkelmand ---------- */
body .et_pb_section.xj-header {
  background-color: var(--cream-header);
  border-bottom: 1px solid var(--line);
  padding: 0 !important;
  position: relative; z-index: 20;
}
/* Het mobiele menu wordt t.o.v. de hele header gepositioneerd */
body .xj-header .et_pb_row.xj-row,
body .xj-header .et_pb_row.xj-row > .et_pb_column,
body .xj-menu.et_pb_menu,
body .xj-menu .et_pb_menu_inner_container,
body .xj-menu .et_pb_menu__wrap,
body .xj-menu .et_mobile_nav_menu,
body .xj-menu .mobile_nav { position: static !important; }

body .xj-menu.et_pb_menu { background-color: transparent; padding: 0; }
body .xj-menu .et_pb_menu_inner_container {
  display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important;
  align-items: center; min-height: 83px; gap: 24px;
}
body .xj-menu .et_pb_menu_inner_container::before,
body .xj-menu .et_pb_menu_inner_container::after { content: none !important; display: none !important; }

/* Logo (PNG van het ontwerp; vervangbaar in de menumodule > Logo) */
body .xj-menu .et_pb_menu__logo-wrap { flex: none !important; width: auto !important; max-width: none !important; margin: 0 0 0 1px !important; padding: 0 !important; }
body .xj-menu .et_pb_menu__logo { display: block; margin: 0 !important; overflow: visible; }
body .xj-menu .et_pb_menu__logo a { display: block; }
body .xj-menu .et_pb_menu__logo img { display: block; width: 198.84px; max-width: none; height: auto !important; max-height: none !important; }

body .xj-menu .et_pb_menu__wrap {
  flex: 1 1 auto !important; display: flex !important; align-items: center !important;
  justify-content: flex-end !important; gap: 24px; margin: 0 !important; opacity: 1 !important;
}
body .xj-menu .et_pb_menu__menu { display: flex; margin-left: auto; flex: 0 1 auto; }
body .xj-menu .et-menu-nav { display: block; }
body .xj-menu .et-menu-nav > ul.et-menu {
  display: flex !important; flex-wrap: nowrap; align-items: center; gap: 0 20px;
  margin: 0 !important; padding: 0 !important; list-style: none;
}
body .xj-menu .et-menu > li {
  position: relative; display: flex !important; align-items: center;
  margin: 0 !important; padding: 0 !important; line-height: 1.2;
}
body .xj-menu .et-menu > li > a {
  display: block !important; position: relative; padding: 10px 0 !important;
  font-family: var(--label) !important; font-weight: 600 !important; font-size: 14px !important;
  letter-spacing: .08em !important; text-transform: uppercase !important; line-height: 1.2 !important;
  color: var(--ink) !important; text-decoration: none; opacity: 1 !important; white-space: nowrap;
  transition: color .2s !important;
}
body .xj-menu .et-menu > li > a:hover,
body .xj-menu .et-menu > li.current-menu-item > a:not([href*="#"]) { color: var(--gold-text) !important; opacity: 1 !important; }

/* Pijltje bij items met submenu (vervangt Divi-icoon "3") */
body .xj-menu .et-menu > li.menu-item-has-children > a { padding-right: 14px !important; }
body .xj-menu .et-menu > li.menu-item-has-children > a::after {
  content: "" !important; position: absolute !important; right: 0 !important; left: auto !important; top: 50% !important;
  width: 7px; height: 5px; margin-top: -2.5px; transform: none;
  background: var(--xj-chevron) no-repeat center / 7px 5px;
  font-size: 0 !important; transition: transform .2s;
}

/* Dropdown (desktop) */
body .xj-menu .et-menu .sub-menu {
  position: absolute !important; top: 100% !important; left: -18px !important; z-index: 9999;
  display: block !important; width: auto !important; min-width: 230px;
  margin: 0 !important; padding: 10px 0 !important;
  background: var(--white) !important; border: 1px solid var(--line) !important;
  box-shadow: 0 14px 30px -14px rgba(42, 40, 38, .25) !important;
  opacity: 0 !important; visibility: hidden !important; transform: translateY(6px);
  transition: opacity .18s, transform .18s, visibility 0s .18s !important;
  animation: none !important; list-style: none; text-align: left;
}
body .xj-menu .et-menu .sub-menu li {
  display: block; width: 100%; margin: 0 !important; padding: 0 !important; line-height: 1.4;
}
body .xj-menu .et-menu .sub-menu a {
  display: block !important; width: auto !important; padding: 8px 18px !important;
  font-family: var(--sans) !important; font-weight: 400 !important; font-size: 15px !important; line-height: 1.4 !important;
  letter-spacing: 0 !important; text-transform: none !important;
  color: var(--ink-soft) !important; text-decoration: none; opacity: 1 !important; background: transparent;
}
body .xj-menu .et-menu .sub-menu a:hover,
body .xj-menu .et-menu .sub-menu a:focus-visible { background: var(--cream) !important; color: var(--ink) !important; }
body .xj-menu .et-menu .sub-menu a::after { content: none !important; }

@media (min-width: 1121px) {
  body .xj-menu .et-menu > li.menu-item-has-children::after {
    content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 12px;
  }
  body .xj-menu .et-menu > li:focus-within > .sub-menu,
  body .xj-menu .et-menu > li.et-hover > .sub-menu,
  body .xj-menu .et-menu > li.et-show-dropdown > .sub-menu,
  body .xj-menu .et-menu > li.xj-open > .sub-menu {
    opacity: 1 !important; visibility: visible !important; transform: none; transition-delay: 0s !important;
  }
  body .xj-menu .et-menu > li:focus-within > a::after,
  body .xj-menu .et-menu > li.et-hover > a::after,
  body .xj-menu .et-menu > li.xj-open > a::after { transform: rotate(180deg); }
  /* Na Escape verborgen houden tot de focus het item verlaat */
  body .xj-menu .et-menu > li.xj-dismissed:not(:hover) > .sub-menu { opacity: 0 !important; visibility: hidden !important; transform: translateY(6px); }
}
@media (hover: hover) and (min-width: 1121px) {
  body .xj-menu .et-menu > li:hover > .sub-menu { opacity: 1 !important; visibility: visible !important; transform: none; transition-delay: 0s !important; }
  body .xj-menu .et-menu > li:hover > a::after { transform: rotate(180deg); }
}

/* Winkelmand-icoon (alleen zichtbaar als WooCommerce actief is) */
body .xj-menu .et_pb_menu__cart-button {
  position: relative; flex: none; order: 2;
  display: inline-flex !important; align-items: center; justify-content: center;
  padding: 8px !important; margin: 0 0 0 -17px !important;
  color: var(--ink) !important; font-size: 0 !important; line-height: 0 !important; text-decoration: none;
  opacity: 1 !important; transition: color .2s;
}
body .xj-menu .et_pb_menu__cart-button::after {
  content: "" !important; display: block !important; width: 20px; height: 20px; margin: 0 !important;
  background-color: currentColor;
  -webkit-mask: var(--xj-cart) center / 20px 20px no-repeat;
          mask: var(--xj-cart) center / 20px 20px no-repeat;
  font-family: inherit !important;
}
body .xj-menu .et_pb_menu__cart-button:hover { color: var(--gold-text) !important; opacity: 1 !important; }
body .xj-menu .xj-cart-count {
  position: absolute; top: 0; right: -4px;
  min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px;
  background: var(--ink); color: var(--cream);
  font-family: var(--label); font-weight: 600; font-size: 11px; line-height: 17px; letter-spacing: 0; text-align: center;
}
body .xj-menu .xj-cart-count.is-empty { display: none; }

/* Divi's eigen mobiele knop: standaard verborgen op desktop */
body .xj-menu .et_mobile_nav_menu { display: none !important; order: 1; float: none !important; margin: 0 !important; }

/* ---------- 7. Hero ---------- */
body .et_pb_section.xj-hero { padding: 81px 0 0 !important; }
body .xj-hero__grid { grid-template-columns: minmax(0, 1fr) 518px; gap: 64px; align-items: start; }
body .xj-hero__text { display: flex !important; flex-wrap: wrap; align-content: flex-start; column-gap: 14px; }
body .xj-hero__text > .et_pb_module { flex: 0 0 100%; max-width: 100%; }
/* Knoppen: 31px onder de intro (17px marge onder de lead + 14px boven elke knop); als ze
   onder elkaar terugvallen staat er 14px tussen, net als in het ontwerp */
body .xj-hero__text > .et_pb_module.et_pb_button_module_wrapper { flex: 0 0 auto; margin-top: 14px; }
body .xj-hero__text > .et_pb_module.xj-lead { margin-bottom: 17px !important; }
body .et_pb_module.xj-hero__title { margin-top: 9px; }
body .xj-hero__title h1 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(2.6rem, 1.2rem + 3.7vw, 4.22rem);
  line-height: 1.06; letter-spacing: -.004em; color: var(--ink);
  max-width: 540px;
}
body .et_pb_module.xj-lead { margin-top: 20px; max-width: 600px !important; }
body .xj-lead p { font-size: 21px; line-height: 1.6; color: var(--ink-soft); }

/* Fotolijst (afbeeldingsmodule met klasse xj-frame) */
body .et_pb_image.xj-frame {
  display: block; width: 100%; max-width: 100%; margin-left: 0 !important; margin-right: 0 !important;
  background: var(--white); border: 1px solid var(--line);
  box-shadow: 0 22px 40px -22px rgba(42, 40, 38, .28);
  line-height: 0; text-align: left;
}
body .xj-frame .et_pb_image_wrap { display: block; width: 100%; }
body .xj-frame img { display: block; width: 100%; height: auto; }

/* ---------- 8. Categoriekaarten (blurbmodule met klasse xj-card) ---------- */
body .et_pb_section.xj-categories { padding-top: 126px !important; }
body .et_pb_row.xj-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 36px; margin-top: 50px !important; }
body .xj-cards > .et_pb_column { display: flex !important; flex-direction: column; }
body .et_pb_blurb.xj-card {
  position: relative; flex: 1 1 auto; display: flex; flex-direction: column;
  background: var(--white); border: 1px solid var(--line);
  padding: 24px 28px 31px;
  transition: box-shadow .2s, transform .2s;
}
body .et_pb_blurb.xj-card:hover { box-shadow: 0 18px 36px -24px rgba(42, 40, 38, .35); transform: translateY(-2px); }
body .et_pb_blurb.xj-card:focus-within { outline: 2px solid var(--gold); outline-offset: 3px; }
body .xj-card .et_pb_blurb_content { position: static; max-width: none !important; width: 100%; margin: 0 !important; text-align: left; }
body .xj-card .et_pb_main_blurb_image {
  display: block; width: 100% !important; max-width: none !important; margin: 0 !important;
  padding-bottom: 12px; border-bottom: 1px solid var(--line); line-height: 0; text-align: center;
}
body .xj-card .et_pb_main_blurb_image a { display: block; }
body .xj-card .et_pb_main_blurb_image .et_pb_image_wrap { display: block; width: 100%; max-width: 260px; margin: 0 auto; }
body .xj-card .et_pb_main_blurb_image img { display: block; width: 100%; height: auto; opacity: 1 !important; transform: none !important; }
body .xj-card .et_pb_blurb_container { position: static; display: block !important; padding: 0 !important; text-align: left; }
body .xj-card h3.et_pb_module_header,
body .xj-card .et_pb_module_header {
  margin-top: 21px; padding: 0 !important;
  font-family: var(--serif); font-weight: 500; font-size: 30px; line-height: 1.15; color: var(--ink);
}
body .xj-card .et_pb_module_header a { color: inherit; text-decoration: none; }
body .xj-card .et_pb_module_header a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
body .xj-card .et_pb_module_header a:focus-visible { outline: none; }
body .xj-card .et_pb_blurb_description {
  margin-top: 12px; padding-right: 25px;
  font-size: 17px; line-height: 1.7; color: var(--muted);
}
body .xj-card .et_pb_blurb_container::after {
  content: "\2192"; position: absolute; right: 28px; bottom: 22px;
  font-family: var(--sans); font-size: 22px; line-height: 1; color: var(--gold);
  transition: transform .2s;
}
body .xj-card:hover .et_pb_blurb_container::after { transform: translateX(4px); }

/* ---------- 9. Twee manieren (linnen band) ---------- */
body .et_pb_row.xj-ways__grid { grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 52px !important; }
body .xj-ways__grid > .et_pb_column.xj-way {
  display: flex !important; flex-direction: column; align-items: flex-start;
  background: var(--white); padding: 44px !important;
  box-shadow: 0 0 0 1px rgba(205, 195, 175, .35);
}
body .xj-way > .et_pb_module.xj-way__body { align-self: stretch; }
body .xj-way > .et_pb_button_module_wrapper { margin-top: auto; }
body .xj-way__body .xj-badge {
  display: block; width: -moz-fit-content; width: fit-content; padding: 5px 11px 4px !important;
  border: 1px solid var(--gold-line);
  font-family: var(--label); font-weight: 600; font-size: 12px; line-height: 15px;
  letter-spacing: .18em; text-transform: uppercase; color: var(--gold-text);
}
body .xj-way__body h3 {
  margin-top: 10px; font-family: var(--serif); font-weight: 500;
  font-size: clamp(2rem, 1.2rem + 2.4vw, 2.94rem); line-height: 1.15; color: var(--ink);
}
body .xj-way__body h3 + p { margin-top: 11px; color: var(--muted); font-size: 17px; line-height: 1.73; }
body .xj-row .xj-way__body ul.xj-checklist,
body .xj-checklist { margin: 17px 0 27px !important; }
body .xj-checklist li { position: relative; padding-left: 28px; color: var(--ink); font-size: 17px; line-height: 1.7 !important; list-style: none; }
body .xj-checklist li + li { margin-top: 6.6px; }
body .xj-checklist li::before {
  content: ""; position: absolute; left: 1px; top: .62em; width: 14px; height: 9px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3E%3Cpath d='M1 3.5l4 4L13 1' fill='none' stroke='%23a89a78' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* ---------- 10. Maakproces (blurbmodule zonder afbeelding, klasse xj-step) ---------- */
body .et_pb_section.xj-process { padding-bottom: 106px !important; }
body .et_pb_row.xj-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 36px; margin-top: 50px !important; counter-reset: xjstep; }
body .et_pb_blurb.xj-step { counter-increment: xjstep; border-top: 1px solid var(--line-warm); padding-top: 22px; }
body .xj-step .et_pb_blurb_content { max-width: none !important; margin: 0 !important; text-align: left; }
body .xj-step .et_pb_main_blurb_image { display: none; }
body .xj-step .et_pb_blurb_container { display: block !important; padding: 0 !important; text-align: left; }
body .xj-step .et_pb_blurb_container::before {
  content: counter(xjstep, decimal-leading-zero); display: block;
  font-family: var(--serif); font-style: italic; font-weight: 500; font-size: 36px; line-height: 30px; color: var(--gold);
}
body .xj-step h3.et_pb_module_header,
body .xj-step .et_pb_module_header {
  margin-top: 15px; padding: 0 !important;
  font-family: var(--serif); font-weight: 500; font-size: 30px; line-height: 1.15; color: var(--ink);
}
body .xj-step .et_pb_blurb_description { margin-top: 19px; color: var(--muted); font-size: inherit; line-height: 1.7; }

/* ---------- 11. Atelier ---------- */
body .et_pb_section.xj-atelier { background-color: #fefefe; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
body .et_pb_row.xj-atelier__grid { grid-template-columns: 1fr 1fr; gap: 76px; align-items: start; }
body .et_pb_module.xj-body { margin-top: 17px; }
body .xj-body p { color: var(--ink); }
body .xj-body p + p { margin-top: 1.1em; }
body .xj-atelier__text > .et_pb_button_module_wrapper { margin-top: 24px; }

/* ---------- 12. Klantreactie ---------- */
body .et_pb_text.xj-quote {
  position: relative; max-width: 640px; margin-left: auto !important; margin-right: auto !important;
  text-align: center; background: var(--paper); border: 1px solid var(--line);
  padding: 21px 72px 34px;
}
body .et_pb_text.xj-quote.xj-quote--placeholder { border: 1px dashed #a4967f; }
body .et_pb_text.xj-quote--placeholder::before {
  content: "Plaatshouder"; position: absolute; left: 50%; top: 0; z-index: 1; transform: translate(-50%, -50%);
  padding: 0 10px; background: var(--cream); white-space: nowrap;
  font-family: var(--label); font-weight: 600; font-size: 11px; line-height: 14px; letter-spacing: .16em;
  text-transform: uppercase; color: var(--gold-text);
}
body .xj-quote .et_pb_text_inner::before {
  content: "\201C"; display: block; height: 63px; text-indent: 8px;
  font-family: var(--serif); font-weight: 500; font-size: 92px; line-height: 1; color: var(--gold);
}
body .xj-quote blockquote {
  margin: 32px 0 0 !important; padding: 0 !important; border: 0 !important; quotes: none;
  font-family: var(--serif); font-style: italic; font-weight: 500; font-size: 30px; line-height: 1.35; color: var(--ink);
}
body .xj-quote blockquote p { text-wrap: balance; }
body .xj-quote .xj-quote__cite {
  margin-top: 22px; font-family: var(--label); font-weight: 600; font-size: 13px; line-height: 18px;
  letter-spacing: .18em; text-transform: uppercase; color: var(--gold-text);
}

/* ---------- 13. Contact + terugbelformulier ---------- */
body .et_pb_row.xj-contact__grid { grid-template-columns: 1fr 1fr; gap: 76px; align-items: start; }
body .et_pb_module.xj-contact__intro { margin-top: 49px; max-width: 563px; }
body .xj-contact__intro p { color: var(--ink); line-height: 1.76; }
body .et_pb_module.xj-details-wrap { margin-top: 26px; }
body .xj-row ul.xj-details { margin: 0 !important; border-top: 1px solid var(--line-linen); }
body .xj-details li {
  display: grid; grid-template-columns: 128px 1fr; align-items: center; min-height: 57px;
  border-bottom: 1px solid var(--line-linen); font-size: 17px; color: var(--ink); line-height: 1.7 !important;
}
body .xj-details__label {
  font-family: var(--label); font-weight: 600; font-size: 12px; letter-spacing: .16em;
  text-transform: uppercase; color: var(--gold-text);
}
body .xj-details a { color: inherit; text-decoration: none; }
body .xj-details a:hover { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--gold-line); }

body .xj-contact__grid > .et_pb_column.xj-callback { background: var(--white); padding: 46px 44px 61px !important; }
body .xj-callback__head h3 { font-family: var(--serif); font-weight: 500; font-size: 30px; line-height: 1.2; color: var(--ink); }
body .xj-callback__head h3 + p { margin-top: 9px; color: var(--muted); }

body .et_pb_module.xj-callback-form { margin-top: 21px; }
body .xj-callback-form .et_pb_contact_main_title { display: none; }
body .xj-callback-form .et_pb_contact { margin: 0; padding: 0; }
body .xj-callback-form .et_pb_contact_form { margin: 0 !important; padding: 0 !important; }
body .xj-callback-form .et_pb_contact_field {
  float: none !important; clear: both; width: 100% !important;
  margin: 0 !important; padding: 0 !important; position: relative;
}
body .xj-callback-form .et_pb_contact_field + .et_pb_contact_field { margin-top: 22px !important; }
body .xj-callback-form .et_pb_contact_field[data-type="select"]::after { content: none !important; display: none !important; }
body .xj-callback-form .et_pb_contact_form_label {
  display: block !important; margin: 0 0 11px !important; padding: 0;
  font-family: var(--label); font-weight: 600; font-size: 13px; line-height: 16px;
  letter-spacing: .14em; text-transform: uppercase; color: var(--ink);
}
body .xj-callback-form .et_pb_contact_field.xj-required .et_pb_contact_form_label::after { content: " *"; color: var(--gold-text); }
body .xj-callback-form .et_pb_contact_field:has(> [data-required_mark="required"]) .et_pb_contact_form_label::after { content: " *"; color: var(--gold-text); }

body .xj-callback-form .et_pb_contact_field .input,
body .xj-callback-form .et_pb_contact_field select {
  display: block; width: 100% !important; height: 52px !important; margin: 0 !important; padding: 0 16px !important;
  background-color: var(--white) !important; border: 1px solid #cfc7b5 !important; border-radius: 0 !important;
  font-family: var(--sans) !important; font-size: 16.8px !important; font-weight: 400; line-height: normal !important;
  color: var(--ink) !important; box-shadow: none !important; outline: none;
  -webkit-appearance: none; appearance: none;
  transition: border-color .2s, box-shadow .2s;
}
body .xj-callback-form .et_pb_contact_field .input::placeholder { color: #84827d !important; opacity: 1; }
body .xj-callback-form .et_pb_contact_field .input:focus,
body .xj-callback-form .et_pb_contact_field select:focus { border-color: var(--gold) !important; box-shadow: 0 0 0 3px rgba(176, 141, 87, .18) !important; }
body .xj-callback-form .et_pb_contact_field select {
  padding-right: 44px !important; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0h10L5 6z' fill='%232a2826'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 18px center !important; background-size: 10px 6px !important;
}
body .xj-callback-form .et_pb_contact_field .et_contact_error,
body .xj-callback-form .et_pb_contact_field .input[aria-invalid="true"] { border-color: #a4452e !important; }
body .xj-callback-form .xj-field-error { margin-top: 6px; font-size: 14px; line-height: 1.5; color: #a4452e; }

body .xj-callback-form .et_contact_bottom_container {
  float: none !important; display: block !important; margin: 37px 0 0 !important; padding: 0 !important; text-align: left !important;
}
body .xj-callback-form .et_pb_contact_right { display: none !important; }

/* Melding na verzenden / bij fouten (Divi vult deze div) */
body .xj-callback-form .et-pb-contact-message:not(:empty) {
  margin: 22px 0 0; padding: 22px 24px; background: var(--cream); border-left: 2px solid var(--gold);
  color: var(--ink-soft); font-size: 17px; line-height: 1.7;
}
body .xj-callback-form .et-pb-contact-message p { color: var(--ink-soft); padding: 0 !important; }
body .xj-callback-form .et-pb-contact-message ul { margin: 6px 0 0 !important; padding: 0 0 0 1.1em !important; list-style: disc !important; }

/* ---------- 14. Footer ---------- */
body .et_pb_section.xj-footer {
  background-color: var(--footer-bg); color: var(--footer-text);
  padding: 99px 0 0 !important; font-size: 15px; line-height: 1.7;
}
body .xj-footer .et_pb_text { color: var(--footer-text); font-size: 15px; line-height: 1.7; }
body .xj-footer .et_pb_text p { font-size: 15px; line-height: 1.7; }
body .et_pb_row.xj-footer__grid { grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px 62.5px; padding-bottom: 57px !important; }
body .et_pb_image.xj-footer-logo { margin: 0 0 0 3px !important; text-align: left; line-height: 0; }
body .xj-footer-logo .et_pb_image_wrap { display: inline-block; }
body .xj-footer-logo img { display: block; width: 183.44px; max-width: 100%; height: auto; }
body .et_pb_module.xj-footer__about { margin-top: 26px; max-width: 380px; }
body .xj-footer__about p { color: var(--footer-text); }
body .xj-footer__col h2 {
  margin: 2px 0 16px !important; padding: 0 !important;
  font-family: var(--label); font-weight: 600; font-size: 13px; line-height: 16px;
  letter-spacing: .2em; text-transform: uppercase; color: #cdb98f;
}
body .xj-footer__col li { font-size: 15px; line-height: 1.7 !important; }
body .xj-footer__col li + li { margin-top: 9px; }
body .xj-footer__col h2 + p { margin-top: 19px; }
body .xj-row .xj-footer__col a,
body .xj-row .xj-copy a { color: var(--footer-link); text-decoration: none; }
body .xj-row .xj-footer__col a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
body .xj-row .xj-copy a:hover { text-decoration: underline; }
body .xj-footer__contact > .et_pb_button_module_wrapper { margin-top: 25px; }
body .xj-footer .et_pb_button.xj-btn { min-height: 50px; padding: 0 28px !important; font-size: 15px !important; }

body .et_pb_row.xj-footer__bottom {
  display: flex !important; justify-content: space-between; flex-wrap: wrap; gap: 8px 24px;
  border-top: 1px solid var(--footer-rule); padding: 27px 0 33px !important;
}
body .xj-footer__bottom > .et_pb_column { flex: 0 1 auto; }
body .xj-footer .xj-copy p { font-size: 14px; color: var(--footer-muted); }

/* ---------- 15. Responsive ---------- */
@media (max-width: 1240px) {
  body .xj-menu .et-menu-nav > ul.et-menu { gap: 0 14px; }
  body .xj-menu .et-menu > li > a { letter-spacing: .06em !important; font-size: 13.5px !important; }
}

/* Hamburger-menu (Divi's mobiele menu, vanaf 1120px in plaats van 980px) */
@media (max-width: 1120px) {
  body .xj-menu .et_pb_menu__menu { display: none !important; }
  body .xj-menu .et_mobile_nav_menu { display: flex !important; align-items: center; margin: 0 0 0 auto !important; }
  body .xj-menu .et_pb_menu__cart-button { margin-left: 4px !important; }
  body .xj-menu .mobile_nav {
    display: inline-flex !important; align-items: center; gap: 10px;
    padding: 10px 4px !important; cursor: pointer; color: var(--ink); background: none !important;
    font-family: var(--label); font-weight: 600; font-size: 14px; line-height: 1.2;
    letter-spacing: .12em; text-transform: uppercase; user-select: none; -webkit-tap-highlight-color: transparent;
  }
  body .xj-menu .mobile_nav::after { content: "Menu"; }
  body .xj-menu .mobile_nav.opened::after { content: "Sluiten"; }
  body .xj-menu .mobile_nav .mobile_menu_bar {
    position: relative !important; display: block !important; width: 22px; height: 1.5px;
    padding: 0 !important; line-height: 0 !important; background: currentColor; transition: background-color .2s;
  }
  body .xj-menu .mobile_nav .mobile_menu_bar::before,
  body .xj-menu .mobile_nav .mobile_menu_bar::after {
    content: "" !important; position: absolute !important; left: 0 !important; display: block;
    width: 22px; height: 1.5px; background: currentColor; font-size: 0 !important; line-height: 0 !important;
    transition: transform .2s;
  }
  body .xj-menu .mobile_nav .mobile_menu_bar::before { top: -7px !important; }
  body .xj-menu .mobile_nav .mobile_menu_bar::after { top: 7px !important; }
  body .xj-menu .mobile_nav.opened .mobile_menu_bar { background: transparent; }
  body .xj-menu .mobile_nav.opened .mobile_menu_bar::before { transform: translateY(7px) rotate(45deg); }
  body .xj-menu .mobile_nav.opened .mobile_menu_bar::after { transform: translateY(-7px) rotate(-45deg); }

  /* Uitklappanel over de volle breedte onder de header */
  body .xj-menu .et_mobile_menu {
    position: absolute !important; left: 0 !important; right: 0 !important; top: 100% !important;
    width: 100% !important; margin: 0 !important; z-index: 9999;
    padding: 8px max(var(--gutter), calc((100% - var(--container)) / 2)) 20px !important;
    background: var(--cream-header) !important; border: 0 !important; border-bottom: 1px solid var(--line) !important;
    box-shadow: 0 20px 30px -20px rgba(42, 40, 38, .25) !important;
    max-height: calc(100vh - 84px); overflow-y: auto; cursor: default;
    font-size: 15px; letter-spacing: 0; text-transform: none; text-align: left; list-style: none;
  }
  body .xj-menu .et_mobile_menu li {
    display: flex !important; flex-wrap: wrap; align-items: center;
    margin: 0 !important; padding: 0 !important; border-bottom: 1px solid var(--line); list-style: none; float: none;
  }
  body .xj-menu .et_mobile_menu li a,
  body .xj-menu .et_mobile_menu .menu-item-has-children > a {
    flex: 1 1 0; display: block; padding: 16px 0 !important; border: 0 !important; background: none !important;
    font-family: var(--label) !important; font-weight: 600 !important; font-size: 15px !important; line-height: 1.2 !important;
    letter-spacing: .1em !important; text-transform: uppercase !important; color: var(--ink) !important; opacity: 1 !important;
  }
  body .xj-menu .et_mobile_menu li a:hover { color: var(--gold-text) !important; opacity: 1 !important; }
  body .xj-menu .et_mobile_menu .sub-menu,
  body .xj-menu .et_mobile_menu li ul {
    display: none !important; position: static !important; flex-basis: 100%; width: auto !important;
    margin: 0 !important; padding: 0 0 12px 14px !important; visibility: visible !important; opacity: 1 !important;
    background: none !important; border: 0 !important; box-shadow: none !important; transform: none !important;
  }
  body .xj-menu .et_mobile_menu li.xj-open > .sub-menu,
  body .xj-menu .et_mobile_menu li.xj-open > ul { display: block !important; }
  body .xj-menu .et_mobile_menu .sub-menu li { display: block !important; border: 0 !important; }
  body .xj-menu .et_mobile_menu .sub-menu li a {
    padding: 9px 0 !important; font-family: var(--sans) !important; font-weight: 400 !important; font-size: 16px !important;
    line-height: 1.4 !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--ink-soft) !important;
  }
  body .xj-menu .et_mobile_menu .sub-menu li a:hover { color: var(--gold-text) !important; }
  body .xj-menu .xj-subtoggle {
    display: inline-flex; align-items: center; justify-content: center; flex: none;
    width: 48px; height: 48px; margin: 0 -12px 0 0; padding: 0;
    background: none; border: 0; cursor: pointer; color: var(--ink);
  }
  body .xj-menu .xj-subtoggle::before {
    content: ""; width: 11px; height: 7px; background: var(--xj-chevron) no-repeat center / 11px 7px; transition: transform .2s;
  }
  body .xj-menu .xj-subtoggle[aria-expanded="true"]::before { transform: rotate(180deg); }
  body .xj-menu .xj-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (min-width: 1121px) {
  body .xj-menu .et_mobile_menu, body .xj-menu .xj-subtoggle { display: none !important; }
}

@media (max-width: 1100px) {
  body .et_pb_row.xj-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 44%); gap: 48px; }
  body .et_pb_row.xj-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  body .et_pb_row.xj-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 32px; }
  body .et_pb_row.xj-footer__grid { grid-template-columns: 1fr 1fr 1fr; }
  body .xj-footer__grid > .et_pb_column.xj-footer__brand { grid-column: 1 / -1; display: flex !important; align-items: center; gap: 48px; }
  body .et_pb_module.xj-footer__about { margin-top: 0; }
}

@media (max-width: 860px) {
  :root { --section-y: 72px; }
  body .et_pb_section.xj-hero { padding-top: 48px !important; }
  body .et_pb_row.xj-hero__grid { grid-template-columns: 1fr; gap: 40px; }
  body .xj-hero__title .xj-br { display: none; }
  body .xj-lead p { font-size: 18.5px; }
  body .et_pb_section.xj-categories { padding-top: 88px !important; }
  body .et_pb_row.xj-ways__grid,
  body .et_pb_row.xj-atelier__grid,
  body .et_pb_row.xj-contact__grid { grid-template-columns: 1fr; gap: 40px; }
  body .xj-atelier__grid > .xj-atelier__media { max-width: 562px; }
  body .et_pb_module.xj-contact__intro { margin-top: 28px; }
  body .et_pb_row.xj-cards, body .et_pb_row.xj-ways__grid, body .et_pb_row.xj-steps { margin-top: 36px !important; }
}

@media (max-width: 640px) {
  :root { --gutter: 20px; --section-y: 64px; }
  html body { font-size: 16px; }
  body .xj-topbar__tagline { display: none !important; }
  body .xj-topbar__inner > .et_pb_column { justify-content: center; }
  body .xj-topbar .et_pb_text { font-size: 12px; }
  body .xj-menu .et_pb_menu_inner_container { min-height: 72px; gap: 12px; }
  body .xj-menu .et_pb_menu__wrap { gap: 12px; }
  body .xj-menu .et_pb_menu__logo img { width: 171.5px; }
  body .xj-menu .mobile_nav::after { content: none !important; }
  body .xj-menu .et_mobile_menu { max-height: calc(100vh - 72px); }
  body .xj-lead p { font-size: 17.5px; }
  body .xj-hero__text > .et_pb_module.et_pb_button_module_wrapper { flex: 0 0 100%; }
  body .xj-hero__text .et_pb_button.xj-btn { display: flex !important; width: 100%; }
  body .et_pb_button.xj-btn, body .xj-callback-form .et_pb_contact_submit.et_pb_button { padding: 0 20px !important; }
  body .et_pb_row.xj-cards { grid-template-columns: 1fr; gap: 20px; }
  body .xj-ways__grid > .et_pb_column.xj-way,
  body .xj-contact__grid > .et_pb_column.xj-callback { padding: 32px 24px !important; }
  body .xj-way > .et_pb_button_module_wrapper { align-self: stretch; }
  body .xj-way .et_pb_button.xj-btn,
  body .xj-callback-form .et_pb_contact_submit.et_pb_button { display: flex !important; width: 100%; }
  body .et_pb_row.xj-steps { grid-template-columns: 1fr; gap: 32px; }
  body .et_pb_text.xj-quote { padding: 32px 22px 28px; }
  body .xj-quote blockquote { font-size: 24px; }
  body .xj-details li { grid-template-columns: 96px 1fr; font-size: 16px; }
  body .et_pb_row.xj-footer__grid { grid-template-columns: 1fr 1fr; gap: 40px 24px; }
  body .xj-footer__grid > .et_pb_column.xj-footer__brand { flex-direction: column; align-items: flex-start; gap: 24px; }
  body .xj-footer__grid > .et_pb_column.xj-footer__contact { grid-column: 1 / -1; }
  body .et_pb_row.xj-footer__bottom { flex-direction: column; }
}

/* ---------- 16. WooCommerce (basis, zodat winkel/winkelmand in stijl blijven) ---------- */
body.woocommerce #main-content, body.woocommerce-page #main-content { background-color: var(--cream); }
body.woocommerce-page h1, body.woocommerce-page h2, body.woocommerce-page h3 { font-family: var(--serif); font-weight: 500; }
body.woocommerce a.button, body.woocommerce button.button, body.woocommerce input.button,
body.woocommerce-page a.button, body.woocommerce-page button.button, body.woocommerce-page input.button,
body.woocommerce #respond input#submit, body .wc-block-components-button:not(.is-link) {
  display: inline-flex !important; align-items: center; justify-content: center; min-height: 52px;
  padding: 0 29px !important; border: 1px solid var(--ink) !important; border-radius: 0 !important;
  background: var(--ink) !important; color: var(--cream) !important;
  font-family: var(--label) !important; font-weight: 600 !important; font-size: 15px !important; line-height: 1.2 !important;
  letter-spacing: .14em !important; text-transform: uppercase !important;
}
body.woocommerce a.button::after, body.woocommerce button.button::after, body.woocommerce-page a.button::after,
body.woocommerce-page button.button::after { content: none !important; display: none !important; }
body.woocommerce a.button:hover, body.woocommerce button.button:hover,
body.woocommerce-page a.button:hover, body.woocommerce-page button.button:hover,
body .wc-block-components-button:not(.is-link):hover { background: #46423d !important; border-color: #46423d !important; }
body.woocommerce span.onsale { background: var(--gold); border-radius: 0; font-family: var(--label); letter-spacing: .1em; text-transform: uppercase; }
body.woocommerce ul.products li.product .price, body.woocommerce div.product p.price, body.woocommerce div.product span.price { color: var(--gold-text); }
body.woocommerce .woocommerce-message, body.woocommerce .woocommerce-info { border-top-color: var(--gold); background: var(--paper); }

/* ---------- 18. Veiligheidsnet header/footer ----------
   Op pagina's waar Divi zijn CPT-stylesheet laadt (bijv. WooCommerce-producten die met de Divi Builder
   gebouwd zijn) beginnen Divi's regels met ".et-db #et-boc .et-l" en winnen ze van gewone klassen.
   Deze regels (met #et-boc) houden kleuren en tekstgroottes van topbalk en footer dan gelijk. */
body #et-boc .et-l .xj-topbar .et_pb_text { color: #f3eee7; }
body #et-boc .et-l .xj-topbar p,
body #et-boc .et-l .xj-footer p { font-size: inherit; line-height: inherit; color: inherit; padding-bottom: 0; }
body #et-boc .et-l .xj-topbar a,
body #et-boc .et-l .xj-menu .et_pb_menu__logo a { color: inherit; }
body #et-boc .et-l .xj-footer .et_pb_text { color: var(--footer-text); }
body #et-boc .et-l .xj-footer .et_pb_text.xj-copy { font-size: 14px; color: var(--footer-muted); }
body #et-boc .et-l .xj-footer__col h2 {
  padding: 0; font-family: var(--label); font-weight: 600; font-size: 13px; line-height: 16px;
  letter-spacing: .2em; text-transform: uppercase; color: #cdb98f;
}
body #et-boc .et-l .xj-footer__col a,
body #et-boc .et-l .xj-copy a { color: var(--footer-link); }
body #et-boc .et-l .xj-footer__col a:hover { color: #fff; }

/* ---------- 17. Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body *, body *::before, body *::after { transition: none !important; scroll-behavior: auto !important; }
}