/* Norvik brand site (invented brand, click dummy). Shared by every brand page.
 * Exported for agent LOADER: .nv-header, .nv-footer, .nv-container, .nv-btn, .nv-btn--ghost */

:root {
  --nv-graphite: #1b2430;
  --nv-graphite-2: #263241;
  --nv-ink: #1b2430;
  --nv-muted: #4b5563;
  --nv-line: #e3e6ea;
  --nv-soft: #f4f5f7;
  --nv-orange: #c2410c;
  --nv-orange-dark: #9a3412;
  --nv-orange-detail: #f97316;
  --nv-teal: #34e0c8;
  --nv-teal-ink: #04221e;
  --nv-blue: #2563eb;
  --nv-radius: 10px;
  --nv-focus: 0 0 0 3px #fff, 0 0 0 5px #2563eb;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: 'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: var(--nv-ink);
  background: #fff;
  line-height: 1.55;
  font-size: 16px;
}
img, svg { max-width: 100%; display: block; }
a { color: inherit; }
:focus-visible { outline: none; box-shadow: var(--nv-focus); border-radius: 6px; }
h1, h2, h3 { line-height: 1.15; margin: 0; letter-spacing: -0.01em; }

.nv-container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 24px; }
@media (max-width: 600px) { .nv-container { padding: 0 16px; } }

