/* Raven Mega Menu 0.10.0 */
:root {
  --rmm-desktop-width: 88vw;
  --rmm-desktop-max: 1200px;
  --rmm-wide-width: 84vw;
  --rmm-wide-max: 1500px;
  --rmm-ultrawide-width: 80vw;
  --rmm-ultrawide-max: 1900px;
  --rmm-gap: 28px;
  --rmm-pad-x: 32px;
  --rmm-pad-y: 30px;
  --rmm-radius: 0px;
  --rmm-shadow: 0 18px 55px rgba(0,0,0,.16);
  --rmm-bg: #fff;
  --rmm-text: #202124;
  --rmm-muted: #6b6f76;
  --rmm-border: rgba(0,0,0,.09);
  --rmm-soft: rgba(0,0,0,.035);
}

.rmm-menu { box-sizing: border-box; }
.rmm-menu *, .rmm-menu *::before, .rmm-menu *::after { box-sizing: border-box; }

.rmm-global {
  position: fixed;
  inset: 0;
  z-index: 999999;
  visibility: hidden;
  pointer-events: none;
}
.rmm-global.rmm-open { visibility: visible; pointer-events: auto; }

.rmm-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(12,15,18,.22);
  opacity: 0;
  backdrop-filter: blur(1px);
  transition: opacity .2s ease;
}
.rmm-open .rmm-backdrop { opacity: 1; }

