/*
Theme Name: MenyDesign Modern 2.0
Theme URI: https://www.menydesign.se/
Author: Menydesign.se
Author URI: https://www.menydesign.se/
Description: MenyDesign Modern 2.0 – modern WooCommerce-design för Menydesign.se. Build 320 – fördröjd Analytics/GTM på mobil startsida.
Version: 2.0.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: menydesign-modern
*/

:root{
  --gold:#c6a25a;
  --border:#e5e5e5;
  --text:#222;
  --muted:#555;
  --bg:#fff;
  --black:#111;
  --card-radius:12px;
  --puff-bg:#f2efe8;
}

*{box-sizing:border-box;}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);}

/* Header */
header.site-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 28px;border-bottom:1px solid var(--border);
  position:relative;background:#fff;z-index:50;
}
.menu-toggle{width:40px;height:40px;border:0;padding:0;background:transparent;color:inherit;font:inherit;border-radius:999px;display:flex;align-items:center;justify-content:center;cursor:pointer;user-select:none;-webkit-appearance:none;appearance:none;}
.menu-toggle:hover{background:#f5f5f5;}
.logo-center{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;}
.logo-center a{color:var(--text);text-decoration:none;font-weight:800;font-size:22px;line-height:1;}
.custom-logo{max-height:42px;width:auto;display:block;}
.header-icons{display:flex;gap:10px;align-items:center;}
.header-icons a{width:40px;height:40px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:var(--text);position:relative;}
.header-icons a:hover{background:#f5f5f5;}
.icon{width:20px;height:20px;display:block;}
.icon *{stroke:currentColor;}
.cart-count{position:absolute;top:4px;right:4px;background:var(--gold);color:#fff;font-size:12px;padding:2px 6px;border-radius:999px;line-height:1.2;min-width:18px;text-align:center;}

/* Dropdown menu */
.dropdown-menu{display:none;padding:18px 28px;border-bottom:1px solid #eee;background:#fff;}
.dropdown-menu .menu{list-style:none;margin:0;padding:0;}
.dropdown-menu .menu li{margin:0 0 10px 0;}
.dropdown-menu .menu a{text-decoration:none;color:var(--text);font-size:16px;}
.dropdown-menu .menu a:hover{text-decoration:underline;}

/* Search bar */
.search-bar{display:none;padding:18px 28px;border-bottom:1px solid #eee;background:#fff;}
.search-bar form{display:flex;gap:10px;max-width:1100px;margin:0 auto;}
.search-bar input{flex:1;padding:12px 12px;border:1px solid #ccc;border-radius:8px;}
.search-bar button{padding:12px 20px;background:var(--gold);border:none;color:#fff;border-radius:8px;cursor:pointer;font-weight:800;}
.search-bar button:hover{filter:brightness(0.96);}

/* Hero slider */
.hero{position:relative;height:520px;overflow:hidden;background:#000;}
.slide{position:absolute;inset:0;background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;flex-direction:column;opacity:0;transition:opacity .8s ease;}
.slide::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));}
.slide > *{position:relative;z-index:1;}
.slide h2{font-size:46px;margin:0 0 10px 0;padding:0 18px;}
.slide p{font-size:18px;margin:0;padding:0 18px;max-width:900px;}
.slide a.slide-btn{margin-top:18px;display:inline-block;background:var(--gold);color:#fff;text-decoration:none;padding:12px 18px;border-radius:10px;font-weight:900;}
.slide a.slide-btn:hover{filter:brightness(.95);}

/* Intro */
.intro{padding:60px 40px;text-align:center;}
.intro .center{max-width:900px;margin:0 auto;}
.intro h1{margin:0 0 14px 0;font-size:28px;}
.intro .intro-text{font-size:16px;line-height:1.7;color:var(--muted);}

/* Puffar */
.puffs{padding:40px 40px;}
.puff-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.puff{background:var(--puff-bg);border:1px solid #e7e1d6;border-radius:14px;padding:18px 18px 16px 18px;text-align:center;}
.puff .puff-icon{width:44px;height:44px;margin:0 auto 10px auto;border-radius:999px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #eadfcb;}
.puff .puff-icon svg{width:22px;height:22px;display:block;color:#000;}
.puff h3{margin:0 0 6px 0;font-size:14px;letter-spacing:.4px;text-transform:uppercase;}
.puff .puff-text{margin:0;color:#333;font-size:14px;line-height:1.35;}
.puff a{color:inherit;text-decoration:none;}
.puff a:hover{text-decoration:underline;}

/* Woo category grid */
.cat-grid-wrap{padding:60px 40px;}
.cat-grid-title{max-width:1100px;margin:0 auto 18px auto;font-size:22px;font-weight:900;}
.category-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.cat-card{border:1px solid var(--border);border-radius:var(--card-radius);overflow:hidden;background:#fff;text-decoration:none;color:var(--text);}
.cat-card img{width:100%;height:190px;object-fit:cover;display:block;background:#f4f4f4;}
.cat-card .pad{padding:14px;}
.cat-card h3{margin:0;font-size:16px;}
.cat-card:hover{box-shadow:0 6px 18px rgba(0,0,0,.08);transform:translateY(-1px);transition:.15s;}

/* Logos banner (bigger) */
.logos{padding:45px 40px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:#fff;}
.logo-row{max-width:1100px;margin:0 auto;display:flex;gap:34px;align-items:center;justify-content:center;flex-wrap:wrap;}
.logo-row img{height:56px;width:auto;opacity:.92;}
.logo-row img:hover{opacity:1;}

/* Footer (5 columns, icon above text) */
footer.site-footer{background:var(--black);color:#fff;padding:52px 40px;}
.footer-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(5,1fr);gap:18px;}
.footer-item{text-align:center;padding:8px 6px;}
.footer-icon{
  width:52px;height:52px;margin:0 auto 10px auto;
  display:flex;align-items:center;justify-content:center;
}
/* Preset icon (SVG) */
.footer-icon.is-preset{
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
}
.footer-icon.is-preset svg{width:22px;height:22px;color:#fff;}
/* Custom uploaded icon (no frame) */
.footer-icon.is-custom{
  background:transparent;border:none;border-radius:0;
}
.footer-icon.is-custom img{
  width:46px;height:46px;object-fit:contain;display:block;
}

.footer-item .footer-text{color:rgba(255,255,255,.86);line-height:1.35;font-size:13px;}
.footer-item .footer-title{color:#fff;font-weight:900;letter-spacing:.3px;text-transform:uppercase;font-size:12px;margin-bottom:6px;}
.footer-bottom{max-width:1100px;margin:26px auto 0 auto;padding-top:18px;border-top:1px solid rgba(255,255,255,.18);text-align:center;color:rgba(255,255,255,.75);font-size:14px;}
footer.site-footer a{color:#fff;}

@media(max-width:1100px){.footer-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:992px){.puff-grid,.category-grid{grid-template-columns:repeat(2,1fr);} .hero{height:460px;} .slide h2{font-size:38px;}}
@media(max-width:600px){
  header.site-header{padding:12px 14px;}
  .puff-grid,.category-grid,.footer-grid{grid-template-columns:1fr;}
  .intro,.puffs,.cat-grid-wrap,.logos,footer.site-footer{padding-left:16px;padding-right:16px;}
  .slide h2{font-size:30px;}
}


/* Footer link wrapper */
.footer-link{color:inherit;text-decoration:none;display:block;}
.footer-link:hover{text-decoration:underline;}



/* Puff background image + gradient like Menydesign feel */
.puff.has-bg{
  background-size:cover;
  background-position:center;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.puff.has-bg::before{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,.55) 70%, rgba(0,0,0,.70) 100%);
  border-radius:14px;
}
.puff.has-bg *{position:relative;z-index:1;}

/* Puff hover */
.puff{
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.puff:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 26px rgba(0,0,0,.10);
}


.puff-btn:hover{filter:brightness(.95);}


/* Puff layout improvement */
.puff{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  text-align:left;
  padding:32px;
}

/* sharper background rendering */
.puff.has-bg{
  background-size:cover;
  background-position:center center;
  image-rendering:auto;
}


/* V62 Puff sizing: 800x400 on desktop */
.puff-grid{
  }

 .puff{
  height:300px;
  max-width:800px;
  width:100%;
}

.puff.has-bg{
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}

/* V62 responsive override */
@media(max-width:992px){
  .puff-grid{grid-template-columns:1fr;}
  .puff{max-width:none;height:320px;}
}
@media(max-width:600px){
  .puff{height:260px;padding:26px;}
}


/* V62 Puff sizing + mobile-first */
.puff-grid{
  /* Center and keep a nice max width */
  }

/* Desktop default */
 .puff{
  height:300px;
  max-width:800px;
  width:100%;
  padding:40px;
}

/* Tablet */
@media (max-width:1024px){
  .puff-grid{grid-template-columns:1fr;}
  .puff{max-width:none;height:300px;padding:34px;}
}

/* Mobile */
@media (max-width:600px){
  .puff{height:200px;padding:26px;}
}

.puff.has-bg{
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}



/* V62 Puff grid: 4 on desktop */
.puff-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:20px;
  max-width:1100px;
  margin:0 auto;
  justify-content:stretch;
}

.puff{
  width:100%;
  max-width:none;
  height:300px;
}

/* Tablet */
@media (max-width:1024px){
  .puff-grid{grid-template-columns: repeat(2, 1fr);}
  .puff{height:260px;}
}

/* Mobile */
@media (max-width:600px){
  .puff-grid{grid-template-columns: 1fr;}
  .puff{height:220px;}
}



/* V62 Puffar: kompakt storlek (mer lik menydesign.se) */
.puff-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:18px;
  max-width:1100px;
  margin:0 auto;
}

.puff{
  width:100%;
  height:170px;           /* kompakt */
  padding:18px 18px;
  border-radius:14px;
  display:flex;
  flex-direction:column;
  justify-content:center; /* centrerad i höjd */
  align-items:flex-start; /* vänster */
  text-align:left;
}

.puff .puff-icon{
  width:40px;height:40px;
  margin:0 0 10px 0;
}
.puff .puff-icon svg{width:20px;height:20px;}

.puff h3{font-size:13px;}
.puff .puff-text{font-size:13px;}

@media (max-width:1024px){
  .puff-grid{grid-template-columns: repeat(2, 1fr);}
  .puff{height:160px;}
}

@media (max-width:600px){
  .puff-grid{grid-template-columns: 1fr;}
  .puff{height:140px;padding:16px;}
}


/* V62 larger banner logos */
.logo-row img{
  height:84px;
}

/* V62 larger header logo */
.custom-logo{
  max-height:63px;
}

/* V62 better logo spacing + responsive scaling */
.logo-row{
  gap:50px;
  padding-top:10px;
  padding-bottom:10px;
}

.logo-row img{
  height:84px;
  width:auto;
}

/* tablet */
@media (max-width:1024px){
  .logo-row{
    gap:36px;
  }
  .logo-row img{
    height:64px;
  }
}

/* mobile */
@media (max-width:600px){
  .logo-row{
    gap:26px;
  }
  .logo-row img{
    height:48px;
  }
}

/* header logo responsive */
@media (max-width:600px){
  .custom-logo{
    max-height:52px;
  }
}


/* V62 Scrolling logo banner */
.logos{
  overflow:hidden;
}

.logo-row{
  display:flex;
  flex-wrap:nowrap;
  gap:60px;
  align-items:center;
  animation: logoScroll 25s linear infinite;
}

.logo-row img{
  flex:0 0 auto;
}

/* animation */
@keyframes logoScroll{
  0%{
    transform:translateX(0);
  }
  100%{
    transform:translateX(-50%);
  }
}

/* pause on hover */
.logos:hover .logo-row{
  animation-play-state:paused;
}


/* V62 Seamless scrolling logo banner (marquee) */
.logos{
  overflow:hidden;
}

.logo-marquee{
  max-width:1100px;
  margin:0 auto;
  overflow:hidden;
}

.logo-track{
  display:flex;
  width:max-content;
  align-items:center;
  gap:0;
  animation: logoMarquee 28s linear infinite;
}

.logo-row{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:60px;
  padding:10px 0;
}

.logo-row img{
  flex:0 0 auto;
}

/* seamless loop: move one full row width (50% of track because we duplicate rows) */
@keyframes logoMarquee{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-50%); }
}

/* pause on hover */
.logos:hover .logo-track{
  animation-play-state:paused;
}

/* responsive spacing/sizing (keeps earlier sizes if present) */
@media (max-width:1024px){
  .logo-row{gap:36px;}
}
@media (max-width:600px){
  .logo-row{gap:26px;}
}


/* V62 Logo marquee (JS-measured distance, no jump, no overlap) */
.logos{
  overflow:hidden;
}

.logo-marquee{
  max-width:1100px;
  margin:0 auto;
  overflow:hidden;
}

.logo-track{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  width:max-content;
  will-change:transform;
}

.logo-row{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:60px;
  padding:10px 0;
  flex:0 0 auto;
}

.logo-row img{
  flex:0 0 auto;
  display:block;
}

/* Pause on hover (desktop) */
@media (hover:hover){
  .logos:hover .logo-track{
    animation-play-state:paused;
  }
}

/* Responsive spacing/sizing */
@media (max-width:1024px){
  .logo-row{gap:36px;}
}
@media (max-width:600px){
  .logo-row{gap:26px;}
}



/* V62 equal spacing between last and first logo */
.logo-row{
  gap:60px;
  position:relative;
}

/* add virtual spacing after last logo so loop gap matches */
.logo-row::after{
  content:"";
  flex:0 0 60px;
}

/* V62: real spacer element to keep equal gap between last and first logo */
.mdm-logo-spacer{
  flex:0 0 var(--mdm-logo-gap, 60px);
  width:var(--mdm-logo-gap, 60px);
  height:1px;
}


/* V62 Category cards: higher image quality + text overlay (like menydesign.se) */
.category-grid{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:20px;
}

.cat-card{
  position:relative;
  border:0;
  border-radius:14px;
  overflow:hidden;
  background:#000;
}

.cat-card .cat-media{
  position:relative;
  width:100%;
  height:210px;
  overflow:hidden;
}
.cat-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.01);
}

.cat-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.40) 65%, rgba(0,0,0,.72) 100%);
  pointer-events:none;
}

.cat-card .cat-overlay{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:14px 14px 14px 14px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
}

.cat-card .cat-title{
  margin:0;
  color:#FFFFFF;
  font-weight:900;
  font-size:14px;
  letter-spacing:.6px;
  text-transform:uppercase;
  display:inline-block;
  background:rgba(0,0,0,.72);
  padding:6px 10px; /* 50% smaller height */
  border-radius:0;
  max-width:80%;
}

.cat-card .cat-cta{
  color:var(--gold);
  font-weight:900;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.3px;
  white-space:nowrap;
}

.cat-card:hover img{
  transform:scale(1.04);
  transition:transform .25s ease;
}
.cat-card:hover{
  box-shadow:0 10px 26px rgba(0,0,0,.14);
  transform:translateY(-2px);
  transition:.18s ease;
}

@media(max-width:992px){
  .category-grid{grid-template-columns:repeat(2, 1fr);}
  .cat-card .cat-media{height:200px;}
}
@media(max-width:600px){
  .category-grid{grid-template-columns:1fr;}
  .cat-card .cat-media{height:190px;}
}



/* V62 Category cards: sliding text panel + reveal "Mer information" */
.category-grid{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:20px;
}

.cat-card{
  position:relative;
  border:0;
  border-radius:14px;
  overflow:hidden;
  background:#000;
  text-decoration:none;
  color:#fff;
}

.cat-card .cat-media{
  position:relative;
  width:100%;
  height:210px;
  overflow:hidden;
}
.cat-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.01);
  transition:transform .28s ease;
}

/* subtle dark overlay for readability */
.cat-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.35) 60%, rgba(0,0,0,.65) 100%);
  pointer-events:none;
}

/* sliding panel */
.cat-card .cat-overlay{
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  padding:14px 14px 12px 14px;
  border-radius:12px;
  background:rgba(0,0,0,.70); /* svart med genomskinlighet */
  backdrop-filter:saturate(120%) blur(2px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;

  transform:translateY(22px);
  transition:transform .22s ease;
}

.cat-card .cat-title{
  margin:0;
  color:#FFFFFF;
  font-weight:900;
  font-size:14px;
  letter-spacing:.6px;
  text-transform:uppercase;
  display:inline-block;
  background:rgba(0,0,0,.72);
  padding:6px 10px; /* 50% smaller height */
  border-radius:0;
  max-width:80%;
}

.cat-card .cat-cta{
  color:var(--gold);
  font-weight:900;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.3px;
  white-space:nowrap;

  opacity:0;
  transform:translateY(6px);
  transition:opacity .18s ease, transform .18s ease;
}

/* hover: panel slides up and CTA appears */
.cat-card:hover .cat-overlay{
  transform:translateY(0);
}
.cat-card:hover .cat-cta{
  opacity:1;
  transform:translateY(0);
}
.cat-card:hover img{
  transform:scale(1.04);
}

@media(max-width:992px){
  .category-grid{grid-template-columns:repeat(2, 1fr);}
  .cat-card .cat-media{height:200px;}
}
@media(max-width:600px){
  .category-grid{grid-template-columns:1fr;}
  .cat-card .cat-media{height:190px;}
  .cat-card .cat-overlay{left:8px;right:8px;bottom:8px;}
}



/* V62 Category cards: centered text + full-width bar (no rounded corners) */
.category-grid{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:20px;
}

.cat-card{
  position:relative;
  border:0;
  border-radius:14px;
  overflow:hidden;
  background:#000;
  text-decoration:none;
  color:#fff;
}

.cat-card .cat-media{
  position:relative;
  width:100%;
  height:210px;
  overflow:hidden;
}
.cat-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.01);
  transition:transform .28s ease;
}

.cat-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.60) 100%);
  pointer-events:none;
}

/* Full-width bar centered vertically */
.cat-card .cat-overlay{
  position:absolute;
  left:0;
  right:0;
  top:50%;
  transform:translateY(calc(-50% + 18px));
  padding:16px 18px;
  background:rgba(0,0,0,.70); /* svart genomskinlig */
  border-radius:0;            /* inga rundade hörn */
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-align:center;
  transition:transform .22s ease;
}

.cat-card .cat-title{
  margin:0;
  color:#FFFFFF;
  font-weight:900;
  font-size:14px;
  letter-spacing:.6px;
  text-transform:uppercase;
  display:inline-block;
  background:rgba(0,0,0,.72);
  padding:6px 10px; /* 50% smaller height */
  border-radius:0;
  max-width:80%;
}

.cat-card .cat-cta{
  color:#fff;
  font-weight:800;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.4px;
  opacity:0;
  transform:translateY(6px);
  transition:opacity .18s ease, transform .18s ease;
}

/* hover: bar slides up, CTA appears */
.cat-card:hover .cat-overlay{
  transform:translateY(-50%);
}
.cat-card:hover .cat-cta{
  opacity:1;
  transform:translateY(0);
}
.cat-card:hover img{
  transform:scale(1.04);
}

@media(max-width:992px){
  .category-grid{grid-template-columns:repeat(2, 1fr);}
  .cat-card .cat-media{height:200px;}
}
@media(max-width:600px){
  .category-grid{grid-template-columns:1fr;}
  .cat-card .cat-media{height:190px;}
}



/* V62 Category cards: narrower title background + hover slide to top + reveal CTA under bar */
.category-grid{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:20px;
}

.cat-card{
  position:relative;
  border:0;
  border-radius:14px;
  overflow:hidden;
  background:#000;
  text-decoration:none;
  color:#FFFFFF;
}

.cat-card .cat-media{
  position:relative;
  width:100%;
  height:210px;
  overflow:hidden;
}
.cat-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.01);
  transition:transform .28s ease;
}

.cat-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,.28) 55%, rgba(0,0,0,.55) 100%);
  pointer-events:none;
}

/* Overlay container: centered initially */
.cat-card .cat-overlay{
  position:absolute;
  left:0;
  right:0;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-align:center;
  transition:top .22s ease, transform .22s ease;
  padding:0 14px;
}

/* Narrower black background only behind title (not edge-to-edge) */
.cat-card .cat-title{
  margin:0;
  color:#FFFFFF;
  font-weight:900;
  font-size:14px;
  letter-spacing:.6px;
  text-transform:uppercase;
  display:inline-block;
  background:rgba(0,0,0,.72);
  padding:6px 10px; /* 50% smaller height */
  border-radius:0;
  max-width:80%;
}

/* CTA under the title bar (no background) */
.cat-card .cat-cta{
  color:#FFFFFF;
  font-weight:800;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.4px;
  opacity:0;
  transform:translateY(-4px);
  transition:opacity .18s ease, transform .18s ease;
}

/* Hover: move the title bar to the very top; CTA appears under it */
.cat-card:hover .cat-overlay{
  top:12px;
  transform:translateY(0);
}
.cat-card:hover .cat-cta{
  opacity:1;
  transform:translateY(0);
}
.cat-card:hover img{
  transform:scale(1.04);
}

@media(max-width:992px){
  .category-grid{grid-template-columns:repeat(2, 1fr);}
  .cat-card .cat-media{height:200px;}
  .cat-card .cat-title{
  margin:0;
  color:#FFFFFF;
  font-weight:900;
  font-size:14px;
  letter-spacing:.6px;
  text-transform:uppercase;
  display:inline-block;
  background:rgba(0,0,0,.72);
  padding:6px 10px; /* 50% smaller height */
  border-radius:0;
  max-width:80%;
}
}
@media(max-width:600px){
  .category-grid{grid-template-columns:1fr;}
  .cat-card .cat-media{height:190px;}
  .cat-card .cat-title{
  margin:0;
  color:#FFFFFF;
  font-weight:900;
  font-size:14px;
  letter-spacing:.6px;
  text-transform:uppercase;
  display:inline-block;
  background:rgba(0,0,0,.72);
  padding:6px 10px; /* 50% smaller height */
  border-radius:0;
  max-width:80%;
}
}



/* V62 Category overlay fix (single background, narrower, moves to top) */
.cat-card .cat-overlay{
  position:absolute;
  left:0;
  right:0;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  transition:all .25s ease;
}

/* single translucent background only here */
.cat-card .cat-title{
  color:#FFFFFF;
  background:rgba(0,0,0,.65);
  padding:6px 12px;
  display:inline-block;
  max-width:70%;
  text-align:center;
}

.cat-card .cat-cta{
  color:#FFFFFF;
  opacity:0;
  transform:translateY(-6px);
  transition:.2s ease;
}

/* hover behaviour */
.cat-card:hover .cat-overlay{
  top:10px;
  transform:none;
}

.cat-card:hover .cat-cta{
  opacity:1;
  transform:translateY(0);
}


/* V62 Category overlay (menydesign-like motion) */
.cat-card .cat-overlay{
  position:absolute;
  left:0;
  right:0;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  transition:top .28s cubic-bezier(.2,.8,.2,1), transform .28s cubic-bezier(.2,.8,.2,1);
  will-change:top, transform;
  pointer-events:none; /* click stays on card */
}

.cat-card .cat-title{
  color:#FFFFFF;
  background:rgba(0,0,0,.62);
  padding:6px 12px;
  display:inline-block;
  max-width:70%;
  text-align:center;
  letter-spacing:.6px;
  text-transform:uppercase;
  font-weight:900;
}

.cat-card .cat-cta{
  color:#FFFFFF;
  font-weight:800;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.4px;
  opacity:0;
  transform:translateY(-6px);
  transition:opacity .18s ease .08s, transform .18s ease .08s;
}

/* hover: move overlay to top and reveal CTA under */
@media (hover:hover){
  .cat-card:hover .cat-overlay{
    top:10px;
    transform:translateY(0);
  }
  .cat-card:hover .cat-cta{
    opacity:1;
    transform:translateY(0);
  }
}

/* touch devices: show CTA without hover */
@media (hover:none){
  .cat-card .cat-cta{
    opacity:1;
    transform:none;
  }
  .cat-card .cat-overlay{
    top:10px;
    transform:translateY(0);
  }
}

@media (prefers-reduced-motion: reduce){
  .cat-card .cat-overlay,
  .cat-card .cat-cta{
    transition:none !important;
  }
}



/* V62 Category overlay (match Menydesign.se feel) */
.cat-card{
  position:relative;
  overflow:hidden;
}
.cat-card img{
  transition:transform .35s cubic-bezier(.2,.8,.2,1);
}

/* Overlay container */
.cat-card .cat-overlay{
  position:absolute;
  left:0;
  right:0;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-align:center;
  pointer-events:none;
  will-change:transform, top;
  transition:
    top .38s cubic-bezier(.19,1,.22,1),
    transform .38s cubic-bezier(.19,1,.22,1);
}

/* Title pill */
.cat-card .cat-title{
  color:#FFFFFF;
  font-weight:900;
  font-size:14px;
  letter-spacing:.6px;
  text-transform:uppercase;

  background:rgba(0,0,0,.72);
  padding:8px 14px;
  max-width:72%;
  border-radius:0;
  box-shadow:0 6px 18px rgba(0,0,0,.18);
}

/* CTA hidden until hover */
.cat-card .cat-cta{
  color:#FFFFFF;
  font-weight:800;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.4px;

  opacity:0;
  transform:translateY(-8px);
  transition:
    opacity .22s ease .10s,
    transform .22s ease .10s;
}

/* Hover behavior (desktop): overlay snaps to top with "expo" feel, CTA reveals */
@media (hover:hover){
  .cat-card:hover img{
    transform:scale(1.04);
  }
  .cat-card:hover .cat-overlay{
    top:12px;
    transform:translateY(0);
  }
  .cat-card:hover .cat-cta{
    opacity:1;
    transform:translateY(0);
  }
}

