.elementor-kit-12{--e-global-color-primary:#C9A46C;--e-global-color-secondary:#111111;--e-global-color-text:#EAEAEA;--e-global-color-accent:#A67C52;--e-global-color-0f2e12e:#1A1A1A;--e-global-color-c51cbc4:#2A2A2A;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-12 e-page-transition{background-color:#FFBC7D;}.elementor-kit-12 a{font-family:"Inter", Sans-serif;font-size:16px;font-weight:400;}.elementor-kit-12 h1{font-family:"Playfair Display", Sans-serif;font-size:42px;font-weight:600;line-height:1.2px;}.elementor-kit-12 h2{font-family:"Playfair Display", Sans-serif;font-size:32px;font-weight:600;line-height:1.25px;}.elementor-kit-12 h3{font-family:"Playfair Display", Sans-serif;font-size:24px;}.elementor-kit-12 button,.elementor-kit-12 input[type="button"],.elementor-kit-12 input[type="submit"],.elementor-kit-12 .elementor-button{font-family:"Inter", Sans-serif;font-size:14px;font-weight:500;text-transform:uppercase;line-height:1px;border-radius:4px 4px 4px 4px;padding:14px 28px 14px 28px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-12 a{font-size:16px;line-height:1.6em;letter-spacing:0px;}.elementor-kit-12 h1{font-size:36px;}.elementor-kit-12 h2{font-size:28px;}.elementor-kit-12 h3{font-size:22px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-12 h1{font-size:28px;}.elementor-kit-12 h2{font-size:22px;}.elementor-kit-12 h3{font-size:20px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */body {
    background: radial-gradient(circle at top center, #1a1a1a 0%, #0f0f0f 60%);
    color: #EAEAEA;
}
/* =========================================================
   Studio Ember — Product Grid (Elementor Product Archive)
   Boutique card look + consistent typography + hover
   ========================================================= */

/* Grid spacing */
.woocommerce ul.products,
.woocommerce-page ul.products{
  gap: 26px !important;
}

/* Card shell */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  background: rgba(255,255,255,0.02) !important;
  border: 1px solid rgba(198,167,94,0.22) !important;
  border-radius: 18px !important;
  padding: 16px !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.45) !important;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease !important;
  overflow: hidden;
}

/* Hover: subtle lift */
.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover{
  transform: translateY(-3px);
  border-color: rgba(198,167,94,0.42) !important;
  box-shadow: 0 26px 60px rgba(0,0,0,0.55) !important;
}

/* Image: rounded + consistent crop feel */
.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img{
  border-radius: 14px !important;
  display: block;
  width: 100%;
  height: auto;
  transition: transform .25s ease, filter .25s ease;
}

/* Image hover: tiny zoom */
.woocommerce ul.products li.product:hover a img,
.woocommerce-page ul.products li.product:hover a img{
  transform: scale(1.02);
  filter: saturate(1.03);
}

/* Title */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title{
  margin: 14px 0 6px !important;
  padding: 0 !important;
  color: rgba(245,245,245,0.92) !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  font-size: 16px !important;
  line-height: 1.25 !important;
}

/* Price */
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price{
  margin: 0 0 12px !important;
  color: rgba(198,167,94,0.95) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

/* Remove underline on links in card */
.woocommerce ul.products li.product a,
.woocommerce-page ul.products li.product a{
  text-decoration: none !important;
}

/* Buttons: unify */
.woocommerce ul.products li.product a.button,
.woocommerce-page ul.products li.product a.button{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 14px !important;
  padding: 10px 14px !important;
  border: 1px solid rgba(198,167,94,0.35) !important;
  background: rgba(255,255,255,0.02) !important;
  color: rgba(245,245,245,0.92) !important;
  box-shadow: none !important;
  transition: transform .15s ease, border-color .15s ease, background-color .15s ease, box-shadow .15s ease !important;
}

/* Hover buttons */
.woocommerce ul.products li.product a.button:hover,
.woocommerce-page ul.products li.product a.button:hover{
  transform: translateY(-1px);
  border-color: rgba(198,167,94,0.60) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,0.45) !important;
}

/* Primary feel when hovering the card */
.woocommerce ul.products li.product:hover a.button,
.woocommerce-page ul.products li.product:hover a.button{
  background: rgba(198,167,94,0.10) !important;
}

/* Sale badge (if you use it later) */
.woocommerce span.onsale{
  background: rgba(198,167,94,0.95) !important;
  color: #0b0b0b !important;
  border-radius: 999px !important;
  padding: 6px 10px !important;
  font-weight: 700 !important;
  box-shadow: 0 12px 30px rgba(0,0,0,0.45) !important;
}

/* Mobile: a bit more breathing room */
@media (max-width: 767px){
  .woocommerce ul.products,
  .woocommerce-page ul.products{ gap: 16px !important; }
  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product{ padding: 14px !important; }
}
/* =========================================================
   Studio Ember — Product Grid PATCH (archive polish)
   Doel: gelijke kaarten, consistente image-crop, CTA onderaan
   Plak ONDER je huidige CSS
   ========================================================= */