.rmm-shell {
  position: absolute;
  background: var(--rmm-bg);
  color: var(--rmm-text);
  box-shadow: var(--rmm-shadow);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.rmm-close {
  position: absolute;
  right: 14px;
  top: 10px;
  z-index: 3;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 999px;
  background: rgba(0,0,0,.04);
  color: inherit;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}
.rmm-close:hover { background: rgba(0,0,0,.08); }

.rmm-columns {
  display: grid;
  gap: var(--rmm-gap);
  align-items: start;
}

.rmm-section { min-width: 0; }
.rmm-heading-row { display: flex; align-items: center; gap: 8px; }
.rmm-heading {
  display: block;
  flex: 1 1 auto;
  margin: 0 0 11px;
  color: var(--rmm-text);
  text-decoration: none;
  text-transform: uppercase;
  font-size: 15px;
  line-height: 1.25;
  font-weight: 750;
  letter-spacing: .025em;
}
.rmm-list { list-style: none; margin: 0; padding: 0; }
.rmm-item { margin: 0; padding: 0; }
.rmm-link {
  display: block;
  padding: 4px 0;
  color: var(--rmm-text);
  text-decoration: none;
  font-size: 14px;
  line-height: 1.35;
}
.rmm-heading:hover, .rmm-link:hover { opacity: .62; }
.rmm-level-2, .rmm-level-3, .rmm-level-4 { margin: 3px 0 5px 12px; }
.rmm-level-2 .rmm-link, .rmm-level-3 .rmm-link, .rmm-level-4 .rmm-link { font-size: 13px; color: var(--rmm-muted); }

.rmm-section-image { display: none; }
.rmm-section-toggle {
  display: none;
  position: relative;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  cursor: pointer;
}
.rmm-section-toggle span::before,
.rmm-section-toggle span::after {
  content: '';
  position: absolute;
  left: 9px;
  top: 14px;
  width: 12px;
  height: 1.5px;
  background: currentColor;
  transition: transform .18s ease;
}
.rmm-section-toggle span::after { transform: rotate(90deg); }
.rmm-section-open .rmm-section-toggle span::after { transform: rotate(0deg); }

/* Shared wide positioning. Keep the actual site header/logo outside the overlay. */
.rmm-template-wide-grid .rmm-backdrop,
.rmm-template-wide-clean .rmm-backdrop,
.rmm-template-wide-dense .rmm-backdrop,
.rmm-template-wide-editorial .rmm-backdrop,
.rmm-template-wide-cards .rmm-backdrop,
.rmm-template-wide-showcase .rmm-backdrop,
.rmm-template-wide-lines .rmm-backdrop {
  top: var(--rmm-top, 90px);
}

.rmm-template-wide-grid .rmm-shell,
.rmm-template-wide-clean .rmm-shell,
.rmm-template-wide-dense .rmm-shell,
.rmm-template-wide-editorial .rmm-shell,
.rmm-template-wide-cards .rmm-shell,
.rmm-template-wide-showcase .rmm-shell,
.rmm-template-wide-lines .rmm-shell {
  top: var(--rmm-top, 90px);
  left: 50%;
  width: min(calc(100vw - 32px), var(--rmm-desktop-width), var(--rmm-desktop-max));
  max-height: calc(100vh - var(--rmm-top, 90px) - 18px);
  transform: translate(-50%, -10px) scale(.995);
  transform-origin: top center;
  opacity: 0;
  transition: transform .2s ease, opacity .18s ease;
}
.rmm-open.rmm-template-wide-grid .rmm-shell,
.rmm-open.rmm-template-wide-clean .rmm-shell,
.rmm-open.rmm-template-wide-dense .rmm-shell,
.rmm-open.rmm-template-wide-editorial .rmm-shell,
.rmm-open.rmm-template-wide-cards .rmm-shell,
.rmm-open.rmm-template-wide-showcase .rmm-shell,
.rmm-open.rmm-template-wide-lines .rmm-shell {
  transform: translate(-50%, 0) scale(1);
  opacity: 1;
}

/* 1 – balanced grid */
.rmm-template-wide-grid { --rmm-min-col: 185px; }
.rmm-template-wide-grid .rmm-shell {
  padding: var(--rmm-pad-y) var(--rmm-pad-x);
  border-top: 1px solid var(--rmm-border);
}

/* 2 – minimal */
.rmm-template-wide-clean { --rmm-min-col: 220px; }
.rmm-template-wide-clean .rmm-shell { padding: 40px 46px; }
.rmm-template-wide-clean .rmm-columns { gap: 44px; }
.rmm-template-wide-clean .rmm-heading { font-size: 16px; margin-bottom: 15px; letter-spacing: .045em; }
.rmm-template-wide-clean .rmm-link { padding: 5px 0; }

/* 3 – dense */
.rmm-template-wide-dense { --rmm-min-col: 150px; }
.rmm-template-wide-dense .rmm-shell { padding: 22px 26px; }
.rmm-template-wide-dense .rmm-columns { gap: 20px; }
.rmm-template-wide-dense .rmm-heading { font-size: 13px; margin-bottom: 8px; }
.rmm-template-wide-dense .rmm-link { font-size: 13px; padding: 3px 0; }
.rmm-template-wide-dense .rmm-level-2 .rmm-link { font-size: 12px; }

/* 4 – editorial */
.rmm-template-wide-editorial { --rmm-min-col: 205px; }
.rmm-template-wide-editorial .rmm-shell { padding: 38px 42px 42px; border-radius: 0 0 18px 18px; }
.rmm-template-wide-editorial .rmm-columns { gap: 34px 42px; }
.rmm-template-wide-editorial .rmm-section { padding-top: 14px; border-top: 2px solid var(--rmm-text); }
.rmm-template-wide-editorial .rmm-heading { font-size: 20px; text-transform: none; letter-spacing: -.02em; margin-bottom: 14px; }
.rmm-template-wide-editorial .rmm-link { padding: 5px 0; color: #3e4248; }

/* 5 – cards with Woo category image */
.rmm-template-wide-cards { --rmm-min-col: 210px; --rmm-gap: 18px; }
.rmm-template-wide-cards .rmm-shell { padding: 28px; background: #f6f7f8; border-radius: 0 0 18px 18px; }
.rmm-template-wide-cards .rmm-section {
  height: 100%;
  padding: 14px 16px 18px;
  border: 1px solid var(--rmm-border);
  border-radius: 14px;
  background: #fff;
}
.rmm-template-wide-cards .rmm-section-image {
  display: block;
  width: 100%;
  aspect-ratio: 16/7;
  margin: -6px 0 15px;
  border-radius: 9px;
  overflow: hidden;
  background: #eceeef;
}
.rmm-template-wide-cards .rmm-section-image img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s ease; }
.rmm-template-wide-cards .rmm-section-image:hover img { transform: scale(1.025); }
.rmm-template-wide-cards .rmm-heading { font-size: 14px; }
.rmm-template-wide-cards .rmm-link { font-size: 13px; }

/* 6 – first category featured */
.rmm-template-wide-showcase { --rmm-min-col: 190px; }
.rmm-template-wide-showcase .rmm-shell { padding: 30px; border-radius: 0 0 18px 18px; }
.rmm-template-wide-showcase .rmm-columns { grid-auto-flow: row; }
.rmm-template-wide-showcase .rmm-featured-section {
  padding: 22px;
  border-radius: 14px;
  background: var(--rmm-text);
  color: #fff;
}
.rmm-template-wide-showcase .rmm-featured-section .rmm-heading,
.rmm-template-wide-showcase .rmm-featured-section .rmm-link,
.rmm-template-wide-showcase .rmm-featured-section .rmm-level-2 .rmm-link,
.rmm-template-wide-showcase .rmm-featured-section .rmm-level-3 .rmm-link { color: #fff; }
.rmm-template-wide-showcase .rmm-featured-section .rmm-section-image {
  display: block;
  margin: -10px -10px 18px;
  aspect-ratio: 16/8;
  border-radius: 9px;
  overflow: hidden;
}
.rmm-template-wide-showcase .rmm-featured-section .rmm-section-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rmm-template-wide-showcase .rmm-featured-section .rmm-heading { font-size: 19px; text-transform: none; }
.rmm-template-wide-showcase .rmm-section:not(.rmm-featured-section) { padding: 10px 0; }

/* 7 – Scandinavian lines */
.rmm-template-wide-lines { --rmm-min-col: 180px; }
.rmm-template-wide-lines .rmm-shell { padding: 34px 28px; }
.rmm-template-wide-lines .rmm-columns { gap: 0; }
.rmm-template-wide-lines .rmm-section { padding: 0 24px; border-left: 1px solid var(--rmm-border); }
.rmm-template-wide-lines .rmm-section:first-child { border-left: 0; }
.rmm-template-wide-lines .rmm-heading { font-size: 14px; letter-spacing: .06em; }
.rmm-template-wide-lines .rmm-link { padding: 5px 0; }

/* Responsive desktop tiers. Extra sections always wrap automatically. */
@media (min-width: 1025px) and (max-width: 1439px) {
  .rmm-template-wide-grid .rmm-shell,
  .rmm-template-wide-clean .rmm-shell,
  .rmm-template-wide-dense .rmm-shell,
  .rmm-template-wide-editorial .rmm-shell,
  .rmm-template-wide-cards .rmm-shell,
  .rmm-template-wide-showcase .rmm-shell,
  .rmm-template-wide-lines .rmm-shell {
    width: min(calc(100vw - 32px), var(--rmm-desktop-width), var(--rmm-desktop-max));
  }

  .rmm-cols-desktop-auto .rmm-columns { grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--rmm-min-col, 185px)), 1fr)); }
  .rmm-cols-desktop-2 .rmm-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rmm-cols-desktop-3 .rmm-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rmm-cols-desktop-4 .rmm-columns { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .rmm-cols-desktop-5 .rmm-columns { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .rmm-cols-desktop-6 .rmm-columns { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .rmm-cols-desktop-7 .rmm-columns { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .rmm-cols-desktop-8 .rmm-columns { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .rmm-cols-desktop-9 .rmm-columns { grid-template-columns: repeat(9, minmax(0, 1fr)); }
  .rmm-cols-desktop-10 .rmm-columns { grid-template-columns: repeat(10, minmax(0, 1fr)); }
  .rmm-template-wide-showcase.rmm-cols-desktop-auto .rmm-featured-section { grid-column: span 2; }
}

@media (min-width: 1440px) and (max-width: 1919px) {
  .rmm-template-wide-grid .rmm-shell,
  .rmm-template-wide-clean .rmm-shell,
  .rmm-template-wide-dense .rmm-shell,
  .rmm-template-wide-editorial .rmm-shell,
  .rmm-template-wide-cards .rmm-shell,
  .rmm-template-wide-showcase .rmm-shell,
  .rmm-template-wide-lines .rmm-shell {
    width: min(calc(100vw - 40px), var(--rmm-wide-width), var(--rmm-wide-max));
  }

  .rmm-cols-wide-auto .rmm-columns { grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--rmm-min-col, 185px)), 1fr)); }
  .rmm-cols-wide-2 .rmm-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rmm-cols-wide-3 .rmm-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rmm-cols-wide-4 .rmm-columns { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .rmm-cols-wide-5 .rmm-columns { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .rmm-cols-wide-6 .rmm-columns { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .rmm-cols-wide-7 .rmm-columns { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .rmm-cols-wide-8 .rmm-columns { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .rmm-cols-wide-9 .rmm-columns { grid-template-columns: repeat(9, minmax(0, 1fr)); }
  .rmm-cols-wide-10 .rmm-columns { grid-template-columns: repeat(10, minmax(0, 1fr)); }
  .rmm-template-wide-showcase.rmm-cols-wide-auto .rmm-featured-section { grid-column: span 2; }
}

@media (min-width: 1920px) {
  .rmm-template-wide-grid .rmm-shell,
  .rmm-template-wide-clean .rmm-shell,
  .rmm-template-wide-dense .rmm-shell,
  .rmm-template-wide-editorial .rmm-shell,
  .rmm-template-wide-cards .rmm-shell,
  .rmm-template-wide-showcase .rmm-shell,
  .rmm-template-wide-lines .rmm-shell {
    width: min(calc(100vw - 48px), var(--rmm-ultrawide-width), var(--rmm-ultrawide-max));
  }

  .rmm-cols-ultrawide-auto .rmm-columns { grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--rmm-min-col, 185px)), 1fr)); }
  .rmm-cols-ultrawide-2 .rmm-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rmm-cols-ultrawide-3 .rmm-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rmm-cols-ultrawide-4 .rmm-columns { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .rmm-cols-ultrawide-5 .rmm-columns { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .rmm-cols-ultrawide-6 .rmm-columns { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .rmm-cols-ultrawide-7 .rmm-columns { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .rmm-cols-ultrawide-8 .rmm-columns { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .rmm-cols-ultrawide-9 .rmm-columns { grid-template-columns: repeat(9, minmax(0, 1fr)); }
  .rmm-cols-ultrawide-10 .rmm-columns { grid-template-columns: repeat(10, minmax(0, 1fr)); }
  .rmm-template-wide-showcase.rmm-cols-ultrawide-auto .rmm-featured-section { grid-column: span 2; }
}

/* Left panel shared */
.rmm-template-left-panel-light .rmm-shell,
.rmm-template-left-panel-dark .rmm-shell {
  top: 0;
  left: 0;
  width: min(480px, 92vw);
  height: 100vh;
  padding: 58px 28px 34px;
  transform: translateX(-102%);
  transition: transform .24s cubic-bezier(.22,.61,.36,1);
}
.rmm-open.rmm-template-left-panel-light .rmm-shell,
.rmm-open.rmm-template-left-panel-dark .rmm-shell { transform: translateX(0); }
.rmm-template-left-panel-light .rmm-columns,
.rmm-template-left-panel-dark .rmm-columns { grid-template-columns: 1fr; gap: 0; }
.rmm-template-left-panel-light .rmm-section,
.rmm-template-left-panel-dark .rmm-section { padding: 13px 0; border-bottom: 1px solid var(--rmm-border); }
.rmm-template-left-panel-light .rmm-heading,
.rmm-template-left-panel-dark .rmm-heading { margin: 0; font-size: 16px; text-transform: none; letter-spacing: 0; }

.rmm-template-left-panel-dark { --rmm-bg: #151719; --rmm-text: #f6f7f8; --rmm-muted: #aeb3ba; --rmm-border: rgba(255,255,255,.12); }
.rmm-template-left-panel-dark .rmm-backdrop { background: rgba(0,0,0,.42); }
.rmm-template-left-panel-dark .rmm-close { background: rgba(255,255,255,.08); }

/* Left panel section behavior */
.rmm-template-left-panel-light.rmm-sections-hover .rmm-section-toggle,
.rmm-template-left-panel-light.rmm-sections-click .rmm-section-toggle,
.rmm-template-left-panel-dark.rmm-sections-hover .rmm-section-toggle,
.rmm-template-left-panel-dark.rmm-sections-click .rmm-section-toggle { display: block; }

.rmm-template-left-panel-light.rmm-sections-hover .rmm-section-body,
.rmm-template-left-panel-light.rmm-sections-click .rmm-section-body,
.rmm-template-left-panel-dark.rmm-sections-hover .rmm-section-body,
.rmm-template-left-panel-dark.rmm-sections-click .rmm-section-body {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows .2s ease, opacity .18s ease, margin .2s ease;
}
.rmm-template-left-panel-light.rmm-sections-hover .rmm-section-body > *,
.rmm-template-left-panel-light.rmm-sections-click .rmm-section-body > *,
.rmm-template-left-panel-dark.rmm-sections-hover .rmm-section-body > *,
.rmm-template-left-panel-dark.rmm-sections-click .rmm-section-body > * { overflow: hidden; }

.rmm-template-left-panel-light.rmm-sections-hover .rmm-section-open .rmm-section-body,
.rmm-template-left-panel-light.rmm-sections-click .rmm-section-open .rmm-section-body,
.rmm-template-left-panel-dark.rmm-sections-hover .rmm-section-open .rmm-section-body,
.rmm-template-left-panel-dark.rmm-sections-click .rmm-section-open .rmm-section-body {
  grid-template-rows: 1fr;
  opacity: 1;
  margin-top: 9px;
}

/* Inline mode */
.rmm-inline { position: relative; visibility: visible; pointer-events: auto; }
.rmm-inline .rmm-backdrop, .rmm-inline .rmm-close { display: none; }
.rmm-inline .rmm-shell { position: relative; inset: auto; width: 100%; max-height: none; transform: none !important; opacity: 1 !important; box-shadow: none; padding: 0; }
.rmm-inline .rmm-columns { grid-template-columns: repeat(4, minmax(0,1fr)); }

/* Tablet/mobile: robust off-canvas; hover section mode becomes click via JS */
@media (max-width: 1024px) {
  .rmm-template-wide-grid .rmm-backdrop,
  .rmm-template-wide-clean .rmm-backdrop,
  .rmm-template-wide-dense .rmm-backdrop,
  .rmm-template-wide-editorial .rmm-backdrop,
  .rmm-template-wide-cards .rmm-backdrop,
  .rmm-template-wide-showcase .rmm-backdrop,
  .rmm-template-wide-lines .rmm-backdrop { top: 0; }

  .rmm-global .rmm-shell,
  .rmm-template-wide-grid .rmm-shell,
  .rmm-template-wide-clean .rmm-shell,
  .rmm-template-wide-dense .rmm-shell,
  .rmm-template-wide-editorial .rmm-shell,
  .rmm-template-wide-cards .rmm-shell,
  .rmm-template-wide-showcase .rmm-shell,
  .rmm-template-wide-lines .rmm-shell,
  .rmm-template-left-panel-light .rmm-shell,
  .rmm-template-left-panel-dark .rmm-shell {
    top: 0;
    left: 0;
    width: min(580px, 94vw);
    height: 100vh;
    max-height: none;
    padding: 58px 26px 32px;
    border-radius: 0;
    transform: translateX(-102%);
    opacity: 1;
  }
  .rmm-open .rmm-shell { transform: translateX(0); }
  .rmm-columns,
  .rmm-template-wide-grid .rmm-columns,
  .rmm-template-wide-clean .rmm-columns,
  .rmm-template-wide-dense .rmm-columns,
  .rmm-template-wide-editorial .rmm-columns,
  .rmm-template-wide-cards .rmm-columns,
  .rmm-template-wide-showcase .rmm-columns,
  .rmm-template-wide-lines .rmm-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 22px; }
  .rmm-template-wide-lines .rmm-section { border-left: 0; border-bottom: 1px solid var(--rmm-border); padding: 0 0 18px; }
  .rmm-template-wide-showcase .rmm-featured-section { grid-column: span 2; }
}

@media (max-width: 900px) and (orientation: portrait) {
  .rmm-columns { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 767px) and (orientation: landscape) {
  .rmm-global .rmm-shell { width: min(640px, 96vw); }
  .rmm-columns { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 567px) and (orientation: portrait) {
  .rmm-global .rmm-shell { width: 94vw; padding: 56px 22px 28px; }
  .rmm-columns { grid-template-columns: 1fr; gap: 22px; }
  .rmm-section { padding-bottom: 14px; border-bottom: 1px solid var(--rmm-border); }
  .rmm-template-wide-showcase .rmm-featured-section { grid-column: auto; }
  .rmm-template-wide-cards .rmm-section { padding: 13px 14px 16px; }
}

body.rmm-lock { overflow: hidden; }

/* ===== v0.5.0: close rail, full-image category cards, new card templates, configurable contrast panel ===== */

/* Close control gets its own rail, so it never sits on top of a category heading. */
.rmm-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-height: 32px;
  margin: 0 0 8px;
  position: relative;
  z-index: 4;
}
.rmm-close {
  position: static;
  width: 32px;
  height: 32px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 32px;
  border: 1px solid var(--rmm-border);
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  color: var(--rmm-text);
  box-shadow: 0 5px 16px rgba(0,0,0,.08);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  backdrop-filter: blur(8px);
  transition: transform .16s ease, background .16s ease, box-shadow .16s ease;
}
.rmm-close span { transform: translateY(-1px); }
.rmm-close:hover {
  background: #fff;
  transform: translateY(-1px);
  box-shadow: 0 7px 20px rgba(0,0,0,.12);
}
.rmm-inline .rmm-toolbar { display: none; }

/* Kategorikort: preserve the full WooCommerce image. Height controls image size,
   while width adapts naturally without cropping. */
.rmm-template-wide-cards .rmm-section-image,
.rmm-template-wide-cards-air .rmm-section-image,
.rmm-template-wide-cards-gallery .rmm-section-image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: var(--rmm-card-image-height, 150px);
  aspect-ratio: auto;
  overflow: hidden;
}
.rmm-template-wide-cards .rmm-section-image img,
.rmm-template-wide-cards-air .rmm-section-image img,
.rmm-template-wide-cards-gallery .rmm-section-image img {
  display: block;
  width: auto;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}
.rmm-template-wide-cards .rmm-section-image:hover img,
.rmm-template-wide-cards-air .rmm-section-image:hover img,
.rmm-template-wide-cards-gallery .rmm-section-image:hover img {
  transform: scale(1.015);
}

/* Card alternative A: Air – soft surfaces, generous whitespace, full image. */
.rmm-template-wide-cards-air {
  --rmm-min-col: 215px;
  --rmm-gap: 20px;
}
.rmm-template-wide-cards-air .rmm-shell {
  background: #eef2f4;
  border: 1px solid rgba(36,45,52,.06);
  border-radius: 0 0 24px 24px;
  padding: 24px 26px 30px;
}
.rmm-template-wide-cards-air .rmm-section {
  height: 100%;
  padding: 12px 14px 18px;
  border: 1px solid rgba(32,40,47,.07);
  border-radius: 20px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 8px 26px rgba(28,38,46,.065);
}
.rmm-template-wide-cards-air .rmm-section-image {
  margin: 0 0 15px;
  padding: 10px;
  border-radius: 14px;
  background: linear-gradient(145deg,#f8fafb,#e9eef1);
}
.rmm-template-wide-cards-air .rmm-heading {
  margin-bottom: 10px;
  font-size: 15px;
  letter-spacing: .01em;
}
.rmm-template-wide-cards-air .rmm-link { font-size: 13px; padding: 4px 0; }

/* Card alternative B: Gallery – image-first framed cards with calm editorial text. */
.rmm-template-wide-cards-gallery {
  --rmm-min-col: 225px;
  --rmm-gap: 22px;
}
.rmm-template-wide-cards-gallery .rmm-shell {
  background: #fff;
  border-radius: 0 0 20px 20px;
  padding: 26px 28px 34px;
}
.rmm-template-wide-cards-gallery .rmm-section {
  height: 100%;
  padding: 0 0 16px;
  border: 1px solid rgba(31,37,42,.12);
  border-radius: 18px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 5px 18px rgba(20,26,31,.045);
}
.rmm-template-wide-cards-gallery .rmm-section-image {
  margin: 0 0 16px;
  padding: 12px;
  border-radius: 0;
  border-bottom: 1px solid rgba(31,37,42,.08);
  background: #f5f5f2;
}
.rmm-template-wide-cards-gallery .rmm-heading-row,
.rmm-template-wide-cards-gallery .rmm-section-body {
  margin-left: 17px;
  margin-right: 17px;
}
.rmm-template-wide-cards-gallery .rmm-heading {
  font-size: 17px;
  text-transform: none;
  letter-spacing: -.015em;
  margin-bottom: 11px;
}
.rmm-template-wide-cards-gallery .rmm-link { font-size: 13px; padding: 4px 0; color: #41484e; }

/* New card templates use the same wide dropdown positioning as the other wide templates. */
@media (min-width: 1025px) {
  .rmm-template-wide-cards-air .rmm-backdrop,
  .rmm-template-wide-cards-gallery .rmm-backdrop {
    top: var(--rmm-top, 90px);
  }
  .rmm-template-wide-cards-air .rmm-shell,
  .rmm-template-wide-cards-gallery .rmm-shell {
    top: var(--rmm-top, 90px);
    left: 50%;
    width: min(calc(100vw - 32px), var(--rmm-desktop-width), var(--rmm-desktop-max));
    max-height: calc(100vh - var(--rmm-top, 90px) - 18px);
    transform: translate(-50%, -10px) scale(.995);
    transform-origin: top center;
    opacity: 0;
    transition: transform .2s ease, opacity .18s ease;
  }
  .rmm-open.rmm-template-wide-cards-air .rmm-shell,
  .rmm-open.rmm-template-wide-cards-gallery .rmm-shell {
    transform: translate(-50%, 0) scale(1);
    opacity: 1;
  }
}

@media (min-width: 1440px) and (max-width: 1919px) {
  .rmm-template-wide-cards-air .rmm-shell,
  .rmm-template-wide-cards-gallery .rmm-shell {
    width: min(calc(100vw - 40px), var(--rmm-wide-width), var(--rmm-wide-max));
  }
}
@media (min-width: 1920px) {
  .rmm-template-wide-cards-air .rmm-shell,
  .rmm-template-wide-cards-gallery .rmm-shell {
    width: min(calc(100vw - 48px), var(--rmm-ultrawide-width), var(--rmm-ultrawide-max));
  }
}

/* Contrast panel now uses a palette generated from the admin setting. */
.rmm-template-left-panel-dark {
  --rmm-bg: var(--rmm-panel-bg, #2b3035);
  --rmm-text: var(--rmm-panel-text, #f7f8f9);
  --rmm-muted: var(--rmm-panel-muted, rgba(255,255,255,.70));
  --rmm-border: var(--rmm-panel-border, rgba(255,255,255,.13));
}
.rmm-template-left-panel-dark .rmm-shell { background: var(--rmm-panel-bg, #2b3035); }
.rmm-template-left-panel-dark .rmm-close {
  background: var(--rmm-panel-close-bg, rgba(255,255,255,.10));
  color: var(--rmm-panel-text, #f7f8f9);
  border-color: var(--rmm-panel-border, rgba(255,255,255,.13));
  box-shadow: none;
}
.rmm-template-left-panel-dark .rmm-close:hover { filter: brightness(1.08); }

/* Left-panel spacing now accounts for the close rail instead of an absolutely overlaid X. */
.rmm-template-left-panel-light .rmm-shell,
.rmm-template-left-panel-dark .rmm-shell {
  padding-top: 18px;
}

@media (max-width: 1024px) {
  .rmm-template-wide-cards-air .rmm-backdrop,
  .rmm-template-wide-cards-gallery .rmm-backdrop { top: 0; }

  .rmm-global .rmm-shell,
  .rmm-template-wide-cards-air .rmm-shell,
  .rmm-template-wide-cards-gallery .rmm-shell {
    top: 0;
    left: 0;
    width: min(580px, 94vw);
    height: 100vh;
    max-height: none;
    padding-top: 18px;
    border-radius: 0;
    transform: translateX(-102%);
    opacity: 1;
  }
  .rmm-open .rmm-shell { transform: translateX(0); }
  .rmm-template-wide-cards-air .rmm-columns,
  .rmm-template-wide-cards-gallery .rmm-columns {
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 24px 20px;
  }
}

@media (max-width: 567px) and (orientation: portrait) {
  .rmm-global .rmm-shell { padding-top: 16px; }
  .rmm-template-wide-cards-air .rmm-columns,
  .rmm-template-wide-cards-gallery .rmm-columns { grid-template-columns: 1fr; }
  .rmm-template-wide-cards-air .rmm-section,
  .rmm-template-wide-cards-gallery .rmm-section { padding-bottom: 15px; }
}

/* ===== v0.6.0: compact floating close button + optional clean card images ===== */
/* The close control is now a small floating corner control instead of a full
   toolbar row. This removes the large dead space above the first category row. */
.rmm-toolbar {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 12;
  min-height: 0;
  margin: 0;
  padding: 0;
  pointer-events: none;
}
.rmm-toolbar .rmm-close {
  pointer-events: auto;
  width: 24px;
  height: 24px;
  flex-basis: 24px;
  border-radius: 999px;
  font-size: 18px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 4px 13px rgba(0,0,0,.09);
}
.rmm-toolbar .rmm-close:hover {
  transform: translateY(-1px) scale(1.02);
}

/* Card templates no longer receive any extra top spacing from the X control. */
.rmm-template-wide-cards .rmm-shell,
.rmm-template-wide-cards-air .rmm-shell,
.rmm-template-wide-cards-gallery .rmm-shell {
  padding-top: 18px;
}

/* When automatic background cleanup is enabled, the transparent derivative
   sits directly on the card design rather than inside a white image rectangle. */
.rmm-card-bg-clean.rmm-template-wide-cards .rmm-section-image,
.rmm-card-bg-clean.rmm-template-wide-cards-air .rmm-section-image,
.rmm-card-bg-clean.rmm-template-wide-cards-gallery .rmm-section-image {
  background-color: transparent;
}

/* On tablet/mobile the X stays in the right padding gutter, so only compact top padding is needed. */
@media (max-width: 1024px) {
  .rmm-global .rmm-shell,
  .rmm-template-wide-cards-air .rmm-shell,
  .rmm-template-wide-cards-gallery .rmm-shell {
    padding-top: 20px;
  }
  .rmm-toolbar {
    top: 4px;
    right: 2px;
  }
}


/* ===== v0.7.0: smarter card image fit + clearer floating menu edge ===== */

/* Card images use nearly the full image stage while preserving the complete
   image. Cleaned PNG derivatives are trimmed server-side, so products that
   previously looked tiny in the middle now scale up naturally with an even
   safety margin around them. */
.rmm-template-wide-cards .rmm-section-image,
.rmm-template-wide-cards-air .rmm-section-image,
.rmm-template-wide-cards-gallery .rmm-section-image {
  padding: 4px;
}
.rmm-template-wide-cards .rmm-section-image img,
.rmm-template-wide-cards-air .rmm-section-image img,
.rmm-template-wide-cards-gallery .rmm-section-image img {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: contain;
  object-position: center;
}

/* Make the dropdown read as a separate floating surface instead of a white
   continuation of the header. This is intentionally subtle enough for the
   non-card templates too. */
@media (min-width: 1025px) {
  .rmm-template-wide-grid .rmm-shell,
  .rmm-template-wide-clean .rmm-shell,
  .rmm-template-wide-dense .rmm-shell,
  .rmm-template-wide-editorial .rmm-shell,
  .rmm-template-wide-cards .rmm-shell,
  .rmm-template-wide-cards-air .rmm-shell,
  .rmm-template-wide-cards-gallery .rmm-shell,
  .rmm-template-wide-showcase .rmm-shell,
  .rmm-template-wide-lines .rmm-shell {
    border-top: 1px solid rgba(31, 37, 42, .16);
    border-radius: 16px;
    box-shadow:
      0 -2px 10px rgba(22, 28, 33, .055),
      0 18px 55px rgba(0, 0, 0, .16);
  }

  .rmm-template-wide-cards .rmm-shell {
    border-radius: 18px;
  }
  .rmm-template-wide-cards-air .rmm-shell {
    border-radius: 22px;
    border-color: rgba(36, 45, 52, .14);
    box-shadow:
      0 -3px 13px rgba(28, 38, 46, .075),
      0 18px 48px rgba(28, 38, 46, .14);
  }
  .rmm-template-wide-cards-gallery .rmm-shell {
    border-radius: 20px;
    border-color: rgba(31, 37, 42, .15);
  }
}


/* ===== v0.8.0: card surface palettes + viewport-fit Gallery ===== */

/* The two card templates can now inherit a site-specific surface palette. */
.rmm-template-wide-cards .rmm-shell,
.rmm-template-wide-cards-air .rmm-shell {
  background: var(--rmm-card-menu-bg, #f3f5f6);
}
.rmm-template-wide-cards .rmm-section-image,
.rmm-template-wide-cards-air .rmm-section-image {
  background: var(--rmm-card-image-bg, linear-gradient(145deg,#f8fafb,#e9eef1));
}

/* When a cleaned transparent category image is used, keep the chosen image
   surface instead of forcing transparency. This lets the site palette show. */
.rmm-card-bg-clean.rmm-template-wide-cards .rmm-section-image,
.rmm-card-bg-clean.rmm-template-wide-cards-air .rmm-section-image {
  background: var(--rmm-card-image-bg, transparent);
}

/* Gallery adapts vertically to the available viewport. On normal desktop
   heights the image stage becomes smaller before the shell needs to scroll. */
@media (min-width: 1025px) {
  .rmm-template-wide-cards-gallery .rmm-shell {
    padding-top: clamp(12px, 2.1vh, 26px);
    padding-bottom: clamp(14px, 2.8vh, 34px);
  }
  .rmm-template-wide-cards-gallery .rmm-columns {
    gap: clamp(10px, 1.7vh, 22px);
  }
  .rmm-template-wide-cards-gallery .rmm-section {
    padding-bottom: clamp(8px, 1.4vh, 16px);
  }
  .rmm-template-wide-cards-gallery .rmm-section-image {
    height: clamp(68px, 11vh, var(--rmm-card-image-height, 150px));
    margin-bottom: clamp(8px, 1.5vh, 16px);
    padding: clamp(5px, .9vh, 12px);
  }
  .rmm-template-wide-cards-gallery .rmm-heading {
    margin-bottom: clamp(5px, .9vh, 11px);
    font-size: clamp(14px, 1.9vh, 17px);
  }
  .rmm-template-wide-cards-gallery .rmm-link {
    padding-top: clamp(2px, .45vh, 4px);
    padding-bottom: clamp(2px, .45vh, 4px);
  }
}

/* ===== v0.9.0: Gallery fits without an internal scrollbar ===== */
@media (min-width: 1025px) {
  .rmm-template-wide-cards-gallery .rmm-shell {
    overflow-y: hidden;
    scrollbar-gutter: auto;
  }
  .rmm-template-wide-cards-gallery .rmm-columns {
    will-change: transform;
  }
  .rmm-template-wide-cards-gallery.rmm-gallery-fitted .rmm-section {
    box-shadow: 0 3px 12px rgba(20,26,31,.04);
  }
}

/* WordPress-menu branches can use the same visual engine even when their
   section items do not have WooCommerce category images. */
.rmm-menu-nav-source.rmm-template-wide-cards .rmm-section,
.rmm-menu-nav-source.rmm-template-wide-cards-air .rmm-section,
.rmm-menu-nav-source.rmm-template-wide-cards-gallery .rmm-section {
  min-height: 82px;
}
.rmm-menu-nav-source.rmm-template-wide-cards-gallery .rmm-heading-row,
.rmm-menu-nav-source.rmm-template-wide-cards-gallery .rmm-section-body {
  margin-top: 14px;
}

/* ===== v0.10.0: switchable triggers, adaptive extra-menu width and images ===== */

/* Keep the real site header interactive while a wide Raven menu is open.
   Only the visible menu surface/backdrop handles pointer events. This lets
   BUTIK -> UTHYRNING -> BLOGG switch instantly on hover and keeps the top
   navigation links clickable. */
.rmm-global.rmm-open {
  pointer-events: none;
}
.rmm-global.rmm-open .rmm-shell,
.rmm-global.rmm-open .rmm-backdrop {
  pointer-events: auto;
}

/* Extra menus with only one/few branches should not look like a nearly
   full-width shop megamenu. Auto width scales with the number of sections,
   while respecting the responsive screen-tier ceiling. */
.rmm-menu-nav-source.rmm-width-auto {
  --rmm-nav-col-width: 230px;
}
.rmm-menu-nav-source.rmm-width-auto.rmm-template-wide-clean,
.rmm-menu-nav-source.rmm-width-auto.rmm-template-wide-editorial {
  --rmm-nav-col-width: 250px;
}
.rmm-menu-nav-source.rmm-width-auto.rmm-template-wide-cards,
.rmm-menu-nav-source.rmm-width-auto.rmm-template-wide-cards-air,
.rmm-menu-nav-source.rmm-width-auto.rmm-template-wide-cards-gallery {
  --rmm-nav-col-width: 265px;
}
.rmm-menu-nav-source.rmm-width-auto.rmm-template-wide-dense {
  --rmm-nav-col-width: 190px;
}

@media (min-width: 1025px) and (max-width: 1439px) {
  .rmm-menu-nav-source.rmm-width-auto .rmm-shell {
    width: min(
      calc(100vw - 32px),
      var(--rmm-desktop-width),
      var(--rmm-desktop-max),
      max(360px, calc(var(--rmm-section-count, 1) * var(--rmm-nav-col-width, 230px) + 72px))
    );
  }
  .rmm-menu-nav-source.rmm-width-custom .rmm-shell {
    width: min(calc(100vw - 32px), var(--rmm-desktop-width), var(--rmm-desktop-max), var(--rmm-extra-max, 900px));
  }
}

@media (min-width: 1440px) and (max-width: 1919px) {
  .rmm-menu-nav-source.rmm-width-auto .rmm-shell {
    width: min(
      calc(100vw - 40px),
      var(--rmm-wide-width),
      var(--rmm-wide-max),
      max(380px, calc(var(--rmm-section-count, 1) * var(--rmm-nav-col-width, 230px) + 80px))
    );
  }
  .rmm-menu-nav-source.rmm-width-custom .rmm-shell {
    width: min(calc(100vw - 40px), var(--rmm-wide-width), var(--rmm-wide-max), var(--rmm-extra-max, 900px));
  }
}

@media (min-width: 1920px) {
  .rmm-menu-nav-source.rmm-width-auto .rmm-shell {
    width: min(
      calc(100vw - 48px),
      var(--rmm-ultrawide-width),
      var(--rmm-ultrawide-max),
      max(400px, calc(var(--rmm-section-count, 1) * var(--rmm-nav-col-width, 230px) + 88px))
    );
  }
  .rmm-menu-nav-source.rmm-width-custom .rmm-shell {
    width: min(calc(100vw - 48px), var(--rmm-ultrawide-width), var(--rmm-ultrawide-max), var(--rmm-extra-max, 900px));
  }
}

/* When a WordPress-menu branch has featured/category images, card templates
   use exactly the same image stage as the WooCommerce BUTIK menu. */
.rmm-menu-nav-source.rmm-template-wide-cards .rmm-section-image,
.rmm-menu-nav-source.rmm-template-wide-cards-air .rmm-section-image,
.rmm-menu-nav-source.rmm-template-wide-cards-gallery .rmm-section-image,
.rmm-menu-nav-source.rmm-template-wide-showcase .rmm-section-image {
  display: flex;
}

/* A small nav-source menu should also form sensible columns rather than leave
   empty grid space inherited from a larger BUTIK configuration. */
@media (min-width: 1025px) {
  .rmm-menu-nav-source.rmm-width-auto .rmm-columns {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--rmm-min-col, 185px)), 1fr));
  }
}