/* Touch devices: show CTA and keep overlay near top */
@media (hover:none){
  .cat-card .cat-overlay{ top:12px; transform:translateY(0); }
  .cat-card .cat-cta{ opacity:1; transform:none; transition:none; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .cat-card img,
  .cat-card .cat-overlay,
  .cat-card .cat-cta{
    transition:none !important;
  }
}



/* V62 WooCommerce styling (approx Menydesign.se) */
.woocommerce ul.products{
  display:grid;
  grid-template-columns:repeat(3, minmax(320px, 1fr));
  gap:28px;
  max-width:1200px;
  margin:0 auto;
  padding:0;
}
.woocommerce ul.products li.product{
  list-style:none;
  margin:0 !important;
  padding:0 !important;
  background:#fff;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 8px 22px rgba(0,0,0,.06);
  transition:transform .18s ease, box-shadow .18s ease;
  display:flex;
  flex-direction:column;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(0,0,0,.10);
}
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{
  text-decoration:none;
  color:inherit;
  display:block;
}
.woocommerce ul.products li.product a img{
  width:100%;
  height:340px;
  object-fit:cover;
  margin:0 !important;
  display:block;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:13px;
  font-weight:900;
  letter-spacing:.5px;
  text-transform:uppercase;
  padding:14px 14px 4px 14px;
  margin:0 !important;
}
.woocommerce ul.products li.product .price{
  padding:0 14px 12px 14px;
  margin:0;
  font-weight:900;
  color:var(--gold);
}
.woocommerce ul.products li.product .price del{opacity:.5;}
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.add_to_cart_button,
.woocommerce ul.products li.product a.product_type_variable,
.woocommerce ul.products li.product a.product_type_simple{
  margin:0 14px 14px 14px !important;
  border-radius:12px !important;
  background:#000 !important;
  color:#fff !important;
  font-weight:900 !important;
  text-transform:uppercase;
  letter-spacing:.35px;
  padding:12px 14px !important;
  text-align:center;
}
.woocommerce ul.products li.product .button:hover{
  filter:brightness(.92);
}

/* badges */
.woocommerce span.onsale{
  background:var(--gold) !important;
  color:#fff !important;
  border-radius:999px !important;
  padding:6px 10px !important;
  top:12px !important;
  left:12px !important;
  right:auto !important;
  min-height:auto !important;
  line-height:1.2 !important;
}

/* Single product */
.woocommerce div.product div.images img{
  border-radius:16px;
}
.woocommerce div.product .product_title{
  font-weight:900;
  letter-spacing:.3px;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price{
  color:var(--gold);
  font-weight:900;
}
.woocommerce div.product form.cart .variations{
  width:100%;
  margin-bottom:10px;
}
.woocommerce div.product form.cart .variations select{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid #e7e7e7;
  background:#fff;
}
.woocommerce div.product form.cart .single_add_to_cart_button{
  background:#000 !important;
  color:#fff !important;
  border-radius:12px !important;
  padding:14px 16px !important;
  font-weight:900 !important;
  text-transform:uppercase;
  letter-spacing:.35px;
}
.woocommerce div.product form.cart .quantity .qty{
  border-radius:12px;
  padding:10px 12px;
  border:1px solid #e7e7e7;
}

/* Responsive */
@media (max-width:1024px){
  .woocommerce ul.products{
  display:grid;
  grid-template-columns:repeat(3, minmax(320px, 1fr));
  gap:28px;
  max-width:1200px;
  margin:0 auto;
  padding:0;
}
  .woocommerce ul.products li.product a img{
  width:100%;
  height:340px;
  object-fit:cover;
  margin:0 !important;
  display:block;
}
}
@media (max-width:600px){
  .woocommerce ul.products{
  display:grid;
  grid-template-columns:repeat(3, minmax(320px, 1fr));
  gap:28px;
  max-width:1200px;
  margin:0 auto;
  padding:0;
}
  .woocommerce ul.products li.product a img{
  width:100%;
  height:340px;
  object-fit:cover;
  margin:0 !important;
  display:block;
}
}


/* V62 larger product cards */
.woocommerce ul.products li.product{
  border-radius:18px;
}


/* V62 Fix: Woo products should not be narrow (override WC float/width rules) */
.woocommerce ul.products{
  width:100% !important;
  max-width:1400px;
  margin-left:auto !important;
  margin-right:auto !important;
  padding:0 16px;
  justify-items:stretch;
  align-items:stretch;
}

.woocommerce ul.products li.product{
  width:100% !important;
  float:none !important;
  clear:none !important;
}

.woocommerce-page ul.products li.product,
.woocommerce ul.products li.product{
  flex:initial !important;
}



/* V62: Category/shop archive layout (centered) + left category menu */
.woocommerce.archive .site-main,
.woocommerce-page.archive .site-main{
  max-width:1400px;
  margin:0 auto;
  padding:0 16px;
}

.mdm-shop-layout{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:28px;
  align-items:start;
}

.mdm-shop-sidebar{
  background:#fff;
  border-radius:16px;
  box-shadow:0 8px 22px rgba(0,0,0,.06);
  padding:16px;
  position:sticky;
  top:90px;
}

.mdm-shop-sidebar h3{
  margin:0 0 10px 0;
  font-size:13px;
  font-weight:900;
  letter-spacing:.4px;
  text-transform:uppercase;
}

.mdm-shop-sidebar ul{
  list-style:none;
  margin:0;
  padding:0;
}
.mdm-shop-sidebar li{margin:0;padding:0;}
.mdm-shop-sidebar a{
  display:block;
  padding:10px 10px;
  border-radius:12px;
  text-decoration:none;
  color:#111;
  font-weight:800;
  font-size:13px;
}
.mdm-shop-sidebar a:hover{background:rgba(0,0,0,.06);}
.mdm-shop-sidebar .current-cat > a{background:rgba(0,0,0,.08);}

/* Center archive title */
.woocommerce-products-header{
  text-align:center;
  margin:10px 0 18px 0;
}
.woocommerce-products-header__title{
  font-weight:900;
  letter-spacing:.4px;
}

/* Ensure products grid uses full width inside main column */
.mdm-shop-main .woocommerce ul.products{
  max-width:none !important;
  padding:0 !important;
}

@media (max-width:1024px){
  .mdm-shop-layout{grid-template-columns:1fr;}
  .mdm-shop-sidebar{position:relative;top:auto;}
}



/* V62 Fix: ensure products are truly 3-per-row and start directly under content (no unexpected left gap) */
.mdm-shop-layout{
  width:100%;
}

.mdm-shop-main{
  min-width:0; /* prevents grid overflow squeezing */
}

.woocommerce .mdm-shop-main ul.products,
.woocommerce-page .mdm-shop-main ul.products{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(320px, 1fr)) !important;
  gap:28px !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;          /* remove auto-centering that can create weird spacing */
  padding:0 !important;
  justify-items:stretch;
  align-items:stretch;
}

.woocommerce .mdm-shop-main ul.products li.product,
.woocommerce-page .mdm-shop-main ul.products li.product{
  width:100% !important;
  float:none !important;
  clear:none !important;
  margin:0 !important;
}

.woocommerce .mdm-shop-main ul.products::before,
.woocommerce .mdm-shop-main ul.products::after{
  content:none !important; /* remove clearfix pseudo elements that can interfere */
}

@media (max-width:1200px){
  .woocommerce .mdm-shop-main ul.products,
  .woocommerce-page .mdm-shop-main ul.products{
    grid-template-columns:repeat(2, minmax(280px, 1fr)) !important;
  }
}
@media (max-width:700px){
  .woocommerce .mdm-shop-main ul.products,
  .woocommerce-page .mdm-shop-main ul.products{
    grid-template-columns:1fr !important;
  }
}



/* V62 Single product: constrain image to ~600x600 */
.woocommerce div.product div.images{
  max-width:600px;
  margin:0 auto 16px auto;
}
.woocommerce div.product div.images img{
  width:100%;
  height:auto;
  max-height:600px;
  object-fit:contain;
}

/* V62 Quantity box matches add-to-cart button height */
.woocommerce div.product form.cart{
  display:flex;
  gap:12px;
  align-items:stretch;
  flex-wrap:wrap;
}
.woocommerce div.product form.cart .quantity{
  display:flex;
  align-items:stretch;
}
.woocommerce div.product form.cart .quantity .qty{
  height:52px;
  min-width:90px;
  padding:0 14px;
  border-radius:12px;
}
.woocommerce div.product form.cart .single_add_to_cart_button{
  height:52px;
  padding:0 18px !important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}



/* V62: hide theme default sidebar/widgets on Woo archives (only show our category menu) */
.woocommerce.archive #secondary,
.woocommerce-page.archive #secondary{
  display:none !important;
}


/* V62 Fix single product page width and alignment */
.woocommerce div.product{
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:start;
}

.woocommerce div.product div.images{
  max-width:600px;
}

.woocommerce div.product div.summary{
  max-width:520px;
}

@media (max-width:900px){
  .woocommerce div.product{
    grid-template-columns:1fr;
    gap:30px;
  }
  .woocommerce div.product div.images,
  .woocommerce div.product div.summary{
    max-width:100%;
  }
}


/* V62 Single product layout (only top gallery+summary, tabs/related full width) */
.single-product .site-main{
  max-width:1200px;
  margin:0 auto;
  padding:0 16px;
}

.single-product .mdm-product-top{
  display:grid;
  grid-template-columns:minmax(420px, 600px) 1fr;
  gap:60px;
  align-items:start;
  margin-top:10px;
}

/* gallery sizing */
.single-product .woocommerce-product-gallery{
  width:100%;
  max-width:600px;
}
.single-product .woocommerce-product-gallery__wrapper,
.single-product .woocommerce-product-gallery img{
  width:100%;
  height:auto;
}
.single-product .woocommerce-product-gallery img{
  max-height:600px;
  object-fit:contain;
}

/* summary sizing */
.single-product .entry-summary{
  max-width:520px;
}

/* stack on smaller screens */
@media (max-width:900px){
  .single-product .mdm-product-top{
    grid-template-columns:1fr;
    gap:28px;
  }
  .single-product .entry-summary{
    max-width:100%;
  }
}



/* V62: Woo layout with left category menu (archive + single product) */
.woocommerce .site-main,
.woocommerce-page .site-main{
  max-width:1400px;
  margin:0 auto;
  padding:0 16px;
}

.mdm-shop-layout{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:28px;
  align-items:start;
}

.mdm-shop-sidebar{
  background:#fff;
  border-radius:16px;
  box-shadow:0 8px 22px rgba(0,0,0,.06);
  padding:16px;
  position:sticky;
  top:90px;
}

.mdm-shop-sidebar h3{
  margin:0 0 10px 0;
  font-size:13px;
  font-weight:900;
  letter-spacing:.4px;
  text-transform:uppercase;
}

.mdm-shop-sidebar ul{list-style:none;margin:0;padding:0;}
.mdm-shop-sidebar li{margin:0;padding:0;}
.mdm-shop-sidebar a{
  display:block;
  padding:10px 10px;
  border-radius:12px;
  text-decoration:none;
  color:#111;
  font-weight:800;
  font-size:13px;
}
.mdm-shop-sidebar a:hover{background:rgba(0,0,0,.06);}
.mdm-shop-sidebar .current-cat > a{background:rgba(0,0,0,.08);}

@media (max-width:1024px){
  .mdm-shop-layout{grid-template-columns:1fr;}
  .mdm-shop-sidebar{position:relative;top:auto;order:2;}
}

/* V62 Single product: only gallery+summary in two columns, tabs/related below */
.single-product .mdm-product-top{
  display:grid;
  grid-template-columns:minmax(420px, 600px) 1fr;
  gap:60px;
  align-items:start;
  margin-top:10px;
}

.single-product .woocommerce-product-gallery{
  width:100%;
  max-width:600px;
}
.single-product .woocommerce-product-gallery img{
  max-height:600px;
  object-fit:contain;
}

.single-product .entry-summary{
  max-width:520px;
}

@media (max-width:900px){
  .single-product .mdm-product-top{
    grid-template-columns:1fr;
    gap:28px;
  }
  .single-product .entry-summary{max-width:100%;}
}



/* V62: Prevent double sidebars on Woo pages + ensure tabs/related below full width */
.woocommerce #secondary,
.woocommerce-page #secondary{
  display:none !important; /* hide theme sidebar completely on Woo pages */
}

.mdm-shop-main{
  min-width:0;
}

/* Single product: tabs/related should take full width in main column and clear floats */
.single-product .mdm-shop-main .woocommerce-tabs,
.single-product .mdm-shop-main .related,
.single-product .mdm-shop-main .upsells,
.single-product .mdm-shop-main .woocommerce-Tabs-panel{
  width:100% !important;
  max-width:100% !important;
  float:none !important;
  clear:both !important;
  display:block;
}

.single-product .mdm-shop-main .woocommerce-tabs{
  margin-top:40px;
}
.single-product .mdm-shop-main .related{
  margin-top:40px;
}


/* V62: hide any theme sidebar on Woo pages (more aggressive selectors) */
.woocommerce aside#secondary,
.woocommerce-page aside#secondary,
.woocommerce .widget-area#secondary,
.woocommerce-page .widget-area#secondary{
  display:none !important;
}


/* V62: Force product tabs (Beskrivning) under gallery+summary and full width */
.single-product .mdm-shop-main div.product{
  display:block !important;
}

.single-product .mdm-shop-main .woocommerce-tabs,
.single-product .mdm-shop-main .woocommerce-tabs .wc-tabs,
.single-product .mdm-shop-main .woocommerce-tabs .woocommerce-Tabs-panel,
.single-product .mdm-shop-main .related,
.single-product .mdm-shop-main .upsells{
  float:none !important;
  clear:both !important;
  width:100% !important;
  max-width:100% !important;
}

.single-product .mdm-shop-main .woocommerce-tabs{
  margin-top:40px !important;
}

/* Hide reviews tab nav if any remains */
.single-product .mdm-shop-main .woocommerce-tabs ul.wc-tabs li.reviews_tab{
  display:none !important;
}



/* V62: Use available width in summary column + keep qty + button on same row */
.single-product .mdm-product-top{
  grid-template-columns:minmax(420px, 600px) minmax(520px, 1fr);
}

.single-product .entry-summary{
  max-width:none !important;
  width:100%;
}

/* Cart row: qty + button inline on desktop */
@media (min-width:901px){
  .woocommerce div.product form.cart{
    flex-wrap:nowrap !important;
    align-items:stretch;
  }
  .woocommerce div.product form.cart .quantity{
    flex:0 0 auto;
  }
  .woocommerce div.product form.cart .single_add_to_cart_button{
    flex:1 1 auto;
    min-width:260px;
  }
}

/* Meta (Kategorier / Etiketter) should use full width */
.single-product .product_meta{
  max-width:none !important;
  width:100%;
}



/* V62: use more horizontal space + improve qty styling */
.single-product .mdm-product-top{
  grid-template-columns:minmax(360px,560px) 1fr;
  gap:40px;
}

.single-product .entry-summary{
  max-width:none;
  padding-right:20px;
}

/* qty box style similar visual weight as button */
.woocommerce div.product form.cart .quantity .qty{
  height:56px;
  font-size:18px;
  font-weight:600;
  min-width:110px;
}

.woocommerce div.product form.cart .single_add_to_cart_button{
  height:56px;
  font-size:18px;
  padding:0 28px !important;
}


/* V62: Puff height -20% and text bottom-left */
.mdm-puff,
.puff,
.puff-card{
  height:240px !important; /* approx 20% smaller if previous ~300 */
}

.mdm-puff .puff-text,
.puff .puff-text,
.puff-card .puff-text{
  position:absolute;
  bottom:20px;
  left:20px;
  right:auto;
  text-align:left;
}


/* V62: Puffar – match Menydesign.se (storlek, grid, text nere vänster, hover) */
.puffs .puff-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:28px;
}

.puffs .puff{
  position:relative;
  height:260px;              /* ~520x260 känsla (2:1) */
  border-radius:18px;
  overflow:hidden;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  box-shadow:0 10px 24px rgba(0,0,0,.10);
  transition:transform .18s ease, box-shadow .18s ease;
}

.puffs .puff:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.45) 85%);
  opacity:.95;               /* lätt mörkning som original */
  transition:opacity .25s ease;
  pointer-events:none;
}

.puffs .puff:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(0,0,0,.14);
}
.puffs .puff:hover:before{
  opacity:1;
}

/* Icon uppe vänster (om vald) */
.puffs .puff .puff-icon{
  position:absolute;
  top:18px;
  left:18px;
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:rgba(255,255,255,.92);
  box-shadow:0 8px 18px rgba(0,0,0,.10);
  z-index:2;
}
.puffs .puff .puff-icon svg{
  width:24px;
  height:24px;
}

/* Text nere vänster */
.puffs .puff h3,
.puffs .puff .puff-text{
  position:absolute;
  left:28px;
  right:28px;
  z-index:2;
  margin:0;
  text-align:left;
  color:#fff;
}

.puffs .puff h3{
  bottom:48px;
  font-weight:900;
  letter-spacing:.4px;
  text-transform:uppercase;
  font-size:18px;
  line-height:1.15;
}

.puffs .puff .puff-text{
  bottom:22px;
  font-size:14px;
  opacity:.92;
}

/* Om två puff-text finns: gör den andra lite mindre */
.puffs .puff .puff-text + .puff-text{
  bottom:18px;
  font-size:13px;
  opacity:.88;
}

/* Länk i rubrik ska inte ändra layout */
.puffs .puff a{
  color:inherit;
  text-decoration:none;
}

/* Responsive: 2 kolumner tablet, 1 kolumn mobil */
@media (max-width:1024px){
  .puffs .puff-grid{grid-template-columns:repeat(2, minmax(0,1fr));}
  .puffs .puff{height:240px;}
}
@media (max-width:600px){
  .puffs .puff-grid{grid-template-columns:1fr;}
  .puffs .puff{height:220px;}
}



/* V62: Category tiles overlay like Menydesign.se (title bar + hover "MER INFORMATION") */
.cat-card{
  position:relative;
  overflow:hidden;
  border-radius:18px;
}
.cat-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .35s cubic-bezier(.2,.8,.2,1);
}

/* darken overlay on hover */
.cat-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.0);
  transition:background .25s ease;
  pointer-events:none;
}

.cat-card .cat-overlay{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-align:center;
  z-index:2;
  pointer-events:none;
}

/* Title bar */
.cat-card .cat-title{
  display:inline-block;
  padding:10px 18px;
  background:rgba(0,0,0,.58);
  color:#FFFFFF;
  font-weight:900;
  letter-spacing:.8px;
  text-transform:uppercase;
  font-size:16px;
  line-height:1.1;
  max-width:78%;
  border-radius:0;
}

/* CTA hidden until hover */
.cat-card .cat-cta{
  color:#FFFFFF;
  font-weight:900;
  letter-spacing:.8px;
  text-transform:uppercase;
  font-size:13px;
  opacity:0;
  transform:translateY(6px);
  transition:opacity .18s ease, transform .18s ease;
}

/* Hover */
@media (hover:hover){
  .cat-card:hover img{ transform:scale(1.03); }
  .cat-card:hover::after{ background:rgba(0,0,0,.45); }
  .cat-card:hover .cat-cta{
    opacity:1;
    transform:translateY(0);
  }
  /* make title bar slightly darker on hover like reference */
  .cat-card:hover .cat-title{
    background:rgba(0,0,0,.68);
  }
}

/* Touch: show CTA always but lighter overlay */
@media (hover:none){
  .cat-card::after{ background:rgba(0,0,0,.25); }
  .cat-card .cat-cta{ opacity:1; transform:none; }
}



/* V62: Kategori-rutor (match ref: innan hover endast titelbar, på hover mörk + MER INFORMATION) */
.cat-card{
  position:relative;
  overflow:hidden;
  border-radius:0; /* ref har raka hörn */
}

.cat-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .40s ease;
}

/* dark overlay only on hover */
.cat-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0);
  transition:background .25s ease;
  pointer-events:none;
}

.cat-card .cat-overlay{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  text-align:center;
  z-index:2;
  pointer-events:none;
}

/* Title bar (smal, auto-bredd) */
.cat-card .cat-title{
  display:inline-block;
  background:rgba(0,0,0,.55);
  color:#FFFFFF;
  padding:12px 28px;
  font-size:16px;
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase;
  line-height:1.1;
  white-space:nowrap;
}

/* CTA hidden until hover */
.cat-card .cat-cta{
  margin-top:12px;
  color:#FFFFFF;
  font-size:13px;
  font-weight:800;
  letter-spacing:1px;
  text-transform:uppercase;
  opacity:0;
  transform:translateY(6px);
  transition:opacity .20s ease, transform .20s ease;
}

@media (hover:hover){
  .cat-card:hover::after{ background:rgba(0,0,0,.35); }
  .cat-card:hover img{ transform:scale(1.05); }
  .cat-card:hover .cat-cta{ opacity:1; transform:translateY(0); }
}

/* Touch: visa CTA alltid men utan mörk hover-känsla */
@media (hover:none){
  .cat-card .cat-cta{ opacity:1; transform:none; }
}



/* V62: Kategori-rutor – smal titelbar som original (ingen stor ruta) + CTA på hover */
.cat-card{
  position:relative;
  overflow:hidden;
  border-radius:0;
}

.cat-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .40s ease;
}

/* No overlay by default (only subtle darkening on hover) */
.cat-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0);
  transition:background .25s ease;
  pointer-events:none;
}

.cat-card .cat-overlay{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  text-align:center;
  z-index:2;
  pointer-events:none;
  width:auto !important;
  max-width:none !important;
}

/* Title bar must hug text (fix: prevent 100% width blocks from other CSS) */
.cat-card .cat-title{
  display:inline-block !important;
  width:auto !important;
  max-width:none !important;
  background:rgba(0,0,0,.55);
  color:#FFFFFF;
  padding:12px 28px;
  font-size:16px;
  font-weight:600;
  letter-spacing:1.5px;
  text-transform:uppercase;
  line-height:1.1;
  white-space:nowrap;
  border-radius:0;
}

/* CTA hidden until hover */
.cat-card .cat-cta{
  margin-top:10px;
  color:#FFFFFF;
  font-size:13px;
  font-weight:600;
  letter-spacing:1px;
  text-transform:uppercase;
  opacity:0;
  transform:translateY(6px);
  transition:opacity .20s ease, transform .20s ease;
}

@media (hover:hover){
  .cat-card:hover::after{ background:rgba(0,0,0,.28); }
  .cat-card:hover img{ transform:scale(1.04); }
  .cat-card:hover .cat-cta{ opacity:1; transform:translateY(0); }
}

/* Touch: show CTA always */
@media (hover:none){
  .cat-card .cat-cta{ opacity:1; transform:none; }
}



/* V62: Kategori-rutor – endast smal titelbar (ingen stor svart ruta). CTA på hover. */
.cat-card{
  position:relative;
  overflow:hidden;
  border-radius:0;
}

.cat-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .40s ease;
}

/* IMPORTANT: no full overlay layer */
.cat-card::after{
  display:none !important;
}

.cat-card .cat-overlay{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  text-align:center;
  z-index:2;
  pointer-events:none;
  width:auto !important;
  max-width:none !important;
  background:transparent !important; /* prevent square background */
  padding:0 !important;
}

/* Title bar hugs text */
.cat-card .cat-title{
  display:inline-block !important;
  width:auto !important;
  max-width:none !important;
  background:rgba(0,0,0,.55);
  color:#FFFFFF;
  padding:12px 28px;
  font-size:16px;
  font-weight:600;
  letter-spacing:1.5px;
  text-transform:uppercase;
  line-height:1.1;
  white-space:nowrap;
  border-radius:0;
}

/* CTA hidden until hover */
.cat-card .cat-cta{
  margin-top:10px;
  color:#FFFFFF;
  font-size:13px;
  font-weight:600;
  letter-spacing:1px;
  text-transform:uppercase;
  opacity:0;
  transform:translateY(6px);
  transition:opacity .20s ease, transform .20s ease;
}

@media (hover:hover){
  .cat-card:hover img{ transform:scale(1.04); }
  .cat-card:hover .cat-cta{ opacity:1; transform:translateY(0); }
}

/* Touch: show CTA always */
@media (hover:none){
  .cat-card .cat-cta{ opacity:1; transform:none; }
}



/* V62: Kategori-bar kant till kant + normal text */
.cat-card .cat-overlay{
  position:absolute;
  top:50%;
  left:0;
  width:100%;
  transform:translateY(-50%);
  text-align:center;
  background:transparent;
}

.cat-card .cat-title{
  display:block;
  width:100%;
  background:rgba(0,0,0,.45);
  color:#FFFFFF;
  padding:14px 0;
  font-size:16px;
  font-weight:400;
  letter-spacing:1px;
  text-transform:uppercase;
}

.cat-card .cat-cta{
  margin-top:10px;
  color:#fff;
  font-size:13px;
  font-weight:400;
  opacity:0;
  transition:.2s;
}

.cat-card:hover .cat-cta{
  opacity:1;
}


/* V62: Same as V60 but background bar full width */
.cat-card .cat-overlay{
  position:absolute;
  top:50%;
  left:0;
  width:100%;
  transform:translateY(-50%);
  text-align:center;
  background:rgba(0,0,0,.45);
  padding:14px 0;
}

.cat-card .cat-title{
  background:none;
  color:#FFFFFF;
  font-size:16px;
  font-weight:400;
  letter-spacing:1px;
  text-transform:uppercase;
}

/* V64 category bar full width + sharper images */
.cat-card{position:relative; overflow:hidden;}
.cat-card img{
width:100%;
height:100%;
object-fit:cover;
filter:none !important;
transform:none !important;
image-rendering:auto;
}

.cat-card .cat-overlay{
position:absolute;
left:0;
top:50%;
transform:translateY(-50%);
width:100%;
background:rgba(0,0,0,.45);
padding:16px 0;
text-align:center;
}

.cat-card .cat-title{
background:none;
color:#fff;
font-weight:400;
letter-spacing:1px;
}


/* V64: Force category overlay bar full width (left->right) + remove any blur */
.category-grid .cat-card .cat-overlay,
.cat-card .cat-overlay{
  left:0 !important;
  right:0 !important;
  width:100% !important;
  top:50% !important;
  bottom:auto !important;
  transform:translateY(-50%) !important;
  background:rgba(0,0,0,.55) !important; /* svart */
  padding:16px 0 !important;
  border-radius:0 !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  box-shadow:none !important;
}

/* Title text should NOT have its own background */
.category-grid .cat-card .cat-title,
.cat-card .cat-title{
  background:transparent !important;
  padding:0 !important;
  font-weight:400 !important;
  color:#FFFFFF !important;
  display:block !important;
  width:100% !important;
  text-align:center !important;
}

/* Ensure images are not blurred by filters/transforms */
.category-grid .cat-card img,
.cat-card img{
  filter:none !important;
  transform:none !important;
  image-rendering:auto !important;
}


/* V65 thinner category bar (equal space above/below text) */
.cat-overlay{
padding:8px 0 !important;
line-height:1.2;
}

.cat-title{
display:block;
}


/* V66: Force category bar height (fix override issues) */
.cat-card .cat-overlay{
  padding:0 !important;
  height:44px !important;          /* thinner bar */
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:rgba(0,0,0,.45) !important;
}

.cat-card .cat-title{
  background:none !important;
  line-height:1 !important;
  padding:0 !important;
  margin:0 !important;
}

/* V67 perfectly center text inside bar */
.cat-card .cat-overlay{
height:44px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
padding:0 !important;
}

.cat-card .cat-title{
display:flex;
align-items:center;
justify-content:center;
height:100%;
line-height:1;
}

/* V68 move bar slightly up and perfectly center text */
.cat-card .cat-overlay{
top:50%;
transform:translateY(-50%) !important;
height:44px !important;
display:block !important;
padding:0 !important;
}

.cat-card .cat-title{
line-height:44px !important;
display:block !important;
}

/* V69 adjust bar vertical position */
.cat-card .cat-overlay{
top:45% !important;
transform:translateY(-50%) !important;
height:44px !important;
background:rgba(0,0,0,.45) !important;
}

.cat-card .cat-title{
line-height:44px !important;
}

/* V70 lock overlay perfectly centered and full width */
.cat-card{
position:relative;
display:flex;
align-items:center;
justify-content:center;
}

.cat-card img{
filter:none !important;
backdrop-filter:none !important;
}

.cat-card .cat-overlay{
position:absolute !important;
left:0;
top:50% !important;
transform:translateY(-50%) !important;
width:100%;
height:44px;
background:rgba(0,0,0,.45);
display:flex;
align-items:center;
justify-content:center;
}

.cat-card .cat-title{
line-height:1;
}

/* V71: Category hover animation - bar moves to top and shows 'MER INFORMATION' */
.cat-card{
  position:relative;
  overflow:hidden;
}

/* default bar centered */
.cat-card .cat-overlay{
  position:absolute !important;
  left:0 !important;
  width:100% !important;
  height:44px !important;
  background:rgba(0,0,0,.45) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  transition:top .25s ease, transform .25s ease, background .25s ease;
  z-index:3;
}

.cat-card .cat-title{
  margin:0 !important;
  padding:0 !important;
  line-height:1 !important;
}

/* CTA line hidden by default */
.cat-card .cat-cta{
  display:block;
  position:absolute;
  left:0;
  width:100%;
  top:50%;
  transform:translateY(-50%);
  margin-top:0;
  text-align:center;
  color:#fff;
  font-size:13px;
  font-weight:400;
  letter-spacing:1px;
  text-transform:uppercase;
  opacity:0;
  transition:opacity .2s ease;
  z-index:4;
  pointer-events:none;
}

/* Hover: move bar to top and reveal CTA below */
@media (hover:hover){
  .cat-card:hover .cat-overlay{
    top:16px !important;
    transform:none !important;
    background:rgba(0,0,0,.55) !important;
  }
  .cat-card:hover .cat-cta{
    top:64px !important;           /* just under the bar */
    transform:none !important;
    opacity:1;
  }
}

/* V78: Puff height 30% smaller */
.puffs .puff,
.mdm-puff,
.puff-card{
height:180px !important;
}

/* V79: Same rounded corners as puffs on category images */
.cat-card,
.cat-card img,
.product-category a{
border-radius:12px !important;
overflow:hidden;
}


/* V83: Product page styling closer to Menydesign.se */
.single-product .product_title{
  font-size:32px;
  font-weight:800;
  letter-spacing:.5px;
  text-transform:uppercase;
  margin:0 0 10px 0;
}