/* Scope: alleen Woo archives (shop/categorie) */
.woocommerce.archive ul.products li.product,
.woocommerce-page.archive ul.products li.product{
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Maak de klikbare product-link geen “rommelige” wrapper */
.woocommerce.archive ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce-page.archive ul.products li.product a.woocommerce-LoopProduct-link{
  display: block !important;
  text-decoration: none !important;
}

/* Consistente beeldverhouding + crop (voelt direct premium) */
.woocommerce.archive ul.products li.product a img,
.woocommerce-page.archive ul.products li.product a img{
  aspect-ratio: 4 / 3;          /* kies 1 stijl: 4/3 werkt mooi voor boxes */
  object-fit: cover;
  width: 100%;
  height: auto;
  background: rgba(255,255,255,0.02);
}

/* Titel: maximaal 2 regels, zodat rijen mooi uitlijnen */
.woocommerce.archive ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page.archive ul.products li.product .woocommerce-loop-product__title{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(1.25em * 2); /* 2 regels “reserve” */
}

/* Prijs en knop altijd richting onderkant */
.woocommerce.archive ul.products li.product .price,
.woocommerce-page.archive ul.products li.product .price{
  margin-top: 2px !important;
}

/* Button: full width, voelt als duidelijke CTA */
.woocommerce.archive ul.products li.product a.button,
.woocommerce-page.archive ul.products li.product a.button{
  width: 100% !important;
  margin-top: auto !important;       /* duwt knop naar beneden */
  padding: 11px 14px !important;
}

/* Kleine “divider vibe” tussen afbeelding en tekst (subtiel) */
.woocommerce.archive ul.products li.product a.woocommerce-LoopProduct-link{
  position: relative;
}
.woocommerce.archive ul.products li.product a.woocommerce-LoopProduct-link::after,
.woocommerce-page.archive ul.products li.product a.woocommerce-LoopProduct-link::after{
  content: "";
  display: block;
  height: 1px;
  margin: 14px 0 0;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(198,167,94,0.22),
    transparent
  );
}

/* Hover: net iets minder “zoom”, iets meer luxe */
.woocommerce.archive ul.products li.product:hover a img,
.woocommerce-page.archive ul.products li.product:hover a img{
  transform: scale(1.015);
  filter: saturate(1.02);
}

/* Mobile: iets “strakker” beeld, minder hoogte */
@media (max-width: 767px){
  .woocommerce.archive ul.products li.product a img,
  .woocommerce-page.archive ul.products li.product a img{
    aspect-ratio: 1 / 1; /* mobiel vaak rustiger vierkant */
  }
}
/* =========================================================
   Studio Ember — Archive polish (gelijke kaarten + warm image-bed)
   Plak ONDER je huidige product-grid CSS
   ========================================================= */

/* 1) Cards: gelijke hoogte + knop altijd onderaan */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

/* De link wrapper mag block zijn */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{
  display: block !important;
}

/* 2) Image: vaste verhouding + “warm bed” erachter */
.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img{
  aspect-ratio: 4 / 3;
  object-fit: cover;
  width: 100%;
  border-radius: 14px !important;

  /* warm image-bed / consistent achtergrondgevoel */
  background: radial-gradient(circle at 30% 20%,
    rgba(198,167,94,0.18),
    rgba(255,255,255,0.02) 55%,
    rgba(0,0,0,0.35) 100%
  ) !important;

  /* mini warmth (subtiel, zodat je nieuwe foto’s lekker warm blijven) */
  filter: saturate(1.03) sepia(0.06) !important;
}

/* 3) Titel: max 2 regels zodat rijen netjes uitlijnen */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(1.25em * 2); /* reserve voor 2 regels */
}

/* 4) CTA altijd onderaan + full width */
.woocommerce ul.products li.product a.button,
.woocommerce-page ul.products li.product a.button{
  margin-top: auto !important;
  width: 100% !important;
}

/* Mobile: iets rustiger (vierkant) */
@media (max-width: 767px){
  .woocommerce ul.products li.product a img,
  .woocommerce-page ul.products li.product a img{
    aspect-ratio: 1 / 1;
  }
}
/* =========================================================
   Studio Ember — Archive final polish (spacing + typography)
   Plak ONDER je huidige CSS
   ========================================================= */

/* 1) Minder lucht boven de product grid */
.woocommerce.archive ul.products,
.woocommerce-page.archive ul.products{
  margin-top: 10px !important;     /* was vaak groot */
  padding-top: 0 !important;
}

/* 2) Kaartbody iets luxer/dieper + rand iets cleaner */
.woocommerce.archive ul.products li.product,
.woocommerce-page.archive ul.products li.product{
  background: rgba(0,0,0,0.22) !important;   /* net iets dieper dan 0.02 */
  border-color: rgba(198,167,94,0.18) !important;
}

/* 3) Afbeeldingblok: iets strakkere “frame” feel */
.woocommerce.archive ul.products li.product a img,
.woocommerce-page.archive ul.products li.product a img{
  border-radius: 14px !important;
  outline: 1px solid rgba(255,255,255,0.05); /* subtiele foto-rand */
  outline-offset: -1px;
}

/* 4) Typografie spacing: titel/prijs compacter */
.woocommerce.archive ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page.archive ul.products li.product .woocommerce-loop-product__title{
  margin: 12px 0 6px !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
}

.woocommerce.archive ul.products li.product .price,
.woocommerce-page.archive ul.products li.product .price{
  margin: 0 0 10px !important;
  font-size: 13.5px !important;
}

/* 5) Button: NIET cursief + iets steviger premium */
.woocommerce.archive ul.products li.product a.button,
.woocommerce-page.archive ul.products li.product a.button{
  font-style: normal !important;     /* <-- weg met italic */
  letter-spacing: 0.02em;
  padding: 11px 14px !important;
  border-color: rgba(198,167,94,0.32) !important;
  background: rgba(255,255,255,0.015) !important;
}

/* Hover: iets warmer “gold wash” */
.woocommerce.archive ul.products li.product:hover a.button,
.woocommerce-page.archive ul.products li.product:hover a.button{
  background: rgba(198,167,94,0.08) !important;
  border-color: rgba(198,167,94,0.55) !important;
}/* End custom CSS */