/* Novame presentation layer. Loaded last; existing CMS layout remains intact. */
body { color: var(--novame-ink); font-weight: 200; }
button, input, select, textarea { font-family: var(--novame-body-font); }
h1, h2, h3, h4, h5, h6 {
  font-family: var(--novame-heading-font) !important;
  font-weight: 300 !important;
  line-height: 1.2;
}
.page_header h2 {
  font-family: var(--novame-body-font) !important;
  font-weight: 200 !important;
  letter-spacing: .14em;
}
.page_header h1 { color: var(--novame-burgundy); }
.page_header > img { max-width: 56px; margin-bottom: 28px; }
/* The SVG canvas includes the guide's proportional logo exclusion zone.
   Never crop, stretch, recolour or apply a filter to these logo files. */
.navigatie, .navholder.scrolled .navigatie {
  width: min(1600px, 96%);
  margin: 0 auto;
  height: 144px;
  align-items: center;
  justify-content: space-between;
  padding: 0;
}
.logo-circle, .navholder.scrolled .logo-circle {
  position: relative;
  top: auto;
  left: auto;
  flex: 0 0 280px;
  width: 280px;
  height: auto;
  padding: 0;
  background: transparent;
  border-radius: 0;
  align-items: center;
}
.navigatie .logo, .navholder.scrolled .logo {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  object-fit: contain;
  filter: none;
}
main { padding-top: 144px; }
.navigatie .nav { min-width: 0; }
.navsub, .navholder.scrolled .navsub { margin-top: 18px; }
.navsub > a, .navsub .has-dropdown > a {
  font-size: 17px;
  margin: 0 7px;
  padding: 10px 8px;
  border-radius: 0;
}
.navigatie .topper { background: var(--novame-ivory); }
.navsub > a.webshoplnk {
  background: var(--novame-burgundy);
  color: #fff;
  border-radius: 4px;
  padding: 14px 20px;
}
.navsub > a.webshoplnk:hover { background: var(--novame-burgundy-dark); color: #fff; }
.navsub > a:not(.webshoplnk):after { background: var(--novame-gold); }
.has-dropdown:focus-within .dropdown-menu {
  opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
}
.dropdown-menu { border-radius: 4px; border-top: 2px solid var(--novame-gold); }
.menuholder { background: var(--novame-burgundy); overflow-y: auto; }
.menu-overlay { background-image: none; }
.menu-inner { min-height: 100%; height: auto; }
.menu-logo { width: min(260px, 65vw); height: auto; filter: none; }
.menu-header { margin-bottom: 12px; }
.menuholder nav ul li a { font-family: var(--novame-heading-font); font-weight: 300; }
.menuholder .footer-divider { background: var(--novame-gold); }
.close_btn { background: transparent; border: 0; cursor: pointer; font-size: 16px; padding: 12px; }
.close_btn > span:last-child { font-size: 30px; }
.navigatie .menubtn {
  background: transparent; border: 0; padding: 12px;
  width: 48px; height: 48px; color: var(--novame-burgundy); cursor: pointer;
}
.novame-menu-icon, .novame-menu-icon::before, .novame-menu-icon::after {
  display: block; width: 24px; height: 2px; background: currentColor; position: relative;
}
.novame-menu-icon::before, .novame-menu-icon::after { content: ''; position: absolute; left: 0; }
.novame-menu-icon::before { top: -7px; }
.novame-menu-icon::after { top: 7px; }
footer, .innerfooter { background-color: var(--novame-burgundy); }
.footer_logo .footer_inner { width: 100%; max-width: 340px; }
.footer_logo img { display: block; width: 100%; max-width: 340px; height: auto; filter: none; }
footer .footerButton { border-color: var(--novame-gold); }
footer .footerButton:hover { background: var(--novame-gold); color: var(--novame-ink); }
footer a:hover { color: var(--novame-gold); }
.siteby img { width: 18px; height: auto; }
.extrafooter { border-top-color: rgba(196,166,117,.5); }
.progress-bar { stroke: var(--novame-burgundy); }
.progress-bg { stroke: var(--novame-line); }
/* Gold is an accent, not small text on white. */
::selection { background: var(--novame-burgundy); color: #fff; }
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--novame-burgundy);
  outline-offset: 4px;
  box-shadow: 0 0 0 2px #fff;
}
footer :focus-visible, .menuholder :focus-visible { outline-color: var(--novame-gold); }
@media (max-width: 1350px) {
  .navigatie .navsub > a, .navigatie .navsub .has-dropdown > a { display: none; }
  .navigatie .menubtn { display: flex; align-items: center; justify-content: center; }
  .nav_top { display: none; }
  .navsub, .navholder.scrolled .navsub { margin-top: 0; }
  .navigatie, .navholder.scrolled .navigatie { height: 112px; }
  .logo-circle, .navholder.scrolled .logo-circle { width: 224px; flex-basis: 224px; }
  main { padding-top: 112px; }
}
@media (max-width: 650px) {
  .navigatie, .navholder.scrolled .navigatie { width: 96%; height: 104px; }
  .logo-circle, .navholder.scrolled .logo-circle { width: 208px; flex-basis: 208px; }
  main { padding-top: 104px; }
  .menu-inner { padding: 12px 16px 28px; }
  .menu-header { gap: 8px; }
  .menu-logo { width: 200px; max-width: 62vw; }
  .close_btn { padding: 8px; gap: 6px; }
  .close_btn > span:first-child { font-size: 11px; }
  .footer_logo .footer_inner { max-width: 300px; }
}
@media (prefers-reduced-motion: reduce) {
  html, body { scroll-behavior: auto; }
  .logo-circle, .navigatie, .navholder, .menuholder, .menuholder li,
  .menuholder nav a, .navsub, .cc-mobile, .pulse { animation: none !important; transition: none !important; }
}

@media (max-width: 400px) {
  .logo-circle, .navholder.scrolled .logo-circle { width: 180px; flex-basis: 180px; }
}