.single-product .price{
  font-size:28px;
  font-weight:800;
  margin:0 0 14px 0;
}

.single-product .woocommerce-product-details__short-description{
  font-size:15px;
  line-height:1.6;
  margin-bottom:18px;
  max-width:none;
}

/* Make cart row match */
.woocommerce div.product form.cart{
  display:flex;
  gap:12px;
  align-items:stretch;
  margin:18px 0 14px 0;
}
.woocommerce div.product form.cart .quantity .qty{
  height:56px;
  font-size:18px;
  font-weight:600;
  border-radius:12px;
}
.woocommerce div.product form.cart .single_add_to_cart_button{
  height:56px;
  border-radius:12px;
  font-size:18px;
  font-weight:800;
}

/* Tabs area cleaner */
.single-product .woocommerce-tabs{
  margin-top:42px;
}
.single-product .woocommerce-tabs ul.wc-tabs{
  display:none; /* Menydesign-style: no tab nav, only description content */
}
.single-product .woocommerce-tabs .woocommerce-Tabs-panel{
  padding:0;
  border:0;
}

/* Related products spacing */
.single-product .related{
  margin-top:44px;
}



/* V86: Single product layout tweaks (600x600 image, wider right column, move short desc below cart) */
.single-product .mdm-product-top{
  grid-template-columns:600px 1fr;
  gap:48px;
}

/* Ensure gallery area doesn't exceed 600 and stays square-ish */
.single-product .woocommerce-product-gallery{
  max-width:600px;
}
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image,
.single-product .woocommerce-product-gallery img{
  max-width:600px !important;
  max-height:600px !important;
  width:100% !important;
  height:auto !important;
  object-fit:contain;
}

/* Make summary column use full width */
.single-product .entry-summary{
  max-width:none !important;
}

/* Place moved short description with nice spacing */
.single-product .woocommerce-product-details__short-description{
  margin-top:18px;
}



/* V87: Category archive header + 3-per-row smaller product cards */
.mdm-cat-header{
  margin:10px 0 18px 0;
  text-align:center;
}
.mdm-cat-header .mdm-cat-title{
  margin:0 0 8px 0;
  font-size:28px;
  font-weight:800;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.mdm-cat-header .mdm-cat-desc{
  margin:0 auto;
  max-width:820px;
  font-size:15px;
  line-height:1.6;
  color:#333;
}

/* Force 3 columns and slightly smaller cards (about -20%) */
.woocommerce ul.products{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:26px !important;
  max-width:1180px;            /* gives a smaller card feel */
  margin:0 auto 40px auto !important;
  padding:0 !important;
}

.woocommerce ul.products li.product{
  width:auto !important;
  margin:0 !important;
  padding:12px 12px 14px 12px;
  border-radius:16px;
  box-shadow:0 10px 22px rgba(0,0,0,.08);
}

/* Slightly smaller typography */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:14px;
  font-weight:800;
  letter-spacing:.4px;
  text-transform:uppercase;
}
.woocommerce ul.products li.product .price{
  font-size:16px;
  font-weight:800;
}

/* Image sizing to avoid "blur stretch" */
.woocommerce ul.products li.product a img{
  width:100% !important;
  height:auto !important;
  object-fit:contain;
}

@media (max-width:1024px){
  .woocommerce ul.products{ grid-template-columns:repeat(2, minmax(0,1fr)) !important; max-width:780px; }
}
@media (max-width:600px){
  .woocommerce ul.products{ grid-template-columns:1fr !important; max-width:420px; }
}



/* V88: Category description left-aligned */
.mdm-cat-header{
  text-align:left !important;
}
.mdm-cat-header .mdm-cat-desc{
  margin:0 0 0 0 !important;
}



/* V89: Category grid same width as description + adjusted height */
.mdm-cat-header .mdm-cat-desc{
  max-width:900px;   /* controls text width */
}

.woocommerce ul.products{
  max-width:900px !important;  /* same width as description */
}