.nv-skip { position: absolute; left: -9999px; top: 8px; background: #fff; color: var(--nv-ink); padding: 10px 14px; z-index: 100; border-radius: 6px; }
.nv-skip:focus { left: 8px; }

/* Header */
.nv-header { background: var(--nv-graphite); color: #fff; position: sticky; top: 0; z-index: 40; }
.nv-header__bar { display: flex; align-items: center; justify-content: space-between; height: 68px; gap: 24px; }
.nv-logo { font-weight: 700; letter-spacing: 0.32em; font-size: 20px; text-decoration: none; color: #fff; display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding-right: 4px; }
.nv-logo__mark { width: 22px; height: 22px; border-radius: 4px; background: var(--nv-orange); position: relative; flex: none; }
.nv-logo__mark::after { content: ''; position: absolute; left: 5px; right: 5px; bottom: 5px; height: 3px; background: #fff; border-radius: 2px; }
.nv-nav { display: flex; align-items: center; gap: 4px; }
.nv-nav a { color: #e5e9ee; text-decoration: none; font-size: 15px; font-weight: 500; padding: 0 12px; min-height: 44px; display: inline-flex; align-items: center; position: relative; border-radius: 6px; }
.nv-nav a:hover { color: #fff; }
.nv-nav a[aria-current="page"] { color: #fff; }
.nv-nav a[aria-current="page"]::after { content: ''; position: absolute; left: 12px; right: 12px; bottom: 6px; height: 2px; background: var(--nv-orange-detail); border-radius: 2px; }
.nv-menu-btn { display: none; background: transparent; border: 1px solid rgba(255,255,255,0.28); color: #fff; border-radius: 8px; min-width: 44px; min-height: 44px; align-items: center; justify-content: center; gap: 8px; padding: 0 12px; font: inherit; font-size: 15px; cursor: pointer; }
.nv-menu-btn svg { width: 20px; height: 20px; }

@media (max-width: 860px) {
  .nv-menu-btn { display: inline-flex; }
  .nv-nav { display: none; position: absolute; left: 0; right: 0; top: 68px; background: var(--nv-graphite); flex-direction: column; align-items: stretch; padding: 8px 16px 16px; border-top: 1px solid rgba(255,255,255,0.1); box-shadow: 0 12px 24px rgba(0,0,0,0.25); }
  .nv-header.is-open .nv-nav { display: flex; }
  .nv-nav a { padding: 0 8px; min-height: 48px; border-bottom: 1px solid rgba(255,255,255,0.08); }
  .nv-nav a[aria-current="page"]::after { left: 8px; right: auto; width: 28px; bottom: 8px; }
}

/* Buttons */
.nv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 8px; border: 2px solid var(--nv-orange); background: var(--nv-orange); color: #fff; font: inherit; font-weight: 600; font-size: 16px; text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s; white-space: nowrap; }
.nv-btn:hover { background: var(--nv-orange-dark); border-color: var(--nv-orange-dark); }
.nv-btn svg { width: 18px; height: 18px; flex: none; }
.nv-btn--ghost { background: transparent; color: var(--nv-ink); border-color: var(--nv-ink); }
.nv-btn--ghost:hover { background: var(--nv-ink); border-color: var(--nv-ink); color: #fff; }
.nv-on-dark .nv-btn--ghost { color: #fff; border-color: rgba(255,255,255,0.7); }
.nv-on-dark .nv-btn--ghost:hover { background: #fff; color: var(--nv-ink); border-color: #fff; }
.nv-btn--sm { min-height: 44px; padding: 0 14px; font-size: 14px; }
.nv-btn--teal { background: var(--nv-teal); border-color: var(--nv-teal); color: var(--nv-teal-ink); }
.nv-btn--teal:hover { background: #22c9b1; border-color: #22c9b1; color: var(--nv-teal-ink); }

.nv-link { color: var(--nv-orange); font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; }
.nv-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.nv-link svg { width: 16px; height: 16px; }

.nv-eyebrow { font-size: 13px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--nv-muted); }
.nv-underline { display: inline-block; width: 44px; height: 3px; background: var(--nv-orange-detail); border-radius: 2px; margin: 14px 0 0; }

main { display: block; }
.nv-section { padding: 72px 0; }
@media (max-width: 600px) { .nv-section { padding: 48px 0; } }

/* Hero */
.nv-hero { background: linear-gradient(180deg, #f4f5f7 0%, #fff 100%); border-bottom: 1px solid var(--nv-line); }
.nv-hero__grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: center; padding-top: 64px; padding-bottom: 56px; }
.nv-hero h1 { font-size: clamp(34px, 5vw, 56px); font-weight: 700; margin-top: 12px; }
.nv-hero p.lead { font-size: 18px; color: var(--nv-muted); max-width: 520px; margin: 20px 0 32px; }
.nv-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.nv-hero__art { position: relative; aspect-ratio: 1 / 1; max-width: 520px; width: 100%; justify-self: center; }
.nv-hero__art::before { content: ''; position: absolute; inset: 10% 6% 4%; background: #fff; border-radius: 50%; box-shadow: 0 30px 60px rgba(27,36,48,0.08); }
.nv-hero__art img { position: relative; width: 100%; height: 100%; }
@media (max-width: 860px) {
  .nv-hero__grid { grid-template-columns: 1fr; gap: 24px; padding-top: 32px; padding-bottom: 40px; }
  .nv-hero__art { max-width: 340px; order: -1; }
}

/* Section headers */
.nv-sechead { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 32px; flex-wrap: wrap; }
.nv-sechead h2 { font-size: clamp(26px, 3vw, 34px); }

/* Product cards */
.nv-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 980px) { .nv-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .nv-grid { grid-template-columns: 1fr; gap: 16px; } }
.nv-card { display: flex; flex-direction: column; border: 1px solid var(--nv-line); border-radius: var(--nv-radius); text-decoration: none; color: inherit; background: #fff; transition: border-color .15s, box-shadow .15s; overflow: hidden; }
.nv-card:hover { border-color: #c7ccd3; box-shadow: 0 10px 30px rgba(27,36,48,0.08); }
.nv-card:focus-visible { box-shadow: var(--nv-focus); }
.nv-card__img { background: var(--nv-soft); aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; padding: 16px; }
.nv-card__img img { height: 100%; width: auto; }
.nv-card__body { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.nv-card__cat { font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--nv-muted); }
.nv-card__name { font-size: 19px; font-weight: 700; }
.nv-card__sub { color: var(--nv-muted); font-size: 15px; }
.nv-card__foot { margin-top: auto; padding-top: 12px; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.nv-uvp { font-weight: 600; font-size: 16px; }
.nv-card__more { color: var(--nv-orange); font-weight: 600; font-size: 15px; display: inline-flex; align-items: center; gap: 4px; }
.nv-card__more svg { width: 16px; height: 16px; }

.nv-cat-title { font-size: 22px; margin: 0 0 20px; display: flex; align-items: baseline; gap: 12px; }
#nv-catalogue > section + section { margin-top: 56px; }
.nv-cat-title small { font-size: 14px; color: var(--nv-muted); font-weight: 500; }

/* Dealer band */
.nv-band { background: var(--nv-graphite); color: #fff; }
.nv-band__inner { display: grid; grid-template-columns: 1.4fr auto; gap: 32px; align-items: center; padding-top: 56px; padding-bottom: 56px; }
.nv-band h2 { font-size: clamp(26px, 3vw, 34px); }
.nv-band p { color: #d5dbe2; font-size: 17px; max-width: 620px; margin: 14px 0 0; }
.nv-band .nv-eyebrow { color: #b8c1cc; }
@media (max-width: 760px) { .nv-band__inner { grid-template-columns: 1fr; padding-top: 44px; padding-bottom: 44px; } }

.nv-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.nv-fact { border-top: 2px solid var(--nv-line); padding-top: 16px; }
.nv-fact h3 { font-size: 17px; margin-bottom: 6px; }
.nv-fact p { margin: 0; color: var(--nv-muted); font-size: 15px; }
@media (max-width: 760px) { .nv-facts { grid-template-columns: 1fr; } }

/* Page head */
.nv-pagehead { padding: 48px 0 8px; }
.nv-pagehead h1 { font-size: clamp(30px, 4vw, 44px); }
.nv-pagehead p { color: var(--nv-muted); font-size: 17px; margin: 12px 0 0; }
.nv-crumbs { font-size: 14px; color: var(--nv-muted); display: flex; gap: 8px; flex-wrap: wrap; align-items: center; padding-top: 24px; }
.nv-crumbs a { color: var(--nv-muted); min-height: 44px; display: inline-flex; align-items: center; }

/* Product detail */
.nv-pdp { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; padding: 24px 0 72px; }
.nv-pdp__media { background: var(--nv-soft); border-radius: 14px; aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; padding: 32px; }
.nv-pdp__media img { width: 100%; height: 100%; }
.nv-pdp h1 { font-size: clamp(28px, 3.6vw, 42px); margin-top: 8px; }
.nv-pdp__sub { color: var(--nv-muted); font-size: 18px; margin: 10px 0 24px; }
.nv-bullets { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 10px; }
.nv-bullets li { display: flex; gap: 12px; align-items: flex-start; }
.nv-bullets svg { width: 20px; height: 20px; flex: none; margin-top: 2px; color: var(--nv-orange); }
.nv-pdp__price { border-top: 1px solid var(--nv-line); padding-top: 20px; margin-bottom: 20px; }
.nv-pdp__uvp { font-size: 26px; font-weight: 700; }
.nv-pdp__note { color: var(--nv-muted); font-size: 14px; margin: 4px 0 0; }
.nv-pdp__actions { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.nv-pdp__actions .nv-btn { width: 100%; max-width: 380px; }
@media (max-width: 860px) { .nv-pdp { grid-template-columns: 1fr; gap: 28px; padding-bottom: 48px; } }

.nv-empty { padding: 80px 0; text-align: center; }
.nv-empty h1 { font-size: 30px; margin-bottom: 12px; }
.nv-empty p { color: var(--nv-muted); margin: 0 0 24px; }

/* Händlersuche */
.nv-locator { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: start; padding: 24px 0 72px; }
.nv-search { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; margin: 28px 0 0; }
.nv-field { display: flex; flex-direction: column; gap: 6px; }
.nv-field label { font-size: 14px; font-weight: 600; }
.nv-field input { font: inherit; font-size: 17px; min-height: 48px; padding: 0 14px; border: 1.5px solid #9aa3ae; border-radius: 8px; width: 180px; color: var(--nv-ink); background: #fff; }
.nv-field input:focus-visible { border-color: var(--nv-blue); box-shadow: 0 0 0 3px rgba(37,99,235,0.3); }
.nv-results { font-size: 15px; color: var(--nv-muted); margin: 0 0 14px; }
.nv-results strong { color: var(--nv-ink); }
.nv-dealers { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.nv-dealer { border: 1px solid var(--nv-line); border-radius: var(--nv-radius); padding: 18px; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 14px; background: #fff; }
.nv-dealer__num { width: 32px; height: 32px; border-radius: 50%; background: var(--nv-graphite); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 15px; }
.nv-dealer.is-online .nv-dealer__num { background: var(--nv-teal); color: var(--nv-teal-ink); }
.nv-dealer__top { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.nv-dealer__name { font-size: 17px; font-weight: 700; }
.nv-dealer__dist { font-weight: 600; white-space: nowrap; font-size: 15px; }
.nv-dealer__addr { color: var(--nv-muted); font-size: 15px; margin: 2px 0 0; }
.nv-dealer__hours { font-size: 14px; color: #166534; margin: 4px 0 0; display: flex; align-items: center; gap: 6px; }
.nv-dealer__hours::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #16a34a; }
.nv-dealer__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.nv-dealer__actions svg { width: 16px; height: 16px; }

.nv-map { position: sticky; top: 92px; border-radius: 14px; overflow: hidden; border: 1px solid var(--nv-line); background: #eef1ec; height: 620px; }
.nv-map svg.nv-map__bg { position: absolute; inset: 0; width: 100%; height: 100%; }
.nv-pin { position: absolute; transform: translate(-50%, -100%); width: 34px; height: 44px; display: block; }
.nv-pin svg { width: 34px; height: 44px; filter: drop-shadow(0 3px 4px rgba(0,0,0,0.25)); }
.nv-pin span { position: absolute; top: 6px; left: 0; right: 0; text-align: center; font-weight: 700; font-size: 14px; color: #fff; }
.nv-pin.is-online span { color: var(--nv-teal-ink); }
.nv-me { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 18px; height: 18px; border-radius: 50%; background: var(--nv-blue); border: 3px solid #fff; box-shadow: 0 0 0 8px rgba(37,99,235,0.18), 0 2px 4px rgba(0,0,0,0.3); }
.nv-me__label { position: absolute; left: 50%; top: 50%; transform: translate(14px, -50%); background: #fff; color: var(--nv-ink); font-size: 13px; font-weight: 700; padding: 2px 8px; border-radius: 6px; box-shadow: 0 1px 3px rgba(0,0,0,0.2); }
.nv-map__legend { position: absolute; left: 12px; bottom: 12px; background: rgba(255,255,255,0.95); border-radius: 8px; padding: 8px 12px; font-size: 13px; display: flex; gap: 14px; flex-wrap: wrap; box-shadow: 0 1px 4px rgba(0,0,0,0.12); }
.nv-map__legend span { display: inline-flex; align-items: center; gap: 6px; }
.nv-map__legend i { width: 12px; height: 12px; border-radius: 50%; display: inline-block; }
.nv-map__radius { position: absolute; left: 50%; top: 50%; width: 78%; aspect-ratio: 1 / 1; transform: translate(-50%, -50%); border-radius: 50%; border: 2px dashed rgba(37,99,235,0.35); background: rgba(37,99,235,0.04); pointer-events: none; }

@media (max-width: 860px) {
  .nv-locator { grid-template-columns: 1fr; gap: 20px; padding-bottom: 48px; }
  .nv-map { position: relative; top: 0; height: 260px; order: -1; }
  .nv-map__radius { width: auto; height: 82%; }
}
@media (max-width: 420px) {
  .nv-dealer { padding: 14px; gap: 12px; grid-template-columns: 32px minmax(0, 1fr); }
  .nv-dealer__actions .nv-btn--sm { flex: 1 1 auto; }
}

/* Footer */
.nv-footer { background: var(--nv-graphite); color: #c9d1da; font-size: 14px; }
.nv-footer__inner { display: flex; justify-content: space-between; gap: 16px 32px; flex-wrap: wrap; padding-top: 28px; padding-bottom: 28px; align-items: center; }
.nv-footer p { margin: 0; }
.nv-footer__brand { color: #fff; font-weight: 700; letter-spacing: 0.32em; font-size: 15px; }
.nv-footer__credit { color: #e5e9ee; }

.nv-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.nv-error { color: #b91c1c; font-size: 14px; margin: 8px 0 0; width: 100%; }
.nv-field input[aria-invalid="true"] { border-color: #b91c1c; }
.nv-slot-wrap:empty { display: none; }
[data-buy-now-slot]:not(:empty) { margin: 0 0 16px; }

/* Händlerinfo dialog: the marketplace's dealer overview, in Norvik's look.
   A bottom sheet on a phone, a centred dialog from 640 px. */
html.nv-lock { overflow: hidden; }
.nv-dialog {
  position: fixed; inset: auto 0 0 0; margin: 0 auto; width: 100%; max-width: 520px;
  max-height: 88vh; max-height: 88dvh; padding: 0; border: 0; border-radius: 14px 14px 0 0;
  background: #fff; color: var(--nv-ink); font-family: inherit; display: none; flex-direction: column; overflow: hidden;
  box-shadow: 0 -10px 40px rgba(27,36,48,0.2);
}
.nv-dialog[open] { display: flex; animation: nv-up .2s ease-out both; }
.nv-dialog::backdrop { background: rgba(15,23,32,0.55); }
@keyframes nv-up { from { transform: translateY(20px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (min-width: 640px) {
  .nv-dialog { inset: 0; margin: auto; height: fit-content; max-width: 560px; border-radius: 14px; box-shadow: 0 24px 60px rgba(27,36,48,0.3); }
}
@media (prefers-reduced-motion: reduce) { .nv-dialog[open] { animation: none; } }
.nv-dialog__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 12px 12px 22px; border-bottom: 3px solid var(--nv-orange-detail); background: var(--nv-graphite); color: #fff; }
.nv-dialog__head h2 { font-size: 18px; letter-spacing: 0.02em; }
.nv-dialog__x { width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 8px; background: transparent; color: #fff; cursor: pointer; }
.nv-dialog__x:hover { background: rgba(255,255,255,0.12); }
.nv-dialog__x svg { width: 20px; height: 20px; }
.nv-dialog__x:focus-visible { box-shadow: 0 0 0 3px var(--nv-graphite), 0 0 0 5px #fff; }
.nv-dialog__body { overflow-y: auto; overscroll-behavior: contain; padding: 18px 22px 22px; display: grid; gap: 12px; justify-items: stretch; }
.nv-dialog__name { font-size: 20px; }
.nv-chip { justify-self: start; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--nv-line); border-radius: 999px; background: var(--nv-soft); font-size: 14px; font-weight: 600; }
.nv-chip svg { width: 16px; height: 16px; color: var(--nv-orange); }
.nv-info-list { display: grid; gap: 8px; }
.nv-info { display: grid; gap: 2px; padding: 11px 14px; border: 1px solid var(--nv-line); border-left: 3px solid var(--nv-graphite); border-radius: 8px; background: #fff; }
.nv-info__label { font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--nv-muted); }
.nv-info__value { font-size: 16px; overflow-wrap: anywhere; }
.nv-info__value span { display: block; }
.nv-info__value a { color: var(--nv-orange); font-weight: 600; text-decoration: none; }
.nv-info__value a:hover { text-decoration: underline; text-underline-offset: 3px; }
.nv-dialog__muted { margin: 0; font-size: 14px; color: var(--nv-muted); }
.nv-dialog__btns { display: flex; gap: 8px; }
.nv-dialog__btns .nv-btn { flex: 1 1 0; min-width: 0; padding: 0 10px; font-size: 15px; white-space: normal; text-align: center; }
.nv-dialog__status { margin: 0; font-size: 14px; font-weight: 600; color: #166534; overflow-wrap: anywhere; }
.nv-dialog__status:empty { display: none; }