.woocommerce ul.products li.product{
  min-height:420px;   /* adjust height proportionally */
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.woocommerce ul.products li.product a img{
  max-height:260px;
  object-fit:contain;
}



/* V90: Single product - image not oversized + right column double width */
.single-product .mdm-product-top{
  grid-template-columns:minmax(360px, 520px) 2fr; /* right column ~2x */
  gap:56px;
  align-items:start;
}

/* Gallery sizing */
.single-product .woocommerce-product-gallery{
  width:100%;
  max-width:520px;
}

.single-product .woocommerce-product-gallery__wrapper,
.single-product .flex-viewport{
  max-width:520px;
}

/* Make main image fit nicely (no stretching/cropping weirdness) */
.single-product .woocommerce-product-gallery__image img,
.single-product .woocommerce-product-gallery img{
  width:100% !important;
  max-width:520px !important;
  height:auto !important;
  max-height:520px !important;
  object-fit:contain !important;
}

/* Thumbnails row */
.single-product .woocommerce-product-gallery .flex-control-thumbs{
  display:flex;
  gap:10px;
  margin-top:12px;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs li{
  width:auto !important;
  flex:0 0 80px;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs img{
  width:80px !important;
  height:80px !important;
  object-fit:cover !important;
  border-radius:12px;
}

/* Ensure summary uses available width */
.single-product .entry-summary{
  width:100%;
  max-width:none !important;
}



/* V91: Minimize left category menu on single product; expand on hover (desktop) */
@media (min-width: 901px){
  /* Target our Woo layout wrapper used on product pages */
  .single-product .mdm-shop-layout{
    display:grid;
    grid-template-columns: 44px 1fr; /* collapsed sidebar */
    gap:24px;
    align-items:start;
  }

  .single-product .mdm-shop-sidebar{
    position:sticky;
    top:110px;
    width:44px;
    max-width:44px;
    overflow:hidden;
    transition:width .22s ease, max-width .22s ease, box-shadow .22s ease;
    background:#fff;
    border-radius:14px;
    box-shadow:0 10px 22px rgba(0,0,0,.06);
  }

  .single-product .mdm-shop-sidebar:hover{
    width:260px;
    max-width:260px;
    overflow:auto;
    box-shadow:0 14px 34px rgba(0,0,0,.12);
  }

  /* Hide sidebar heading/links when collapsed via opacity */
  .single-product .mdm-shop-sidebar .mdm-shop-sidebar-inner{
    width:260px; /* so content doesn't wrap weird when expanded */
    padding:14px 14px;
  }

  .single-product .mdm-shop-sidebar:not(:hover) .mdm-shop-sidebar-inner > *{
    opacity:0;
    pointer-events:none;
  }

  /* Small handle indicator */
  .single-product .mdm-shop-sidebar::before{
    content:"Kategorier";
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%) rotate(-90deg);
    font-size:12px;
    letter-spacing:2px;
    text-transform:uppercase;
    color:#666;
    opacity:.9;
    pointer-events:none;
    white-space:nowrap;
  }
  .single-product .mdm-shop-sidebar:hover::before{
    opacity:0;
  }
}




/* Make right column wider */
@media (min-width: 901px){
  .single-product .mdm-product-top{
    grid-template-columns: minmax(520px, 720px) 3fr !important;
    gap:64px !important;
    align-items:start;
  }
}

/* Fix "half image" issues from flexslider viewport constraints */
.single-product .woocommerce-product-gallery,
.single-product .woocommerce-product-gallery__wrapper,
.single-product .flex-viewport{
  height:auto !important;
  max-height:none !important;
}

.single-product .woocommerce-product-gallery{
  max-width:720px !important;
  width:100% !important;
}

/* Let main image show fully */
.single-product .woocommerce-product-gallery__image img,
.single-product .woocommerce-product-gallery img{
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
}

/* Thumbnails nice like original */
.single-product .woocommerce-product-gallery .flex-control-thumbs{
  display:flex !important;
  flex-wrap:nowrap;
  gap:14px;
  margin-top:14px;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs li{
  flex:0 0 110px;
  width:110px !important;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs img{
  width:110px !important;
  height:110px !important;
  object-fit:cover !important;
  border-radius:14px;
}

/* Hide attribute/variation labels and option text under swatches (keep icons) */
.single-product form.variations_form .variations td.label,
.single-product form.variations_form .variations th.label,
.single-product form.variations_form .variations label{
  display:none !important;
}
.single-product .woo-variation-items-wrapper .variable-item-contents .variable-item-span,
.single-product .woo-variation-items-wrapper .variable-item-contents .variable-item-title,
.single-product .woo-variation-items-wrapper .variable-item-contents .variable-item-content,
.single-product .woo-variation-items-wrapper .variable-item-contents span{
  display:none !important;
}




/* If flexslider isn't adding class, show only first image */
.single-product .woocommerce-product-gallery .slides > li:first-child{
  display:block !important;
}

/* Ensure wrapper doesn't lay out multiple slides side-by-side */
.single-product .woocommerce-product-gallery .slides{
  display:block !important;
}



/* Some setups output a second gallery inside summary; hide any extra galleries after the first */
.single-product .product .woocommerce-product-gallery:nth-of-type(n+2){
  display:none !important;
}

/* Ensure only one main gallery is visible; keep flexslider functioning */
.single-product .woocommerce-product-gallery{
  overflow:visible;
}
.single-product .woocommerce-product-gallery .flex-viewport{
  overflow:hidden !important;
}

/* V96: Single product gallery should be 1 large image + thumbnails below (like reference) */
.single-product .woocommerce-product-gallery{
  width:100% !important;
  max-width:720px !important;
  margin:0 auto !important;
}
.single-product .woocommerce-product-gallery__wrapper{
  width:100% !important;
  margin:0 !important;
}
.single-product .woocommerce-product-gallery__image{
  width:100% !important;
}
.single-product .woocommerce-product-gallery__image img{
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
}

/* Thumbnails centered below */
.single-product .woocommerce-product-gallery .flex-control-thumbs{
  display:flex !important;
  justify-content:center;
  gap:18px;
  margin-top:16px !important;
  padding:0 !important;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs li{
  flex:0 0 120px;
  width:120px !important;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs img{
  width:120px !important;
  height:120px !important;
  object-fit:cover !important;
  border-radius:14px;
}

/* V97: Woo single product gallery - show ONE main image + thumbnails (fix stacked/double images) */
@media (min-width: 901px){
  .single-product .mdm-product-top{
    grid-template-columns: minmax(520px, 720px) 4fr !important; /* wider right column */
    gap:64px !important;
    align-items:start;
  }
}

.single-product .woocommerce-product-gallery{
  width:100% !important;
  max-width:720px !important;
  margin:0 auto !important;
}
.single-product .woocommerce-product-gallery .flex-viewport{
  overflow:hidden !important;
  height:auto !important;
  max-height:none !important;
}

/* Critical: don't stack slides vertically */
.single-product .woocommerce-product-gallery .slides{
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
}
.single-product .woocommerce-product-gallery .slides > li{
  width:100% !important;
  float:left !important;          /* restore flexslider layout */
  display:block !important;
  margin:0 !important;
}

/* Main image fit */
.single-product .woocommerce-product-gallery__image img,
.single-product .woocommerce-product-gallery img{
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
  max-height:none !important;
}

/* Thumbnails centered below */
.single-product .woocommerce-product-gallery .flex-control-thumbs{
  display:flex !important;
  justify-content:center;
  gap:18px;
  margin-top:16px !important;
  padding:0 !important;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs li{
  flex:0 0 120px;
  width:120px !important;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs img{
  width:120px !important;
  height:120px !important;
  object-fit:cover !important;
  border-radius:14px;
}


/* V98: Right column (summary) layout like Menydesign.se screenshot */
.single-product .entry-summary{ max-width:980px; }
.single-product .product_title{
  font-size:44px; font-weight:900; letter-spacing:1px; text-transform:uppercase;
}

/* Variation blocks */
.single-product form.variations_form .variations{
  width:100%;
  border:1px solid #e5e5e5;
  border-radius:10px;
  overflow:hidden;
  margin:18px 0 18px 0;
}
.single-product form.variations_form .variations tr{ display:block; width:100%; border-top:1px solid #ededed; }
.single-product form.variations_form .variations tr:first-child{ border-top:0; }
.single-product form.variations_form .variations td{ display:block; width:100%; padding:0; }
.single-product form.variations_form .variations td.value{ padding:0; }

/* Swatches spacing */
.single-product .woo-variation-items-wrapper,
.single-product .variable-items-wrapper{ padding:26px 20px 24px 20px; }
.single-product .variable-items-wrapper{
  display:flex; justify-content:space-between; align-items:flex-start;
  gap:22px; flex-wrap:nowrap;
}
.single-product .variable-items-wrapper .variable-item{ flex:1 1 0; text-align:center; }
.single-product .variable-items-wrapper .variable-item .variable-item-contents{
  display:flex; flex-direction:column; align-items:center; gap:10px;
}

/* Price big */
.single-product .summary .price,
.single-product .woocommerce-variation-price .price{
  font-size:38px; font-weight:900; color:#111; margin:12px 0 14px 0;
}
.single-product .price del{ opacity:.45; }

/* Reset link right */
.single-product .reset_variations{
  float:right; font-size:14px; color:#111; text-decoration:none; margin-top:-6px;
}

/* Qty + button row */
.single-product form.cart{ display:flex; gap:18px; align-items:stretch; margin:14px 0 14px 0; }
.single-product form.cart .quantity{ flex:0 0 110px; }
.single-product form.cart .quantity .qty{
  width:110px; height:58px; font-size:18px; border-radius:10px;
}

/* Gold button */
.single-product form.cart .single_add_to_cart_button{
  flex:1 1 auto; height:58px; border-radius:10px;
  background:#d7c692; color:#fff; font-weight:900; font-size:18px;
  text-transform:uppercase; letter-spacing:1px;
}
.single-product form.cart .single_add_to_cart_button:hover{ filter:brightness(.95); }


/* V101: Product gallery – ensure ONE main image visible + thumbnails swap main image (flex-safe) */
.single-product .woocommerce-product-gallery{ max-width:720px !important; width:100% !important; }
.single-product .woocommerce-product-gallery .flex-viewport{ overflow:hidden !important; height:auto !important; }

/* Make slides behave like a carousel even if plugin CSS breaks floats */
.single-product .woocommerce-product-gallery .slides{
  display:flex !important;
  flex-wrap:nowrap !important;
  padding:0 !important;
  margin:0 !important;
}
.single-product .woocommerce-product-gallery .slides > li{
  flex:0 0 100% !important;
  width:100% !important;
  margin:0 !important;
}

/* Main image fit */
.single-product .woocommerce-product-gallery__image img,
.single-product .woocommerce-product-gallery img{
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
}

/* Thumbnails row */
.single-product .woocommerce-product-gallery .flex-control-thumbs{
  display:flex !important;
  justify-content:center;
  gap:16px;
  margin-top:16px !important;
  padding:0 !important;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs li{ flex:0 0 120px; width:120px !important; }
.single-product .woocommerce-product-gallery .flex-control-thumbs img{
  width:120px !important;
  height:120px !important;
  object-fit:cover !important;
  border-radius:14px;
}

/* Wider right column */
@media (min-width: 901px){
  .single-product .mdm-product-top{
    grid-template-columns: minmax(520px, 720px) 4fr !important;
    gap:64px !important;
    align-items:start;
  }
}

/* V102: Simple product gallery (no flexslider) */
.single-product .mdm-simple-gallery{max-width:720px;margin:0 auto;}
.single-product .mdm-simple-gallery .mdm-main-image{
  width:100%;
  border-radius:16px;
  overflow:hidden;
}
.single-product .mdm-simple-gallery .mdm-main-image img{
  width:100%;
  height:auto;
  object-fit:contain;
  display:block;
}
.single-product .mdm-simple-gallery .mdm-thumbs{
  display:flex;
  justify-content:center;
  gap:16px;
  margin-top:16px;
  padding:0;
  list-style:none;
}
.single-product .mdm-simple-gallery .mdm-thumbs li{
  flex:0 0 120px;
}
.single-product .mdm-simple-gallery .mdm-thumbs img{
  width:120px;
  height:120px;
  object-fit:cover;
  border-radius:14px;
  cursor:pointer;
  opacity:.9;
}
.single-product .mdm-simple-gallery .mdm-thumbs img:hover{
  opacity:1;
}

/* V103: Bigger main image + make thumbnails clickable */
.single-product .mdm-simple-gallery{ max-width:820px; }
.single-product .mdm-simple-gallery .mdm-main-image img{
  max-width:820px;
  max-height:820px;
}
.single-product .mdm-simple-gallery .mdm-thumbs img{
  pointer-events:auto !important;
}
.single-product .mdm-simple-gallery .mdm-thumbs li{
  cursor:pointer;
}

/* V104: Product images fixed to 440x440px */
.single-product .mdm-simple-gallery{ 
  max-width:440px;
}
.single-product .mdm-simple-gallery .mdm-main-image{
  width:440px;
  height:440px;
}
.single-product .mdm-simple-gallery .mdm-main-image img{
  width:440px;
  height:440px;
  object-fit:contain;
}
.single-product .mdm-simple-gallery .mdm-thumbs img{
  width:90px;
  height:90px;
  object-fit:cover;
}


/* V171: Woo left menu main category styling */
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat{
  list-style:none !important;
  margin:0 0 14px 0 !important;
  padding:0 !important;
}
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat-title{
  display:block !important;
  background:#d6c58e !important;
  color:#000 !important;
  font-weight:700 !important;
  text-transform:uppercase !important;
  padding:10px 14px !important;
  margin:0 0 8px 0 !important;
  border-radius:4px !important;
  letter-spacing:.4px !important;
}
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .children{
  margin:0 !important;
  padding:0 !important;
}
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .children li{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
}
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .children li a{
  display:block !important;
  padding:8px 12px !important;
}


/* V172: left menu cleanup + separate scroll */
.mdm-shop-sidebar-inner > h3{
  display:none !important;
}

.mdm-shop-sidebar{
  position: relative !important;
}

.mdm-shop-sidebar .mdm-shop-sidebar-inner{
  max-height: calc(100vh - 140px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-right: 6px !important;
}

/* tidy top spacing so menu starts directly with FÖR RESTAURANGER */
.mdm-shop-sidebar .mdm-cat-list{
  margin-top: 0 !important;
  padding-top: 0 !important;
}
.mdm-shop-sidebar .mdm-cat-list > li:first-child{
  margin-top: 0 !important;
}

/* Hide homepage labels/sections requested */
.home .mdm-home-categories .mdm-category-card[data-title="MENY INLAGA"],
.home .mdm-home-categories .mdm-category-card[data-title="POPULÄRA PRODUKTER"],
.home .mdm-home-categories .mdm-category-card[data-title="FÖR RESTAURANGER"],
.home .mdm-home-categories .mdm-category-card[data-title="MENYPÄRMAR SOFT"]{
  display:none !important;
}

/* Fallback: hide matching text blocks by common title selectors */
.home .mdm-home-categories .mdm-category-card .mdm-category-title,
.home .mdm-home-categories .mdm-category-card h2,
.home .mdm-home-categories .mdm-category-card h3,
.home .mdm-home-categories .mdm-category-card h4,
.home .mdm-home-categories .mdm-category-card .title{
  word-break: break-word;
}

.home .mdm-home-categories .mdm-category-card:has(.mdm-category-title),
.home .mdm-home-categories .mdm-category-card:has(h2),
.home .mdm-home-categories .mdm-category-card:has(h3),
.home .mdm-home-categories .mdm-category-card:has(h4){
}


/* V173: cleaner hidden-scroll sidebar and stronger homepage category hiding */
.mdm-shop-sidebar .mdm-shop-sidebar-inner{
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
.mdm-shop-sidebar .mdm-shop-sidebar-inner::-webkit-scrollbar{
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}




/* V182: keep puff design, make puff text match category text style */
.footer-grid .footer-item,
.footer-grid .footer-item p,
.footer-grid .footer-item span,
.footer-grid .footer-item strong,
.footer-grid .footer-title,
.mdm-puff,
.mdm-puff p,
.mdm-puff-text,
.mdm-puff-title{
  font-size:17px !important;
  font-weight:600 !important;
  line-height:1.2 !important;
  letter-spacing:.3px !important;
}

.footer-grid .footer-item strong{
  font-weight:600 !important;
}


/* V183: stronger puff text override to match category text style */
.home .elementor-widget-text-editor .elementor-widget-container,
.home .elementor-widget-text-editor .elementor-widget-container *,
.home .elementor-widget-heading .elementor-heading-title,
.home .elementor-widget-heading .elementor-heading-title *,
.home .mdm-puffs *,
.home .footer-grid .footer-item *,
.home .footer-grid .footer-item a,
.home .footer-grid .footer-item a *{
  font-size:17px !important;
  font-weight:600 !important;
  line-height:1.2 !important;
  letter-spacing:.3px !important;
  text-transform:none !important;
}

/* keep puff card design unchanged */
.home .elementor-widget-text-editor,
.home .elementor-widget-heading{
  text-shadow:none !important;
}


/* V184: exact puff typography override to match requested non-bold style */
.puffs .puff h3{
  font-weight:400 !important;
  font-size:17px !important;
  line-height:1.2 !important;
  letter-spacing:.3px !important;
  text-transform:uppercase !important;
}

.puffs .puff .puff-text{
  font-weight:400 !important;
  font-size:14px !important;
  line-height:1.35 !important;
  letter-spacing:0 !important;
}

.puffs .puff strong,
.puffs .puff b{
  font-weight:400 !important;
}


/* V185: homepage category layout polish */
.home .woocommerce ul.products{
  gap: 24px !important;
}

.home .woocommerce ul.products li.product-category,
.home .mdm-home-categories li.product-category,
.home .mdm-home-categories .mdm-category-card,
.home .mdm-home-categories .category-card{
  border-radius: 20px !important;
  overflow: hidden !important;
  background: #fff !important;
  transition: transform .18s ease, box-shadow .18s ease !important;
}

.home .woocommerce ul.products li.product-category:hover,
.home .mdm-home-categories li.product-category:hover,
.home .mdm-home-categories .mdm-category-card:hover,
.home .mdm-home-categories .category-card:hover{
  transform: translateY(-3px) !important;
  box-shadow: 0 16px 36px rgba(0,0,0,.10) !important;
}

.home .woocommerce ul.products li.product-category img,
.home .mdm-home-categories img{
  display: block !important;
  width: 100% !important;
  height: auto !important;
  transition: transform .25s ease !important;
}

.home .woocommerce ul.products li.product-category:hover img,
.home .mdm-home-categories li.product-category:hover img,
.home .mdm-home-categories .mdm-category-card:hover img,
.home .mdm-home-categories .category-card:hover img{
  transform: scale(1.03) !important;
}

.home .woocommerce ul.products li.product-category h2,
.home .woocommerce ul.products li.product-category .woocommerce-loop-category__title,
.home .mdm-home-categories .mdm-category-title,
.home .mdm-home-categories h2,
.home .mdm-home-categories h3{
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 14px 10px 16px 10px !important;
}

.home .woocommerce ul.products li.product-category a,
.home .mdm-home-categories a{
  text-decoration: none !important;
  color: #111 !important;
}

.home .woocommerce ul.products li.product-category:hover h2,
.home .woocommerce ul.products li.product-category:hover .woocommerce-loop-category__title,
.home .mdm-home-categories a:hover .mdm-category-title,
.home .mdm-home-categories a:hover h2,
.home .mdm-home-categories a:hover h3{
  color: #b89a4a !important;
}


/* V186 – perfect category grid overlay text */
.home .category-card-title,
.home .category-card h3,
.home .category-overlay,
.home .category-overlay span,
.home .mdm-home-categories .category-card-title,
.home .mdm-home-categories .category-card h3,
.home .mdm-home-categories .category-overlay,
.home .mdm-home-categories .category-overlay span{
    font-size:14px !important;
    font-weight:500 !important;
    letter-spacing:.4px !important;
    line-height:1.2 !important;
}

.home .category-overlay,
.home .mdm-home-categories .category-overlay{
    padding:6px 10px !important;
    background:rgba(0,0,0,.42) !important;
}

.home .category-card,
.home .mdm-home-categories .category-card{
    overflow:hidden !important;
    border-radius:18px !important;
}

.home .category-card img,
.home .mdm-home-categories .category-card img{
    transition:transform .25s ease !important;
}

.home .category-card:hover img,
.home .mdm-home-categories .category-card:hover img{
    transform:scale(1.03) !important;
}


/* V187 – smaller homepage category image text via actual theme selectors */
.cat-card .cat-title{
  font-size:13px !important;
  font-weight:500 !important;
  line-height:1.15 !important;
  letter-spacing:.3px !important;
}

.cat-card .cat-overlay{
  padding:10px 12px !important;
}


/* V189: admin thumbnail column for Logotyper */
.column-mdm10_logo_thumb{ width: 90px; }
.column-mdm10_logo_thumb img{
  display:block;
  width:64px;
  height:64px;
  object-fit:contain;
  background:#fff;
  border:1px solid #e5e5e5;
  border-radius:6px;
  padding:4px;
}


/* V190: 3-column mega menu in hamburger dropdown */
.dropdown-menu{
  padding: 28px 34px !important;
}

.dropdown-menu .menu > ul{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
  gap: 28px 38px !important;
  align-items: start !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.dropdown-menu .menu > ul > li{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.dropdown-menu .menu > ul > li > a{
  display: block !important;
  font-weight: 700 !important;
  font-size: 20px !important;
  letter-spacing: .4px !important;
  text-transform: uppercase !important;
  color: #111 !important;
  text-decoration: none !important;
  border-bottom: 2px solid #d6c58e !important;
  padding: 0 0 10px 0 !important;
  margin: 0 0 12px 0 !important;
}

.dropdown-menu .menu > ul > li ul{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.dropdown-menu .menu > ul > li ul li{
  margin: 0 !important;
  padding: 0 !important;
}

.dropdown-menu .menu > ul > li ul li a{
  display: block !important;
  padding: 8px 0 !important;
  color: #222 !important;
  text-decoration: none !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  transition: color .18s ease, transform .18s ease !important;
}

.dropdown-menu .menu > ul > li ul li a:hover{
  color: #b89a4a !important;
  transform: translateX(3px) !important;
}

.dropdown-menu .menu > ul > li > a:hover{
  color: #b89a4a !important;
}

@media (max-width: 980px){
  .dropdown-menu .menu > ul{
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .dropdown-menu{
    padding: 22px 20px !important;
  }

  .dropdown-menu .menu > ul > li > a{
    font-size: 18px !important;
  }
}


/* V194 – precise fixes in actual theme selectors */

/* Footer text should not be bold */
.footer-item .footer-title,
.footer-text,
footer.site-footer a,
footer.site-footer span,
footer.site-footer strong{
  font-weight:400 !important;
}

/* Logo banner spacing + size */
.logo-row{
  gap:60px !important;
}

.logo-row img{
  height:56px !important;
  width:auto !important;
  opacity:.92 !important;
}

/* Homepage category cards text sizing */
.cat-card .cat-title{
  font-size:13px !important;
  font-weight:500 !important;
  line-height:1.15 !important;
  letter-spacing:.3px !important;
}

.cat-card .cat-overlay{
  padding:10px 12px !important;
}

/* Puff typography */
.puff h3{
  font-weight:400 !important;
  font-size:17px !important;
  line-height:1.2 !important;
  letter-spacing:.3px !important;
  text-transform:uppercase !important;
}

.puff .puff-text{
  font-weight:400 !important;
  font-size:14px !important;
  line-height:1.35 !important;
  letter-spacing:0 !important;
}

.puff strong,
.puff b{
  font-weight:400 !important;
}


/* V195: precise footer and logo banner fixes */
.logo-row img{
  margin:0 35px !important;
}


/* V196 logo banner improvements */
.logo-row{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    gap:70px !important;
}

.logo-row img{
    height:80px !important;
    width:auto !important;
    margin:0 !important;
}

/* Force footer text normal weight */
footer *,
.footer-item *,
.footer-text{
    font-weight:400 !important;
}



/* V197 – logo banner single centered row with equal spacing */
.logo-row{
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:center !important;
    align-items:center !important;
    gap:60px !important;
    overflow:hidden;
}

.logo-row img{
    height:80px !important;
    width:auto !important;
    flex:0 0 auto;
}


/* V198 – premium logo row spacing */
.logo-row{
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:space-evenly !important;
    align-items:center !important;
    gap:0 !important;
    max-width:1200px !important;
    margin:0 auto !important;
    padding:0 28px !important;
    overflow:hidden !important;
}

.logo-row > *{
    flex:0 1 auto !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}

.logo-row img{
    height:80px !important;
    width:auto !important;
    max-width:120px !important;
    object-fit:contain !important;
    margin:0 !important;
    flex:0 0 auto !important;
}

@media (max-width: 1200px){
    .logo-row{
        padding:0 20px !important;
    }
    .logo-row img{
        max-width:100px !important;
        height:72px !important;
    }
}

/* V199 – larger logos + more spacing */
.logo-row{
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:space-evenly !important;
    align-items:center !important;
    max-width:1400px !important;
    margin:0 auto !important;
    padding:0 60px !important; /* more space around row */
}

.logo-row img{
    height:100px !important;   /* bigger logos */
    width:auto !important;
    max-width:160px !important;
    object-fit:contain !important;
}

/* ensure equal spacing visually */
.logo-row > *{
    padding:0 20px !important;
}


/* V205 – working 3-column hamburger menu + puff 4 contact button */
.dropdown-menu{
  padding:34px 42px !important;
  background:#fff !important;
  box-shadow:0 22px 48px rgba(0,0,0,.10) !important;
}

.dropdown-menu .mdm-mega-menu{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(220px,1fr)) !important;
  gap:36px 48px !important;
  max-width:1200px !important;
  margin:0 auto !important;
}

.dropdown-menu .mdm-mega-col-title{
  display:block !important;
  font-weight:700 !important;
  text-transform:uppercase !important;
  font-size:19px !important;
  letter-spacing:.35px !important;
  color:#111 !important;
  text-decoration:none !important;
  border-bottom:2px solid #d6c58e !important;
  padding:0 0 10px 0 !important;
  margin:0 0 12px 0 !important;
}

.dropdown-menu .mdm-mega-links,
.dropdown-menu .mdm-mega-links li{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
}

.dropdown-menu .mdm-mega-links li a{
  display:block !important;
  position:relative !important;
  padding:8px 0 8px 14px !important;
  color:#222 !important;
  text-decoration:none !important;
  font-size:15px !important;
  line-height:1.35 !important;
  transition:color .18s ease, transform .18s ease !important;
}

.dropdown-menu .mdm-mega-links li a:before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#d6c58e;
  position:absolute;
  left:0;
  top:15px;
}

.dropdown-menu .mdm-mega-links li a:hover{
  color:#b89a4a !important;
  transform:translateX(4px) !important;
}

@media (max-width:980px){
  .dropdown-menu{
    padding:22px 20px !important;
  }
  .dropdown-menu .mdm-mega-menu{
    grid-template-columns:1fr !important;
    gap:20px !important;
  }
}


.puff .puff-button:hover{
  background:#fff !important;
  color:#111 !important;
}


/* V207 – Puff shortcode/widget in modal popup */
.mdm10-modal-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:99999;
  padding:24px;
}
.mdm10-modal-overlay.is-open{ display:flex; }
.mdm10-modal{
  width:min(720px, 100%);
  max-height:85vh;
  overflow:auto;
  background:#fff;
  border-radius:18px;
  box-shadow:0 25px 60px rgba(0,0,0,.20);
  position:relative;
  padding:32px 28px;
}
.mdm10-modal-close{
  position:absolute;
  top:14px;
  right:14px;
  width:38px;
  height:38px;
  border:0;
  border-radius:999px;
  background:#f4f4f4;
  color:#111;
  cursor:pointer;
  font-size:22px;
  line-height:1;
}
.mdm10-modal-close:hover{ background:#e9e9e9; }
.puffs .puff[data-mdm10-modal="true"],
.puff[data-mdm10-modal="true"]{ cursor:pointer; }


/* V214 – style actual left product sidebar (.mdm-shop-sidebar) like hamburger menu */
.mdm-shop-sidebar{
  background:#fff !important;
  border-radius:18px !important;
  box-shadow:0 8px 24px rgba(0,0,0,.06) !important;
  padding:14px !important;
}

.mdm-shop-sidebar h3{
  display:block !important;
  background:#d3bf80 !important;
  color:#111 !important;
  border-radius:8px !important;
  padding:11px 14px !important;
  margin:0 0 12px 0 !important;
  font-size:18px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  letter-spacing:.25px !important;
  text-transform:uppercase !important;
}

.mdm-shop-sidebar ul{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
}

.mdm-shop-sidebar li{
  margin:0 !important;
  padding:0 !important;
}

.mdm-shop-sidebar a{
  display:block !important;
  color:#111 !important;
  text-decoration:none !important;
  font-size:15px !important;
  font-weight:700 !important;
  line-height:1.35 !important;
  padding:8px 12px !important;
  border-radius:8px !important;
  transition:background .18s ease, color .18s ease, transform .18s ease !important;
}

.mdm-shop-sidebar a:hover{
  background:#f5f5f5 !important;
  color:#111 !important;
  transform:translateX(2px) !important;
}

.mdm-shop-sidebar .current-cat > a{
  background:#f5f5f5 !important;
}


/* V215 – left sidebar matches reference screenshot exactly */
.mdm-shop-sidebar{
  background:#fff !important;
  border-radius:18px !important;
  box-shadow:0 8px 24px rgba(0,0,0,.06) !important;
  padding:18px 16px !important;
}

/* "KATEGORIER" title stays plain */
.mdm-shop-sidebar h3{
  display:block !important;
  background:none !important;
  color:#111 !important;
  border-radius:0 !important;
  padding:0 !important;
  margin:0 0 16px 0 !important;
  font-size:14px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  letter-spacing:.5px !important;
  text-transform:uppercase !important;
  box-shadow:none !important;
}

/* top-level headings like hamburger screenshot: plain with gold underline */
.mdm-shop-sidebar > ul > li,
.mdm-shop-sidebar .product-categories > li{
  margin:0 0 18px 0 !important;
  padding:0 !important;
}

.mdm-shop-sidebar > ul > li > a,
.mdm-shop-sidebar .product-categories > li > a{
  display:block !important;
  background:none !important;
  color:#111 !important;
  border-radius:0 !important;
  padding:0 0 9px 0 !important;
  margin:0 0 10px 0 !important;
  font-size:18px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  letter-spacing:.35px !important;
  text-transform:uppercase !important;
  text-decoration:none !important;
  border-bottom:2px solid #cfbb78 !important;
  box-shadow:none !important;
}

/* child lists */
.mdm-shop-sidebar ul.children,
.mdm-shop-sidebar .product-categories .children{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
}

.mdm-shop-sidebar ul.children li,
.mdm-shop-sidebar .product-categories .children li{
  position:relative !important;
  margin:0 0 10px 0 !important;
  padding:0 0 0 16px !important;
}

/* gold bullet */
.mdm-shop-sidebar ul.children li:before,
.mdm-shop-sidebar .product-categories .children li:before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:12px !important;
  width:6px !important;
  height:6px !important;
  border-radius:50% !important;
  background:#cfbb78 !important;
  display:block !important;
}

/* child links */
.mdm-shop-sidebar ul.children li a,
.mdm-shop-sidebar .product-categories .children li a{
  display:block !important;
  color:#333 !important;
  background:none !important;
  border-radius:0 !important;
  padding:2px 0 !important;
  margin:0 !important;
  text-decoration:none !important;
  font-size:15px !important;
  font-weight:500 !important;
  line-height:1.5 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  box-shadow:none !important;
}

.mdm-shop-sidebar ul.children li a:hover,
.mdm-shop-sidebar .product-categories .children li a:hover{
  color:#000 !important;
  background:none !important;
  transform:translateX(2px) !important;
}

/* active child like screenshot */
.mdm-shop-sidebar ul.children .current-cat > a,
.mdm-shop-sidebar .product-categories .children .current-cat > a,
.mdm-shop-sidebar .current-cat-parent > a{
  color:#bd9b42 !important;
  background:none !important;
}

/* remove old active background from previous versions */
.mdm-shop-sidebar .current-cat > a{
  background:none !important;
}


/* V216 – ensure NO gold background on sidebar headings */
.mdm-shop-sidebar h3,
.mdm-shop-sidebar > ul > li > a,
.mdm-shop-sidebar .product-categories > li > a{
  background:none !important;
}

/* keep only underline style like hamburger menu */
.mdm-shop-sidebar > ul > li > a,
.mdm-shop-sidebar .product-categories > li > a{
  border-bottom:2px solid #cfbb78 !important;
}


/* V217 – refine left sidebar to match hamburger menu more closely */
.mdm-shop-sidebar{
  background:#fff !important;
  border-radius:18px !important;
  box-shadow:0 8px 24px rgba(0,0,0,.06) !important;
  padding:18px 16px !important;
}

.mdm-shop-sidebar h3{
  background:none !important;
  color:#111 !important;
  padding:0 !important;
  margin:0 0 18px 0 !important;
  font-size:14px !important;
  font-weight:800 !important;
  letter-spacing:.5px !important;
  text-transform:uppercase !important;
  border:0 !important;
  box-shadow:none !important;
}

.mdm-shop-sidebar > ul > li,
.mdm-shop-sidebar .product-categories > li{
  margin:0 0 22px 0 !important;
  padding:0 !important;
}

.mdm-shop-sidebar > ul > li > a,
.mdm-shop-sidebar .product-categories > li > a{
  display:block !important;
  background:none !important;
  color:#111 !important;
  padding:0 0 10px 0 !important;
  margin:0 0 12px 0 !important;
  font-size:18px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  letter-spacing:.35px !important;
  text-transform:uppercase !important;
  text-decoration:none !important;
  border:0 !important;
  border-bottom:2px solid #cfbb78 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

.mdm-shop-sidebar ul.children,
.mdm-shop-sidebar .product-categories .children{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
}

.mdm-shop-sidebar ul.children li,
.mdm-shop-sidebar .product-categories .children li{
  position:relative !important;
  margin:0 0 12px 0 !important;
  padding:0 0 0 16px !important;
}

.mdm-shop-sidebar ul.children li:before,
.mdm-shop-sidebar .product-categories .children li:before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:11px !important;
  width:6px !important;
  height:6px !important;
  border-radius:50% !important;
  background:#cfbb78 !important;
  display:block !important;
}

.mdm-shop-sidebar ul.children li a,
.mdm-shop-sidebar .product-categories .children li a{
  display:block !important;
  color:#333 !important;
  background:none !important;
  padding:2px 0 !important;
  margin:0 !important;
  font-size:15px !important;
  font-weight:500 !important;
  line-height:1.55 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  text-decoration:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  transition:color .18s ease, transform .18s ease !important;
}

.mdm-shop-sidebar ul.children li a:hover,
.mdm-shop-sidebar .product-categories .children li a:hover{
  color:#000 !important;
  background:none !important;
  transform:translateX(2px) !important;
}

.mdm-shop-sidebar ul.children .current-cat > a,
.mdm-shop-sidebar .product-categories .children .current-cat > a,
.mdm-shop-sidebar .current-cat-parent > a{
  color:#bd9b42 !important;
  background:none !important;
}

.mdm-shop-sidebar .current-cat > a{
  background:none !important;
}


/* V218 – left sidebar closer to hamburger menu */
.mdm-shop-sidebar{
  background:#fff !important;
  border-radius:18px !important;
  box-shadow:0 8px 24px rgba(0,0,0,.06) !important;
  padding:18px 16px !important;
}

/* remove KATEGORIER title */
.mdm-shop-sidebar h3{
  display:none !important;
}

/* no background on main headings, same size as hamburger */
.mdm-shop-sidebar > ul > li,
.mdm-shop-sidebar .product-categories > li{
  margin:0 0 22px 0 !important;
  padding:0 !important;
}

.mdm-shop-sidebar > ul > li > a,
.mdm-shop-sidebar .product-categories > li > a{
  display:block !important;
  background:none !important;
  color:#111 !important;
  padding:0 0 10px 0 !important;
  margin:0 0 12px 0 !important;
  font-size:20px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  letter-spacing:.45px !important;
  text-transform:uppercase !important;
  text-decoration:none !important;
  border:0 !important;
  border-bottom:2px solid #cfbb78 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

.mdm-shop-sidebar > ul > li > a:hover,
.mdm-shop-sidebar .product-categories > li > a:hover{
  color:#b89a4a !important;
}

/* child lists */
.mdm-shop-sidebar ul.children,
.mdm-shop-sidebar .product-categories .children{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
}

.mdm-shop-sidebar ul.children li,
.mdm-shop-sidebar .product-categories .children li{
  position:relative !important;
  margin:0 0 12px 0 !important;
  padding:0 0 0 18px !important;
}

/* centered gold bullet */
.mdm-shop-sidebar ul.children li:before,
.mdm-shop-sidebar .product-categories .children li:before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:6px !important;
  height:6px !important;
  border-radius:50% !important;
  background:#cfbb78 !important;
  display:block !important;
}

.mdm-shop-sidebar ul.children li a,
.mdm-shop-sidebar .product-categories .children li a{
  display:block !important;
  color:#222 !important;
  background:none !important;
  padding:2px 0 !important;
  margin:0 !important;
  font-size:15px !important;
  font-weight:500 !important;
  line-height:1.35 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  text-decoration:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  transition:color .18s ease, transform .18s ease !important;
}

.mdm-shop-sidebar ul.children li a:hover,
.mdm-shop-sidebar .product-categories .children li a:hover{
  color:#b89a4a !important;
  background:none !important;
  transform:translateX(2px) !important;
}

.mdm-shop-sidebar ul.children .current-cat > a,
.mdm-shop-sidebar .product-categories .children .current-cat > a,
.mdm-shop-sidebar .current-cat-parent > a{
  color:#bd9b42 !important;
  background:none !important;
}

.mdm-shop-sidebar .current-cat > a{
  background:none !important;
}


/* V219 – force remove gold background from main sidebar categories */
.mdm-shop-sidebar > ul > li > a,
.mdm-shop-sidebar .product-categories > li > a{
  background:none !important;
  background-color:transparent !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

/* keep only underline like hamburger menu */
.mdm-shop-sidebar > ul > li > a,
.mdm-shop-sidebar .product-categories > li > a{
  border-bottom:2px solid #cfbb78 !important;
  padding-bottom:10px !important;
}


/* V220 – clean sidebar category heading styling, remove old gold box */
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat{
  list-style:none !important;
  margin:0 0 14px 0 !important;
  padding:0 !important;
}

.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat-title{
  display:block !important;
  background:none !important;
  background-color:transparent !important;
  color:#000 !important;
  font-weight:700 !important;
  text-transform:uppercase !important;
  padding:10px 0 !important;
  margin:0 0 8px 0 !important;
  border-radius:0 !important;
  letter-spacing:.4px !important;
  border-bottom:2px solid #cfa520 !important;
  box-shadow:none !important;
}

/* keep submenu visual style */
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .children,
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .sub-menu{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
}

.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .children li,
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .sub-menu li{
  position:relative !important;
  margin:0 0 10px 0 !important;
  padding:0 0 0 16px !important;
}

.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .children li:before,
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .sub-menu li:before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:6px !important;
  height:6px !important;
  border-radius:50% !important;
  background:#cfa520 !important;
}

.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .children li a,
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .sub-menu li a{
  display:block !important;
  color:#222 !important;
  text-decoration:none !important;
  font-size:15px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  padding:2px 0 !important;
  background:none !important;
}

.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .children li a:hover,
.mdm-shop-sidebar .mdm-cat-list .mdm-main-cat .sub-menu li a:hover{
  color:#b89a4a !important;
}


/* V221 – homepage footer text normal */
.home .site-footer,
.home footer,
.home .site-footer *,
.home footer *{
  font-weight:400 !important;
}

/* V221 – keep left product menu visible while scrolling */
.mdm-shop-sidebar{
  position:sticky !important;
  top:100px !important;
  align-self:start !important;
  max-height:calc(100vh - 120px) !important;
  overflow:auto !important;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.mdm-shop-sidebar::-webkit-scrollbar{
  width:0;
  height:0;
}

@media (max-width: 1024px){
  .mdm-shop-sidebar{
    position:relative !important;
    top:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }
}


/* V222 – FIX footer bold text (all pages incl homepage) */
.footer-item .footer-title{
  font-weight:400 !important;
}

.footer-item .footer-text{
  font-weight:400 !important;
}


/* V223 – exact footer fix */
.footer-item .footer-title,
.footer-item .footer-link .footer-title,
.home .footer-item .footer-title,
.home .footer-item .footer-link .footer-title{
  font-weight:400 !important;
}

.footer-item .footer-text,
.footer-item .footer-link .footer-text,
.home .footer-item .footer-text,
.home .footer-item .footer-link .footer-text{
  font-weight:400 !important;
}

/* V223 – lock top menu on scroll */
header.site-header,
.site-header{
  position:sticky !important;
  top:0 !important;
  z-index:10000 !important;
  background:#fff !important;
}

/* prevent dropdown/search from hiding under sticky header */
.dropdown-menu,
.search-bar{
  z-index:10001 !important;
}


/* V224 – unify footer text size on homepage */
.home .footer-item .footer-text,
.home .footer-item .footer-title{
  font-size:13px !important;
}

/* ensure same as other pages */
.footer-item .footer-text{
  font-size:13px !important;
}


/* V225 – 4 produkter per rad på desktop, mindre kort */
.woocommerce ul.products,
.woocommerce-page ul.products,
.mdm-shop-main ul.products{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:24px !important;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.mdm-shop-main ul.products li.product{
  width:auto !important;
  margin:0 !important;
}

.woocommerce ul.products li.product .product-inner,
.woocommerce-page ul.products li.product .product-inner,
.mdm-shop-main ul.products li.product .product-inner{
  padding:20px 18px !important;
}

.woocommerce ul.products li.product img,
.woocommerce-page ul.products li.product img,
.mdm-shop-main ul.products li.product img{
  max-height:260px !important;
  width:auto !important;
  margin:0 auto 16px auto !important;
  object-fit:contain !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title,
.mdm-shop-main ul.products li.product .woocommerce-loop-product__title{
  font-size:16px !important;
  line-height:1.2 !important;
}

.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price,
.mdm-shop-main ul.products li.product .price{
  font-size:14px !important;
}

.woocommerce ul.products li.product .button,
.woocommerce-page ul.products li.product .button,
.mdm-shop-main ul.products li.product .button{
  padding:12px 16px !important;
  font-size:14px !important;
  border-radius:14px !important;
}

@media (max-width: 1200px){
  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .mdm-shop-main ul.products{
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px){
  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .mdm-shop-main ul.products{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 560px){
  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .mdm-shop-main ul.products{
    grid-template-columns:1fr !important;
  }
}


/* V227 – MSPC layout fixes */

/* Max 5 options per row on desktop/tablet */
.single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variations{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
}

.single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variation{
  flex:0 0 calc((100% - 40px) / 5) !important;
  width:calc((100% - 40px) / 5) !important;
  min-width:calc((100% - 40px) / 5) !important;
  max-width:calc((100% - 40px) / 5) !important;
  box-sizing:border-box !important;
}

.single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variation img,
.single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variation .mspc-attribute-image{
  max-width:100% !important;
  height:auto !important;
}

/* Mobile: put selections under image instead of beside it */
@media (max-width: 767px){
  .single-product .mdm-product-top{
    display:block !important;
  }

  .single-product .mdm-product-top > .mdm-simple-gallery,
  .single-product .mdm-product-top > .summary.entry-summary{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  .single-product .mdm-product-top > .summary.entry-summary{
    margin-top:20px !important;
  }

  .single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variations{
    gap:8px !important;
  }

  .single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variation{
    flex:0 0 calc((100% - 16px) / 3) !important;
    width:calc((100% - 16px) / 3) !important;
    min-width:calc((100% - 16px) / 3) !important;
    max-width:calc((100% - 16px) / 3) !important;
  }
}


/* V228 – mobile MSPC max 3 per row */
@media (max-width: 767px){
  .single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variation{
    flex:0 0 calc((100% - 16px) / 3) !important;
    width:calc((100% - 16px) / 3) !important;
    min-width:calc((100% - 16px) / 3) !important;
    max-width:calc((100% - 16px) / 3) !important;
  }
}


/* V229 – MSPC exact selectors from live markup */

/* stop horizontal row/scroll behavior */
.single-product .mspc-wrapper.mspc-items-vertical .mspc-content{
  overflow: visible !important;
}

.single-product .mspc-wrapper.mspc-items-vertical .mspc-tab-content.mspc-variations{
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
  overflow: visible !important;
  width: 100% !important;
}

/* make each option fit inside grid */
.single-product .mspc-wrapper.mspc-items-vertical .mspc-tab-content.mspc-variations .mspc-variation{
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: none !important;
  box-sizing: border-box !important;
}

.single-product .mspc-wrapper.mspc-items-vertical .mspc-tab-content.mspc-variations .mspc-attribute-image{
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
}

.single-product .mspc-wrapper.mspc-items-vertical .mspc-tab-content.mspc-variations .mspc-text-wrapper{
  width: 100% !important;
}

/* mobile: selections under image and max 3 per row */
@media (max-width: 767px){
  .single-product .mdm-product-top{
    display: block !important;
  }

  .single-product .mdm-product-top > .mdm-simple-gallery,
  .single-product .mdm-product-top > .summary.entry-summary{
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .single-product .mdm-product-top > .summary.entry-summary{
    margin-top: 20px !important;
  }

  .single-product .mspc-wrapper.mspc-items-vertical .mspc-tab-content.mspc-variations{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
}


/* V230 – MSPC hard override fallback */
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations{
  width:100% !important;
  max-width:100% !important;
  overflow:visible !important;
}

.single-product .mspc-wrapper .mspc-tab-content.mspc-variations .mspc-variation{
  box-sizing:border-box !important;
}

@media (max-width:767px){
  .single-product .mdm-product-top{
    display:block !important;
  }
  .single-product .mdm-product-top > .mdm-simple-gallery,
  .single-product .mdm-product-top > .summary.entry-summary{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    float:none !important;
  }
  .single-product .mdm-product-top > .summary.entry-summary{
    margin-top:20px !important;
  }
}


/* ==========================================================
   V231 – SEO recovery
   - One H1 on the homepage (intro); hero headings are H2.
   - Visible WooCommerce breadcrumbs.
   - Four-column mega menu including company/trust links.
   - Responsive hero <img> keeps the existing visual treatment.
   ========================================================== */
.slide h1,
.slide h2{
  font-size:46px;
  margin:0 0 10px 0;
  padding:0 18px;
}
.slide .mdm231-hero-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  z-index:0;
}
.slide::before{z-index:1;}
.slide > *:not(.mdm231-hero-image):not(.mdm312-hero-picture){position:relative;z-index:2;}
.slide > .mdm312-hero-picture{display:contents !important;position:static !important;z-index:auto !important;}
.intro h1{
  margin:0 0 14px 0;
  font-size:28px;
  line-height:1.22;
}

/* Breadcrumbs: visible, compact and crawlable */
.mdm231-breadcrumbs{
  margin:0 0 22px 0;
  font-size:13px;
  line-height:1.5;
  color:#666;
}
.mdm231-breadcrumbs a{
  color:#555;
  text-decoration:none;
}
.mdm231-breadcrumbs a:hover{
  color:#111;
  text-decoration:underline;
}
.mdm231-breadcrumbs .woocommerce-breadcrumb{
  margin:0 !important;
  color:#666 !important;
}

/* V231: product columns + company/trust column */
.dropdown-menu .mdm-mega-menu{
  grid-template-columns:repeat(4, minmax(190px,1fr)) !important;
  max-width:1360px !important;
  gap:32px 42px !important;
}
.dropdown-menu .mdm-mega-col-title.is-static{
  cursor:default;
}

@media (max-width:1180px){
  .dropdown-menu .mdm-mega-menu{
    grid-template-columns:repeat(2, minmax(220px,1fr)) !important;
  }
}
@media (max-width:700px){
  .dropdown-menu .mdm-mega-menu{
    grid-template-columns:1fr !important;
  }
  .slide h1,
  .slide h2{font-size:34px;}
  .intro h1{font-size:26px;}
}

@media (max-width:992px){
  .slide h2{font-size:38px;}
}
@media (max-width:600px){
  .slide h1,
  .slide h2{font-size:30px;}
}


/* ==========================================================
   V232 – category SEO content + internal linking
   ========================================================== */
.mdm232-seo-support{
  margin:42px 0 12px;
  padding:28px;
  border:1px solid var(--border);
  border-radius:14px;
  background:#faf9f6;
}
.mdm232-seo-support h2{
  margin:0 0 12px;
  font-size:23px;
  line-height:1.25;
}
.mdm232-seo-support p{
  margin:0 0 12px;
  color:#444;
  line-height:1.7;
}
.mdm232-related-title{
  margin:22px 0 10px;
  font-size:14px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.4px;
}
.mdm232-related-links{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}
.mdm232-related-links a{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:8px 12px;
  border:1px solid #ddd;
  border-radius:999px;
  background:#fff;
  color:#222;
  font-size:13px;
  font-weight:800;
  text-decoration:none;
}
.mdm232-related-links a:hover{
  border-color:#bbb;
  background:#f4f1ea;
}
.mdm-cat-desc .mdm232-fallback-intro{
  max-width:900px;
  margin:0 auto;
}
.mdm-cat-desc .mdm232-fallback-intro p{
  line-height:1.7;
}
@media(max-width:700px){
  .mdm232-seo-support{padding:20px;margin-top:30px;}
  .mdm232-seo-support h2{font-size:20px;}
}


/* ==========================================================
 * V233 – Product SEO layer
 * ========================================================== */
.single-product .mdm233-product-info{
  margin:34px 0 10px;
  padding:28px 30px;
  border:1px solid #e7e7e7;
  border-radius:14px;
  background:#fff;
}
.single-product .mdm233-product-info h2{
  margin:0 0 18px;
  font-size:26px;
  line-height:1.2;
}
.single-product .mdm233-product-attributes{
  display:grid;
  grid-template-columns:minmax(150px,220px) 1fr;
  gap:0;
  margin:0;
  border-top:1px solid #eee;
}
.single-product .mdm233-product-attributes dt,
.single-product .mdm233-product-attributes dd{
  margin:0;
  padding:11px 0;
  border-bottom:1px solid #eee;
  line-height:1.5;
}
.single-product .mdm233-product-attributes dt{
  padding-right:20px;
  font-weight:700;
}
.single-product .mdm233-product-attributes dd{
  color:#444;
}
.single-product .mdm233-category-context{
  margin:18px 0 0;
  line-height:1.6;
}
.single-product .mdm233-category-context strong{
  margin-right:6px;
}
.single-product .mdm233-category-context a{
  color:inherit;
  text-decoration:underline;
  text-underline-offset:2px;
}
.single-product .woocommerce-product-details__short-description > :first-child{
  margin-top:0;
}
.single-product .woocommerce-product-details__short-description > :last-child{
  margin-bottom:0;
}

@media (max-width:700px){
  .single-product .mdm233-product-info{
    padding:22px 20px;
  }
  .single-product .mdm233-product-attributes{
    grid-template-columns:1fr;
  }
  .single-product .mdm233-product-attributes dt{
    padding-bottom:2px;
    border-bottom:0;
  }
  .single-product .mdm233-product-attributes dd{
    padding-top:2px;
  }
}


/* ==========================================================
   V236 – SEO Landing Pages 2.0
   ========================================================== */
.mdm236-cat-header{margin:0 0 26px;}
.mdm236-cat-header .mdm-cat-title{margin-bottom:12px;}
.mdm236-cat-lead{max-width:920px;font-size:17px;line-height:1.65;color:var(--text);}
.mdm236-cat-lead p:first-child{margin-top:0;}
.mdm236-cat-lead p:last-child{margin-bottom:0;}
.mdm236-quicklinks{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0 0;}
.mdm236-quicklinks a{display:inline-flex;align-items:center;min-height:38px;padding:8px 13px;border:1px solid var(--border);border-radius:999px;background:#fff;color:var(--text);font-weight:700;text-decoration:none;}
.mdm236-quicklinks a:hover{text-decoration:underline;}

.mdm236-landing{margin:42px 0 16px;padding:30px;border:1px solid var(--border);border-radius:var(--card-radius);background:#fff;}
.mdm236-landing h2{margin:0 0 14px;font-size:28px;line-height:1.2;}
.mdm236-landing h3{margin:28px 0 10px;font-size:20px;line-height:1.25;}
.mdm236-landing p{max-width:940px;line-height:1.7;margin:0 0 14px;}
.mdm236-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0 10px;}
.mdm236-guide-card{border:1px solid var(--border);border-radius:10px;padding:17px;background:#fff;}
.mdm236-guide-card h3{font-size:18px;margin:0 0 8px;}
.mdm236-guide-card p{font-size:15px;margin:0;line-height:1.55;}
.mdm236-guide-card a{color:inherit;text-decoration:none;}
.mdm236-guide-card a:hover{text-decoration:underline;}
.mdm236-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0 28px;padding:0;list-style:none;}
.mdm236-points li{border-left:3px solid var(--gold);padding:4px 10px 4px 14px;line-height:1.55;}
.mdm236-faq{margin-top:26px;max-width:980px;}
.mdm236-faq details{border-top:1px solid var(--border);padding:13px 0;}
.mdm236-faq details:last-child{border-bottom:1px solid var(--border);}
.mdm236-faq summary{cursor:pointer;font-weight:700;line-height:1.4;}
.mdm236-faq details p{margin:10px 0 0;}
.mdm236-related{margin-top:28px;}
.mdm236-related strong{display:block;margin-bottom:10px;}
.mdm236-related-links{display:flex;flex-wrap:wrap;gap:9px;}
.mdm236-related-links a{display:inline-flex;padding:8px 12px;border:1px solid var(--border);border-radius:999px;text-decoration:none;color:inherit;background:#fff;}
.mdm236-related-links a:hover{text-decoration:underline;}
@media (max-width:900px){
  .mdm236-guide-grid,.mdm236-points{grid-template-columns:1fr;}
  .mdm236-landing{padding:22px;margin-top:30px;}
  .mdm236-landing h2{font-size:23px;}
  .mdm236-cat-lead{font-size:16px;}
}

/* ==========================================================
   V242 – SEO UX Cleanup
   ========================================================== */
.mdm242-landing{margin:38px 0 18px;padding:28px;border:1px solid var(--border);border-radius:16px;background:#fff;}
.mdm242-landing h2{margin:0 0 10px;font-size:28px;line-height:1.2;}
.mdm242-landing>.mdm242-intro{max-width:900px;margin:0 0 20px;line-height:1.65;color:var(--text);}
.mdm242-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:20px 0 0;}
.mdm242-card{position:relative;display:flex;flex-direction:column;min-height:148px;padding:20px 52px 18px 20px;border:1px solid var(--border);border-radius:14px;background:#fff;color:var(--text);text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;background-color .18s ease;}
.mdm242-card:hover,.mdm242-card:focus-visible{transform:translateY(-2px);border-color:rgba(198,162,90,.65);box-shadow:0 12px 28px rgba(17,17,17,.08);background:#fffdf8;text-decoration:none;outline:none;}
.mdm242-card h3{margin:0 0 8px;font-size:19px;line-height:1.25;color:inherit;}
.mdm242-card p{margin:0;font-size:15px;line-height:1.5;color:var(--muted);}
.mdm242-card .mdm242-arrow{position:absolute;right:20px;top:20px;width:30px;height:30px;border-radius:999px;display:grid;place-items:center;background:#f5f2eb;color:#111;font-size:18px;transition:transform .18s ease,background .18s ease;}
.mdm242-card:hover .mdm242-arrow,.mdm242-card:focus-visible .mdm242-arrow{transform:translateX(2px);background:var(--gold);}
.mdm242-card .mdm242-cta{margin-top:auto;padding-top:14px;font-weight:700;font-size:14px;color:#111;}
.mdm242-faq{margin-top:28px;max-width:980px;}
.mdm242-faq h3{margin:0 0 8px;font-size:20px;}
.mdm242-faq details{border-top:1px solid var(--border);padding:13px 2px;}
.mdm242-faq details:last-child{border-bottom:1px solid var(--border);}
.mdm242-faq summary{cursor:pointer;font-weight:700;line-height:1.45;}
.mdm242-faq details p{margin:10px 0 0;line-height:1.6;}

/* Modern WooCommerce pagination */
.woocommerce nav.woocommerce-pagination{margin:34px 0 24px;text-align:center;}
.woocommerce nav.woocommerce-pagination ul,
.woocommerce-pagination ul.page-numbers{display:flex!important;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin:0!important;padding:0!important;border:0!important;list-style:none!important;}
.woocommerce nav.woocommerce-pagination ul li,
.woocommerce-pagination ul.page-numbers li{margin:0!important;padding:0!important;border:0!important;float:none!important;}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span,
.woocommerce-pagination .page-numbers li>a,
.woocommerce-pagination .page-numbers li>span{display:inline-flex!important;align-items:center;justify-content:center;min-width:46px;height:46px;padding:0 15px!important;border:1px solid #ddd!important;border-radius:12px!important;background:#fff!important;color:#222!important;font-size:16px!important;font-weight:700!important;line-height:1!important;text-decoration:none!important;transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;}
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce-pagination .page-numbers li>a:hover{background:#fffdf8!important;border-color:var(--gold)!important;transform:translateY(-1px);box-shadow:0 6px 16px rgba(17,17,17,.07);}
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce-pagination .page-numbers li>span.current{background:#111!important;border-color:#111!important;color:#fff!important;}
.woocommerce nav.woocommerce-pagination ul li a.next,
.woocommerce nav.woocommerce-pagination ul li a.prev,
.woocommerce-pagination a.next.page-numbers,
.woocommerce-pagination a.prev.page-numbers{min-width:auto;padding:0 18px!important;}

@media(max-width:760px){
  .mdm242-landing{padding:20px;margin-top:28px;}
  .mdm242-landing h2{font-size:23px;}
  .mdm242-card-grid{grid-template-columns:1fr;gap:12px;}
  .mdm242-card{min-height:0;}
  .woocommerce nav.woocommerce-pagination ul,
  .woocommerce-pagination ul.page-numbers{gap:7px;}
  .woocommerce nav.woocommerce-pagination ul li a,
  .woocommerce nav.woocommerce-pagination ul li span,
  .woocommerce-pagination .page-numbers li>a,
  .woocommerce-pagination .page-numbers li>span{min-width:42px;height:42px;padding:0 12px!important;border-radius:10px!important;font-size:15px!important;}
}


/* ==========================================================
   V243 – Puff text closer to bottom edge
   ========================================================== */
.puffs .puff .puff-copy{
  position:absolute;
  left:28px;
  right:28px;
  bottom:14px;
  z-index:3;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
  text-align:left;
  pointer-events:none;
}
.puffs .puff .puff-copy a{
  display:block;
  color:inherit;
  text-decoration:none;
  pointer-events:auto;
}
.puffs .puff .puff-copy h3,
.puffs .puff .puff-copy .puff-text{
  position:static !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  margin:0 !important;
  width:100%;
}
.puffs .puff .puff-copy h3{
  font-size:18px;
  line-height:1.15;
}
.puffs .puff .puff-copy .puff-text{
  font-size:14px;
  line-height:1.3;
}
@media(max-width:992px){
  .puffs .puff .puff-copy{left:22px;right:22px;bottom:12px;}
}
@media(max-width:600px){
  .puffs .puff .puff-copy{left:18px;right:18px;bottom:10px;gap:4px;}
}


/* V245 – merged binding navigation */
body.tax-product_cat.term-for-restauranger .mdm245-top-bindings{
  margin-top:18px;
  margin-bottom:30px;
}
body.tax-product_cat.term-for-restauranger .mdm245-top-bindings h2{
  margin-top:0;
}
body.tax-product_cat.term-for-restauranger .mdm245-faq-only{
  margin-top:24px;
}
body.tax-product_cat.term-for-restauranger .mdm245-faq-only .mdm242-faq{
  margin-top:0;
}
@media (max-width: 700px){
  body.tax-product_cat.term-for-restauranger .mdm245-top-bindings{
    margin-top:14px;
    margin-bottom:22px;
  }
}


/* ==========================================================
 * V246 – SEO Content Cleanup
 * ========================================================== */
.mdm246-cat-header .mdm-cat-desc{max-width:1180px;}
.mdm246-cat-header .mdm-cat-desc p{margin:0;line-height:1.58;}
.mdm246-hub-cards{margin-top:18px;}
.mdm246-hub-cards > h2{margin-bottom:20px;}
.mdm246-faq-only{margin-top:28px;}
.mdm246-family-nav .mdm242-card-grid{margin-top:18px;}
@media (max-width: 720px){
  .mdm246-cat-header .mdm-cat-desc{font-size:16px;line-height:1.5;}
  .mdm246-hub-cards{margin-top:12px;}
}


/* ==========================================================
 * V248 – More breathing room on WooCommerce pages
 * ========================================================== */
/* Give shop/category pages a calmer start below the header and a clear white zone before footer. */
.woocommerce.archive .site-main,
.woocommerce-page.archive .site-main{
  padding-top:30px !important;
  padding-bottom:86px !important;
}

/* Single products should use the same vertical rhythm. */
.single-product .site-main{
  padding-top:30px !important;
  padding-bottom:86px !important;
}

/* More space between breadcrumb and page heading/content. */
.woocommerce .mdm231-breadcrumbs,
.woocommerce-page .mdm231-breadcrumbs{
  margin-bottom:30px !important;
}

/* Let the rewritten category intro breathe before the product grid/navigation. */
.tax-product_cat .mdm246-cat-header{
  margin-top:0 !important;
  margin-bottom:34px !important;
}

/* Extra breathing room around product pagination and the content that follows it. */
.woocommerce.archive nav.woocommerce-pagination,
.woocommerce-page.archive nav.woocommerce-pagination{
  margin-top:42px !important;
  margin-bottom:38px !important;
}

/* Never let the final archive section sit directly on the footer. */
.woocommerce.archive .mdm-shop-main > :last-child,
.woocommerce-page.archive .mdm-shop-main > :last-child{
  margin-bottom:0;
}

@media (max-width:760px){
  .woocommerce.archive .site-main,
  .woocommerce-page.archive .site-main,
  .single-product .site-main{
    padding-top:20px !important;
    padding-bottom:58px !important;
  }
  .woocommerce .mdm231-breadcrumbs,
  .woocommerce-page .mdm231-breadcrumbs{
    margin-bottom:22px !important;
  }
  .tax-product_cat .mdm246-cat-header{
    margin-bottom:26px !important;
  }
  .woocommerce.archive nav.woocommerce-pagination,
  .woocommerce-page.archive nav.woocommerce-pagination{
    margin-top:34px !important;
    margin-bottom:30px !important;
  }
}


/* ==========================================================
 * V249 – Category top copy polish + logo marquee cleanup
 * ========================================================== */
.mdm249-cat-header{
  margin:26px 0 30px 0;
  padding:28px 34px;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fff;
}
.mdm249-cat-header .mdm-cat-title{
  margin:0 0 14px 0;
  max-width:22ch;
  font-size:clamp(32px, 4vw, 56px);
  line-height:1.02;
  letter-spacing:.02em;
  text-wrap:balance;
}
.mdm249-cat-header .mdm-cat-desc{
  max-width:100%;
}
.mdm249-cat-header .mdm-cat-desc p{
  max-width:62ch;
  font-size:clamp(18px, 1.55vw, 22px);
  line-height:1.6;
  color:var(--text);
}
.woocommerce.archive .site-main,
.woocommerce-page.archive .site-main{
  padding-top:40px !important;
  padding-bottom:110px !important;
}

.logo-marquee{
  max-width:min(1320px, calc(100% - 40px));
  padding-inline:20px;
}
.logo-track{
  width:max-content;
}
.logo-row{
  width:max-content;
  max-width:none !important;
  justify-content:flex-start !important;
}
.logo-row img{
  max-width:none;
  width:auto;
  object-fit:contain;
}

@media (max-width: 900px){
  .mdm249-cat-header{
    padding:24px 24px;
    margin:22px 0 26px 0;
  }
  .mdm249-cat-header .mdm-cat-title{
    max-width:18ch;
    font-size:clamp(28px, 7vw, 44px);
  }
  .mdm249-cat-header .mdm-cat-desc p{
    max-width:100%;
    font-size:18px;
    line-height:1.55;
  }
  .woocommerce.archive .site-main,
  .woocommerce-page.archive .site-main{
    padding-top:28px !important;
    padding-bottom:88px !important;
  }
}


/* ==========================================================
 * V250 – Category header polish (one-line desktop H1)
 * ========================================================== */
.mdm249-cat-header .mdm-cat-title,
.mdm250-cat-header .mdm-cat-title{
  max-width:none;
  font-size:clamp(34px, 3.05vw, 46px);
  line-height:1.06;
  letter-spacing:.01em;
  text-wrap:nowrap;
  white-space:nowrap;
}
.mdm249-cat-header .mdm-cat-desc p,
.mdm250-cat-header .mdm-cat-desc p{
  max-width:72ch;
  font-size:clamp(18px, 1.35vw, 20px);
}
.mdm249-cat-header,
.mdm250-cat-header{
  padding:24px 30px;
}
@media (max-width: 1200px){
  .mdm249-cat-header .mdm-cat-title,
  .mdm250-cat-header .mdm-cat-title{
    font-size:clamp(32px, 3.8vw, 40px);
  }
}
@media (max-width: 900px){
  .mdm249-cat-header .mdm-cat-title,
  .mdm250-cat-header .mdm-cat-title{
    white-space:normal;
    text-wrap:balance;
    font-size:clamp(28px, 6.4vw, 38px);
    line-height:1.08;
  }
  .mdm249-cat-header,
  .mdm250-cat-header{
    padding:22px 22px;
  }
}


/* ==========================================================
 * V251 – Header fit + FAQ spacing polish
 * ========================================================== */
@media (min-width: 1101px){
  .mdm249-cat-header .mdm-cat-title,
  .mdm250-cat-header .mdm-cat-title{
    max-width:100%;
    white-space:nowrap;
    text-wrap:nowrap;
    font-size:clamp(28px, 2vw, 38px);
    line-height:1.08;
    letter-spacing:0;
  }
}
@media (max-width:1100px){
  .mdm249-cat-header .mdm-cat-title,
  .mdm250-cat-header .mdm-cat-title{
    white-space:normal;
    text-wrap:balance;
    font-size:clamp(28px, 4.6vw, 36px);
  }
}

.mdm246-faq-only{
  padding:36px 28px 34px !important;
}
.mdm246-faq-only .mdm242-faq{
  margin-top:0 !important;
  max-width:none;
}
.mdm246-faq-only .mdm242-faq h2{
  margin:0 0 14px !important;
}
.mdm246-faq-only .mdm242-faq details{
  padding:14px 2px;
}
@media (max-width:760px){
  .mdm246-faq-only{
    padding:26px 20px 24px !important;
  }
}


/* ==========================================================
 * V252 – Logo Marquee 2.0
 * One animation only. Old V62/V194–V199 row animations and
 * clipping rules are neutralised here deliberately.
 * ========================================================== */
.logos{
  overflow:hidden !important;
}
.logo-marquee{
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:18px 0 !important;
  overflow:hidden !important;
}
.logo-track{
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  width:max-content !important;
  max-width:none !important;
  gap:0 !important;
  animation:none;
  transform:translate3d(0,0,0);
  will-change:transform;
}
.logo-row,
.logo-row.clone{
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  width:max-content !important;
  max-width:none !important;
  min-width:max-content !important;
  margin:0 !important;
  padding:0 30px !important;
  gap:60px !important;
  overflow:visible !important;
  animation:none !important;
  transform:none !important;
  position:static !important;
  flex:0 0 auto !important;
}
.logo-row::after,
.logo-row.clone::after{
  content:none !important;
  display:none !important;
}
.logo-row > *,
.logo-row.clone > *{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  margin:0 !important;
  padding:0 !important;
}
.logo-row img,
.logo-row.clone img{
  display:block !important;
  height:82px !important;
  width:auto !important;
  max-width:180px !important;
  object-fit:contain !important;
  margin:0 !important;
  opacity:.94 !important;
  flex:0 0 auto !important;
}
.mdm-logo-spacer{display:none !important;}
@media (max-width:1024px){
  .logo-row,.logo-row.clone{gap:46px !important;padding:0 23px !important;}
  .logo-row img,.logo-row.clone img{height:68px !important;max-width:150px !important;}
}
@media (max-width:600px){
  .logo-marquee{padding:12px 0 !important;}
  .logo-row,.logo-row.clone{gap:32px !important;padding:0 16px !important;}
  .logo-row img,.logo-row.clone img{height:54px !important;max-width:125px !important;}
}
@media (prefers-reduced-motion: reduce){
  .logo-track{transform:none !important;}
}


/* ==========================================================
 * V255 – Sales Copy 1.0
 * ========================================================== */
.mdm255-home-sales-copy{max-width:900px;margin:0 auto;}
.mdm255-home-sales-copy p{margin:0 0 10px;line-height:1.65;}
.mdm255-home-sales-copy p:last-child{margin-bottom:0;}
.mdm255-home-sales-copy strong{font-weight:800;color:var(--text);}
.mdm255-cat-header .mdm-cat-desc p{max-width:76ch;}


/* ==========================================================
 * V256 – Callback form polish
 * ========================================================== */
.mdm10-modal.mdm256-callback-modal{
  width:min(640px, 100%);
  padding:38px 34px 32px;
}
.mdm256-callback-head{
  padding-right:48px;
  margin-bottom:22px;
}
.mdm256-callback-head h2{
  margin:0 0 8px;
  font-size:30px;
  line-height:1.15;
}
.mdm256-callback-head p{
  margin:0;
  color:var(--muted);
  font-size:16px;
  line-height:1.55;
}
@media(max-width:600px){
  .mdm10-modal.mdm256-callback-modal{padding:30px 20px 24px;}
  .mdm256-callback-head h2{font-size:25px;}
}



/* ==========================================================
 * V258 – Contact Design 1.0
 * ========================================================== */
.mdm10-modal.mdm256-callback-modal{
  width:min(760px, 100%);
  padding:42px 38px 34px;
  border:1px solid rgba(198,162,90,.28);
  border-radius:28px;
  background:linear-gradient(180deg,#fffdfa 0%,#ffffff 100%);
  box-shadow:0 26px 60px rgba(17,17,17,.22);
}
.mdm10-modal.mdm256-callback-modal::before{
  content:'';
  position:absolute;
  inset:0 0 auto 0;
  height:6px;
  background:linear-gradient(90deg,var(--gold) 0%,#dbc28b 50%,var(--gold) 100%);
  border-radius:28px 28px 0 0;
}
.mdm10-modal.mdm256-callback-modal .mdm10-modal-close{
  top:18px;
  right:18px;
  width:46px;
  height:46px;
  background:#f5efe2;
  border:1px solid rgba(198,162,90,.35);
  color:#111;
  transition:transform .18s ease, background .18s ease;
}
.mdm10-modal.mdm256-callback-modal .mdm10-modal-close:hover{
  background:#efe4c8;
  transform:translateY(-1px);
}
.mdm256-callback-head{
  position:relative;
  padding:0 72px 22px 0;
  margin-bottom:24px;
}
.mdm256-callback-head::after{
  content:'';
  display:block;
  width:84px;
  height:2px;
  margin-top:18px;
  background:var(--gold);
}
.mdm256-callback-head h2{
  margin:0 0 12px;
  font-size:clamp(34px,4vw,54px);
  line-height:1.02;
  letter-spacing:-.03em;
}
.mdm256-callback-head p{
  margin:0;
  max-width:48ch;
  color:#5f5a51;
  font-size:18px;
  line-height:1.65;
}
.mdm256-callback-modal .wpcf7{
  display:block;
}
.mdm256-callback-modal .wpcf7 form{
  margin:0;
}
.mdm256-callback-modal .wpcf7 form > p{
  margin:0 0 18px;
}
.mdm256-callback-modal .wpcf7 label{
  display:block;
  margin:0 0 14px;
  color:#232323;
  font-size:15px;
  font-weight:800;
  line-height:1.35;
}
.mdm256-callback-modal .wpcf7 label[data-mdm258-label]::before{
  content:attr(data-mdm258-label);
  display:block;
  margin-bottom:8px;
  color:#202020;
}
.mdm256-callback-modal .wpcf7 label[data-mdm258-label]{
  font-size:0;
}
.mdm256-callback-modal .wpcf7 label[data-mdm258-label] .wpcf7-form-control-wrap,
.mdm256-callback-modal .wpcf7 label[data-mdm258-label] input,
.mdm256-callback-modal .wpcf7 label[data-mdm258-label] textarea,
.mdm256-callback-modal .wpcf7 label[data-mdm258-label] select{
  font-size:17px;
}
.mdm256-callback-modal .wpcf7 input[type="text"],
.mdm256-callback-modal .wpcf7 input[type="tel"],
.mdm256-callback-modal .wpcf7 input[type="email"],
.mdm256-callback-modal .wpcf7 input[type="number"],
.mdm256-callback-modal .wpcf7 textarea,
.mdm256-callback-modal .wpcf7 select{
  width:100%;
  min-height:58px;
  border:1px solid #ddd3bf;
  border-radius:16px;
  padding:16px 18px;
  background:#fff;
  color:#1c1c1c;
  font-size:17px;
  line-height:1.45;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.mdm256-callback-modal .wpcf7 textarea{min-height:140px;resize:vertical;}
.mdm256-callback-modal .wpcf7 input::placeholder,
.mdm256-callback-modal .wpcf7 textarea::placeholder{color:#8f877a;opacity:1;}
.mdm256-callback-modal .wpcf7 input:focus,
.mdm256-callback-modal .wpcf7 textarea:focus,
.mdm256-callback-modal .wpcf7 select:focus{
  outline:none;
  border-color:var(--gold);
  box-shadow:0 0 0 4px rgba(198,162,90,.16);
  background:#fffdfa;
}
.mdm256-callback-modal .wpcf7 .wpcf7-acceptance{
  display:block;
  margin:22px 0 10px;
}
.mdm256-callback-modal .wpcf7 .wpcf7-list-item{
  margin:0;
}
.mdm256-callback-modal .wpcf7 .wpcf7-list-item label{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin:0;
  font-size:16px;
  font-weight:600;
  color:#2d2d2d;
}
.mdm256-callback-modal .wpcf7 .wpcf7-list-item input[type="checkbox"]{
  width:22px;
  height:22px;
  margin-top:2px;
  accent-color:#111;
}
.mdm256-callback-modal .wpcf7 .wpcf7-submit,
.mdm256-callback-modal .wpcf7 button[type="submit"]{
  appearance:none;
  border:0;
  min-height:58px;
  padding:16px 28px;
  border-radius:999px;
  background:#111;
  color:#fff;
  font-size:16px;
  font-weight:800;
  letter-spacing:.01em;
  cursor:pointer;
  box-shadow:0 12px 28px rgba(17,17,17,.16);
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.mdm256-callback-modal .wpcf7 .wpcf7-submit:hover,
.mdm256-callback-modal .wpcf7 button[type="submit"]:hover{
  background:var(--gold);
  color:#111;
  transform:translateY(-1px);
  box-shadow:0 18px 32px rgba(198,162,90,.24);
}
.mdm256-callback-modal .wpcf7 .wpcf7-submit:disabled,
.mdm256-callback-modal .wpcf7 button[type="submit"]:disabled{
  opacity:.48;
  cursor:not-allowed;
  transform:none;
  box-shadow:none;
}
.mdm256-callback-modal .wpcf7 .wpcf7-spinner{
  vertical-align:middle;
  margin-left:10px;
}
.mdm256-callback-modal .wpcf7 .wpcf7-response-output{
  margin:18px 0 0;
  padding:14px 16px;
  border-radius:14px;
  font-size:15px;
  line-height:1.55;
}
.mdm256-callback-modal .wpcf7 form.sent .wpcf7-response-output{
  border:1px solid #d9d1b8;
  background:#faf6ec;
  color:#1d1d1d;
}
.mdm256-callback-modal .wpcf7-not-valid-tip{
  margin-top:8px;
  color:#9f2f1c;
  font-size:14px;
}
@media (max-width:700px){
  .mdm10-modal.mdm256-callback-modal{
    padding:34px 22px 24px;
    border-radius:24px;
  }
  .mdm256-callback-head{
    padding-right:58px;
    margin-bottom:20px;
  }
  .mdm256-callback-head p{font-size:16px;}
  .mdm256-callback-modal .wpcf7 input[type="text"],
  .mdm256-callback-modal .wpcf7 input[type="tel"],
  .mdm256-callback-modal .wpcf7 input[type="email"],
  .mdm256-callback-modal .wpcf7 input[type="number"],
  .mdm256-callback-modal .wpcf7 textarea,
  .mdm256-callback-modal .wpcf7 select{min-height:54px;font-size:16px;}
  .mdm256-callback-modal .wpcf7 .wpcf7-submit,
  .mdm256-callback-modal .wpcf7 button[type="submit"]{width:100%;}
}


/* ==========================================================
 * V259 – Callback Compact
 * ========================================================== */
.mdm10-modal.mdm256-callback-modal{
  width:min(610px, calc(100vw - 36px));
  max-height:calc(100vh - 40px);
  padding:30px 30px 26px;
  border-radius:22px;
}
.mdm10-modal.mdm256-callback-modal::before{
  height:4px;
  border-radius:22px 22px 0 0;
}
.mdm10-modal.mdm256-callback-modal .mdm10-modal-close{
  top:14px;
  right:14px;
  width:38px;
  height:38px;
  font-size:20px;
}
.mdm256-callback-head{
  padding:0 52px 12px 0;
  margin-bottom:16px;
}
.mdm256-callback-head::after{
  width:60px;
  margin-top:12px;
}
.mdm256-callback-head h2{
  margin:0 0 7px;
  font-size:34px;
  line-height:1.08;
  letter-spacing:-.025em;
}
.mdm256-callback-head p{
  font-size:15px;
  line-height:1.5;
}

/* Two-column field area on desktop. CF7 paragraphs are classified by V259 JS. */
.mdm256-callback-modal .wpcf7 form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:13px 14px;
  align-items:start;
}
.mdm256-callback-modal .wpcf7 form > p,
.mdm256-callback-modal .wpcf7 form > div{
  margin:0;
}
.mdm256-callback-modal .wpcf7 form > .mdm259-field{
  min-width:0;
}
.mdm256-callback-modal .wpcf7 form > .mdm259-acceptance,
.mdm256-callback-modal .wpcf7 form > .mdm259-submit,
.mdm256-callback-modal .wpcf7 form > .wpcf7-response-output{
  grid-column:1 / -1;
}

/* Restore the field labels that V258 accidentally made effectively invisible. */
.mdm256-callback-modal .wpcf7 label[data-mdm258-label],
.mdm256-callback-modal .wpcf7 label.mdm259-labelled{
  margin:0;
  font-size:0;
  font-weight:700;
}
.mdm256-callback-modal .wpcf7 label[data-mdm258-label]::before,
.mdm256-callback-modal .wpcf7 label.mdm259-labelled::before{
  content:attr(data-mdm258-label);
  display:block;
  margin:0 0 6px;
  color:#292929;
  font-size:13px;
  line-height:1.25;
  font-weight:800;
}
.mdm256-callback-modal .wpcf7 label[data-mdm258-label] .wpcf7-form-control-wrap,
.mdm256-callback-modal .wpcf7 label.mdm259-labelled .wpcf7-form-control-wrap{
  display:block;
}

.mdm256-callback-modal .wpcf7 input[type="text"],
.mdm256-callback-modal .wpcf7 input[type="tel"],
.mdm256-callback-modal .wpcf7 input[type="email"],
.mdm256-callback-modal .wpcf7 input[type="number"],
.mdm256-callback-modal .wpcf7 textarea,
.mdm256-callback-modal .wpcf7 select{
  min-height:46px;
  padding:11px 13px;
  border-radius:11px;
  font-size:15px;
}
.mdm256-callback-modal .wpcf7 textarea{
  min-height:92px;
}

/* Acceptance is deliberately kept: it activates submit and acts as a simple spam barrier. */
.mdm256-callback-modal .wpcf7 form > .mdm259-acceptance{
  margin-top:3px;
  padding:11px 13px;
  border:1px solid #e5dcc9;
  border-radius:12px;
  background:#faf7f0;
}
.mdm256-callback-modal .wpcf7 .wpcf7-acceptance{
  margin:0;
}
.mdm256-callback-modal .wpcf7 .wpcf7-list-item label{
  align-items:center;
  gap:10px;
  font-size:14px;
  line-height:1.35;
  font-weight:700;
}
.mdm256-callback-modal .wpcf7 .wpcf7-list-item input[type="checkbox"]{
  width:19px;
  height:19px;
  margin:0;
  flex:0 0 19px;
}

.mdm256-callback-modal .wpcf7 form > .mdm259-submit{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:0;
}
.mdm256-callback-modal .wpcf7 .wpcf7-submit,
.mdm256-callback-modal .wpcf7 button[type="submit"]{
  min-height:48px;
  padding:12px 22px;
  font-size:14px;
  box-shadow:0 8px 20px rgba(17,17,17,.13);
}
.mdm256-callback-modal .wpcf7 .wpcf7-submit:disabled,
.mdm256-callback-modal .wpcf7 button[type="submit"]:disabled{
  background:#c8c8c8;
  color:#fff;
  opacity:1;
}
.mdm256-callback-modal .wpcf7 .wpcf7-response-output{
  margin:2px 0 0;
  padding:10px 12px;
  font-size:13px;
}

@media(max-width:640px){
  .mdm10-modal.mdm256-callback-modal{
    width:min(520px, calc(100vw - 22px));
    max-height:calc(100vh - 22px);
    padding:26px 18px 20px;
    border-radius:18px;
  }
  .mdm256-callback-head{
    padding:42px 74px 12px 0;
    margin-bottom:14px;
  }
  .mdm256-callback-head h2{
    font-size:22px;
    line-height:1.1;
    white-space:nowrap;
  }
  .mdm256-callback-head p{
    font-size:12px;
    line-height:1.35;
    white-space:nowrap;
  }
  .mdm256-callback-modal .wpcf7 form{
    grid-template-columns:1fr;
    gap:11px;
  }
  .mdm256-callback-modal .wpcf7 form > .mdm259-acceptance,
  .mdm256-callback-modal .wpcf7 form > .mdm259-submit,
  .mdm256-callback-modal .wpcf7 form > .wpcf7-response-output{
    grid-column:1;
  }
  .mdm256-callback-modal .wpcf7 .wpcf7-submit,
  .mdm256-callback-modal .wpcf7 button[type="submit"]{
    width:100%;
  }
}

/* ==========================================================
 * V262 – Popup Mobile Fix
 * ========================================================== */
/* Preserve the acceptance checkbox as the anti-spam/send activation control. */
.mdm256-callback-modal .wpcf7 .mdm262-actions{
  grid-column:1 / -1;
}

@media(max-width:640px){
  /* The acceptance must be clearly above the CTA on mobile. */
  .mdm256-callback-modal .wpcf7 form > .mdm259-acceptance{
    order:10;
    width:100%;
  }
  .mdm256-callback-modal .wpcf7 form > .mdm259-submit{
    order:11;
    width:100%;
  }

  /* CF7 can place acceptance + submit in the same block. V262 JS marks it
     as mdm262-actions; stack its contents vertically instead of side-by-side. */
  .mdm256-callback-modal .wpcf7 .mdm262-actions{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:12px !important;
    width:100%;
    padding:12px 13px !important;
    border:1px solid #e5dcc9;
    border-radius:12px;
    background:#faf7f0;
  }
  .mdm256-callback-modal .wpcf7 .mdm262-actions .wpcf7-acceptance{
    order:1;
    width:100%;
    margin:0 !important;
  }
  .mdm256-callback-modal .wpcf7 .mdm262-actions input[type="submit"],
  .mdm256-callback-modal .wpcf7 .mdm262-actions button[type="submit"]{
    order:2;
    width:100% !important;
    margin:0 !important;
  }
  .mdm256-callback-modal .wpcf7 .mdm262-actions .wpcf7-spinner{
    order:3;
    align-self:center;
  }
  .mdm256-callback-modal .wpcf7 .wpcf7-list-item label{
    align-items:flex-start;
  }
  .mdm256-callback-modal .wpcf7 .wpcf7-list-item-label{
    display:block;
    min-width:0;
    overflow-wrap:anywhere;
  }
}


/* ==========================================================
 * V269 – Callback Time Clean Rebuild
 * One component, two full-width rows on desktop and mobile.
 * ========================================================== */
.mdm256-callback-modal .mdm269-time-source,
.mdm256-callback-modal .mdm269-original-time-label{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
  clip:rect(0,0,0,0) !important;
  clip-path:inset(50%) !important;
}
.mdm256-callback-modal .mdm269-time-ui{
  grid-column:1 / -1;
  width:100%;
  margin:2px 0 0;
}
.mdm256-callback-modal .mdm269-time-heading{
  margin:0 0 10px;
  color:#202020;
  font-size:14px;
  font-weight:800;
  line-height:1.3;
}
.mdm256-callback-modal .mdm269-time-rows{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  width:100%;
}
.mdm256-callback-modal .mdm269-time-row{
  display:grid;
  grid-template-columns:72px minmax(0,1fr);
  align-items:center;
  gap:14px;
  width:100%;
  padding:12px 14px;
  border:1px solid #eadfc9;
  border-radius:14px;
  background:#fcfaf5;
}
.mdm256-callback-modal .mdm269-time-row-label{
  color:#24211d;
  font-size:15px;
  font-weight:800;
}
.mdm256-callback-modal .mdm269-time-controls{
  display:grid;
  grid-template-columns:minmax(118px,1fr) 18px minmax(108px,1fr);
  align-items:end;
  gap:10px;
  min-width:0;
}
.mdm256-callback-modal .mdm269-time-control{
  display:block !important;
  margin:0 !important;
  min-width:0;
  font-size:inherit !important;
}
.mdm256-callback-modal .mdm269-time-control > span{
  display:block;
  margin:0 0 5px;
  color:#776f63;
  font-size:11px;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.mdm256-callback-modal .mdm269-time-control select{
  display:block;
  width:100%;
  min-width:0;
  min-height:50px;
  margin:0;
  padding:11px 38px 11px 14px;
  border:1px solid #ddd3bf;
  border-radius:11px;
  background:#fff;
  color:#1c1c1c;
  font-size:17px;
  font-weight:700;
  line-height:1.2;
  cursor:pointer;
  box-shadow:none;
}
.mdm256-callback-modal .mdm269-time-control select:focus{
  outline:none;
  border-color:var(--gold);
  box-shadow:0 0 0 4px rgba(198,162,90,.14);
  background:#fffdfa;
}
.mdm256-callback-modal .mdm269-time-colon{
  display:flex;
  align-items:center;
  justify-content:center;
  height:50px;
  color:#8a806f;
  font-size:24px;
  font-weight:800;
  line-height:1;
}
.mdm256-callback-modal .mdm269-time-info{
  margin:10px 0 0;
  padding:11px 14px;
  border-left:3px solid var(--gold);
  border-radius:0 10px 10px 0;
  background:#faf7ef;
  color:#665f54;
}
.mdm256-callback-modal .mdm269-time-info p{
  margin:0;
  font-size:13px;
  line-height:1.45;
}
.mdm256-callback-modal .mdm269-time-info p + p{
  margin-top:3px;
}
.mdm256-callback-modal .mdm269-time-info strong{
  color:#2c2924;
}
@media(max-width:640px){
  .mdm256-callback-modal .mdm269-time-row{
    grid-template-columns:1fr;
    gap:7px;
    padding:12px;
  }
  .mdm256-callback-modal .mdm269-time-controls{
    grid-template-columns:minmax(0,1fr) 16px minmax(0,1fr);
    gap:8px;
  }
  .mdm256-callback-modal .mdm269-time-control select{
    min-height:52px;
    padding:11px 34px 11px 12px;
    font-size:16px;
  }
  .mdm256-callback-modal .mdm269-time-colon{
    height:52px;
    font-size:22px;
  }
  .mdm256-callback-modal .mdm269-time-info{
    padding:10px 12px;
  }
  .mdm256-callback-modal .mdm269-time-info p{
    font-size:12px;
  }
}


/* ==========================================================
 * V270 – Popup Field Alignment
 * Full-width field rhythm across the callback form.
 * ========================================================== */
.mdm256-callback-modal .wpcf7 form > .mdm259-field{
  grid-column:1 / -1 !important;
  width:100% !important;
  min-width:0;
}
.mdm256-callback-modal .wpcf7 form > .mdm259-field label,
.mdm256-callback-modal .wpcf7 form > .mdm259-field .wpcf7-form-control-wrap{
  width:100%;
}
.mdm256-callback-modal .wpcf7 form > .mdm259-field input[type="text"],
.mdm256-callback-modal .wpcf7 form > .mdm259-field input[type="tel"],
.mdm256-callback-modal .wpcf7 form > .mdm259-field input[type="email"],
.mdm256-callback-modal .wpcf7 form > .mdm259-field input[type="number"],
.mdm256-callback-modal .wpcf7 form > .mdm259-field textarea,
.mdm256-callback-modal .wpcf7 form > .mdm259-field select{
  width:100% !important;
  max-width:none !important;
}
.mdm256-callback-modal .mdm269-time-ui{
  width:100% !important;
  max-width:none !important;
}
.mdm256-callback-modal .mdm269-time-row,
.mdm256-callback-modal .mdm269-time-info{
  width:100%;
  max-width:none;
}

@media(min-width:641px){
  .mdm256-callback-modal .wpcf7 form{
    grid-template-columns:minmax(0,1fr) !important;
  }
  .mdm256-callback-modal .wpcf7 form > .mdm259-field,
  .mdm256-callback-modal .wpcf7 form > .mdm259-acceptance,
  .mdm256-callback-modal .wpcf7 form > .mdm259-submit,
  .mdm256-callback-modal .wpcf7 form > .wpcf7-response-output{
    grid-column:1 !important;
  }
}


/* ==========================================================
 * V271 – Success State 2.0
 * ========================================================== */
.mdm10-modal.mdm256-callback-modal.mdm271-sent{
  overflow:hidden;
}
.mdm271-sent .mdm256-callback-head,
.mdm271-sent .wpcf7{
  display:none !important;
}
.mdm271-success-state{
  min-height:500px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:54px 32px 42px;
  color:#202020;
}
.mdm271-success-kicker{
  margin:0 0 20px;
  color:#a8791e;
  font-size:13px;
  font-weight:900;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.mdm271-success-stamp{
  position:relative;
  width:132px;
  height:132px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 0 26px;
  border:6px solid #2f9e44;
  border-radius:50%;
  background:linear-gradient(145deg,#f6fff8 0%,#eaf8ee 100%);
  color:#2f9e44;
  box-shadow:0 18px 40px rgba(47,158,68,.18), inset 0 0 0 9px rgba(47,158,68,.07);
  animation:mdm271StampIn .62s cubic-bezier(.2,.9,.22,1.25) both;
}
.mdm271-success-stamp::after{
  content:'';
  position:absolute;
  inset:-15px;
  border:2px solid rgba(47,158,68,.2);
  border-radius:50%;
  animation:mdm271Pulse 1.2s .25s ease-out both;
}
.mdm271-success-check{
  display:block;
  font-size:72px;
  line-height:1;
  font-weight:900;
  transform:translateY(-2px);
  animation:mdm271CheckIn .35s .28s ease-out both;
}
.mdm271-success-title{
  margin:0;
  color:#172438;
  font-size:clamp(44px,7vw,66px);
  line-height:.95;
  font-weight:950;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.mdm271-success-rule{
  width:84px;
  height:3px;
  margin:22px 0 20px;
  border-radius:999px;
  background:var(--gold);
}
.mdm271-success-lead{
  margin:0 0 8px;
  color:#252525;
  font-size:20px;
  line-height:1.45;
  font-weight:800;
}
.mdm271-success-copy{
  max-width:460px;
  margin:0;
  color:#665f54;
  font-size:16px;
  line-height:1.65;
}
.mdm271-success-close{
  margin-top:30px;
  min-width:170px;
  min-height:50px;
  padding:13px 26px;
  border:0;
  border-radius:999px;
  background:#111;
  color:#fff;
  font:inherit;
  font-size:15px;
  font-weight:850;
  cursor:pointer;
  box-shadow:0 12px 28px rgba(17,17,17,.16);
  transition:transform .18s ease, background .18s ease, color .18s ease;
}
.mdm271-success-close:hover,
.mdm271-success-close:focus-visible{
  background:var(--gold);
  color:#111;
  transform:translateY(-1px);
  outline:none;
}
@keyframes mdm271StampIn{
  0%{opacity:0;transform:scale(.55) rotate(-7deg)}
  70%{opacity:1;transform:scale(1.05) rotate(1deg)}
  100%{opacity:1;transform:scale(1) rotate(0)}
}
@keyframes mdm271CheckIn{
  from{opacity:0;transform:translateY(-2px) scale(.5)}
  to{opacity:1;transform:translateY(-2px) scale(1)}
}
@keyframes mdm271Pulse{
  0%{opacity:.8;transform:scale(.82)}
  100%{opacity:0;transform:scale(1.18)}
}
@media(max-width:640px){
  .mdm271-success-state{
    min-height:430px;
    padding:48px 18px 34px;
  }
  .mdm271-success-stamp{
    width:106px;
    height:106px;
    border-width:5px;
    margin-bottom:22px;
  }
  .mdm271-success-check{font-size:58px;}
  .mdm271-success-title{font-size:42px;}
  .mdm271-success-lead{font-size:18px;}
  .mdm271-success-copy{font-size:15px;}
  .mdm271-success-close{width:100%;}
}
@media(prefers-reduced-motion:reduce){
  .mdm271-success-stamp,
  .mdm271-success-stamp::after,
  .mdm271-success-check{animation:none !important;}
}


/* ==========================================================
 * V272 – Success state close cleanup
 * ========================================================== */
.mdm10-modal.mdm256-callback-modal.mdm271-sent > .mdm10-modal-close{
  display:none !important;
}


/* ==========================================================
 * V273 – Success close cleanup, desktop + mobile
 * ========================================================== */
.mdm10-modal.mdm256-callback-modal.mdm271-sent .mdm10-modal-close,
.mdm10-modal.mdm256-callback-modal[data-mdm273-sent="1"] .mdm10-modal-close{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}


/* ==========================================================
   V274 – SEO Recovery 2.0: commercial internal-link paths
   ========================================================== */
.mdm274-seo-paths{
  width:100%;
  padding:8px 24px 34px;
  background:#fff;
}
.mdm274-seo-paths-inner{
  max-width:1180px;
  margin:0 auto;
}
.mdm274-seo-paths h2{
  margin:0 0 16px;
  text-align:center;
  font-size:clamp(24px,2.2vw,34px);
  line-height:1.12;
  color:#222;
}
.mdm274-seo-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
.mdm274-seo-card{
  display:flex;
  min-width:0;
  min-height:150px;
  flex-direction:column;
  align-items:flex-start;
  padding:20px;
  border:1px solid #e5dcc8;
  border-radius:16px;
  background:#fbf8f1;
  color:#222;
  text-decoration:none;
  box-shadow:0 8px 24px rgba(26,22,14,.05);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.mdm274-seo-card:hover,
.mdm274-seo-card:focus-visible{
  transform:translateY(-2px);
  border-color:#c6a25a;
  box-shadow:0 12px 30px rgba(26,22,14,.09);
}
.mdm274-seo-card strong{
  display:block;
  margin:0 0 8px;
  font-size:18px;
  line-height:1.2;
}
.mdm274-seo-card span{
  display:block;
  font-size:15px;
  line-height:1.45;
  color:#5b554b;
}
.mdm274-seo-card em{
  margin-top:auto;
  padding-top:14px;
  font-style:normal;
  font-weight:800;
  color:#8c681f;
}
@media(max-width:900px){
  .mdm274-seo-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:600px){
  .mdm274-seo-paths{padding:4px 16px 26px;}
  .mdm274-seo-grid{grid-template-columns:1fr;gap:10px;}
  .mdm274-seo-card{min-height:0;padding:17px 18px;}
}


/* V276 – American PVC quick delivery SEO callout */
.mdm276-quick-pvc{margin:18px 0 24px;padding:18px 20px;border:1px solid #e6d8b9;border-radius:16px;background:#fbf8f1;}
.mdm276-quick-pvc strong{display:block;font-size:1.08rem;margin-bottom:5px;}
.mdm276-quick-pvc p{margin:0 0 10px;line-height:1.55;}
.mdm276-quick-pvc a{display:inline-block;font-weight:800;color:#111;text-decoration:underline;text-underline-offset:3px;}

/* ==========================================================
   V282 – 4-up compact option grid
   - Max 4 val per rad på desktop/tablet
   - Automatiskt radbyte
   - Kompaktare bredd så grupper inte drar ut onödigt långt åt höger
   - Gäller format, färg, modell, plastfickor, tillbehör och tryck
   ========================================================== */
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations,
.single-product .mspc-wrapper.mspc-items-vertical .mspc-tab-content.mspc-variations,
.single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variations{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(150px, 170px)) !important;
  gap:18px 22px !important;
  justify-content:start !important;
  align-items:start !important;
  align-content:start !important;
  width:fit-content !important;
  max-width:100% !important;
  overflow:visible !important;
}

.single-product .mspc-wrapper .mspc-tab-content.mspc-variations .mspc-variation,
.single-product .mspc-wrapper.mspc-items-vertical .mspc-tab-content.mspc-variations .mspc-variation,
.single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variation{
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  flex:none !important;
  box-sizing:border-box !important;
  margin:0 !important;
}

.single-product .mspc-wrapper .mspc-tab-content.mspc-variations .mspc-attribute-image,
.single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variation img,
.single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variation .mspc-attribute-image{
  max-width:100% !important;
  height:auto !important;
}

.single-product .mspc-wrapper .mspc-tab-content.mspc-variations .mspc-text-wrapper,
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations .mspc-attribute-title,
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations .mspc-attribute-text,
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations .mspc-attribute-desc{
  width:100% !important;
}

/* Mellanstora skärmar: behåll 4 per rad men med lite smalare kort */
@media (max-width: 1180px){
  .single-product .mspc-wrapper .mspc-tab-content.mspc-variations,
  .single-product .mspc-wrapper.mspc-items-vertical .mspc-tab-content.mspc-variations,
  .single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variations{
    grid-template-columns:repeat(4, minmax(135px, 155px)) !important;
    gap:16px 18px !important;
  }
}

/* Tablet */
@media (max-width: 900px){
  .single-product .mspc-wrapper .mspc-tab-content.mspc-variations,
  .single-product .mspc-wrapper.mspc-items-vertical .mspc-tab-content.mspc-variations,
  .single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variations{
    grid-template-columns:repeat(3, minmax(130px, 1fr)) !important;
    width:100% !important;
    gap:14px 16px !important;
  }
}

/* Mobil */
@media (max-width: 767px){
  .single-product .mspc-wrapper .mspc-tab-content.mspc-variations,
  .single-product .mspc-wrapper.mspc-items-vertical .mspc-tab-content.mspc-variations,
  .single-product .summary.entry-summary .mspc-wrapper .mspc-content .mspc-variations{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    width:100% !important;
    gap:12px 12px !important;
  }
}

/* ==========================================================
   V283 – Forced 4-up MSPC grid
   JS sätter kolumnantalet efter att MSPC renderat färdigt.
   CSS här är fallback och styling för samma struktur.
   ========================================================== */
.single-product .mspc-wrapper{
  max-width:100% !important;
}
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm283-grid{
  display:grid !important;
  grid-auto-flow:row !important;
  align-items:start !important;
  align-content:start !important;
  justify-content:start !important;
  gap:16px 20px !important;
  max-width:100% !important;
  overflow:visible !important;
}
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm283-grid > .mspc-variation{
  box-sizing:border-box !important;
  min-width:0 !important;
  max-width:100% !important;
  width:100% !important;
  margin:0 !important;
  float:none !important;
}
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm283-grid > .mspc-variation .mspc-attribute-image,
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm283-grid > .mspc-variation img{
  max-width:100% !important;
  height:auto !important;
}

/* Låt själva konfiguratorn bli kompakt efter största gruppens 4-kolumnsbredd. */
.single-product .summary.entry-summary .mspc-wrapper.mdm283-wrapper{
  width:fit-content !important;
  max-width:100% !important;
  min-width:min(100%, 620px) !important;
}
.single-product .summary.entry-summary .mspc-wrapper.mdm283-wrapper .mspc-content,
.single-product .summary.entry-summary .mspc-wrapper.mdm283-wrapper .mspc-tab,
.single-product .summary.entry-summary .mspc-wrapper.mdm283-wrapper .mspc-menu-item{
  max-width:100% !important;
}

@media (max-width:900px){
  .single-product .summary.entry-summary .mspc-wrapper.mdm283-wrapper{
    width:100% !important;
    min-width:0 !important;
  }
}

/* ==========================================================
   V284 – Compact + click-safe MSPC option grid
   - 4 per row desktop, 3 tablet, 2 mobile
   - much tighter option spacing
   - wrapper shrink-wraps to the largest option group
   - clickable option nodes remain untouched by JS
   ========================================================== */
.single-product .summary.entry-summary .mspc-wrapper.mdm284-wrapper{
  width:fit-content !important;
  max-width:100% !important;
  min-width:0 !important;
}

.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm284-grid{
  display:grid !important;
  grid-auto-flow:row !important;
  grid-template-columns:repeat(4, 160px) !important;
  gap:12px 14px !important;
  justify-content:start !important;
  align-items:start !important;
  align-content:start !important;
  width:fit-content !important;
  max-width:100% !important;
  overflow:visible !important;
}

/* Undo V282/V283 child forcing; keep MSPC's native clickable element geometry. */
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm284-grid > .mspc-variation{
  width:auto !important;
  min-width:0 !important;
  max-width:160px !important;
  flex:none !important;
  float:none !important;
  margin:0 !important;
  box-sizing:border-box !important;
  pointer-events:auto !important;
  position:relative !important;
}

.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm284-grid > .mspc-variation *,
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm284-grid > .mspc-variation label,
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm284-grid > .mspc-variation input{
  pointer-events:auto;
}

.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm284-grid .mspc-attribute-image,
.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm284-grid img{
  max-width:100% !important;
  height:auto !important;
}

.single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm284-grid .mspc-text-wrapper{
  width:100% !important;
  margin-top:6px !important;
}

@media (max-width:900px){
  .single-product .summary.entry-summary .mspc-wrapper.mdm284-wrapper{
    width:100% !important;
  }
  .single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm284-grid{
    grid-template-columns:repeat(3, minmax(135px, 1fr)) !important;
    gap:12px !important;
    width:100% !important;
  }
  .single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm284-grid > .mspc-variation{
    max-width:none !important;
  }
}

@media (max-width:767px){
  .single-product .mspc-wrapper .mspc-tab-content.mspc-variations.mdm284-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:10px !important;
  }
}

/* ==========================================================
   V285 – Universal compact MSPC grid
   Träffar ALLA MSPC-valgrupper (.mspc-content .mspc-variations),
   även Format-grupper som saknar .mspc-tab-content.
   ========================================================== */
.single-product .mspc-wrapper .mspc-content .mspc-variations.mdm285-grid{
  display:grid !important;
  grid-template-columns:repeat(4,145px) !important;
  grid-auto-flow:row !important;
  gap:12px !important;
  justify-content:start !important;
  align-items:start !important;
  align-content:start !important;
  width:fit-content !important;
  max-width:100% !important;
  overflow:visible !important;
  padding-left:12px !important;
  padding-right:12px !important;
}

/* Pluginets gamla 20/25%-bredder får inte sprida korten över hela raden. */
.single-product .mspc-wrapper .mspc-content .mspc-variations.mdm285-grid > .mspc-variation{
  width:145px !important;
  min-width:145px !important;
  max-width:145px !important;
  margin:0 !important;
  float:none !important;
  flex:none !important;
  box-sizing:border-box !important;
}

.single-product .mspc-wrapper .mspc-content .mspc-variations.mdm285-grid > .mspc-variation .mspc-attribute-image,
.single-product .mspc-wrapper .mspc-content .mspc-variations.mdm285-grid > .mspc-variation img{
  max-width:100% !important;
  height:auto !important;
}

.single-product .mspc-wrapper .mspc-content .mspc-variations.mdm285-grid > .mspc-variation .mspc-text-wrapper{
  width:100% !important;
  margin-top:5px !important;
}

@media(max-width:900px){
  .single-product .mspc-wrapper .mspc-content .mspc-variations.mdm285-grid{
    grid-template-columns:repeat(3,140px) !important;
    gap:11px !important;
  }
  .single-product .mspc-wrapper .mspc-content .mspc-variations.mdm285-grid > .mspc-variation{
    width:140px !important;
    min-width:140px !important;
    max-width:140px !important;
  }
}

@media(max-width:767px){
  .single-product .mspc-wrapper .mspc-content .mspc-variations.mdm285-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    width:100% !important;
    gap:10px !important;
    padding-left:8px !important;
    padding-right:8px !important;
  }
  .single-product .mspc-wrapper .mspc-content .mspc-variations.mdm285-grid > .mspc-variation{
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
  }
}

/* ==========================================================
   V286 – Compact auto-width product options
   Desktop: max 4 per row, compact 150px cells, 10px column gap, 8px row gap.
   Wrapper follows the largest visible option group instead of filling the full summary width.
   Click handling remains MSPC-native.
   ========================================================== */
.single-product .mspc-wrapper.mdm286-wrapper{
  min-width:0 !important;
  box-sizing:border-box !important;
}

.single-product .mspc-wrapper .mspc-variations.mdm286-grid{
  display:grid !important;
  grid-auto-flow:row !important;
  justify-content:start !important;
  align-items:start !important;
  align-content:start !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  padding:10px !important;
  overflow:visible !important;
}

/* Remove old 20/25%-width and large vertical padding from option cards. */
.single-product .mspc-wrapper .mspc-variations.mdm286-grid > .mspc-variation{
  width:150px !important;
  min-width:0 !important;
  max-width:150px !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:8px 5px 6px !important;
  float:none !important;
  flex:none !important;
  box-sizing:border-box !important;
  position:relative !important;
}

.single-product .mspc-wrapper .mspc-variations.mdm286-grid > .mspc-variation .mspc-attribute-image,
.single-product .mspc-wrapper .mspc-variations.mdm286-grid > .mspc-variation img{
  max-width:100% !important;
  height:auto !important;
}

.single-product .mspc-wrapper .mspc-variations.mdm286-grid > .mspc-variation .mspc-text-wrapper{
  width:100% !important;
  margin-top:4px !important;
  line-height:1.25 !important;
}

@media(max-width:900px){
  .single-product .mspc-wrapper.mdm286-wrapper{
    width:100% !important;
    max-width:100% !important;
  }
  .single-product .mspc-wrapper .mspc-variations.mdm286-grid{
    padding:8px !important;
  }
  .single-product .mspc-wrapper .mspc-variations.mdm286-grid > .mspc-variation{
    width:138px !important;
    max-width:138px !important;
    padding:7px 4px 6px !important;
  }
}

@media(max-width:767px){
  .single-product .mspc-wrapper .mspc-variations.mdm286-grid{
    width:100% !important;
    padding:7px !important;
  }
  .single-product .mspc-wrapper .mspc-variations.mdm286-grid > .mspc-variation{
    width:auto !important;
    max-width:none !important;
    padding:7px 4px 5px !important;
  }
}

/* ==========================================================
   V287 – Native Product Options 1.0
   Egen WooCommerce-väljare. MSPC-frontend kan stängas av.
   ========================================================== */
body.single-product.mdm-native-product-options .mspc-wrapper,
body.single-product.mdm-native-product-options .mspc-accordion,
body.single-product.mdm-native-product-options form.variations_form table.variations{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.mdm287-native-options{
  width:100%;
  max-width:100%;
  margin:0 0 18px;
  border:1px solid #e4e4e4;
  background:#fff;
  font-family:Montserrat,Arial,sans-serif;
}

.mdm287-step + .mdm287-step{border-top:1px solid #e4e4e4;}

.mdm287-step-head{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  min-height:64px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  padding:15px 18px;
  border:0;
  border-radius:0;
  background:#fff;
  color:#222;
  text-align:left;
  cursor:pointer;
  font:inherit;
  font-size:21px;
  line-height:1.35;
}
.mdm287-step-head:hover{background:#fcfbf8;}
.mdm287-step-title{font-weight:800;}
.mdm287-step-value{font-weight:400;}
.mdm287-step-head[aria-expanded="true"]{background:#fff;}

.mdm287-step-panel{
  border-top:1px solid #e4e4e4;
  padding:22px 18px 24px;
  overflow:hidden;
}
.mdm287-step-panel[hidden]{display:none !important;}

.mdm287-options-grid{
  --mdm287-cols:4;
  display:grid;
  grid-template-columns:repeat(var(--mdm287-cols), 150px);
  gap:16px 18px;
  width:max-content;
  max-width:100%;
  align-items:start;
  justify-items:stretch;
}

.mdm287-option{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  width:150px;
  min-width:0;
  margin:0;
  padding:10px 8px 9px;
  border:2px solid transparent;
  border-radius:8px;
  background:#fff;
  color:#222;
  cursor:pointer;
  font:inherit;
  text-align:center;
  box-sizing:border-box;
  touch-action:manipulation;
}
.mdm287-option:hover{border-color:#e7dcc4;background:#fffdf9;}
.mdm287-option.is-selected{border-color:#c6a25a;background:#fffdf9;}
.mdm287-option:disabled,
.mdm287-option.is-unavailable{opacity:.32;cursor:not-allowed;}
.mdm287-option:focus-visible{outline:3px solid rgba(198,162,90,.28);outline-offset:2px;}

.mdm287-option-image{
  display:flex;
  align-items:center;
  justify-content:center;
  width:116px;
  height:116px;
  margin:0 auto 9px;
  overflow:hidden;
  border-radius:10px;
  background:#fff;
}
.mdm287-option-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}
.mdm287-option.no-image .mdm287-option-image{display:none;}
.mdm287-option.no-image{
  min-height:62px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:13px 10px;
  border-color:#e4e4e4;
}
.mdm287-option.no-image.is-selected{border-color:#c6a25a;}
.mdm287-option-label{
  display:block;
  font-size:16px;
  line-height:1.25;
  font-weight:700;
  overflow-wrap:anywhere;
}

.mdm287-reset-row{
  display:flex;
  justify-content:flex-end;
  margin:8px 0 18px;
}
.mdm287-reset{
  appearance:none;
  border:0;
  background:transparent;
  color:#5c149a;
  padding:0;
  font:inherit;
  font-size:18px;
  text-decoration:underline;
  text-underline-offset:2px;
  cursor:pointer;
}

/* Hide only Woo's built-in reset text; V287 supplies its own reset control. */
body.single-product.mdm-native-product-options form.variations_form .reset_variations{display:none !important;}

@media (max-width:1100px){
  .mdm287-options-grid{
    --mdm287-cols:3 !important;
    grid-template-columns:repeat(3, 145px);
    gap:14px 16px;
  }
  .mdm287-option{width:145px;}
}

@media (max-width:767px){
  .mdm287-step-head{min-height:56px;padding:13px 14px;font-size:18px;}
  .mdm287-step-panel{padding:16px 12px 18px;}
  .mdm287-options-grid{
    --mdm287-cols:2 !important;
    grid-template-columns:repeat(2, minmax(0,1fr));
    width:100%;
    gap:12px;
  }
  .mdm287-option{width:100%;padding:8px 6px;}
  .mdm287-option-image{width:min(110px,100%);height:105px;}
  .mdm287-option-label{font-size:14px;}
  .mdm287-reset{font-size:16px;}
}

/* ==========================================================
   V289 – Menydesign Configurator Style
   Bildreferens: varm vit premium-panel, numrerade steg, gulddetaljer,
   större fyrkantiga färgprover och tydlig vald-status.
   ========================================================== */
body.single-product.mdm-native-product-options{
  --mdm289-gold:#c6a25a;
  --mdm289-gold-soft:#f7f1e5;
  --mdm289-line:#e6e3dc;
  --mdm289-panel:#fff;
  --mdm289-warm:#fdfbf7;
  --mdm289-text:#202020;
  --mdm289-muted:#77736d;
}

.mdm289-configurator{
  border:0 !important;
  background:transparent !important;
  display:grid;
  gap:14px;
  margin:0 0 14px !important;
}

.mdm289-configurator .mdm287-step{
  border:1px solid var(--mdm289-line) !important;
  border-radius:14px;
  background:var(--mdm289-panel);
  overflow:hidden;
  box-shadow:0 4px 18px rgba(34,29,20,.035);
}
.mdm289-configurator .mdm287-step + .mdm287-step{border-top:1px solid var(--mdm289-line) !important;}

.mdm289-configurator .mdm287-step-head{
  min-height:70px;
  padding:13px 18px;
  display:grid;
  grid-template-columns:46px minmax(0,1fr) auto 20px;
  align-items:center;
  gap:14px;
  background:#fff;
  border:0;
  color:var(--mdm289-text);
  font-size:20px;
}
.mdm289-configurator .mdm287-step-head:hover{background:#fffdfa;}
.mdm289-configurator .mdm287-step-head[aria-expanded="true"]{background:#fff;}

.mdm289-step-number{
  width:42px;
  height:42px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#d0ae63,#b88d36);
  color:#fff;
  font-weight:800;
  font-size:18px;
  line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
.mdm289-step-main{min-width:0;}
.mdm289-configurator .mdm287-step-title{
  display:block;
  font-size:20px;
  font-weight:800;
  letter-spacing:-.01em;
}
.mdm289-configurator .mdm287-step-value{
  color:var(--mdm289-muted);
  font-size:17px;
  font-weight:500;
  white-space:nowrap;
}
.mdm289-chevron{
  width:12px;
  height:12px;
  border-right:2px solid #111;
  border-bottom:2px solid #111;
  transform:rotate(45deg) translateY(-2px);
  transform-origin:center;
  transition:transform .18s ease;
  justify-self:end;
}
.mdm287-step-head[aria-expanded="true"] .mdm289-chevron{
  transform:rotate(225deg) translate(-1px,-1px);
}

.mdm289-configurator .mdm287-step-panel{
  border-top:1px solid var(--mdm289-line);
  padding:18px 22px 22px;
  background:#fff;
}

.mdm289-configurator .mdm287-options-grid{
  display:grid;
  grid-template-columns:repeat(var(--mdm287-cols), minmax(138px, 1fr));
  gap:14px;
  width:100%;
  max-width:820px;
  align-items:stretch;
}

.mdm289-configurator .mdm287-option{
  width:100%;
  min-height:126px;
  padding:12px 10px 10px;
  border:1px solid #e4e3df;
  border-radius:10px;
  background:#fff;
  transition:border-color .15s ease,background .15s ease,box-shadow .15s ease,transform .15s ease;
}
.mdm289-configurator .mdm287-option:hover{
  border-color:#d8c7a1;
  background:#fffdf9;
  box-shadow:0 4px 14px rgba(58,43,17,.05);
}
.mdm289-configurator .mdm287-option.is-selected{
  border-color:var(--mdm289-gold);
  background:linear-gradient(180deg,#fffdf8,#fbf6eb);
  box-shadow:inset 0 0 0 1px rgba(198,162,90,.18);
}

/* Grundbild – format/modell/tillbehör */
.mdm289-configurator .mdm287-option-image{
  width:112px;
  height:98px;
  margin:0 auto 8px;
  border-radius:8px;
  background:transparent;
}
.mdm289-configurator .mdm287-option-image img{
  object-fit:contain;
}
.mdm289-configurator .mdm287-option-label{
  font-size:15px;
  font-weight:650;
  color:#1f1f1f;
}

/* Färg: större kvadratiska prover enligt vald design. */
.mdm289-configurator .mdm289-step-color .mdm287-option{
  min-height:170px;
  padding:11px 8px 10px;
}
.mdm289-configurator .mdm289-step-color .mdm287-option-image{
  width:132px;
  height:132px;
  aspect-ratio:1/1;
  border-radius:10px;
  margin-bottom:8px;
  background:#f6f5f2;
}
.mdm289-configurator .mdm289-step-color .mdm287-option-image img{
  width:100%;
  height:100%;
  object-fit:cover;
}

/* Format: håll illustrationerna luftiga utan att göra korten stora. */
.mdm289-configurator .mdm289-step-format .mdm287-option-image{
  width:94px;
  height:112px;
}

/* Tillbehör: tre val får breda, låga premiumkort. */
.mdm289-configurator .mdm289-step-accessory .mdm287-options-grid{
  max-width:760px;
}
.mdm289-configurator .mdm289-step-accessory .mdm287-option{
  min-height:132px;
}
.mdm289-configurator .mdm289-step-accessory .mdm287-option-image{
  width:118px;
  height:82px;
}

/* Textfallback om en migrerad bild ännu saknas. */
.mdm289-configurator .mdm287-option.no-image{
  min-height:92px;
  padding:16px 12px;
  background:#fff;
  border:1px solid #deddda;
}
.mdm289-configurator .mdm287-option.no-image.is-selected{
  border-color:var(--mdm289-gold);
  background:linear-gradient(180deg,#fffdf8,#fbf6eb);
}

.mdm287-reset-row{
  margin:4px 0 18px;
}
.mdm287-reset{
  color:#6a25a0;
  font-size:17px;
}

@media (max-width:1100px){
  .mdm289-configurator .mdm287-options-grid{
    grid-template-columns:repeat(var(--mdm287-cols), minmax(125px,1fr));
    max-width:720px;
  }
  .mdm289-configurator .mdm289-step-color .mdm287-option-image{
    width:122px;
    height:122px;
  }
}

@media (max-width:767px){
  .mdm289-configurator{gap:10px;}
  .mdm289-configurator .mdm287-step{border-radius:12px;}
  .mdm289-configurator .mdm287-step-head{
    min-height:62px;
    padding:10px 12px;
    grid-template-columns:38px minmax(0,1fr) auto 16px;
    gap:9px;
  }
  .mdm289-step-number{width:36px;height:36px;font-size:16px;}
  .mdm289-configurator .mdm287-step-title{font-size:17px;}
  .mdm289-configurator .mdm287-step-value{font-size:14px;max-width:120px;overflow:hidden;text-overflow:ellipsis;}
  .mdm289-configurator .mdm287-step-panel{padding:13px 12px 15px;}
  .mdm289-configurator .mdm287-options-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    max-width:none;
    gap:10px;
  }
  .mdm289-configurator .mdm287-option{min-height:112px;padding:9px 6px;}
  .mdm289-configurator .mdm287-option-image{width:96px;height:86px;}
  .mdm289-configurator .mdm289-step-color .mdm287-option{min-height:148px;}
  .mdm289-configurator .mdm289-step-color .mdm287-option-image{width:112px;height:112px;}
  .mdm289-configurator .mdm287-option-label{font-size:14px;}
}

/* ==========================================================
   V290 – Compact Configurator
   Samma design som V289, men ca 25–35 % mindre vertikal yta.
   Klickytor förblir tydliga och färgproverna är fortsatt kvadratiska.
   ========================================================== */
.mdm289-configurator{
  gap:9px !important;
  margin-bottom:10px !important;
}

.mdm289-configurator .mdm287-step{
  border-radius:12px !important;
  box-shadow:0 2px 10px rgba(34,29,20,.025) !important;
}

.mdm289-configurator .mdm287-step-head{
  min-height:54px !important;
  padding:8px 14px !important;
  grid-template-columns:36px minmax(0,1fr) auto 16px !important;
  gap:10px !important;
  font-size:17px !important;
}

.mdm289-step-number{
  width:34px !important;
  height:34px !important;
  font-size:15px !important;
}

.mdm289-configurator .mdm287-step-title{
  font-size:17px !important;
}

.mdm289-configurator .mdm287-step-value{
  font-size:15px !important;
}

.mdm289-chevron{
  width:10px !important;
  height:10px !important;
}

.mdm289-configurator .mdm287-step-panel{
  padding:12px 14px 14px !important;
}

.mdm289-configurator .mdm287-options-grid{
  grid-template-columns:repeat(var(--mdm287-cols), minmax(118px, 1fr)) !important;
  gap:9px !important;
  max-width:690px !important;
}

.mdm289-configurator .mdm287-option{
  min-height:94px !important;
  padding:7px 7px 6px !important;
  border-radius:9px !important;
}

.mdm289-configurator .mdm287-option-image{
  width:82px !important;
  height:70px !important;
  margin-bottom:5px !important;
}

.mdm289-configurator .mdm287-option-label{
  font-size:13.5px !important;
  line-height:1.15 !important;
}

/* Färgprover: fortfarande tydliga och kvadratiska, men mer kompakta. */
.mdm289-configurator .mdm289-step-color .mdm287-option{
  min-height:128px !important;
  padding:7px 6px 6px !important;
}
.mdm289-configurator .mdm289-step-color .mdm287-option-image{
  width:96px !important;
  height:96px !important;
  border-radius:9px !important;
  margin-bottom:5px !important;
}

/* Format – mindre kort/illustrationer så fem val inte bygger onödig höjd. */
.mdm289-configurator .mdm289-step-format .mdm287-option-image{
  width:72px !important;
  height:84px !important;
}
.mdm289-configurator .mdm289-step-format .mdm287-option{
  min-height:110px !important;
}

/* Tillbehör – kompaktare men med bilderna kvar tydliga. */
.mdm289-configurator .mdm289-step-accessory .mdm287-options-grid{
  max-width:610px !important;
}
.mdm289-configurator .mdm289-step-accessory .mdm287-option{
  min-height:100px !important;
}
.mdm289-configurator .mdm289-step-accessory .mdm287-option-image{
  width:88px !important;
  height:58px !important;
}

/* Textval utan bild ska inte bli höga. */
.mdm289-configurator .mdm287-option.no-image{
  min-height:66px !important;
  padding:10px 9px !important;
}

.mdm287-reset-row{
  margin:2px 0 10px !important;
}
.mdm287-reset{
  font-size:15px !important;
}

@media (max-width:1100px){
  .mdm289-configurator .mdm287-options-grid{
    max-width:640px !important;
    grid-template-columns:repeat(var(--mdm287-cols), minmax(110px,1fr)) !important;
    gap:8px !important;
  }
  .mdm289-configurator .mdm289-step-color .mdm287-option-image{
    width:90px !important;
    height:90px !important;
  }
}

@media (max-width:767px){
  .mdm289-configurator{gap:7px !important;}
  .mdm289-configurator .mdm287-step-head{
    min-height:50px !important;
    padding:7px 10px !important;
    grid-template-columns:32px minmax(0,1fr) auto 14px !important;
    gap:7px !important;
  }
  .mdm289-step-number{width:30px !important;height:30px !important;font-size:14px !important;}
  .mdm289-configurator .mdm287-step-title{font-size:16px !important;}
  .mdm289-configurator .mdm287-step-value{font-size:13px !important;max-width:105px !important;}
  .mdm289-configurator .mdm287-step-panel{padding:9px 9px 11px !important;}
  .mdm289-configurator .mdm287-options-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    max-width:none !important;
    gap:8px !important;
  }
  .mdm289-configurator .mdm287-option{min-height:92px !important;padding:7px 5px !important;}
  .mdm289-configurator .mdm287-option-image{width:78px !important;height:66px !important;}
  .mdm289-configurator .mdm289-step-color .mdm287-option{min-height:120px !important;}
  .mdm289-configurator .mdm289-step-color .mdm287-option-image{width:92px !important;height:92px !important;}
  .mdm289-configurator .mdm287-option-label{font-size:13px !important;}
}

/* ==========================================================
   V291 – Tight Rounded Option Frames
   - Bildramen följer själva valet i stället för ett stort tomt kort.
   - Färgproverna är 1 mm större än V290 och ramen ligger 1 mm utanför.
   - Samma rundade ramprincip används för format, färg, tillbehör och övriga bildval.
   - Klickytan är fortsatt hela knappen; bara den visuella ramen flyttas till bilden.
   ========================================================== */
.mdm289-configurator .mdm287-options-grid{
  justify-content:start !important;
  align-items:start !important;
}

/* Ta bort den stora synliga kort-ramen men behåll hela knappen som klickyta. */
.mdm289-configurator .mdm287-option,
.mdm289-configurator .mdm287-option:hover,
.mdm289-configurator .mdm287-option.is-selected{
  min-height:0 !important;
  padding:4px !important;
  border:0 !important;
  border-radius:14px !important;
  background:transparent !important;
  box-shadow:none !important;
  transform:none !important;
}

/* Gemensam liten bildram – samma formspråk på alla val. */
.mdm289-configurator .mdm287-option-image{
  box-sizing:content-box !important;
  padding:1mm !important;
  border:1px solid #e1dfda !important;
  border-radius:12px !important;
  background:#fff !important;
  overflow:hidden !important;
  transition:border-color .14s ease, background .14s ease, box-shadow .14s ease !important;
}

.mdm289-configurator .mdm287-option:hover .mdm287-option-image{
  border-color:#d7c49a !important;
  background:#fffdfa !important;
}

.mdm289-configurator .mdm287-option.is-selected .mdm287-option-image{
  border-color:var(--mdm289-gold) !important;
  background:#fffaf0 !important;
  box-shadow:0 0 0 1px rgba(198,162,90,.16) !important;
}

.mdm289-configurator .mdm287-option-label{
  margin-top:4px !important;
  font-weight:700 !important;
}
.mdm289-configurator .mdm287-option.is-selected .mdm287-option-label{
  color:#181818 !important;
}

/* Färg: 1 mm större prov än V290, med ram 1 mm runt själva färgrutan. */
.mdm289-configurator .mdm289-step-color .mdm287-option-image{
  width:calc(96px + 1mm) !important;
  height:calc(96px + 1mm) !important;
  aspect-ratio:1 / 1 !important;
  border-radius:12px !important;
  margin-bottom:0 !important;
}
.mdm289-configurator .mdm289-step-color .mdm287-option-image img{
  border-radius:9px !important;
}
.mdm289-configurator .mdm289-step-color .mdm287-option{
  min-height:0 !important;
  padding:4px !important;
}

/* Format: samma rundade bildram och tätare kort. */
.mdm289-configurator .mdm289-step-format .mdm287-option-image{
  width:72px !important;
  height:84px !important;
  border-radius:12px !important;
  margin-bottom:0 !important;
}
.mdm289-configurator .mdm289-step-format .mdm287-option{
  min-height:0 !important;
}

/* Tillbehör: samma ramprincip, men liggande bildyta. */
.mdm289-configurator .mdm289-step-accessory .mdm287-option-image{
  width:88px !important;
  height:58px !important;
  border-radius:12px !important;
  margin-bottom:0 !important;
}
.mdm289-configurator .mdm289-step-accessory .mdm287-option{
  min-height:0 !important;
}

/* Övriga bildval får samma rundade ram. */
.mdm289-configurator .mdm287-option-image img{
  border-radius:8px !important;
}

/* Textval utan bild behåller ett riktigt kompakt rundat kort. */
.mdm289-configurator .mdm287-option.no-image{
  min-height:54px !important;
  padding:8px 12px !important;
  border:1px solid #e1dfda !important;
  border-radius:12px !important;
  background:#fff !important;
}
.mdm289-configurator .mdm287-option.no-image:hover{
  border-color:#d7c49a !important;
  background:#fffdfa !important;
}
.mdm289-configurator .mdm287-option.no-image.is-selected{
  border-color:var(--mdm289-gold) !important;
  background:#fffaf0 !important;
  box-shadow:0 0 0 1px rgba(198,162,90,.14) !important;
}
.mdm289-configurator .mdm287-option.no-image .mdm287-option-image{
  display:none !important;
}

@media (max-width:1100px){
  .mdm289-configurator .mdm289-step-color .mdm287-option-image{
    width:calc(90px + 1mm) !important;
    height:calc(90px + 1mm) !important;
  }
}

@media (max-width:767px){
  .mdm289-configurator .mdm287-option{padding:3px !important;}
  .mdm289-configurator .mdm287-option-image{padding:0.8mm !important;border-radius:10px !important;}
  .mdm289-configurator .mdm289-step-color .mdm287-option-image{
    width:calc(92px + 1mm) !important;
    height:calc(92px + 1mm) !important;
    border-radius:10px !important;
  }
  .mdm289-configurator .mdm287-option-label{margin-top:3px !important;}
}

/* ==========================================================
   V292 – Tight Option Spacing + Selected State
   - 1–2 mm visuellt mellan valen (ca 6 px desktop, 5 px mindre skärmar)
   - inga 1fr-kolumner som drar isär valen
   - tydlig vald-status via både klass och aria-pressed
   - samma täta placering för format, färg, tillbehör, modell och tryck
   ========================================================== */
.mdm289-configurator .mdm287-options-grid{
  display:grid !important;
  grid-template-columns:repeat(var(--mdm287-cols), max-content) !important;
  column-gap:6px !important;
  row-gap:6px !important;
  width:max-content !important;
  max-width:100% !important;
  justify-content:start !important;
  justify-items:start !important;
  align-items:start !important;
}

/* Låt varje klickyta bara vara så bred som sitt faktiska val. */
.mdm289-configurator .mdm287-option{
  width:max-content !important;
  min-width:0 !important;
  max-width:none !important;
  padding:0 !important;
  margin:0 !important;
}

/* Vald-status: använd även aria-pressed så markeringen alltid syns direkt. */
.mdm289-configurator .mdm287-option.is-selected .mdm287-option-image,
.mdm289-configurator .mdm287-option[aria-pressed="true"] .mdm287-option-image{
  border-color:var(--mdm289-gold) !important;
  background:#fffaf0 !important;
  box-shadow:0 0 0 2px rgba(198,162,90,.20) !important;
}
.mdm289-configurator .mdm287-option.is-selected .mdm287-option-label,
.mdm289-configurator .mdm287-option[aria-pressed="true"] .mdm287-option-label{
  color:#171717 !important;
  font-weight:800 !important;
}

/* För textval utan bild: samma tydliga Menydesign-markering. */
.mdm289-configurator .mdm287-option.no-image{
  width:auto !important;
  min-width:92px !important;
  margin:0 !important;
}
.mdm289-configurator .mdm287-option.no-image.is-selected,
.mdm289-configurator .mdm287-option.no-image[aria-pressed="true"]{
  border-color:var(--mdm289-gold) !important;
  background:#fffaf0 !important;
  box-shadow:0 0 0 2px rgba(198,162,90,.18) !important;
}

@media (max-width:1100px){
  .mdm289-configurator .mdm287-options-grid{
    grid-template-columns:repeat(var(--mdm287-cols), max-content) !important;
    column-gap:5px !important;
    row-gap:5px !important;
    width:max-content !important;
    max-width:100% !important;
  }
}

@media (max-width:767px){
  .mdm289-configurator .mdm287-options-grid{
    --mdm287-cols:2 !important;
    grid-template-columns:repeat(2, max-content) !important;
    column-gap:5px !important;
    row-gap:5px !important;
    width:max-content !important;
    max-width:100% !important;
  }
  .mdm289-configurator .mdm287-option{
    width:max-content !important;
  }
}

/* ==========================================================
   V293 – Equal Option Cards + Auto Width
   - Samma visuella rutstorlek för format, färg, tillbehör och övriga bildval
   - 1–2 mm mellan valen
   - Konfiguratorn krymper efter det öppna stegets innehåll
   - Ingen stor tomyta till höger på desktop
   ========================================================== */
.mdm289-configurator{
  display:inline-grid !important;
  width:fit-content !important;
  max-width:100% !important;
  justify-items:stretch !important;
}

.mdm289-configurator .mdm287-step{
  width:100% !important;
  max-width:100% !important;
}

.mdm289-configurator .mdm287-step-panel{
  width:fit-content !important;
  max-width:100% !important;
}

.mdm289-configurator .mdm287-options-grid{
  display:grid !important;
  grid-template-columns:repeat(var(--mdm287-cols), 134px) !important;
  gap:7px !important;
  width:max-content !important;
  max-width:100% !important;
  justify-content:start !important;
  justify-items:center !important;
  align-items:start !important;
}

/* Alla val får samma klickyta/bredd inom konfiguratorn. */
.mdm289-configurator .mdm287-option,
.mdm289-configurator .mdm287-option.no-image{
  width:134px !important;
  min-width:134px !important;
  max-width:134px !important;
  min-height:0 !important;
  margin:0 !important;
  padding:3px !important;
  box-sizing:border-box !important;
  text-align:center !important;
}

/* Samma synliga bildram på alla bildbaserade val. */
.mdm289-configurator .mdm287-option-image,
.mdm289-configurator .mdm289-step-color .mdm287-option-image,
.mdm289-configurator .mdm289-step-format .mdm287-option-image,
.mdm289-configurator .mdm289-step-accessory .mdm287-option-image{
  width:106px !important;
  height:106px !important;
  aspect-ratio:1 / 1 !important;
  margin:0 auto !important;
  padding:1mm !important;
  box-sizing:content-box !important;
  border-radius:12px !important;
}

/* Färg fyller ramen, övriga bilder behåller hela motivet. */
.mdm289-configurator .mdm289-step-color .mdm287-option-image img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  border-radius:9px !important;
}
.mdm289-configurator .mdm289-step-format .mdm287-option-image img,
.mdm289-configurator .mdm289-step-accessory .mdm287-option-image img,
.mdm289-configurator .mdm287-option-image img{
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
}

.mdm289-configurator .mdm287-option-label{
  display:block !important;
  width:100% !important;
  margin-top:4px !important;
  line-height:1.12 !important;
  text-align:center !important;
  overflow-wrap:anywhere !important;
}

/* Textval utan bild använder samma kortbredd men lägre höjd. */
.mdm289-configurator .mdm287-option.no-image{
  min-height:54px !important;
  display:grid !important;
  place-items:center !important;
  padding:8px 10px !important;
}

@media (max-width:767px){
  .mdm289-configurator{
    display:grid !important;
    width:100% !important;
  }
  .mdm289-configurator .mdm287-step-panel{
    width:100% !important;
  }
  .mdm289-configurator .mdm287-options-grid{
    --mdm287-cols:2 !important;
    grid-template-columns:repeat(2, 126px) !important;
    gap:6px !important;
    width:max-content !important;
    max-width:100% !important;
  }
  .mdm289-configurator .mdm287-option,
  .mdm289-configurator .mdm287-option.no-image{
    width:126px !important;
    min-width:126px !important;
    max-width:126px !important;
  }
  .mdm289-configurator .mdm287-option-image,
  .mdm289-configurator .mdm289-step-color .mdm287-option-image,
  .mdm289-configurator .mdm289-step-format .mdm287-option-image,
  .mdm289-configurator .mdm289-step-accessory .mdm287-option-image{
    width:98px !important;
    height:98px !important;
  }
}


/* ==========================================================
   V294 – Right-aligned option groups, equal card width, smaller images
   - Hela öppna valgruppen ligger åt höger i steget
   - Själva valen ligger vänsterställda inne i gruppen
   - Alla valkort använder samma bredd inom konfiguratorn
   - Kortbredd sätts av längsta etiketten via JS-variabel
   - Bilder/ikoner ca 15 % mindre än V293
   - Tydligare visning av val i rubrikraden
   ========================================================== */
.mdm289-configurator{
  --mdm294-card-width: 124px;
  --mdm294-gap: 6px;
  --mdm294-image-size: 90px;
  --mdm294-color-size: 92px;
  --mdm294-format-image-width: 72px;
  --mdm294-format-image-height: 88px;
  --mdm294-accessory-image-width: 82px;
  --mdm294-accessory-image-height: 60px;
  display:grid !important;
  width:100% !important;
  max-width:100% !important;
  justify-items:stretch !important;
  gap:12px !important;
}

.mdm289-configurator .mdm287-step{
  width:100% !important;
  max-width:100% !important;
}

.mdm289-configurator .mdm287-step-head{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto auto !important;
  align-items:center !important;
  column-gap:16px !important;
  min-height:84px !important;
  padding:18px 22px !important;
}

.mdm289-step-number{
  width:46px !important;
  height:46px !important;
  font-size:20px !important;
}

.mdm289-configurator .mdm287-step-title{
  font-size:28px !important;
  font-weight:800 !important;
}

.mdm289-configurator .mdm287-step-value{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  min-height:40px !important;
  padding:6px 14px !important;
  border:1px solid #e7ddc8 !important;
  border-radius:999px !important;
  background:#fcfaf4 !important;
  color:#5c5344 !important;
  font-size:17px !important;
  line-height:1.2 !important;
  font-weight:700 !important;
  text-align:right !important;
}

.mdm289-configurator .mdm287-step-value:empty{
  display:none !important;
}

.mdm289-configurator .mdm287-step-head[aria-expanded="true"] .mdm287-step-value,
.mdm289-configurator .mdm287-step-head:hover .mdm287-step-value{
  border-color:#d8c28f !important;
  background:#fffaf0 !important;
  color:#433b2f !important;
}

.mdm289-configurator .mdm287-step-panel{
  width:100% !important;
  max-width:100% !important;
  padding:14px 20px 18px !important;
  display:flex !important;
  justify-content:flex-end !important;
  align-items:flex-start !important;
}

.mdm289-configurator .mdm287-options-grid{
  display:grid !important;
  grid-template-columns:repeat(var(--mdm287-cols), var(--mdm294-card-width)) !important;
  column-gap:var(--mdm294-gap) !important;
  row-gap:var(--mdm294-gap) !important;
  width:max-content !important;
  max-width:100% !important;
  justify-content:start !important;
  justify-items:stretch !important;
  align-items:start !important;
  margin-left:auto !important;
}

.mdm289-configurator .mdm287-option,
.mdm289-configurator .mdm287-option.no-image{
  width:var(--mdm294-card-width) !important;
  min-width:var(--mdm294-card-width) !important;
  max-width:var(--mdm294-card-width) !important;
  min-height:0 !important;
  margin:0 !important;
  padding:3px !important;
  box-sizing:border-box !important;
  text-align:center !important;
}

.mdm289-configurator .mdm287-option-image,
.mdm289-configurator .mdm289-step-color .mdm287-option-image{
  width:calc(var(--mdm294-color-size) + 1mm) !important;
  height:calc(var(--mdm294-color-size) + 1mm) !important;
  aspect-ratio:1 / 1 !important;
  margin:0 auto !important;
  padding:1mm !important;
  box-sizing:content-box !important;
  border-radius:14px !important;
}

.mdm289-configurator .mdm289-step-format .mdm287-option-image{
  width:var(--mdm294-format-image-width) !important;
  height:var(--mdm294-format-image-height) !important;
  aspect-ratio:auto !important;
  padding:0 !important;
  border-radius:12px !important;
}

.mdm289-configurator .mdm289-step-accessory .mdm287-option-image{
  width:var(--mdm294-accessory-image-width) !important;
  height:var(--mdm294-accessory-image-height) !important;
  aspect-ratio:auto !important;
  padding:0 !important;
  border-radius:12px !important;
}

.mdm289-configurator .mdm289-step-color .mdm287-option-image img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  border-radius:11px !important;
}

.mdm289-configurator .mdm289-step-format .mdm287-option-image img,
.mdm289-configurator .mdm289-step-accessory .mdm287-option-image img,
.mdm289-configurator .mdm287-option-image img{
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
}

.mdm289-configurator .mdm287-option-label{
  display:block !important;
  width:100% !important;
  margin-top:4px !important;
  line-height:1.12 !important;
  text-align:center !important;
  overflow-wrap:anywhere !important;
  font-size:15px !important;
  font-weight:800 !important;
}

.mdm289-configurator .mdm287-option.no-image{
  min-height:54px !important;
  display:grid !important;
  place-items:center !important;
  padding:10px 12px !important;
}

.mdm289-configurator .mdm287-option.is-selected .mdm287-option-image,
.mdm289-configurator .mdm287-option[aria-pressed="true"] .mdm287-option-image{
  border-color:var(--mdm289-gold) !important;
  background:#fffaf0 !important;
  box-shadow:0 0 0 2px rgba(198,162,90,.20) !important;
}

.mdm289-configurator .mdm287-option.is-selected .mdm287-option-label,
.mdm289-configurator .mdm287-option[aria-pressed="true"] .mdm287-option-label{
  color:#171717 !important;
  font-weight:800 !important;
}

.mdm289-configurator .mdm287-option.no-image.is-selected,
.mdm289-configurator .mdm287-option.no-image[aria-pressed="true"]{
  border-color:var(--mdm289-gold) !important;
  background:#fffaf0 !important;
  box-shadow:0 0 0 2px rgba(198,162,90,.18) !important;
}

@media (max-width:1100px){
  .mdm289-configurator{
    --mdm294-card-width: 118px;
    --mdm294-image-size: 84px;
    --mdm294-color-size: 86px;
    --mdm294-format-image-width: 68px;
    --mdm294-format-image-height: 82px;
    --mdm294-accessory-image-width: 78px;
    --mdm294-accessory-image-height: 56px;
  }
  .mdm289-configurator .mdm287-step-head{
    min-height:76px !important;
    padding:16px 18px !important;
    column-gap:14px !important;
  }
  .mdm289-step-number{width:42px !important;height:42px !important;font-size:18px !important;}
  .mdm289-configurator .mdm287-step-title{font-size:24px !important;}
  .mdm289-configurator .mdm287-step-value{font-size:16px !important;padding:5px 12px !important;}
  .mdm289-configurator .mdm287-step-panel{padding:12px 16px 16px !important;}
}

@media (max-width:767px){
  .mdm289-configurator{
    --mdm294-card-width: 120px;
    --mdm294-gap: 5px;
    --mdm294-image-size: 80px;
    --mdm294-color-size: 82px;
    --mdm294-format-image-width: 64px;
    --mdm294-format-image-height: 76px;
    --mdm294-accessory-image-width: 72px;
    --mdm294-accessory-image-height: 52px;
    gap:9px !important;
  }
  .mdm289-configurator .mdm287-step-head{
    min-height:66px !important;
    padding:12px 14px !important;
    column-gap:10px !important;
  }
  .mdm289-step-number{width:36px !important;height:36px !important;font-size:16px !important;}
  .mdm289-configurator .mdm287-step-title{font-size:18px !important;}
  .mdm289-configurator .mdm287-step-value{font-size:14px !important;padding:4px 10px !important;}
  .mdm289-configurator .mdm287-step-panel{padding:10px 12px 12px !important;justify-content:center !important;}
  .mdm289-configurator .mdm287-options-grid{
    --mdm287-cols:2 !important;
    grid-template-columns:repeat(2, var(--mdm294-card-width)) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .mdm289-configurator .mdm287-option,
  .mdm289-configurator .mdm287-option.no-image{
    width:var(--mdm294-card-width) !important;
    min-width:var(--mdm294-card-width) !important;
    max-width:var(--mdm294-card-width) !important;
  }
  .mdm289-configurator .mdm287-option-label{font-size:14px !important;}
}


/* ==========================================================
   V295 – Corrected right-side layout
   User intent:
   - Hela konfiguratorblocket ska ligga till höger på desktop.
   - Bredden får inte hoppa när steg med 2/3/4 val öppnas.
   - Valen i respektive rad börjar från vänster INOM sin grupp.
   - Själva gruppen i den öppna panelen ligger mot höger.
   - Alla valkort använder samma globala kortbredd.
   - Bilder cirka 15 % mindre än V293; format något mindre igen.
   ========================================================== */
body.single-product.mdm-native-product-options form.variations_form{
  --mdm295-config-width: 620px;
}

body.single-product.mdm-native-product-options .mdm289-configurator{
  --mdm295-card-width: 124px;
  --mdm295-gap: 7px;
  width:var(--mdm295-config-width) !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:0 !important;
  display:grid !important;
  justify-items:stretch !important;
}

/* Alla tre accordionrader behåller exakt samma bredd oavsett öppet steg. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step{
  width:100% !important;
  max-width:none !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-head{
  width:100% !important;
  grid-template-columns:auto minmax(0,1fr) auto auto !important;
}

/* Valt-värdet ska synas tydligt direkt i rubrikraden. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-value{
  color:#24211c !important;
  font-weight:800 !important;
  background:#fbf6eb !important;
  border:1px solid #dcc58f !important;
  border-radius:999px !important;
  padding:6px 12px !important;
  white-space:nowrap !important;
  box-shadow:inset 0 0 0 1px rgba(198,162,90,.08) !important;
}
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-value:empty{
  display:none !important;
}

/* Panelen är fullbredd men valgruppen skjuts till höger. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-panel{
  width:100% !important;
  max-width:none !important;
  display:flex !important;
  justify-content:flex-end !important;
  align-items:flex-start !important;
  padding:14px 18px 18px !important;
}

/* Gridens egen bredd följer antal val per rad. Innehållet i raden börjar från vänster. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-options-grid{
  display:grid !important;
  grid-template-columns:repeat(var(--mdm287-cols), var(--mdm295-card-width)) !important;
  column-gap:var(--mdm295-gap) !important;
  row-gap:var(--mdm295-gap) !important;
  width:max-content !important;
  max-width:100% !important;
  justify-content:start !important;
  justify-items:stretch !important;
  align-items:start !important;
  margin-left:auto !important;
  margin-right:0 !important;
}

/* Gemensam kortbredd – samma oavsett format/färg/tillbehör och antal på raden. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option,
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option.no-image{
  width:var(--mdm295-card-width) !important;
  min-width:var(--mdm295-card-width) !important;
  max-width:var(--mdm295-card-width) !important;
  box-sizing:border-box !important;
}

/* Cirka 15 % mindre bildyta jämfört med V293. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option-image,
body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-color .mdm287-option-image{
  width:90px !important;
  height:90px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Format ska kännas som den mindre tidigare versionen. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-format .mdm287-option-image{
  width:72px !important;
  height:86px !important;
  padding:0 !important;
  aspect-ratio:auto !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-accessory .mdm287-option-image{
  width:82px !important;
  height:60px !important;
  padding:0 !important;
  aspect-ratio:auto !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option-label{
  width:100% !important;
  text-align:center !important;
  font-weight:800 !important;
}

/* Reset följer samma högersida som konfiguratorn. */
body.single-product.mdm-native-product-options form.variations_form .mdm287-reset-row{
  width:var(--mdm295-config-width) !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:0 !important;
  text-align:right !important;
}

@media (max-width:767px){
  body.single-product.mdm-native-product-options form.variations_form{
    --mdm295-config-width: 100%;
  }
  body.single-product.mdm-native-product-options .mdm289-configurator{
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    --mdm295-card-width: 120px;
    --mdm295-gap:5px;
  }
  body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-panel{
    justify-content:center !important;
    padding:10px 12px 12px !important;
  }
  body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-options-grid{
    --mdm287-cols:2 !important;
    grid-template-columns:repeat(2,var(--mdm295-card-width)) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  body.single-product.mdm-native-product-options form.variations_form .mdm287-reset-row{
    width:100% !important;
  }
}

body.single-product.mdm-native-product-options .mdm295-selected-prefix{
  color:#9d7427;
  font-weight:800;
}
body.single-product.mdm-native-product-options .mdm295-selected-name{
  color:#201d18;
  font-weight:900;
}


/* ==========================================================
   V296 – Tight right-anchored configurator
   - outer configurator should sit almost flush to the right side of the summary
   - all cards keep one shared width
   - groups stay right aligned, but cards inside each row start from the left
   - images reduced ~15% and format icons kept smaller
   ========================================================== */
body.single-product.mdm-native-product-options form.variations_form{
  --mdm296-edge-gap: 6px;
  --mdm295-gap: 6px;
  width:100% !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  row-gap:14px !important;
  align-items:start !important;
}

body.single-product.mdm-native-product-options form.variations_form > .mdm287-native-options,
body.single-product.mdm-native-product-options form.variations_form > .mdm287-reset-row{
  justify-self:end !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator{
  --mdm295-card-width: 118px;
  width:min(var(--mdm296-config-width, var(--mdm295-config-width)), calc(100% - var(--mdm296-edge-gap))) !important;
  max-width:calc(100% - var(--mdm296-edge-gap)) !important;
  margin-left:auto !important;
  margin-right:0 !important;
  justify-self:end !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step{
  width:100% !important;
  max-width:none !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-head{
  width:100% !important;
  min-height:60px !important;
  padding:14px 16px !important;
  grid-template-columns:auto minmax(0,1fr) auto auto !important;
  column-gap:8px !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-title{
  text-transform:none !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-value{
  display:inline-flex !important;
  align-items:center !important;
  gap:4px !important;
  color:#8f6a24 !important;
  font-weight:900 !important;
  background:#fff8e8 !important;
  border:1px solid #d7b76f !important;
  border-radius:999px !important;
  padding:5px 10px !important;
  white-space:nowrap !important;
  box-shadow:inset 0 0 0 1px rgba(215,183,111,.18) !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-value:empty{
  display:none !important;
}

body.single-product.mdm-native-product-options .mdm295-selected-prefix{
  color:#9d7427 !important;
  font-weight:800 !important;
}
body.single-product.mdm-native-product-options .mdm295-selected-name{
  color:#1d1b18 !important;
  font-weight:900 !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-panel{
  width:100% !important;
  max-width:none !important;
  display:flex !important;
  justify-content:flex-end !important;
  align-items:flex-start !important;
  padding:12px 10px 14px 16px !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-options-grid{
  display:grid !important;
  grid-template-columns:repeat(var(--mdm287-cols), var(--mdm295-card-width)) !important;
  column-gap:var(--mdm295-gap) !important;
  row-gap:var(--mdm295-gap) !important;
  width:max-content !important;
  max-width:100% !important;
  justify-content:start !important;
  justify-items:stretch !important;
  align-items:start !important;
  margin-left:auto !important;
  margin-right:0 !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option,
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option.no-image{
  width:var(--mdm295-card-width) !important;
  min-width:var(--mdm295-card-width) !important;
  max-width:var(--mdm295-card-width) !important;
  padding:3px !important;
  border-radius:12px !important;
  box-sizing:border-box !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option-image,
body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-color .mdm287-option-image{
  width:76px !important;
  height:76px !important;
  padding:0.9mm !important;
  border-radius:12px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-format .mdm287-option-image{
  width:60px !important;
  height:74px !important;
  padding:0 !important;
  aspect-ratio:auto !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-accessory .mdm287-option-image{
  width:68px !important;
  height:52px !important;
  padding:0 !important;
  aspect-ratio:auto !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option-label{
  width:100% !important;
  margin-top:3px !important;
  text-align:center !important;
  font-weight:800 !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option.is-selected .mdm287-option-image,
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option[aria-pressed="true"] .mdm287-option-image{
  box-shadow:0 0 0 1px #c6a25a inset !important;
}

body.single-product.mdm-native-product-options form.variations_form .mdm287-reset-row{
  width:min(var(--mdm296-config-width, var(--mdm295-config-width)), calc(100% - var(--mdm296-edge-gap))) !important;
  max-width:calc(100% - var(--mdm296-edge-gap)) !important;
  margin-left:auto !important;
  margin-right:0 !important;
  justify-self:end !important;
  text-align:right !important;
}

@media (max-width:767px){
  body.single-product.mdm-native-product-options form.variations_form{
    --mdm296-edge-gap: 0px;
    --mdm295-gap: 5px;
  }

  body.single-product.mdm-native-product-options .mdm289-configurator,
  body.single-product.mdm-native-product-options form.variations_form .mdm287-reset-row{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    justify-self:stretch !important;
  }

  body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-panel{
    justify-content:center !important;
    padding:10px 8px 12px !important;
  }

  body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-options-grid{
    margin-left:auto !important;
    margin-right:auto !important;
  }

  body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option,
  body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option.no-image{
    width:112px !important;
    min-width:112px !important;
    max-width:112px !important;
  }

  body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option-image,
  body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-color .mdm287-option-image{
    width:68px !important;
    height:68px !important;
  }

  body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-format .mdm287-option-image{
    width:56px !important;
    height:68px !important;
  }

  body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-accessory .mdm287-option-image{
    width:60px !important;
    height:46px !important;
  }
}


/* ==========================================================
   V297 – Compact Product Focus
   Målet är att produkten ska dominera – konfiguratorn ska vara
   kompakt, tydlig och sekundär.
   ========================================================== */

/* Desktop: större produktbild, kompakt högerspalt nära högerkant. */
@media (min-width:1101px){
  body.single-product .mdm-product-top,
  body.single-product .woocommerce div.product .mdm-product-top,
  body.single-product div.product .mdm-product-top{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 470px !important;
    gap:28px !important;
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    align-items:start !important;
  }

  body.single-product .mdm-product-top > .mdm-simple-gallery,
  body.single-product .mdm-product-top > .woocommerce-product-gallery,
  body.single-product .woocommerce div.product > .images,
  body.single-product div.product > .images{
    width:100% !important;
    max-width:780px !important;
    min-width:0 !important;
    justify-self:start !important;
  }

  body.single-product .mdm-product-top > .summary,
  body.single-product .mdm-product-top > .summary.entry-summary,
  body.single-product .summary.entry-summary{
    width:470px !important;
    max-width:470px !important;
    min-width:0 !important;
    justify-self:end !important;
    margin:0 !important;
  }
}

/* Titel + pris ligger som en tydlig topp ovanför valen, i samma kolumnbredd. */
body.single-product .summary.entry-summary .product_title,
body.single-product .summary.entry-summary h1.product_title{
  width:100% !important;
  max-width:100% !important;
  margin:0 0 8px !important;
  font-size:34px !important;
  line-height:1.08 !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
}

body.single-product .summary.entry-summary > .price,
body.single-product .summary.entry-summary > p.price{
  width:100% !important;
  margin:0 0 16px !important;
  font-size:25px !important;
  line-height:1.2 !important;
  font-weight:500 !important;
}

/* Woo-variationsform ska inte bli en gigantisk flexrad. */
body.single-product.mdm-native-product-options form.variations_form,
body.single-product.mdm-native-product-options form.variations_form.cart{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
}

/* Konfiguratorn använder hela den kompakta högerspalten – inte mer. */
body.single-product.mdm-native-product-options .mdm289-configurator{
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  display:grid !important;
  gap:7px !important;
  border:0 !important;
  background:transparent !important;
  --mdm295-card-width:108px;
  --mdm295-gap:5px;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step{
  width:100% !important;
  border:1px solid #e5e1d9 !important;
  border-radius:12px !important;
  overflow:hidden !important;
  background:#fff !important;
}
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step + .mdm287-step{
  border-top:1px solid #e5e1d9 !important;
}

/* Betydligt lägre rubrikrader och mindre text. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-head{
  min-height:50px !important;
  padding:8px 11px !important;
  display:grid !important;
  grid-template-columns:32px minmax(0,1fr) auto 18px !important;
  column-gap:8px !important;
  align-items:center !important;
  border:0 !important;
  background:#fff !important;
}

body.single-product.mdm-native-product-options .mdm289-step-number{
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  font-size:15px !important;
  line-height:32px !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-title{
  font-size:18px !important;
  line-height:1.15 !important;
  font-weight:800 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-value{
  min-height:0 !important;
  padding:3px 7px !important;
  font-size:13px !important;
  line-height:1.15 !important;
  font-weight:800 !important;
  border-radius:999px !important;
  white-space:nowrap !important;
  background:#fff8e8 !important;
  border:1px solid #d9bd7c !important;
  box-shadow:none !important;
}

body.single-product.mdm-native-product-options .mdm289-chevron{
  width:10px !important;
  height:10px !important;
}

/* Ta bort den stora fria ytan i öppna steg. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-panel{
  width:100% !important;
  padding:8px 8px 10px !important;
  display:flex !important;
  justify-content:flex-start !important;
  align-items:flex-start !important;
  border-top:1px solid #eeeae2 !important;
  overflow:hidden !important;
}

/* Alla val har samma fasta bredd – antal val ändrar inte kortstorleken. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-options-grid{
  display:grid !important;
  grid-template-columns:repeat(var(--mdm287-cols),108px) !important;
  gap:5px !important;
  width:max-content !important;
  max-width:100% !important;
  margin:0 !important;
  justify-content:start !important;
  justify-items:stretch !important;
  align-items:start !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option,
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option.no-image{
  width:108px !important;
  min-width:108px !important;
  max-width:108px !important;
  min-height:0 !important;
  margin:0 !important;
  padding:2px !important;
  border-radius:10px !important;
  box-sizing:border-box !important;
}

/* Färgstorleken från V296 behålls – Format och Tillbehör får nu samma visuella bildyta. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option-image,
body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-color .mdm287-option-image,
body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-format .mdm287-option-image,
body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-accessory .mdm287-option-image{
  width:76px !important;
  height:76px !important;
  aspect-ratio:1/1 !important;
  margin:0 auto !important;
  padding:0.8mm !important;
  border-radius:10px !important;
  box-sizing:content-box !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-color .mdm287-option-image img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  border-radius:8px !important;
}
body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-format .mdm287-option-image img,
body.single-product.mdm-native-product-options .mdm289-configurator .mdm289-step-accessory .mdm287-option-image img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  border-radius:7px !important;
}

body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option-label{
  width:100% !important;
  margin-top:2px !important;
  font-size:13px !important;
  line-height:1.1 !important;
  font-weight:800 !important;
  text-align:center !important;
}

/* Vald ruta tydlig men inte klumpig. */
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option.is-selected .mdm287-option-image,
body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-option[aria-pressed="true"] .mdm287-option-image{
  border-color:#c6a25a !important;
  box-shadow:0 0 0 1px #c6a25a !important;
  background:#fffaf0 !important;
}

/* Reset diskret mellan val och köp. */
body.single-product.mdm-native-product-options form.variations_form .mdm287-reset-row{
  width:100% !important;
  max-width:100% !important;
  margin:6px 0 8px !important;
  text-align:right !important;
}
body.single-product.mdm-native-product-options form.variations_form .mdm287-reset{
  font-size:13px !important;
}

/* Antal + köp under valen med exakt samma totalbredd som valdelen. */
body.single-product.mdm-native-product-options .single_variation_wrap,
body.single-product.mdm-native-product-options .woocommerce-variation-add-to-cart,
body.single-product.mdm-native-product-options .woocommerce-variation-add-to-cart.variations_button{
  width:100% !important;
  max-width:100% !important;
}

body.single-product.mdm-native-product-options .woocommerce-variation-add-to-cart,
body.single-product.mdm-native-product-options .woocommerce-variation-add-to-cart.variations_button{
  display:grid !important;
  grid-template-columns:76px minmax(0,1fr) !important;
  gap:9px !important;
  align-items:stretch !important;
  margin-top:0 !important;
}

body.single-product.mdm-native-product-options form.cart .quantity,
body.single-product.mdm-native-product-options .woocommerce-variation-add-to-cart .quantity{
  width:76px !important;
  min-width:76px !important;
  max-width:76px !important;
  margin:0 !important;
}
body.single-product.mdm-native-product-options form.cart .quantity .qty,
body.single-product.mdm-native-product-options .woocommerce-variation-add-to-cart .quantity .qty{
  width:76px !important;
  height:50px !important;
  min-height:50px !important;
  border-radius:10px !important;
  font-size:17px !important;
}

/* Köpknappen ska vara Menydesign-guld. */
body.single-product.mdm-native-product-options form.cart .single_add_to_cart_button,
body.single-product.mdm-native-product-options .woocommerce-variation-add-to-cart .single_add_to_cart_button{
  width:100% !important;
  height:50px !important;
  min-height:50px !important;
  margin:0 !important;
  border:1px solid #b78e3d !important;
  border-radius:10px !important;
  background:#c6a25a !important;
  color:#17130d !important;
  font-size:16px !important;
  font-weight:900 !important;
  letter-spacing:.4px !important;
  box-shadow:none !important;
}
body.single-product.mdm-native-product-options form.cart .single_add_to_cart_button:hover,
body.single-product.mdm-native-product-options .woocommerce-variation-add-to-cart .single_add_to_cart_button:hover{
  background:#b99449 !important;
  color:#111 !important;
}

@media (max-width:1100px){
  body.single-product .summary.entry-summary .product_title,
  body.single-product .summary.entry-summary h1.product_title{
    font-size:30px !important;
  }
  body.single-product.mdm-native-product-options .mdm289-configurator{
    width:100% !important;
  }
}

@media (max-width:767px){
  body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-options-grid{
    --mdm287-cols:2 !important;
    grid-template-columns:repeat(2,108px) !important;
    gap:5px !important;
  }
  body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-title{
    font-size:17px !important;
  }
  body.single-product.mdm-native-product-options .mdm289-configurator .mdm287-step-value{
    max-width:135px !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
}


/* V298 marker – final product-page overrides live in assets/css/overrides.css, loaded after style.css. */


/* ==========================================================
   V301 – Image sharpness + commercial notes below cart
   - Do not upscale a ~500x500 product image beyond 500 CSS px.
   - Keep the commercial volume/delivery text directly below the
     add-to-cart row, separated by a calm horizontal rule.
   ========================================================== */
@media (min-width:781px){
  body.single-product.mdm-native-product-options .mdm-product-top > .mdm-simple-gallery{
    width:100% !important;
    max-width:none !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
  }

  body.single-product.mdm-native-product-options .mdm-simple-gallery .mdm-main-image{
    width:100% !important;
    max-width:100% !important;
    min-height:0 !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
    overflow:visible !important;
  }

  body.single-product.mdm-native-product-options .mdm-simple-gallery .mdm-main-image img,
  body.single-product.mdm-native-product-options #mdm-main-product-image{
    width:auto !important;
    height:auto !important;
    max-width:min(100%, 500px) !important;
    max-height:500px !important;
    object-fit:contain !important;
    image-rendering:auto !important;
  }
}

body.single-product .summary.entry-summary .mdm301-order-notes{
  width:100% !important;
  margin:18px 0 0 !important;
  padding:16px 0 0 !important;
  border-top:1px solid #ddd8cf !important;
  color:#2b2926 !important;
  font-size:14px !important;
  line-height:1.5 !important;
}

body.single-product .summary.entry-summary .mdm301-order-notes p{
  margin:0 !important;
}

body.single-product .summary.entry-summary .mdm301-order-notes .mdm301-volume-note{
  margin-bottom:12px !important;
}

body.single-product .summary.entry-summary .mdm301-order-notes strong{
  font-weight:800 !important;
}

body.single-product .summary.entry-summary .mdm301-order-notes .mdm301-delivery-note{
  color:#e31d1a !important;
  font-weight:500 !important;
}

@media (max-width:780px){
  body.single-product .summary.entry-summary .mdm301-order-notes{
    margin-top:14px !important;
    padding-top:14px !important;
    font-size:13px !important;
  }
}


/* ==========================================================
   Build 318 – mobile homepage font optimization
   On narrow homepage viewports, use the native system font stack so the
   first render does not wait for Montserrat and no webfont swap can move
   the hero text. Desktop homepage and product pages keep Montserrat.
   ========================================================== */
@media (max-width: 780px){
  body.home,
  body.home .hero,
  body.home .hero h1,
  body.home .hero h2,
  body.home .hero p,
  body.home .slide,
  body.home .slide h1,
  body.home .slide h2,
  body.home .slide p,
  body.home .intro,
  body.home .intro h2,
  body.home .intro p,
  body.home .puff-grid,
  body.home .puff-grid *{
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  }
}


/* ==========================================================
   Build 319 – deferred mobile category-image wrapper
   Preserve the existing cat-media/image dimensions when the img is wrapped
   in picture for viewport-triggered mobile loading.
   ========================================================== */
.mdm319-category-picture{
  display:block;
  width:100%;
  height:100%;
}
.mdm319-category-picture > img{
  width:100%;
  height:100%;
}
